DeliverSmart

DeliverSmart

UX Design

2021

Project info

Overview

For the final project of my UC Davis UI/UX Design class, I designed a mobile app that helps gig workers at companies like Doordash and Uber Eats better understand their earnings and costs. As a gig worker who drives for multiple companies, I had a clear vision for how an app could unify important data such as earnings and mileage into one interactive dashboard.

Problem Statement

Gig apps like Doordash, Uber Eats and Instacart offer appealing perks like working flexible hours and being your own boss. However, gig workers who drive for multiple apps face a clear problem: calculating earnings across apps is a tedious, manual process. When accounting for personal expenses like gas and repairs, it gets even more difficult to determine net income from gig work.

User research

For my research, I conducted five user interviews with full-time gig workers, created user personas, and read online anecdotal reviews about gig workers’ experiences with various gig apps. Overall, I found that users saw many shortcomings among these apps, some of which were related to a lack of earnings analytics. Other concerns were about bugs/glitches, low earnings, difficult pickups at certain restaurants, and more.

Something that stood out to me was when one of my interviewees mentioned that he often had very slow or even completely dead hours/days, making him wish he could figure out what his highest performing hours/days are. He also mentioned that he often finds himself having to use the Calculator app on his iPhone to find out how much he made per hour in a night and to get a sense of how he had performed compared to other nights.

My research uncovered two major pain points:

  1. There’s no way to view total mileage driven on any major gig app for tax purposes

  2. Certain hours and days are very slow for receiving orders

Low-fidelity wireframes

I began my design process by creating a skeleton of the application’s main pages to establish their layouts. During my research, users indicated that Earnings Per Hour would be one of the most important features for them in my app, so I made it the most prominent element on the Analytics page. Similarly, I made Total Miles Driven the most prominent element on the Mileage page.

High-fidelity wireframes

For the high-fidelity prototypes, my main focus was maintaining a consistent visual design across the entire app. Because I wasn’t working with any premade design system or library (other than iconography), this was challenging when visualizing different types of information such as earnings analytics vs. mileage.

I chose to use a dark theme because it’s easy on the eyes and appeals more to the average user. According to a survey conducted by Android Authority, 81.9% of respondents said they use dark mode in apps whenever it’s available.

Analytics

For the high-fidelity prototypes, my main focus was maintaining a consistent visual design across the entire app. Because I wasn’t working with any premade design system or library (other than iconography), this was challenging when visualizing different types of information such as earnings analytics vs. mileage.

I chose to use a dark theme because it’s easy on the eyes and appeals more to the average user. According to a survey conducted by Android Authority, 81.9% of respondents said they use dark mode in apps whenever it’s available.

Trips

DeliverSmart imports mileage data from whichever delivery apps the user links, whether that’s Doordash, Uber Eats or both. Neither the Doordash app nor the Uber Eats app shows all of a driver’s mileage data in one place, so this is one of the advantages of the Trips screen in DeliverSmart. This data can be particularly useful for understanding how much of a driver’s mileage is business-related so that it can be written off for tax purposes.

Prototyping

The next step was building an interactive prototype using Figma’s prototyping tool. This allowed me to conduct usability testing with my pool of test users. Try it out yourself here!

User testing

Upon finishing the high-fidelity prototype of my app, I tested it with my target audience: three gig workers driving for Doordash and Uber Eats. I had them complete two tasks:

  • Completing the onboarding process (logging into Doordash and/or Uber Eats, inputting vehicle details).

  • In the weekly view (1W) on the Analytics page, view exactly how much you made on 5/13. Then, change to monthly view (1M) and view exactly how much you made on 5/4.

From observing their behavior during these tasks and hearing their thoughts after, my key findings were that users would like:

  • a better understanding of the DeliverSmart’s purpose/goal

  • more responsive buttons

To address these issues for the final prototype, I added a few points describing the app’s purpose to give the user more context, and increased the padding of most buttons. After retesting the app with my users, the issues were no longer a concern and they were satisfied with the overall experience of DeliverSmart.

User testing

Upon finishing the high-fidelity prototype of my app, I tested it with my target audience: three gig workers driving for Doordash and Uber Eats. I had them complete two tasks:

  • Completing the onboarding process (logging into Doordash and/or Uber Eats, inputting vehicle details).

  • In the weekly view (1W) on the Analytics page, view exactly how much you made on 5/13. Then, change to monthly view (1M) and view exactly how much you made on 5/4.

From observing their behavior during these tasks and hearing their thoughts after, my key findings were that users would like:

  • a better understanding of the DeliverSmart’s purpose/goal

  • more responsive buttons

To address these issues for the final prototype, I added a few points describing the app’s purpose to give the user more context, and increased the padding of most buttons. After retesting the app with my users, the issues were no longer a concern and they were satisfied with the overall experience of DeliverSmart.

Takeaways

DeliverSmart was my first time working on a mobile app, and also my first time conducting user testing which gave me highly valuable insight into the most important aspect of designing a user experience: understanding how users interact with your product. Having switched from Adobe XD to Figma shortly before this project, it gave me lots of time to get familiar with the design software and its variety of features.