Zzzloth
The health and wellness industry has been experiencing immense disruption due to advancements in technology. Today’s customers are embracing wearable technologies and other activity-tracking products more than ever before. Combine that with the presence of the smartphone, and it creates a massive market for mobile health and wellness apps. So our challenge was to
Reimagine how people can adopt and maintain a sleeping routine that enhances their well-being.
UX research
Based on the competitive brand analysis, feature analysis, user surveys, user interviews we discovered our primary user Jeanine, a.k.a. the busy nature lover. She wants to discover if her sleep is related to minor health issues, so she can quickly improve her sleep quality without having to go to a doctor.
For that our native Android app would need to help users monitor their sleep. By performing personalized data analytics, the app enriches the user’s knowledge around the quality of their sleep. Therefore the user will become aware of their sleeping behavior and its’ consequences, and learn how to improve their sleep. This will help the users to improve the quality of their life in general.
UX Design
After designing and testing a lowfi prototype, where we researched the path Jeanine would take in the app, we designed the mid-fidelity version, where we tested different ways to visualize KPI’s for the user. With the user-tested feedback we designed a second version of the data before moving on to the hifi design.
UI Research
Based on the visual competitive analysis we created the brand attributes that we wanted to express with the app and designed a moodboard. After performing a desirability test, we found that this moodboard didn’t project exactly what we were aiming for. Even though some associations were perfect, others such as “travel/vacation” were beautiful, but not what we were aiming for, and others (motivation) were missing. After the second version, we found that we were on the right track.
UI Design
Here we decided that the MVP needed to be available in dark mode first. Calm colors that are gentile to the eye, with a lot of round shapes to avoid harsh lines. Someone gave the second moodboard some beautiful feedback that we decided to implement in the design: to them the colors seemed to move from night (dark blues) to day (pink and beige). So that’s what we did for the colors.
The fun quick logo design came about as these seem to be the most calm, relaxed beings on earth. Which is something we want our users to feel in all screens of the app. They need to be able to take a step back and be calm, because then you really get to understand your sleeping data, adapt your sleeping routine if necessary, and sleep better overall.
I also really wanted to design a complete style guide for this project. Mainly to understand how the colors would be used in a light mode that could follow, and to understand what the dev team would need from us as designers.
High fidelity prototype
At this time we have gathered all of the information we need to design the first version of our high fidelity prototype, which you can see below.
For viewing purposes, this recording has been sped up 1.5x.