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
🎨 Doodio — Because everyone has something to express
I've always believed that creativity lives in all of us — not just in those who can draw perfectly or play an instrument. I'm not the best at either, honestly. But there's something that happens when I listen to music or when I make something with my hands… I feel a different version of myself. Freer. More me.
That feeling is what I wanted to capture with Doodio.
It's a simple idea: you draw anything — a sun, a cat, a chaotic scribble that makes no sense — and your drawing becomes a unique melody. Not because you did it right. But because you did it.
The messiest drawings in my demo? They had the most interesting rhythms. 🎵
What you can do:
🎨 Draw anything on the canvas
🎵 Hear your drawing come to life as a melody
🎸 Remix it across 6 genres — Jazz, Rock, Ballad, Pop, Funk, Metal
🎤 Add your voice and become part of the music
💾 Save your doodle to a shared gallery and hear what others created
Built with:
🖌️ Figma Make — prototyped the entire UI in just a few prompts
🔗 Figma MCP + GitHub — design and code always in sync
🗄️ Supabase · 🚀 Vercel · 🎼 Web Audio API
This isn't about making something perfect. It's about making something that feels like you. 🌟
Github Repo : https://github.com/mcontrerasmalpar-pixel/Doodio
Come draw something. Anything. 👇
#FigmaMake #FigmaMCP #Figma #Challenge #Doodio #WebAudio #Supabase #Vercel
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
What if you could see the world through the eyes of a local? 🧐
A quick search doesn't always cut it. We get funneled toward the same generic spots, and half the time we don't even know why something's being recommended to us.
Incola fixes that. Just ask someone who actually knows the place you're heading to. 🧳
Where should I go if I love history and I've got 2 days in New York? Where do I find open-air house music events in Tokyo? Ask a local. And while you're at it, help other travelers by answering the open questions about your own city.
Try it now! The more people jump in, the faster we leave the cold start problem behind. 😄
Can't believe I'm saying this, but all of this was built in Figma Make.
Try Incola: https://vary-mac-30681003.figma.site
More insights coming soon.
Pip is a zero-friction health companion built to turn tracking your health (SYMPTOMS, DIET AND MORE) into clinical clarity. It abandons rigid 0–10 numeric scales and replaces them with a compassionate, glanceable interface.
❤ Why It Was Built
Pip was born out of pure personal necessity. I built it because it was something I desperately needed, and something a few close friends and someone incredibly close to my heart needed too. I wanted to strip away the clinical coldness of modern software and create something beautifully simple that could be truly, deeply helpful on someone's hardest days
⚠️ The Problem
Traditional health apps suffer from "Data Collection Theater." They force users suffering from chronic illness or fatigue to rate dozens of variables daily, causing severe decision fatigue.
Worse, they act as data sinks, dumping raw, chaotic charts onto doctors. In a high-stakes, 15-minute medical consultation, physicians don't have the time to audit raw logs. They need high-yield, synthesized clinical signals, not noise. Pip bridges this gap by assuming "bad days are the default," capturing symptoms effortlessly, and compiling them into a clean, one-page summary sheet.
🛠 The Figma Workflow Pipeline
To bring Pip to life, I leveraged the Figma ecosystem:
Figma Weave: Used to iterate and generate the visual asset layers for Pip’s mascot.
Figma Agent: Brainstormed layouts directly on the canvas, instantly pairing elegant fonts and organizing simple, stress-free forms.
Figma Make: Instantly turned those canvas designs and components into a live, fully working, and responsive web application while allowing rapid iteration.
Bloom Lab is a cozy virtual plant-breeding mini game where users can choose a seed, plant it, care for it, help it bloom, and create new hybrid plants by combining traits.
The idea started with a simple thought:
What if a plant-care game could feel calm, expressive, and a little magical?
In the game, each plant reacts through mood changes, care meters, facial expressions, and small interactions. Users can water the plant, give it sunlight, watch it grow, and eventually discover hybrid plants like Glowleaf, Honeybloom, and Dreamberry.
This project was also special for me because it was my first time using Figma Make, along with other AI-assisted tools/models during the process. It was exciting, but also challenging. I had to learn how to work with prompts, fix broken flows, manage component states, refine animations, and make sure the final experience still felt intentional as a design.
Some things I focused on:
Building a soft and cozy visual style
Creating reusable components and plant assets
Designing smooth micro-interactions
Making the care screen feel alive through plant expressions and idle animations
Creating branching outcomes based on seed and hybrid choices
This project taught me a lot about designing with AI tools not just generating screens, but guiding, correcting, and shaping the experience until it felt like my own.
It was a challenging but really fun learning experience, and I’m happy I pushed myself to participate.
Check it out here: https://pad-flyer-18166722.figma.site
Highly captivating novel experience.
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?