Community forum for knowledge and support

Updated 10 months ago

Best practices for interactive user experiences

At a glance

The community members are discussing the best practices to create interactive elements like hover-activated animations or videos. Some suggestions include using Lottie animations, Webflow's Lottie element, GSAP, or Rive App. The comments indicate that using native Webflow interactions alone may be challenging, and a workflow involving After Effects, Lottie, and Webflow is a likely path. One community member also offers to help with custom Rive animations.

Hey folks, does anybody know the best practices to make interaction like this?

1
A
H
M
6 comments

These are probably lotties or videos, which start playing on hover and you just show the first frame of the lottie without hovering.

Yeah I was thinking of that, is there another way to do it? maybe native webflow interaction?

You can use the Webflow Lottie element and start the playback on hover, but it will run until the end of the animation and not stop if you stop hovering it. I am not sure how to set this up with native webflow πŸ˜•

my guess is that it would be way too unorganized to do this with just native webflow interactions. From the surface, I wouldn't say its impossible. After Effects > Lottie > Webflow is the most likely path. GSAP could be another path. Rive App could be another one. You have a few options there. πŸ˜‰

Hi , in case you still haven't found a solution for this, I'm happy to help.

I make custom Rive animations, here you can see some examples: www.motiongurus.co

Add a reply
Sign up and join the conversation on Slack