top of page

Ezzz

App Icon.png
Overview

Ezzz is a sleep focus and tracking app that aims to help people enhance their sleep quality and sleep hours. One of the greatest obstacles that affect people’s sleep is an addiction to technology. Essentially, the app will provide sleep aids (including meditation, stories, music) to help users naturally get detached from their mobile phones before bed. The app will also measure and analyze sleep data to help users determine the core influence of their sleep concerns.

Roles

Entire project design from research to ideation, prototyping and testing

Tools

Figma, Invision, Wix

Ezzz
Part 1: Discover
Secondary Research

Health research studies have found that mobile addiction is hindering people’s professional life and personal relations. Extensive screentime is also found to disrupt sleeping quality which leads to rest deprivation and mental stress. 

Nomophobia is a behavioral addiction that triggers fear and anxiety when being without a mobile device.

75%

Of Americans admit that they have an addiction to their cellphones.

71%

Sleep with or next to their phone.

40%

Check their phones in the middle of the night (if they wake up).

80%

Are on their phone an hour before and after sleep

Effects of Mobile Use on Sleep Quality
  • Sleep Disturbances

  • Decreased sleeping time

  • Increased Sleep Latency

  • Increased daytime sleepiness & reduced concentration

Design Outline

Hypothesis

 I believe that heavy phone users have a difficult time being detached from their mobile devices because they are habituated to checking their phones regularly during the day. This can lead to sleep latency, decreased sleep quality, and increased daytime sleepiness.

Problem Space

Research has found mobile addiction is hindering users’ work/ study and personal relations. Also, extensive screen time is found to disrupt sleeping quality which leads to sleep deprivation and mental stress.

How Might We?

In that sense, the problem I want to solve is:

How might we help heavy cellphone users optimize their screen time so that they can get sufficient sleep at night?

User Research

Interviewee Criteria

Millennials are the majority of the population who spend extensive hours on their mobile phones. The criteria for heavy phone usage is at least 5 hours a day. People can check on their device screen time in the settings like the image above to determine their usage and determine whether they have an addiction to cell phones.

Screen Shot 2022-03-28 at 11.41.11 PM.png
Screen Shot 2022-04-01 at 10.11.13 PM.png
Part 2: Define
Key Insights

Interview Findings

Screen Shot 2022-04-01 at 10.14.57 PM.png

Affinity Map

The affinity map helped to allocate people’s main source of pain points for sleep concerns, their motivation to sleep, and their common behaviors when trying to put themselves to sleep.

Screen Shot 2022-04-01 at 10.18.31 PM.png
User Persona

The initial stage in the design process was creating a persona and user experience map using the insights that were gathered through my user interviews.

The persona represents the core attributes of my target user. Skylar is a young working woman who has trouble sleeping due to stress from work and addiction to her cell phone. As many interviewees reported their main motivation is to get sufficient hours of sleep in order to be energetic and focused during the day. However, at night, they have the urge to have some kind of entertainment to destress. 

Persona My.jpg
User Experience Map

This experience map shows Skylar as she try to seek for resources to help with her sleep problem. Mapping out what Skylar is doing,thinking and feeling leads me to discover opportunities where I can intervene and help her resolve the problem.

Experience Map.jpg
User Stories & Epics

In order to investigate and determine the core concern of my users, I created 35 user stories that were gathered from my user interviews and secondary research. Then I categorized those user stories into 3 epics including focus, control, and track. I chose to focus on sleep focus since it is the top concern for phone addiction.

Epic: Sleep Focus

  1. As a young adult, I want to clear my mind before sleep so that I do not ruminate over stressful events that happened during the day.

  2. As a young adult, I want to set a sleeping schedule so that I have control over my sleeping hours.

  3. As a young adult, I want to become detached from all electronic devices when I go to bed so that I am fully concentrated on sleep.

User Flow Diagram

This user flow maps out the journey that the user would take from beginning to end of using the app.

NEW USER FLOW.jpg
Part 3: Design Process
Sketches

Exploratory Sketches

After creating the user flow and user stories I began to sketch on paper to brainstorm different options of layouts for the app.

Welcome Page

Simple Ver.
Simple Ver.

A simple welcome page.

press to zoom
Complex Ver.
Complex Ver.

A welcome page with sign-in and register buttons.

press to zoom
Introductory Ver.
Introductory Ver.

An introductory welcome page.

press to zoom
Simple Ver.
Simple Ver.

A simple welcome page.

press to zoom
1/3

Home Page

Activities Ver.
Activities Ver.

A large image with navigation bar at the bottom.

press to zoom
Navigation as Home Page
Navigation as Home Page

press to zoom
Data Ver.
Data Ver.

A home page that includes sleep data.

press to zoom
Activities Ver.
Activities Ver.

A large image with navigation bar at the bottom.

press to zoom
1/3

Sign-up Page

Form Ver.
Form Ver.

Detailed Sign-up Page to Fill Personal Information

press to zoom
Scale
Scale

press to zoom
Tags
Tags

press to zoom
Form Ver.
Form Ver.

Detailed Sign-up Page to Fill Personal Information

press to zoom
1/3

Sleep Analysis

Graph Ver.
Graph Ver.

press to zoom
Card Ver.
Card Ver.

press to zoom
Carousel Ver.
Carousel Ver.

press to zoom
Graph Ver.
Graph Ver.

press to zoom
1/3

