Interactive Rive hero scene with micro-interactions

A hero scene for a developer-tool landing page that reacts to the visitor instead of looping a video. Every element on screen should respond to hover and click, and the whole thing had to stay light enough to sit above the fold without hurting load time.

One Rive state machine for the entire scene, so a developer wires up a single set of inputs. File under 40 KB. No raster images, everything vector, so it stays sharp on any screen. Motion that idles quietly and only gets loud when the cursor arrives.

Isometric layout. Depth without a 3D engine, and every surface is a flat shape that animates cheaply. Hover before click. Each element has a hover state that hints it is interactive, then a click state that pays it off. Idle loop. A slow ambient movement so the hero never looks like a frozen screenshot. One trigger set. Hover, click and reset, named plainly, so it drops into Framer, Webflow or React through the Rive runtime.

A single .riv file at 36 KB with hover and click states on every element, driven by one state machine. The video above is the scene reacting to a cursor. If your landing page needs a hero that responds instead of plays, this is the approach I would take.