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
KOSS Porta Pro — Interactive 3D Headphone Configurator 🎧
A real-time 3D product configurator built for the web — customize colors and swap parts on a classic pair of headphones, right in the browser.
What I did:
🎨 3D modeled my personal KOSS Porta Pro headphones from scratch — a clean, low-poly version built specifically for real-time web rendering
🎮 Built the configurator with React Three Fiber, using React's Context API as a global state layer that drives material colors across the geometry in real time
🔄 Designed a part-swapping system for the earmuffs — multiple geometry variants toggled seamlessly through state
✨ Polished the scene with drei helpers: a reflective floor, atmospheric fog, and a custom shader material to give the headbands a metallic shine
Shoutout to Wawa Sensei on YouTube — his tutorials are where I picked up the core concepts. Highly recommended if you're getting into 3D on the web.
Stack: React · React Three Fiber · Drei · Blender
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
TITLE:- RALPH SPOONS
I'll let you guys decide what to make of it..
Built for the RENOISE CHALLENGE using renoise.ai inculcating the use of Renoise Canvas and FacePass features primarily. Used the Image Assets for referencing throughout .
Credits spent:- 870 Leftover:- 130
I had to fine tune each clip again to make up for the inconsistencies which was experimental and fun.
Final editing done in Clipchamp.
It is a SOLO project from me , Prasun.
I have attached the workflow walkthrough for you guys to see along with the final output. I HAD A BALL working on this and am really excited to see what others made . Cheers!
Music by Ludwig van Beethoven. Bagatelle No.25
I read it as: the man is trying to protect the child, but ends up looking guilty, which makes the message feel like “nothing is really what it seems.” The spoon connection could be “don’t swallow everything you see at first glance.” 🤔
Still thinking about the sandwich though 😄
I am working with 3d websites using next js and three js
Does 3d website work properly?
App Name: GigPulse
Category: 📊 Dashboard + 🤝 Social/Community
What it does:
GigPulse is a personal freelance project tracker built for independent professionals who juggle multiple platforms. Freelancers can log their projects, track earnings per platform, monitor project status, and attach video demos of their work all in one private dashboard. The community benchmarking layer lets users see anonymized stats from other freelancers in their niche, so you always know how you stack up.
How I built on top of the AI-generated base:
Bubble AI generated the core dashboard structure and data architecture. From there, I manually engineered the video upload and playback system per project, built privacy-filtered data workflows so each user only sees their own data, added platform-specific earnings tracking with status badges, and designed a clean dark UI with collapsible video players. The AI gave me the skeleton, I built the muscles.
This is the Bubble AI-generated base after my initial prompt 'Build a freelance analytics dashboard app called "GigPulse" where
freelancers can track their gigs, proposals sent, earnings per platform,
client response rates, and monthly revenue goals. Include a community
benchmarking section where users can see anonymized stats from other
freelancers in their niche. Add user authentication, a personal stats
dashboard with charts, a goal-setting tracker, and a community feed
where freelancers share weekly wins.'
Everything you see in the final build beyond this point was manually engineered.
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?