
Jan. 2024 - Apr. 2024
PROJECT OVERVIEW
Wonderland is an innovative app crafted to explore users’ mental well-being interactively. Inspired by “Alice in Wonderland,” it evaluates burnout levels through a playful quiz. By incorporating elements from the classic story, we guide users on a self-reflective journey into their mental health.
Group Members
Initial Design
Our initial design was created using Figma, with hand-drawn graphics using Procreate and Adobe Illustrator.
Usability Test Report
We conducted a usability study to assess user navigation, satisfaction, and overall effectiveness in stress relief.
Wonderland-A6-Usability Report by Celine Meow
Changes After Usability Test
Feedback revealed users struggled with too much descriptive text and unclear navigation. We improved accessibility by simplifying content and enhancing the quiz interface.
Final Design
After refining our content, addressing minor wording issues, and polishing our prototypes, we finalized the flow design of our app on Figma.
Development Process
Built with Next.js, Wonderland integrates OpenAI API for chatbot features. The app also includes AI-generated calming music and a quiz-based navigation system.
Demo of our app
Style guide
We also coded a comprehensive style guide using HTML and CSS to maintain design consistency across the app.
Images Created





