๐ Project Title: DreamCanvas โ Turn Imagination into Interactive Media
Track: AI/ML + Education/ArtTech
๐ What It Does
DreamCanvas is a no-code platform that transforms creativity, whether itโs a childโs crayon sketch, a dream journal entry, or even a to-do list, into vibrant animated stories and interactive media using generative AI.
With DreamCanvas, users can:
- โ๏ธ Upload drawings or text (dreams, to-dos, journal entries)
- ๐จ Transform sketches into short AI-generated animations
- ๐ Enter "Story Mode" to turn dreams into narrated tales with user-defined characters and settings
- ๐ก Get intelligent prompts to fuel storytelling and imagination
- ๐ผ๏ธ Build vision boards and keep dream journals
- ๐ Preview and share creations in a community gallery
- ๐ฃ Enjoy playful loading animations tailored for younger users
- ๐ Log in to save and revisit projects over time
Whether you're 5 or 55, DreamCanvas helps you bring your imagination to life.
๐ก Inspiration
DreamCanvas began with a simple question: What if we could bring childrenโs imaginations to life? Crayon doodles, bedtime dreams, and wishful thinking, these fleeting moments hold deep meaning, yet they often vanish. We wanted to preserve and amplify them using generative AI.
As we explored further, we realized imagination isnโt just for children. At the heart of being human is the ability to dream, to set goals, to imagine futures that donโt yet exist. This vision evolved into something more powerful: a platform that not only captures creativity but also supports personal growth, reflection, and motivation. By incorporating features like digital vision boards and dream journals, we saw the opportunity to bridge AI with the deeply human need to imagine and strive. Having dreams is a uniquely human trait.
DreamCanvas brings together Human Imagination (HI) and Artificial Intelligence (AI) to honor this core part of who we are. AI becomes not a replacement, but a collaborator and a creative assistant that helps bring our most personal thoughts to life in the form of stories, animations, and interactive media. In that collaboration, we believe weโre crafting something truly meaningful: tools that reflect our inner worlds and amplify them in new, magical ways.
๐ ๏ธ How We Built It
Frontend:
- React.js โ Interface & component logic
- Tailwind CSS โ Responsive design & styling
- React Router โ Page routing
- React Dropzone โ Drawing/image upload
- Socket.io โ Real-time preview integration (optional)
AI & Media Generation:
- OpenAI API โ Story generation, prompt enhancement, and dream interpretation
- Replicate API โ Drawing-to-animation conversion
- Text-to-Speech (TTS) โ Voice narration for generated stories
Backend:
- Node.js + Express โ Server routes and API handling
- Multer โ File upload handling
Database & Auth:
- Supabase โ Authentication, project saving, user data management
- Supabase Storage โ Image and animation storage
๐ง Team Responsibilities
- Sonma โ Page routing, upload/input UI (chat + drawing flow)
- Mandy โ Authentication, Supabase setup, media storage
- Phani โ Backend integration, vision board & dream journal UI
- Jenn โ OpenAI story generation, drawing-to-animation flow
- Stuti โ Interactive gallery, UX polish, loading animation design
๐ Whatโs Next
- ๐๏ธ Add voice-to-text for younger users
- ๐ฎ Enable character movement and interactivity
- ๐ต Integrate AI-generated music and sound effects
- ๐งช Launch beta in classrooms and parent groups for testing & feedback
DreamCanvas isnโt just a product; itโs a movement to preserve imagination and turn it into something shareable, lasting, and joyful. ๐
Built With
- express.js
- javascript
- mutter
- node.js
- openai
- react
- supabase
Log in or sign up for Devpost to join the conversation.