Rive Animation for AI Agent Tool - Patchbay

Patchbay is a concept hero I designed and built in Rive for a product that lets an AI agent use your work tools. Access works like a patch cable: plug it in and the agent can use that tool, pull it out and the access is gone.

Agent permissions usually live on a settings page full of toggles. The hero had to show the product's one idea, that you decide what the agent can touch, in a way a visitor gets by trying it once.

Drew a rack with four tool modules and one agent module as vector art and brought it into Rive with every layer named.

Made the cables real curves. Their ends follow the plugs through data binding, and the sag depends on the distance, so a cable hangs naturally wherever you drop it.

Wrote a 139-line Luau script for the drag. A plug dropped near a free jack snaps in; dropped anywhere else, it slides back to its place.

Turned the agent's screen into a small terminal. It lists the patched tools with what the agent may do in each, and the count changes as you patch.

Run agent sends a light pulse down every patched cable. With the knob on "ask first" the screen ends with "waiting for your ok", on "full auto" with "sent on its own".

The whole hero after a run: three tools patched in and the knob on full auto.

A plug in the hand. Its cable follows with a little sag, and the free jacks wait on the right.

The pulse runs into the agent, and the LED next to each jack shows which inputs are live.

Inside the file: 27 view model properties, a 139-line Luau script, 14 pointer listeners and three state machine layers.

A hero that explains agent permissions through one gesture people already know from audio gear. Everything, the drag logic included, lives in one .riv file, so it can go into an Astro, Framer, Webflow or React site.