UIUX Design
Alarme
Alarme is an app that helps you catch the bus and get to school in time. This alarm depends on users' class schedule, daily prep time, and real-time traffic to provide correct wake up time in the morning for users.
Course /
UX Strategies
Timeline /
Sep - Oct, 2019
Tool Used /
Figma
Photoshop
Principle
Contributions /
User Research
Wireframing
User Interface Design
Prototyping
1️⃣ Project Overview
Prompt
Students always get to class 5-10 mins late.
Professors get interrupted by the noise of opening doors. It also distracts students. Based on this past experience, I aim to create an app that helps:
-
Students who can't get up on time.
-
Students who can't catch the bus because the bus doesn't show up as scheduled.
Solution Overview
Incorporating Alarm and bus information
Alarm
+
=
Real-time traffic info
Alarme
Alarme is designed to assist students in waking up on time and catching the school bus by offering alarms that align with the bus schedules, enabling them to maximize their sleep and concentrate on their studies
2️⃣ User Research: Who are our user?
Thomas Rodriguez (26)
Grad student
Bio
" I am a Visual Communication Design student studying at Rochester Institute of Technology. Most of time I stay up late in order to finish our huge load of projects. I usually have to set 10 alarms to wake me up in the morning, "
Frustrations
-
I am not always aware that I turn off my last alarm and keep sleeping.
-
I want to be in class on time.
Goals
-
I want to sleep as much as I can.
-
I want to be in class on time.
Jessica Davis (19)
Collage student
Bio
I am an Economics major student who has trouble with time management. I always understate the amount of time I need to get prepared for school so I am always late for the bus.
Frustrations
-
Although I tried to wake up early, my procrastination still makes me miss the bus.
-
The bus schedule isn't accurate.
-
Bad traffic causing me to arrive late.
Goals
-
I need some kind of notification tell me when it's time to leave the house
3️⃣ Defining the Problem
Taking all my research and product goals into consideration, I developed "how might we?" statements to articulate the problems I am solving. These statements prepared me for ideation.
🛌
How might we help users sleep as much as possible?
🚌
How might we help user catch the bus?
4️⃣ Design Ideation
User Flow
In the initial user flow, I hadn't considered all possible user scenarios thoroughly. However, after gathering feedback from users, I realized that the flow was missing essential scheduling components
(X) Version 1
In the second user flow, I integrated the schedule process and also accounted for an edge case involving the user's snooze functionality
(O) Version 2
Sketch
Sign in with your student account to access your school schedule
By syncing with the school schedule, students can skip the manual schedule creation process, allowing them to quickly dive into the app and start using it
Utilize the Calendar View to Stay Informed About Upcoming Classes
Address the fundamental issue of students not punctually attending classes by providing timely notifications about upcoming classes
Alarms ring according to bus arrival time
After interviewing with students and listening about their pain points and goals, I sketched down some ideas in my mind.
Wireframe
Wireframe
5️⃣ Design Implementation
Typography
Aa
Roboto Black
A B C D E F G H I J K L M
N O P Q R S T U V W X Y Z
Aa
Roboto Bold
a b c d e f g h i j k l m
n o p q r s t u v w x y z
Aa
Roboto Regular
0 1 2 3 4 5 6 7 8 9
Color
#F5BABE
#FED78A
#7AC8AC
#B0ADF3
#89C5FF
01
Login with Student Account
Login with your student account so that system can collect your course information. You don't have to add your schedule manually.
02
Customized Alarm
If your course schedule changes, you can still edit your alarm anytime. You can customize your ringtone and snooze frequency on this page.
03
Get Real-time Bus Information
Once you stop the alarm, the system will give you real-time bus information and the preparation time you need.
