Unleash your creativity and bring your ad to life with the Image Sequence Module, a dynamic tool designed to seamlessly playback sequences of images to create captivating animations and effects. With this module, users can upload folders of assets that will be played back in sequence, allowing for the creation of stunning visual narratives. Customize playback options such as frames per second (fps), looping behavior, and playback direction to achieve the desired animation effect.
Use cases
Animated CTA's, Backgrounds, and more
Create flashy effects with transparent backgrounds that stun the user
Expand on what you can do with the timeline and normal animation capabilities
Example
This simple example shows how you can create a fake 3d effect with an image sequence and link a slider module to it to control it. Of course, image sequences can also play automatically, but this is a nice way of bringing some interaction possibilities to your users!
As with all examples, you can request us to copy them over to your company so you can look at how they are built in detail.
Source folder
You start by dropping a folder of assets here. The assets inside will be ordered by alphabet, so ideally they have the same name but differing numbers in the end - e.x. "anim1.png, anim2.png, anim3.png"
Responsive options
You can change the responsive behavior of the image sequence with these settings you already know from the Background and asset modules.
Direction
You can change between forward & backward animation playback direction, meaning that you can also play back an animation in reverse.
Yoyo
The yoyo-effect will play the animation in the direction you specified first and then reverses through the animation in the other direction. It can also be combined with loops so you can have something like a box opening and closing repeatedly.
Autoplay
You can toggle the automatic playback of the image sequence. Alternatively, you can trigger the animation through interaction events.
Loop
You can loop the image sequence for a specified number of times between 1-10 or you choose the last option "Unlimited" so it'll loop until the killswitch for animations (by default 30s) is triggered.
FPS
You can change the FPS with which your animation will play back here, between 1-60. This will also determine how long your animation playback will be, as more fps means a shorter animation if the amount of frames stays the same.
Properties & Clickout
As for the Background module, the Basket module allows you to change different properties like the opacity seperately in the "Properties" tab.
Also, you can set up a clickout link for the Basket module as usual.
Interactions
The Image Sequence offers all standard triggers & actions that the Background module offers as well. Furthermore, the Image Sequence module offers:
Triggers
Sequence finished = Triggers when the image sequence has finished playback (after all loops are finished in case looping is active!)
Actions for other modules
The Image Sequence module offers actions to be triggered by other modules:
Play image sequence = Play an image sequence - will continue playback if it has been stopped in the middle
Stop image sequence = Stops playback of an image sequence
Reset image sequence = Resets an image sequence to the first frame of playback