admin-plugins author calendar category facebook post rss search twitter star star-half star-empty

Tidy Repo

The best & most reliable WordPress plugins

Paid Plugin Scrollsequence – Cinematic Scroll Animation for WordPress

Scrollsequence – Cinematic Scroll Animation for WordPress

Plugin Author: Scrollsequence

Beatrice Stefanescu

June 27, 2022 (modified on March 3, 2023)

Media

Scrollsequence is a WordPress plugin that allows users to take any video and transform it into an immersive web experience. This sequence plays and rewinds when you scroll up or down the page or with touch. It is easy to integrate with any WordPress website in a few clicks. This kind of technology was earlier available exclusively to big companies since it was very expensive and required a lot of skill to implement.

So, no matter the page builder you are using, the simple shortcode works with all of them, even in the backend. If there are any issues regarding integration to your WordPress website, their customer support is always available to assist and help you.

The plugin is offered in two versions, free and paid. The free version suits those who want a simple design and implementation but is also very appealing. The PRO version gets you the full package with loads of features. There is also a 14-day free trial for the PRO version available with no credit card required for you to try it out.

The free version includes basic features that allow you to set up the animations. Those features include fully responsive and mobile-first design, SEO-friendly design and crawlable content, customizable image scaling for every scene of the sequence, image preloading in the background, and array customization that lets you customize the duration, loop, reversing, and bounce-back, etc. Due to performance reasons, the free version has a limit on the number of animated images. And lastly, you can insert one sequence per page with the free version.

The PRO version comes with advanced animation that enables HTML content animation, the scroll delay that smoothens the animation, GSAP powered animation engine that allows you to animate any element on your page, advanced preloading and caching, priority email support, custom CSS for adding your styles and functionality, unlimited images, and full shortcode support.

Scrollsequence example animation

The development team puts great effort to provide a “global” plugin availability. Until now they have achieved great performance results across all platforms, and the plugin runs on proven and stable JavaScript libraries. Regarding browser compatibility, most of the mainstream browsers like Chrome, Safari, Firefox, Android, and Edge are supported, as well as the popular page builders like Elementor, Divi, Oxygen, and Beaver. Essentially, any page builder is compatible with the plugin, you just have to enter the shortcode.

The process of installation is straightforward. First, you have to download the installation .zip file and upload it to your WordPress. After navigating to your WordPress Admin Dashboard, click on the “Add Plugin” button and upload the said .zip file to your installation. After installation, click on the “Activate” button to finish the activation. If you want to activate the purchased license, go to your Scrollsequence sidebar menu, and click on the “Upgrade” option.

Scrollsequence example animation

After that, you just have to select the license you want to activate and follow the instructions on the screen. After the activation has been successful, you can access the Scrollsequence menu on the left side of the admin dashboard.

Starting up with the plugin, you can try out a simple animation, using a smaller number of images taken from a video, exported from a 3D animation software, or by downloading samples from Scrollsequence. Getting an animation up and running is not a hard job. Let’s go through the steps of creating your animation.

1. Create a new sequence

The first thing you have to do after you have successfully installed the plugin is to go to the “Add New Scrollsequence” option on the left sidebar under the Scrollsequence section. Give it a name, it can be whatever you want to name that animation. After that, you will have to create a new scene where you will later add media for your animation. For more complex animations, it is recommended to use multiple scenes to ensure smooth playback.

2. Prepare media

After creating a new scene, you will have to upload media that will be used in the animation. This can be done by uploading images you took from a video, using some of the images available from Scrollsequence, or by using exported data from a 3D animation software. If you need to prepare media to be uploaded, this cannot be done directly in the plugin, unfortunately. However, there are third-party tools you can use to prepare images.

For example, you can use Adobe Premiere Pro, VLC Media Player, or onlineconverter.com to convert a video to an image sequence. Also, if you want to optimize your images to fit certain dimensions, data size, or resolution, you can use applications like Imagify, ImageOptim, and Kraken.io. When filming a custom video, have in mind not to use motion blur, keep track of the depth of field and stick to the standard 24 or 25fps framerate.

3. Add images

After you have prepared the images, you want to use, now is the time to import them into your scene. On the scene page, click on the Select attachments button. Here you can choose images from an existing media library, or you can upload files from your local machine. When choosing multiple images, hold down CRTL or SHIFT buttons for multiple selections. Also, keep in mind that the order you select the images is important for the animation. You can use the drag-and-drop feature to easily reorder your images. Consider having at least 50-100 images, and to have all of them roughly the same resolution.

Images

4. Set up animations

This is an optional step and is not required for the whole sequence to work. However, if you choose to add an animation, you have the possibility. There are multiple fields like the Selector which is the element id or class selector, Start for the animation starting point, End for the ending point, From Animation (PRO version only), and To Animation (PRO version only). Other PRO version properties include Fade From/To, Move Up/Down Vertical, Move Up/Down Horizontal, and Scale.

Animate

5. Configure sequence and animation settings

Other than the before-mentioned options and settings, there are a plethora of other settings you can configure, both for the individual scene, as well as for the whole animation. You can configure the duration of each image in the sequence, and also image scaling and alignment for responsiveness. You can also control the scroll delay, image width, opacity, and many other settings for the whole animation sequence.

6. Display your animation

On the newer versions of the plugin (from 1.0.0), you can insert the animated sequence anywhere on the website by using the shortcode. The shortcode includes properties like id for the scrollsequence post ID, margintop for the spacing or overlap of the start of the animation, marginbottom for the spacing or overlap of the end of the animation, and hide which is a list of devices for which the sequence is not loaded. From version 1.1.8 the Scrollsequence can also be duplicated with one click, which is useful if you are working with multiple languages, or if you want to back up your work.

Pricing

As we mentioned earlier, aside from the free version, the PRO version comes with a 14-day free trial with full functionality and customer support. The PRO version costs $209.99 for a lifetime license or $69.99 for a yearly license. The BUSINESS version comes with all PRO features plus a success manager service and customization pack for $499.99 for a lifetime license or $149.99 for a yearly license. If you, for some reason, decide that you do not find a use for Scrollsequence anymore, you can simply cancel your account from the Members panel.

All plans are billed on a year-to-year basis unless you choose the lifetime license, and you can upgrade or downgrade your plan at any time. Payments can be made with major credit cards like Visa, and Mastercard, as well as PayPal. There is a plan to implement payments with crypto. If you for some reason cannot set up the plugin, you are guaranteed a 100% money refund. Lastly, you do not have to worry about updates since automatic updates are performed to the premium versions without any additional cost.

Conclusion

All things considered, Scrollsequence is a great plugin that provides the possibility to create stunning animations that were once available only for the big dogs in the industry. With this highly customizable plugin, those of you who want to create visually appealing and eye-catching websites can do it with very little to no knowledge of programming. It is possibly the only plugin that offers this kind of functionality without any additional coding required. Having that in mind, it is well worth the try.