Solution Sketches

Welcome Page

Welcome Page.jpg

Home Page

Home Page.jpg

Sign-up Page

Registery Page.jpg

Sleep Analysis

Sleep Analysis.jpg

Low-Fi Prototypes

The solution sketches were transferred into grey-scale prototypes in Figma. 

Welcome.jpg
Daily Meditation.jpg
Sign Up.jpg
Authorization.jpg
Home Page.jpg
Daily Meditation-1.jpg
Home Page-1.jpg
Meditation Playlist.jpg
Sleep Analysis.jpg

Usability Testing

10 usability tests were conducted with 10 participants to gain insight into the experience through the user flow of the app and receive feedback about any confusion, difficulty, and misinterpretations.

Screen Shot 2022-04-01 at 11.31.26 PM.png

Usability Test Findings

Authorizations:

  • Concerns relating to privacy and safety on enabling the microphones

  • Concerns with phone’s battery life when enabling the microphone all night

  • Wonders why it is necessary to enable notifications

Meditation:

  • Unable to locate the meditation activity for beginners

  • Confused about the transition from meditation to the next morning

 

Sleep Statistics:

  • Confused about the algorithms with the sleeping score

  • Questioned about the calculations of screen time in bed

Lo-Fi Prototype Iterations

Iteration 1:

Added feature- New feature to allow users to set a sleeping goal. The app will motivate users to achieve their goals by starting a streak

Iteration 2: 

  1. Description: Each authorization now comes with a description of why it is necessary to enable them.

  2. Layout: a line is added between each section for a clearer view.

Iteration 3: 

  1. Clarification: instead of meditation, it is now labeled as a sleep guide to help users understand that it is a sleep aid.

Iteration 4: 

  1. Layout: increased the spacing between each section to create some breathing rooms.

  2. Added features: users will be able to visualize their growth and improvement. Each star means they have achieved their sleep goal that night. Users will also receive badges for streak milestones and for the activities they have tried out.

Sign Up (i).jpg
Sign Up (f).jpg
Authorization (i).jpg
Authorization (f).jpg
Home Page (i).jpg
Home Page (f).jpg
Sleep Analysis.jpg
Sleep Analysis-1.jpg
Part 4: Deliver
Branding

Brand Name:

The name Ezzz is derived from the phrase Easy Sleep, but it has a symbolic meaning of falling asleep before one can finish the word ‘easy’. ‘Ezzz’ is also intended to rhyme with ‘the word ‘easy’ which creates the impression that this is a minimal and simple app to use.

Ezzz.png

Logo:

The blue-purple gradient font color offers a natural and subtle feeling. 

The ‘E’ is capitalized and the ‘z’s are lower case to present contrast. This fits with the theme of natural and easy sleep as ‘zzz’ means falling asleep.

icon2.png
icon1.png

Typography:

Nunito is a well-rounded typeface that is used widely across many mobile apps. It is prolific as it offers multiple text styles. The typeface gives a friendly and pleasant feeling which corresponds with the theme of the app.

Nunito Typography.png

Color:

The primary colors are blue and purple. The blue symbolizes the color of the sky and the purple symbolizes the color of lavend0r. Overall, these are tranquil colors that gets users in the mode to sleep and allow them to feel calm and relaxed.

Brand Colors.jpg

Grids & Spacing

The UI design uses a grid of four columns (with 24px margins and 16px gutters) and an 8px auto row.

Template (to show).jpg

A UI library was created to follow consistent spacing and sizing throughout the app.

Atom- Buttons.jpg
Hi-Fi Prototype
Home Screen
Home Screen

press to zoom
Registery
Registery

press to zoom
Sleep Analysis
Sleep Analysis

press to zoom
Home Screen
Home Screen

press to zoom
1/9
Also Available on iWatch

Ezzz is also available on iWatch to further assist users to keep up with their sleep schedule and view their sleep statistics.

At night, users will receive a notification that the sleep mode is on which means all their notifications are off and they will receive a sleep notification if they are still on their phones. In the morning, the sleep statistics will display a variety of sleep scores and data which is easily accessible on the iWatch.

Frame 10.png
Marketing Site

I designed a responsive marketing site to advertise Ezzz to increase brand familiarity and advocate its features to more people with concerns about sleep.

Frame 64.png
Frame 65.png
Part 5: Reflection
Key Learnings

Dig Deep

This Capstone project began by searching for an existing problem in society to tackle. I had the intention to find a concern that the majority of people in the community had in their daily lives. Since I have a social psychology background, I knew insomnia is a serious problem for a large proportion of the population. Therefore, I conducted in-depth research to discover that the core influence of sleep deficiency for Millenials is cell phone addiction.

Iterate & Re-iterate

In the design process, I learned the best way to enhance the user experience for the app is to do multiple phases of user testing and seek critiques from classmates and educators. This feedback allows me to acknowledge users’ difficulty and confusion when using the app. After each phase of user testing, I was able to make small iterations to improve the overall usability and functionality.

Next Steps​

Due to the short time constraint in designing the app, there are more features to be implemented if  Ezzz has a future of launching on the market.

  • More physiological measures include heartbeat and sleep movement at night. This can offer more sleep data to the users and allow them to know if there was an irregular pattern or factor that affected their sleep quality.

  • Complete building other sleep aids including music, story, and smart alarm. 

pexels-ketut-subiyanto-4473863.jpg
bottom of page