MENU

Fun & Interesting

Rive Pointer Tracking Animation Implemented in Webflow - Rive to Webflow workflow

Jeff McAvoy 2,634 2 years ago
Video Not Working? Fix It Now

How to set up a Rive file with pointer tracking for Webflow implementation. In this walkthrough, I show how I set up a self-portrait with a 3D head-turning effect in Rive. It covers creating bones, mesh, weighting, animating, constraints, state machine set up with multiple layers, and how to make it all work using a Javascript code embed in Webflow. Here is the original Codesandbox created by Zach on the Rive team. This contains the code to make the tracking work: https://codesandbox.io/s/bold-ioana-ofp6fg

Comment