-
-
Figure 1: Home Screen
-
Figures 2a and 2b: Sign up and Login Screens
-
Figure 3: Screens for connecting to a streaming service (i.e. Spotify)
-
Figure 4: General Loading Screen
-
Figure 5: Emoji Selection Screens
-
Figure 6: Mood Rant Screen
-
Figure 7: Genre Screen
-
Figure 8: Loading Screen with Quote
-
Figure 9: Playlist Reveal Screen
-
Figure 10: Playlist Expanded Screen
-
Figure 11: Current Song Screen
Inspiration 🌟
According to the University of Maryland Medical Center, listening to music can positively impact students' health and well-being. Music is an effective stress reducer in both healthy individuals and people with health problems. This inspired us to develop Moodi, a platform devoted to serving college students validated in their emotions through music.
What it does 💡
Moodi is a mobile application that allows users to receive an AI-generated playlist based on their mood and preferred genre. A user can select an emoji to represent how they are currently feeling, and also add sentences to further describe their mood (optional feature). From these inputs, Moodi will analyze this information to output songs in a personalized playlist and allow the user to stream songs directly from the app.
How we built it 🛠
We used Figma to design Moodi, starting with low-fidelity wireframes and transforming them into high-fidelity wireframes after establishing our brand identity (which includes our color palette, assets, font face). We added 3D illustrations from Figma’s Icons8 plugin and emojis from iOS. We also used public Figma community libraries to add UI assets from iOS, such as the keyboard, timestamp, and battery life. We also leveraged Figma’s “Prototype” feature to allow users to experience the app in an interactive walkthrough (i.e. clicking a button leads to a specific screen).
Challenges we ran into 🏎
Skyler: Brainstorming app ideas and choosing which track to pursue–Fintech or Health & Lifestyle–was one of the longest phases and the most difficult. Fortunately, by talking to 2 users from our intended audience to understand their pain points, we were able to overcome this challenge and identify our app idea.
Olivia: Our biggest challenge was deciding what type of app to design. It was very difficult for us to choose what design idea we wanted to implement for our app.
Accomplishments that we're proud of 🏆
Skyler: I’m proud of our team’s fun dynamic and organized workflow! Olivia and I were able to identify our own strengths, teach each other new concepts, and leverage this understanding of each others’ skills to delegate tasks smoothly. I’m also proud of the ample amount of survey responses we received in the limited time frame.
Olivia: I am proud of the team effort we put forth. We were able to split up the work evenly and communicate with each other by asking questions and sharing perspectives. Furthermore, I am very proud of how we managed our time wisely and organized our work, as we put so much thought into this.
What we learned 📚
Skyler: I learned more about the significance of understanding a target audience’s pain points before diving into a design. Through a combination of surveying users, interviewing students from our intended audience, and doing online research, we were able to fully identify the needs of our users that aligned with features that we could implement into our project.
Olivia: I learned that it is important to understand the background story of why we are designing this app. Through user research and the survey we sent out, It helped me gain insight into college students’ perspectives and their struggles. Furthermore, Figma helped me improve my design skills and exposed me to new techniques for designing apps.
What's next for Moodi 🔮
We plan to implement a community-driven feature that enables college students to connect in groups based on mood. We plan to add a feature that represents the mood status of a user, along with the song and playlist they are currently listening to. The statuses can be stored in a graph that the user can look back on to see a visualization of their moods/songs throughout the week. In addition to music playlist recommendations, we also plan to implement a feature that recommends video games to play based on a user’s mood.
Built With
- figma


Log in or sign up for Devpost to join the conversation.