VISUALIZING AND INTERPRETING OUR DREAMS
Melo
ROLE
UX/UI Design
Wireframing
Prototyping
TIMELINE
72 hours
March 2026
TOOLS
Adobe Ilustrator, Photoshop, Firefly, Express
Figma Design
Procreate
TEAM
Cathy Yin
OVERVIEW
Melo is a speculative mobile product designed to help users capture, interpret, and reflect on their dreams.
This project was created as part of FigBuild 2026, and addressed their challenge statement:
"Design a tool that tracks, measures, or visualizes an aspect of the human sensory experience not typically considered."
RESEARCH
Did you know?
Dreams often provide insight into our subconscious mind, revealing the emotions, memories, and anxieties of our waking life.
1/3
of our lives are spent asleep
95%
of our dreams vanish within minutes of waking
80%
of our dreams involve negative emotions
THE PROBLEM
Unreliable dream recall
People forget dreams within minutes of waking. Since the average person has 3-6 dreams per night, details are lost very easily and unreliable upon recall.
Hard to understand
Dreams are often very complex, making it hard to interpret and gain insights from if not approached correctly.
No pattern tracking
People don't recognize patterns in dreams overtime, therefore recurring indicators and themes may not be addressed.
Reworked problem statement
So, what if we could turn dreams into actionable reflections, helping users understand their subconscious and emotional well-being?
DESIGN DECISIONS
Ideation
The ideation for this project began with determining the core features of the app and creating a user flow diagram. Followed by rough sketches of the user interface, we were able to outline the skeleton of the app.
User flow diagram
Wireframes
Lo/hi-fidelity Screens
Based on our early-stage wireframes, we developed a set of low-fidelity screens that translated initial concepts into more structured interface layouts. Using a consistent design system, we rapidly iterated on these screens, maintaining visual and functional consistency across the experience.
Lo-fi wireframes
Final design
FINAL DELIVERY
Our features
Not only do our features allow users to revisit past dreams, but they also use AI to help interpret them and identify patterns in sleep behaviour over time, giving users deeper insight into their thoughts, emotions, and overall sleep habits.
Reliable dream recall
Easy to understand
Active pattern tracking
Cinemagraph
The Cinemagraph is a collection of photos taken and complied together to make a scrollable moving scene.
By using the scroll wheel, users can look at key moments throughout their dream identified by AI to gain dream-specific insights.
*concept inspired by iPhone live photos
Dream Archive
Users can refer to their dream archive calendar when wanting to look back at old dreams. All dreams are organized by the date and show a thumbnail photo to remind users what dreams they want to view.
Search Section
Users can use the search bar to type in key words or the filter to categorize their dreams for easy access and identification.
Biometrics
By examining biometric data, users can more effectively quantify and compare their sleep patterns.
TAKEAWAYS
Reflection & Key Takeaways
Designing Melo became less about analyzing dreams and more about creating space to stay with them a little longer. That same awareness can extend into our waking lives, helping us notice what we often overlook and reminding us to care for our health and well-being with greater intention.
SEE MORE WORKS
Designing a focus app for students
