Mockup.png

Switch!

UX Design

Mockup.png

Switch!

Planning long distance trips has never been so easy and safe.

 

Switch! is an application that enables users to plan for long-distance road trips and keep alert on the road.

Switch! uses algorithms to calculate the user’s vehicle gas efficiency and the driver’s personal driving limit to produce recommended stops to visit along the route and optimized alerting/switching schedule.

 
 
 

CSE 440: Introduction to HCI

Role: UX Researcher and Designer

Duration: January ~ March 2019, 3 months

Team: Meng Yan, Jason Chou, Wei Liao

Course Staff: James Fogarty, Anne Spencer Ross, Manaswi Saha, Jeremy Viny, Mandy Xu

Skills: Ideation, User Interview, Analytics, Storyboard, Paper Prototype, Heuristic Evaluation, Usability Test, Figma, InVision, Video Prototype, Posters Design

 
 

Problem Statement: How to prevent drowsy driving?

Data from the National Safety Council have shown that, on average, there were 328,000 drowsy driving crashes per year.  That is 899 per day and 37 per hour.  The most common category of people that engage in drowsy driving are drivers who did not sleep enough, which could be any of the 222 million licensed drivers in the United States.

 

Target Audience: Drivers around 20~30 years old

Drivers around 20-30 years old and frequently go on road trips with family and friends because according to the National Sleep Foundations, drivers age between 18 ~ 29 build up 71% of the user segment that is likely to drive while drowsy.

 

Goal: Enable drivers to plan for long-distance trips and keep alert on the road

To enable drivers to plan for long-distance road trips and keep alert on the road by calculating the user’s vehicle gas efficiency and the driver’s driving limit to produce recommended stops to visit along the route and optimized alerting/switching schedule.

 

Video Prototype: Design and features presentation

Demonstrate how the design works and showcase Switch’s features.

 

Design Process

 

Project Proposal: Track the drivers’ tiredness, instruct the drivers, and alert the drivers

The current solutions to drowsy driving are mostly campaigns from government and companies for drivers to learn about the symptoms of drowsy driving. However, there are drawbacks from these current solutions: 

  1. Drivers have no knowledge of how tired they are, and the exact moment when they fall asleep.

  2. Drivers may not know what to do when drowsy driving.

  3. Drowsy-driving crashes often occur when there is only one person driving and no other people to alert the driver.  

The new solution should track the drivers’ tiredness, instruct the drivers on how to handle tiredness, and alert the drivers when there are drowsy driving symptoms in order to prevent drivers from drowsy driving.

 
 
 

Project Ideation: Rapid ideation with sketches related to forms, data, tasks, and features

As a team, we came up with ten different ideas related to each of the aspects of forms, data, tasks, and features related to drowsy driving.

 

User Interview: Users want product to detect tiredness and report tiredness level. They also express privacy concern and wearable problem

We were able to conduct four interview with our target users, and I interviewed two out of our four target users.

From the interview, we found out that our users shared the same idea that:

  • They get tired gradually and get more and more tired as they keep driving, so if a thing can detect their tiredness and report their tiredness level before they starting doze off would be very helpful.

  • Some concerns that the users have are privacy protection and wearable problem.

  • Our users have expressed concern that they do not want to share their private health data. 

  • Our users have revealed their concerns that the glasses may block their vision and wear a pair of glasses is not convenient at all. They prefer something not wearable.

 
 
 

Initial Tasks Brainstorming: Brainstorm six tasks that our design can perform

From our interview findings, we have developed six tasks that our design can perform that will help prevent drivers from drowsy driving. These six tasks are:

  1. Track continuously about one’s tiredness during driving.

  2. Alert oneself to take breaks when one is tired during long-distance trips.

  3. Discover which personal symptoms signify drowsiness to stop oneself from driving during long-distance trips.

  4. Assist oneself in driving without any rest when one is tired.

  5. Plan time to drive, switch, and rest on a long-distance trip.

  6. Measure personal maximum driving time, so knows if one should choose driving or other commuting options when going on long-distance trips.

 
 
 

Initial Designs: Sketching three different designs

As a team, we brainstormed and sketched three very different initial designs for our interface, and each design supported four of our tasks.

  1. Our first design is called Switch, which is a mobile application that helps drivers to plan on their driving times and switch drivers during a long-distance trip. It supported our planning, alert, measure personal limit, and discover drowsiness symptoms tasks.

  2. I was in charge of our second design. Our second design is called Soteria. It is a vehicle-based measurement integrated with the smart speaker. When the car detects the driver is not maintaining the safety distance between cars, have less steering wheel movement, and drive too fast or too slow, it will trigger the smart speaker in the car to play trivia games to help the driver stay awake. It supported our track tiredness, discover drowsiness symptoms, assist, and alert tasks.

  3. Our third design is called CLY. CLY is an intelligent personal assistant with physiological sensors. When the system detects physiological signs that signify the onset of sleep, the sensors will notify the intelligent personal assistant, CLY. CLY will then alert and assist the driver. Personal driving limits are also calculated by CLY and reported to the user. It supported our alert, assist, track tiredness, and measure personal limit tasks.

 

