Overview
This project was done for a course in User Experience and Mobile Prototyping at UPM. It consisted of doing interviews, finding a customer's need, creating personas/task scenarios, making a storyboard, and a user journey map. Finally, we created moodboards and a prototype using Justinmind. I completed this project with three other UPM students: Leire Litwin, Paula Manzano, and Tobias Piffrader.
My role
My role consisted of doing user research, prototyping with Justinmind, UI/UX design, and conducting user tests.
Design process
Interviews & Empathy map
We started by doing user interviews. The goal of these interviews was to understand the user's needs and to find a solution to the user’s problem. We also started by specifying the context of use. The goal here is to define the user by creating user profiles followed by the task scenario and the environment around the user. After analyzing the interviews, we created an empathy map to understand better the user environment and to be able to identify the user profiles. The Empathy map can be seen below in Figure 1.
User profiles
We identified two different kinds of user profiles, the disorganized user and the information consumer. The disorganized user just wants to keep sleeping and is always in a rush. They need to keep a tight schedule and receive continuous notifications to be on time. Contrarily, the information consumer is usually on time, so this user just needs to have a smooth wake up, comfortably checking up the phone notifications and the news.
WakeApp must fulfill the needs of both of these users. Therefore, the application will help the users to wake up smoothly or energetically. They will be able to create a schedule and receive notifications and gamification to follow it. Users will also receive information about their subjects of interest (news, social media) and will have a tab to explore and get the most relevant insights of their day.
User Journey
We continued by creating a user journey map of the user's steps while using the app. This methodology enabled us to identify the pain points of the user and the moments of truth during the journey. The user journey map can be seen in Figure 2.
Moodboards
The next step was to start the design of the prototype. Because of lack of time in the course, we skipped the layouts and low-fidelity prototypes. Instead, we created two different loose moodboards with different designs to present to the client. They can be seen in Figures 3 & 4.
The client decided he preferred the first design. Therefore, the team created a refined moodboard of the design in figure 3. In the refined version, the color palette, typography, different textures and patterns were defined. The final loose moodboard can be seen in Figure 5.
Prototype
The last step was to start designing and building the high-fidelity prototype using the JustinMind tool. One of the main decisions was to make the app with the dark mode since the users will mostly use it when they wake up in the morning and having a darker screen for the eyes is more pleasant.
The app will be following the iOS guidelines by using the iOS status bar, the use of Apple System Icons, Apple text fields, and keyboards. It will also be using the iOS date pickers, toggles, and the sliding right to go back. The buttons will have rounded corners as well as the little cards for the tasks of the day. Everything is meant to be kept very simple and smooth for the users. The final result can be seen in Figures 6 & 7.
User tests
For the user tests, we created two tasks scenarios to put the users in a certain context. Then, each type of user had to perform a different task within the application.
Disorganized User
Task Scenario
Tobi is a mess when it comes to organizing his day. One of the main reasons is that he always gets
up late. Tomorrow he does not want to mess it up, because his crush Sara wants to have breakfast
with him. That is why he sets up his morning schedule with the WakeApp. He opens the app and clicks
the “Add events” button of the chosen day. On a new screen, he will be able to modify the tasks of
last week, add events or just start from scratch.
First task to perform
You noticed today that you should have woken up a bit earlier. That’s why you should go to the
schedule of Tuesday (today) and change the first event instead of waking up at 7:00 am. You want to
wake up at 6:30 am (30 mins duration).
Second task to perform
Create a schedule for Wednesday with the following actions: Event 1: Wake up at 8:30 am (15 mins
duration) Event 2: Have breakfast at 8:45 am (15 mins duration) Event 3: Finish prototype at 9:00 am
(3 hours duration).
Information Consumer
Task Scenario
María likes to keep herself up-to-date with the daily news. When she wakes up, she doesn't like to
be in a rush. She prefers staying in bed longer to check social media or even watch a TED talk.
Additionally she enjoys reading the news while having a calm breakfast. She is also a big fan of
apps that show her recommendations based on her behavior.
First task to perform
Check the current user preferences and deactivate Twitter and YouTube.
Second task to perform
Explore the entertainment section. Click through the publications that you find interesting and let
the app know if you liked the content or not.
More projects
