๐ŸŒŸ 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

Share this project:

Updates