Hey everyone! 👋
I just launched Monster Opera – a fun little web experiment where you can create your own singing monster choir! 🎤
I wanted to build something playful, UX-friendly, and creative, making it easy and enjoyable to interact with.
🛠️ Tech Stack
- 🚀 Next.js – for the frontend
- 🎨 Spline – for interactive 3D models
- 🎵 Tone.js – to handle sound generation
🎨 Designing the Monsters
I started by designing multiple monster variations in Spline, giving each one its own quirky personality.
Once the 3D models were ready, I imported them into my Next.js project and used Tone.js to associate sounds with them. Now, clicking on a monster triggers its unique singing voice! 🎶
🎛️ Step Sequencer – Making Music Interactive
To make the experience even more fun, I added a step sequencer, allowing users to compose simple patterns and hear their monsters sing in rhythm! 🕺💃
With just a few clicks, you can create fun melodies and watch the monsters perform in sync.
👩🎨 Why I Built This
I wanted to code something simple yet creative, blending music, interactivity, and playful design into an experience that's:
- Easy to use – no steep learning curve, just play!
- Visually engaging – thanks to interactive 3D monsters
- Musically fun – experiment with sounds and patterns
🎶 Try it out here 👉 Monster Opera
I’d love to hear your feedback – any thoughts on how to improve it or take it further? 🐥
Top comments (0)