SYDNEY SWANSON


Case Study: Designing a More Effective Alarm Clock


Research
Design
Usability Testing
Final Prototype
Reflection

Inspiration for this project came from my search for ways to improve my daily routine. I found that being able to wake up on time was a high priority. It was not only a problem that affected me personally, but also one that I knew many people dealt with. The native alarm clock app on my iPhone leaves a lot to be desired, so I decided to design a unique alarm clock app to better solve this problem.



ROLE: UX/UI Designer

TIMELINE: 2 Months

TOOLS: Miro, OptimalSort, Adobe XD, Illustrator

TEAM: Me



UX Research to Define the Problem





I wanted to improve the user experience of using an alarm clock app, but first I had to figure out what that entailed. To tackle this, I conducted a few one-on-one interviews that focused on asking subjects to tell a story about their daily routines. I was able to gather information on their needs and behaviors that revealed pain points and problems these users had about their morning routines. Another method I used was card sorting, which allowed me to better visualize the information architecture of my app.



IDEATION - INTERVIEWS & CLUSTERING



I transferred my notes onto stickies, which I then clustered into groups with common themes. This visualization of information helped me define some clear findings about users' habits and needs:

  • Users fell into the categories of light, medium, and heavy sleepers. These categories correlated with how easily users woke up -- light sleepers set fewer alarms that were simple to turn off, while heavy sleepers set more alarms that were complicated to turn off.
  • Motivation to wake up generally depended on the schedule planned for the day.
  • Common pain points revolved around alarms that were tedious to set up without much customization and sleeping through alarms.
  • Most users would not pay for extra features unless they were confident that those features improved their sleeping and waking up habits.


Ideation - Card Sorting



I used card sorting to help determine which features users felt were most important to have in a mobile alarm clock app. I opted for a closed sort of features with categories ranging from “Very important” to “Not important.” Participants’ comments while sorting and how they placed the cards provided the qualitative and quantitative data I needed to prioritize which features to include in my alarm app. I decided to only include the features most users categorized as very important and somewhat important.



Ideation - Personas



Next, I created three personas based off of the information gathered from my research to help me contextualize how my alarm clock app would begin to improve the user's waking up routine.



IDEATION - PERSONAS



Next, I created three personas based off of the information gathered from my research to help me contextualize how my alarm clock app would begin to improve the user's waking up routine.



IDEATION - PERSONAS



Next, I created three personas based off of the information gathered from my research to help me contextualize how my alarm clock app would begin to improve the user's waking up routine.



UX Design to Approach the Problem





Now that my initial research was complete, I could apply my findings to creating a viable solution. I wanted a product that was “invisible” to the users. Ideally, they would not have to think too hard in creating an alarm suitable for their individual needs and in navigating the app itself.



Wireframes



I sketched out some wireframes for my app. I brainstormed an alarm clock app with:

  • Customization through a questionnaire-style onboarding process
  • Access to settings centered around improving the user’s waking up routine
  • A motivation-based alarm clock


Design Decisions



I envisioned an app that had a simple, yet creative design both in the navigation and process of setting the alarm itself. I played around with creating a way to set the alarm that was familiar to the user, yet still interesting to interact with.


I also wanted to incorporate a light and dark version that the user could toggle between to best suit nighttime or daytime use. The color palette inspiration for the two modes came from internet research on color science for colors that soothe and colors that promote alertness. Here are some examples of the original prototype I made using Adobe XD.


Video of v.1 Prototype

Usability Testing to Improve My Design





Once the first iteration of my design was prototyped, I set out to get usability feedback. One of the biggest constraints I had while working on this project was the technical limits of Adobe XD’s prototyping application. I could not create unlimited instances of unique user actions (i.e. typing in infinite combinations of alarm clock times or duplicating an alarm many, many times), so I had to come up with interactions that gave the user a good idea of what a certain action would do, while at the same time limiting the actions available. Usability testing provided a good way for me to see if my solutions were valid in a real-world setting.



Usability Testing - results



I tested users in moderated sessions where I let users play around with the prototype to get a general feel of it, and then asked users to complete specific tasks. I was able to translate these results into a second iteration of the original prototype. To the left is a summary of my main findings.



SECOND ITERATION CHANGES - WIREFRAMES & DESIGN



Navigation

  • From the very beginning, users now have a clear option to choose if they want help setting up their alarm, or if they want to go straight to the alarm home screen.
  • I added confirmation screens for some actions to give users greater navigational control.

Onboarding

  • Answers are now arranged on a single screen, with feedback on how selecting a specific answer will apply to the alarm settings.

Appearance

  • I changed the method of setting an alarm time to simply typing in a number.
  • Light/dark mode can be set to manual or automatic based on the time of day.
  • Home screen alarms changed to a static view without an expanded option, prioritizing available information and actions.

Copy

  • I changed the language used throughout the app from a suggestive tone to provide users a plain understanding of navigation and actions.


FINAL PROTOTYPE



Finally, I was able to create an improved prototype of my alarm clock app!


Interactive Prototype

Reflection





I wanted to create a unique solution to a common problem that stemmed from my personal life. By completing this project, I learned how to translate an idea, such as “improving the user’s waking up routine,” into something with a measurable effect. In order to define what constitutes a “more effective” alarm clock, I studied the experiences of potential users, addressing their pain points and fulfilling their needs in the form of a mobile app.


In my efforts to create a seamless experience, I first thought that users wanted an app that essentially set up everything for them. Through usability testing, however, I discovered that users actually wanted greater control over every aspect of navigating through an alarm clock app. I learned that designing something aesthetically pleasing AND functional is a real challenge. If I were to continue developing this project, I would test the app with users in a more accurate context, such as observing how well the app performs at waking up users.






Icons by Noun Project