Make your campaigns more playful with animations! Triggerbee offers a variety of animations, and this article will guide you through them!
Entry & Exit Animations
Make your popups "pop" even more by adding an entry animation. This will allow your popup to either slide in (from the top, bottom, left, or right), tone in, or wiggle. They can even have an "elastic" effect! The same set of animations can be used for closing the campaign.
How to add Entry and Exit Animations
The entry and exit animations can be found under the Transition setting on the Canvas. You'll also get to select the duration of the animation, and whether you want the animation to be elastic.
The "Morph between steps" feature is useful when you're having a teaser step in your campaign. The morphing feature will then make it look like the teaser "morphs" (transforms into) the bigger popup when maximized or when minimized back to the teaser. Try it out!
Slide in & Rolling Banners
Be creative and build eye-catching campaigns with rolling or sliding text or content! Perfect for site-wide sales like Black Week or Christmas Sale. The widget element can either have a "rolling" effect which means that the content rolls horizontally over the widget from side to side, or it can "slide in" - meaning the content slides in, stops for a second, then slides out to display the next message.
The rolling effect is useful for when you want, like "BLACK WEEK - BLACK WEEK - BLACK WEEK - BLACK WEEK".
The slide-in animation is useful for multiple messages, eg. "Black Weekend", "50% off everything", "Free returns within 30 days".
Both Rolling and Slide-in animations can be found on the container in the editor. For each animation, there is a selection of settings to refine your animation - like scroll speed, direction, and wrapping.
Even buttons can be animated! Have the button "wiggle" to draw attention, add a color-swipe to create some action, and add a nice hoover effect to enhance the feeling of interaction with the button.
The wiggle effect will have your button "wiggle" after a number of seconds, to draw some attention.
The color swipe animation will allow you to select another color that the button will change to by a swiping effect. Very useful for close buttons together with the auto action feature, eg. "Closing in 5 seconds".
The wiggle and color swipe animations are found under Animation in the button Appearance tab.
When hoovering the button, you can select between the following animations:
- Color Swipe: This effect will slowly change the color of the button in a swipe-motion
- Circle: Similar color swipe, the button will instead change color in a circle motion
- Show icon: if you have an icon on your button, eg. a shopping cart, arrow, or close icon - the icon will be hidden until the user hovers the button.
For surveys, especially on phones - it is a nice feature to add some animation to enhance the feeling that a vote or a selection has been made. With survey animations, you can have the start, number, or thumb "blink" once when selected. And if it's a good vote (3+ on a 5 scale), you might also want to add some confetti to make it pop even more! Celebrate every win! The confetti animation is called "Fancy".