Create Voice-Reactive UI Components with Real-Time 3D Effects

Create Voice-Reactive UI Components with Real-Time 3D EffectsCreate Voice-Reactive UI Components with Real-Time 3D Effects

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

Gabor Molnar

pro

• Mar 19

Built and deployed a voice-reactive UI component today. Just me and Claude. 🤝

Noise-displaced 3D sphere, particles deforming in real time from mic input.

First custom code. First deploy.

🔗 https://voicereactivebutton.netlify.app/

So addictive ...

Claude interactiondesigner aidesignflow Netlify Interaction Design Web Design

Jan du Plessis

• 2h

This is so cool! Wow love it. 🥰

Gabor Molnar

pro

• 2h

thanks! I will be live soon with minor tweaks

Paweł Andrzejewski

pro

• Mar 18

Car interfaces keep gaining features, but experience gets lost in complexity. With River, we stripped that back: only surface what the driver needs, when they need it.

We wanted the HMI to belong to the car, not sit on top. So we designed both as one system: car, interior, cluster, main display, app.

Rive was key to bringing the whole system to life. We used joysticks and blend states to animate the cluster gauges, solos to play back a pre-rendered Blender navigation scene on the central display, and state machine inputs to bring the whole prototype to life.

We then built a companion app and plugged it into a manufacturer's API to test against real vehicle data. The app works like a key: gives you access and gets out of the way. Just the right function at the right moment.

One ecosystem where every screen earns its place.

Completed work

vehiclehmiwithrive Rive Blender 3D Design Animation UX Design

Dakshi Parashar

• Mar 18

This is so good it almost feels unreal. Incredible work and amazing efforts! 👏🏻👏🏻👏🏻

JAVIER | DSpot

max

• Mar 18

We are combining 3 main HMI experiences from 2 vehicles into a unified entry. Having a lot of fun on this one! Expect the official entry soon. Can you guess what they are? WIP 👇 🔊

vehiclehmiwithrive car Rive