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
Taste Test
Recently, I built an interactive voice orb for an AI voice agent, built with Three.js and custom GLSL shaders. Four real-time states: idle, listening, speaking, thinking — that react to live microphone input.
This started from a role I came across here on Contra, but didn't land. The concept stuck with me, so I built it out and added a second style: a particle orb. Two takes on the same idea — curious which one you prefer.
Here is the link to the live project - https://voice-orb.netlify.app
1 voted
14%
6 voted
86%
7 votes
Closed
Deformation ORB
Interesting choice. Thank you Esther!
You’re welcome
Voting for the Particle ORB
Yeah, the Particle Orb looks cooler right?
Particle Orb. The granular texture gives it a lot more personality and the way particles would scatter when listening vs thinking could feel genuinely expressive. Building this after not landing the role is the right call, great portfolio piece.
Nice! Thank you for your detailed response.
Particle looks more appealing
Alright. Thank you!
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
Related posts
For this makeathon, I vibe coded a voice note app inspired by old cassette tape recorder, Leave a Tape.
Inspired by my own dilemma, if we can customize our texts with fonts and styles, why can’t voice notes be just as personal and charming?
And Leave a Tape was born! User got to record, and share their recording through virtual cassette tapes to their loved ones!
Simply Leave a Tape at the beep. The recording will only stay available for 24 hours, because some of the best conversations aren’t meant to be archived forever. They simply stay with us.
made for @contra x Figma makeathon! #Configmakeathon
How I built it:
1. I started by creating a simple voice note web app, no designs, no fuss. Just a working voice note system that allows user to record their message
2. Connecting to MCP (Supabase) I connected the initial site to Supabase, that way users can now share their...
Really !! As a freelance web designer who can build you a full website. But the moment I had to talk about it in front of someone, my voice would rush, my breath would disappear, and everything I wanted to say just fell apart.
I knew I wasn't alone. Most designers and creatives I know have the same problem. The work is great. The talking part? That's where we lose the room.
So I built VoiceWell using Figma Make
It's an AI voice coach that actually talks to you, listens to you, and coaches you — like having a real speaking trainer in your pocket. It even guides you through a quick breathing exercise before each session because half the battle is just calming your body down before you open your mouth.
No more losing opportunities because of how you sound. The work already speaks for itself — now it's your turn.
Your work gets you the interview. Your voice gets you the role.
Note 🙌
This is a demo — it works right away, no setup needed.
Want the coach to feel smarter and more human? Just add your own OpenAI or Anthropic API key into the prompt when building in Figma Make and it will come alive.
cool
Throwing out the keyboard. 🎙️✨
How do you design an onboarding flow for users who have never typed on a smartphone? Here is Part 2 of my official submission for the Contra x Figma #ConfigMakeathon: ShramID.
In my last post, I introduced the overarching ecosystem designed for India’s informal workforce. Today, I’m diving deep into the core UX challenge: the entry point.
Since nearly 70% of this workforce faces literacy or tech barriers, a standard consumer app was bound to fail. So, I threw out the keyboard and designed a "zero-tech" ecosystem that is entirely voice-driven and fully localized in their native language.
Here is how the voice-only onboarding works:
1️⃣ Native Selection: The worker simply selects their regional language.
2️⃣ One-Tap Recording: They press the microphone and speak naturally about their past jobs and experience.
No complex forms. No typing. Just natural conversation instantly transformed into a verified digital identity.
#ConfigMakeathon #Figma #FigmaMake
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
MagicPath
The canvas is infinite, and exploration is becoming the workflow. How are you using MagicPath?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?