When you export HTML5 animations, some platforms (like specific email clients or older browsers) may not support motion. In these cases, a static image called a fallback is shown instead.
To ensure your brand always looks its best, Abyssale allows you to choose the exact moment of your animation to be used as this static image.
⚠️Important Requirements
Before you begin, please note that this feature is specifically designed for HTML5 exports:
HTML5 Ads only: This marker only affects the
fallback.jpggenerated during HTML5 exports. It does not apply to MP4 or GIF formats.Enable Fallback: Ensure that the "Generate fallback image" option is toggled ON in your design settings.
Learn more: For a full breakdown of these options, check out our guide on Understanding HTML5 export settings.
How to set your Fallback Frame from the Timeline
You can visually select your preview frame directly within the Design Builder:
Open your Animation: Start by opening your animated design in the Abyssale editor.
Locate the Marker: Look at the Timeline at the bottom of the screen. You will see a specific marker labeled Fallback Frame.
Drag to Position: Click and drag this yellow marker left or right along the timeline.
Select the Best Moment: Release the marker at the exact frame you want to capture (for example, when your logo and "Call to Action" are fully visible).
Export: That’s it! When you export your design as an HTML5 ad, this precise frame will be automatically generated as the
fallback.jpginside your ZIP file.
Pro Tip: Avoid placing the marker during a "fade" or "slide" transition to ensure your fallback image isn't blurry or incomplete.
Why this matters
By default, most tools use the very first/last frame of an animation. If your animation starts/end with a blank screen or a "fade-in/out," your fallback image might end up being empty. Using the Fallback Frame marker ensures your audience always sees your most important message, even if the animation doesn't play.