Switch!

Soteria

CLY

 
 

Team Decision: Tasks: Narrow down to two tasks

As a team, we came together to discuss which design we wanted to go with and the two tasks that our design would support. We chose to focus on our first design, which is a mobile app called “Switch”. Switch can access users’ sleep data and allow users to input their driving information. The two tasks that we chose to focus on are:

  1. Planning breaks and driver rotations on long-distance drives.

  2. Measuring personal maximum driving time so knows if one should choose driving or other commuting options when going on long-distance trips.

Task 1 was chosen because our interview participants find it difficult to plan long-distance trips and switch drivers. Task 2 was chosen because understanding personal limits are critical for planning long-distance trips. In summary, the two tasks were chosen due to their feasibility, prevention mindset, and safety.

 
team_discussion_tasks.png
 
 

Team Decision: Design: Narrow down to one design

As a team, we came together to discuss which design we wanted to go with.  We chose to focus on our first design, which is a mobile app called “Switch”. Switch can access users’ sleep data and allow users to input their driving information.

We chose our first design (Switch) over the others due to three reasons.

  1. We believed our first design is a relatively unique design that has not yet to be created.

  2. Our first design focuses on preventing drowsy driving before it happens, which may be more effective than trying to change the driver’s action during drowsy driving.

  3. Our primary research suggests that users prefer a solution that does not require consistent attention.

Switch!

 

Storyboard: Demonstrate how the tasks are accomplished in our design

After we had decided to go with our first design (Switch), we storyboarded our first design for our two chosen tasks, demonstrating how the tasks are accomplished in our first design. We were all involved in our discussion. I was in charge of drawing a storyboard for task 2, and the two other teammates were in charge of task 1 storyboard and summarizing our information.

Planning Breaks and Driver Rotations

 

Measuring Personal Maximum Driving Time

 

Initial Paper Prototype: Visualize how the users will perform our two tasks

Our paper prototype represented our mobile app design called “Switch”. The critical aspect of the design was to show how the user would be able to perform the two tasks that we aim to tackle:

  1. Plan time to drive, rest, and switch on a long-distance road trip and

  2. Measure a person’s driving limit and keep him / her alert.

 

Heuristic Evaluation: Evaluate any heuristic issues

We received a total of 2 evaluations from two groups in class. Below were some changes that we made according to our heuristic evaluation.

  • The users want the flexibility of made trips. This violated the rule, Flexibility, and Efficiency of use. Therefore, we added a pop-up menu to have buttons for “edit trip”, “view trip”, “start / delete” trip.

 
 
Arrow.png
 
  • We had inconsistence icons. This violated the rule, Consistency, and Standards. Therefore we changed our icons to make them consistent.

 
 
Arrow.png
 
  • The users misunderstood "Alert" usage. This violated the rule, Help, and Documentation. Therefore, we changed the name “Alert” to “Drowsy Alert”.

 
 
Arrow.png
 
 

Usability Test: Find any usability issues with the users

As a team, we went out and conducted 3 usability tests. I had a chance to be the computer and the observer in our usability tests. Below were some changes that we made according to our usability tests.

  • The users had a hard time reselect drivers and vehicles every time using the app. Therefore we provided users default drivers, groups, and vehicle options later on.

 
 
 
Arrow.png
 
  • The users wanted multiple destinations requests. Therefore, we changed our route page to allow users to add more destinations.

 
 
Arrow.png
 
  • There was a lack of explanation of data use. Therefore, we added a welcome page to explain that we need these data to measure the driver’s driving limit.

 
 
Arrow.png
 
 

Final Paper Prototype: Revised based on heuristic evaluations and usability tests

The final prototype conveyed the main ideas from the initial prototype. With modifications from our heuristic evaluations and usability tests that made our application more consistent with existing mainstream applications, easier to find individual sections that correspond to unique functions and more understandable for first-time users that have never used any similar products before.

 

Digital Mockups: High-Fi mockups to provide more complete design and better user experience

I was leading the creation of the digital mockups, and I made some changes based on our TA’s advice, usability testings, and consistency with popular applications. The changes were all aimed to make the product more complete and give the user a better experience when using our application.

 
  • I wanted our users to be able to see the recommendation based on the user’s car efficiency and each participating drivers’ personal driving limit. Therefore, I changed the page to show the user’s route on the map, and the recommended gas stops shown beside the route.

 
 
Arrow.png
 
  • I wanted to show the user how many steps they have to perform in order to complete the plan and which step they are currently at. Therefore, I added four little dots on the bottom of each planning page.

 
 
Arrow.png
 
  • I wanted to produce visualized trip details to present to the user. Therefore, I transformed the text information to visual information that showed the user the overall route, along-the-route stops, drivers, and vehicle of the trip.

 
 
Arrow.png
 
 

Poster Session: Communicate our design and design process

We created a poster that communicates our design and our design process to the general audience. The whole class presented their posters at the Paul G. Allen Center at the University of Washington.

 

Switch! Official Website

As a team, we were able to create a website for our Switch! Go check it out!