How to elevate your website with stunning Animations in BOWWE?
BOWWE tutorials
Welcome to our collection of online lessons. We’ve created these to help you learn the best practices and get the most out of BOWWE. Come back here whenever you want!

How to elevate your website with stunning Animations in BOWWE?

Unleash the power of dynamic and captivating animations on your website using BOWWE Builder! Animations have the ability to engage and delight visitors, making your website more interactive and memorable. In this tutorial, we'll guide you step-by-step through the process of incorporating stunning animations into your website effortlessly, all within the intuitive interface of BOWWE Builder.

How to create Animations in BOWWE?

1
Open BOWWE
2
Select the element, container or section
3
Click on the paintbrush icon and go to the Widget Styles
4
Find the Animations tab
5

Select the trigger for the animation by choosing the right tab

6

Click on the preview of the animation to choose it and enter its customization settings.

⚡ BOWWE Expert Tip:

Ensure that your animations are responsive and adapt well to different screen sizes and devices. Test animations on various devices to ensure they work smoothly and don't cause layout or usability issues on smaller screens or touch-based devices.

7

Adjust the settings and click preview below to see how it will look like on your website

Remember about:

Animations should be relevant to the content and context of your website. Avoid using animations solely for decorative purposes or without a clear purpose.

 

Ensure that animations enhance the user experience, provide feedback, or convey information effectively.

8

When you are happy with the result SAVE and PUBLISH to complete

Customization settings

Chosen animation

Choose among available animations

Devices

Decide on which devices the animation will appear

Animation duration

Control the speed of your animations 

Animation delay

Stagger the animation trigger

Hide widget on start

Determine whether a widget or element should be hidden when the animation begins

Play in loop

Animations will seamlessly repeat

Trigger animation once

Ensure that the animation plays just once

Distance to edge

Define the proximity of an object or widget to the edge of a screen or container

Direction

Set the direction in which the animation will move

Preview

Check how the animation will look on your website

Congratulations!

Now you know how to create animations on your website