Luna
An iOS native app that helps people who deal with stress and anxiety sleep better at night by improving their mental-well being.
Project Type
Passion Project (12 weeks to complete)
Role
Both Vanessa and I evenly split the roles of UX Designer, UI Designer & Researcher.
Project Overview &
Design Process
Luna is a passion project that Vanessa, a fellow designer, and I began shortly after we graduated from BrainStation’s UX Design diploma program. We discovered that we both had a shared interest in health & wellness, so we sought to tackle the problem space of sleep deprivation among the adult population.
In terms of the design process, we adopted the 5-stage design thinking methodology developed by Hasso-Plattner Institute of Design.
As hinted at by the arrows of this diagram, our process was not always linear and there was a fair bit of back and forth between the different 5 stages as new data emerged. However, in order to make this case study more readable, I’ve arranged it so that the 5 stages appear in the order shown above.
Project Constraints
Before diving into the research, I wanted to briefly outline the constraints that my partner and I worked with during this project.
- No research budget due to this being a passion project
- Limited to research methods and resources that are free
- UI will be specifically for the iOS platform
- Final product will be a high fidelity prototype
Empathize
The Problem
Most of us innately know that sleep deprivation is a very common problem among adults in North America. According to a study led by the CDC in 2016.
1 in 3 adults are not getting the recommended 7-9 hours of sleep each night
1 in 2 adults having trouble falling and staying asleep at night.
When people get less than the recommended hours of sleep per night, as many do, it can eventually lead to a number of health problems. These can include forgetfulness, inattentiveness, being less able to fight off infections, and even mood swings and depression.
One group of young adults that is especially prone to these problems are full-time post-secondary students, usually those attending college or university. This is not surprising due to their demanding academic lifestyle, which often results in studying late at night, poor sleep hygiene, and stress before going to bed*.
*Sleep hygiene refers to behaviors before bedtime that affect sleep. .
The consequences of sleep deprivation and daytime sleepiness are especially problematic to college students and can result in lower grade point averages, increased risk of academic failure, compromised learning, impaired mood, and increased risk of motor vehicle accidents.
- US National Library of Medicine National Institutes of Health
Solution Exploration
Focusing on post-secondary students as our primary audience, we set out to create a design intervention that would help them sleep better at night. We began our exploration broadly by positing the follow design question:
How might we help sleep deprived post-secondary students take better care of themselves in order to improve their overall health?
Primary Research
Using our initial design question as a frame of reference, we conducted research interviews in order to better understand the behaviors, pain-points and goals of post-secondary students.
We built our questions around the following research objectives:
- To discover the behavioural patterns people make in their day to day that cause them to be sleep deprived.
- To understand the attitudes and behaviors people have towards managing their sleep.
- To find out how educated people are generally about good sleeping habits.
- To come away with an understanding of what might incentivize people to get more sleep.
- To walk away with some concrete ideas for a human-centered design intervention.
For our research discovery, we interviewed 8 individuals who all met the following criteria:
- Between the ages of 23-32
- Currently or previously a post-secondary student
- Current or past experience with sleep deprivation
Key Findings
After synthesizing the notes we gathered from our interviews, we grouped our insights into the following four themes.
Define
Design Challenge
After completing our research, we concluded that a combination of stress, anxiety, and poor sleep hygiene are the principal reasons behind poor sleep quality and sleep deprivation.
These insights led us to refine our design question as follows:
How might we help people experiencing stress and anxiety improve their mental well-being so that they can sleep better at night?
User Persona &
Scenario Mapping
Our next step for our design intervention was the creation of a user persona. Based on the pain points, goals, motivations, and quotes we captured during our interviews, we created our persona: Alexandria Jones.
We then conducted a scenario mapping exercise in order to map out the opportune moments where our design intervention would have the most impact.
Competitor Analysis
After creating our user persona and scenario map, we did a competitor analysis to see what solutions already existed. Upon exploring the iOS App Store, we discovered that there were already many digital solutions on the market. Here is a summary of our top competitors:
Finding a Unique
Value Proposition
Coming up with a unique value proposition for our design intervention was for me the most challenging part of this project. Even though this was only a passion project and there was no money at stake, I still wanted to create something that stood a chance of making a dent in the market if it were a real product.
After a couple days of brainstorming, we noticed that there was a feature being used by a number of non-sleep apps to great success, but that sleep apps in general lacked: gamification.
I was particularly inspired by a language app called Duolingo, which has applied gamification masterfully to become one of the most downloaded language apps. Vanessa and I therefore decided to build a healthy sleep app that would utilize some of the same gamification features we’ve seen from other apps.
User Stories &
Task Flow Diagram
For our next step, we authored user stories in order to better understand what Alexandria might be looking for in a gamified sleep app in terms of functionality. The following user story, which was inspired by apps we’ve explored previously, served as a foundation for our design intervention.
As a student who usually is anxious before going to bed, I want to have access to a library of sleep stories, sounds, audios to listen to before bedtime so that I can calm myself down and fall asleep more easily.
Based on this user story, we created a task flow diagram based on two tasks:
- User selects a sleep audio to relax to.
- User selects a timeframe where they will commit to not using their phone.
Ideate
Inspiration
After creating our task flow diagram, we put together an inspiration board to help us visualize what our app might look like. Here were some of the screens we drew our initial inspiration from.
Sketching
We then proceeded with exploratory sketching.
Prototype
Low Fidelity Prototype
For the next step, we crafted the first of 3 iterations for our low-fidelity prototypes. It was also during this process that we named our app Luna.
Test
Usability Testing
As part of our design process, we conducted 2 rounds of usability testing with 5 testers per round. Below are our user scenario and tasks that we communicated to our testers.
Test Scenario
You are a 4th year business student balancing a full course-load with a part-time job. Lately, you’ve been feeling overwhelmed about your upcoming midterms and finding a job after graduation. As a result, you often feel anxious at night and this has made it difficult for you to sleep.
A friend recently recommended that you download an app called Luna. It is designed to help users sleep easier at night by offering a library of relaxing audios. Additionally, it encourages users to use their phone less at bedtime.
It is the end of the night and you’re ready for bed. In preparation for a good night’s sleep, you turn to Luna.
User Tasks
- Set a time period where you won’t use your phone after bedtime.
- Find and play the sleep audio track “Gentle Waves”.
Design Changes
After each round of usability testing, we made design changes based on user feedback. Below are the key design changes and mockups for our second and third iteration.
Design changes after first usability test
Second iteration
Design changes after second usability test
Third and final iteration
This is the version that served as the base for Luna’s high fidelity prototype.
High Fidelity Prototype
Video demo of Luna's high fidelity prototype. For the interactive version, find it here.
Visual Identity
This section explores the behind-the-scenes thinking where we look at the mood, logo, colours, and typography of Luna.
Mood
Following best practices, we first created a moodboard to define the direction of Luna’s brand.
Logo & Wordmark
Luna was selected as the name of our app because we wanted a name that would be memorable for users, and symbolic of a sleep based digital solution.
The logo itself went through many iterations as we experimented with the wordmark. We thought that the rounded geometric sans-serif typeface Comfortaa fit with the mood of being relaxed that we wanted to evoke. A moon was used in place of the “u” to make the logo more on brand.
Brand Colours
The goal of the palette was to help our user feel calm, relaxed, and sleepy when using the app. We chose blue as our primary brand colour due to its associations with health, tranquility, and the night sky.
Purple, another sky colour that nicely compliments blue, was selected as an accent colour. Lastly, we added yellow as a tertiary colour due to its universal association with the moon.
Typography
We selected SF Pro Text and SF Pro Display as Luna’s primary typefaces for two reasons: conformity to iOS design guidelines, and high versatility in terms of font weights.
High-Fidelity Prototype
Here is the final interactive prototype of BoundZero.
Future Thinking
Next Steps
As Luna was a passion project between my partner Vanessa and I, we didn’t have the resources to make this into a real app. If we did, however, here would be possible next steps:
Customer Desirability
Before developing Luna any further, more market research is needed to determine whether or not there is a place for Luna among the hundreds of sleep apps that already exist. This would involve additional interviews with more people, conducting interest surveys, and other available research methods to validate customer desirability.
Business Viability
In terms of monetization, one way would be to make Luna free to download, but require users to pay for a monthly or premium subscription if they wish to access premium content. All the competitors we explored earlier use this freemium SaaS model.
The other monetization method is in-game currency, which is a very popular mechanic among mobile gaming apps. In Luna’s case, the user would be rewarded with currency for maintaining their streak over a period of time. which they can then use to purchase locked audio content. However, users could also purchase in-game currency directly with real money. This would bypass the need for users to farm currency so that they can access the premium content they want right away.
Product Feasibility
Until now, we have not consulted with any developers regarding Luna’s product feasibility, so that would be the first thing we’d do before building any new task flows. After we’ve determined that Luna could be built with the desired functionality, we would continue to build the app one task flow at a time until we have a minimum viable product. From there, we would finally bring it to market, gauge user interest, and go from there.
Reflections
Design for User Familiarity
Luna was a challenging project as it brought me into unchartered territory where I tried to build UI elements that I haven’t seen in other apps. For example, the Digital Health Goal UI from the first iteration was too complicated for users to understand. We eventually ended up removing it and replaced it with the alarm function which was more in line with our users’ mental models. For me, this cemented the importance of designing for user familiarity.
Specific Designs for Specific Problems
Another key takeaway for me is that apps are specifically designed in a way to solve its own specific problems. As I wrote earlier in this case study, the language app Duolingo served as inspiration for our initial sketches. However, we allowed Duolingo’s UI to influence our design decisions more than we should have despite Duolingo being a completely different type of app. This led to some of the more severe usability issues in our first greyscale prototype.
For future projects, I will definitely do a better job of identifying the specific UI elements from other apps that can aid my own design intervention, and leave the rest alone.
I'd love to connect with you! Feel free to say hello.