Aug 2023 - Sep 2023
Product Design
Redesign the interface of the driver delivery experience to reduce computational overload and support delivery volume of 2 million shipments per day.
Designed and delivered scalable UI components, improving app efficiency and increasing volume capacity by 10 times, supporting 60 deliveries per driver.
Roadie is a last-mile delivery pltform for major retailers across the US. Users can install the Roadie app and deliver orders. When delivering a package, drivers need to complete a series of tasks on the app. These tasks are displayed as a list of accordions that pops up at the bottom of the screen, on top of a map.
Users need to complete tasks such as take a photo, collect recipient's signature, add delivery notes, add parking or toll expenses and rate the sender.
In its current form, the accoridons are in collapsed state. On tapping the accordion, it expands to show the action required to complete the tasks.
While some tasks, such as Verify Items and Add Expenses open the camera view, other actions such as Collect Signature and Delivery Notes open a bottomsheet. Rate the Sender does not require any additional step and could be completed within the accordion itself.
...
Speaking with engineers on the team, I discovered three main challenges with the existing design.
...
Based on challenges defined above, we defined
the requirements for a new design solution that would help solve the problems.
The new design should meet the following requirements
Not consist of accordions
Should be scalable
Should be full-screen
Based on the requirements, I explored various design concepts to redesign the existing interface.
...
...
The old design used a variety of interactive elements and button style that changed depending on the task the user was completing. The new design streamlines interaction by making it consistent, regardless of the task the user needs to complete.
Tapping on each tasks surfaces a bottomsheet, making the new design predictive in its behavior.
The old design provided feedback in the form of a checkmark next to the completed tasks. The new design also provides a summary of the information entered by the user when completing the tasks.
While the new design brings many new changes to the interface, I kept concepts from the old design that worked really well, although slightly reinterpreted to fit the new design. For instance, the old design used different surface color that allows the user to easily differentiate required tasks from the optional ones. I used a similar concept in the new design, using a darker color for the required tasks and a lighter color for the optional ones. Additionally, I also added a label to call out the optional tasks which was missing in the old design.
Similarly, the new interface mutes the completed tasks like the old design, directing the user's attention to pending tasks.
...
Working on the redesign has been a great experience. The redesign achieves a
lot more than making the app look beautiful (which is important!). It
significantly improves the user experience, enabling users to move through the
app inuitively and focus on the tasks at hand instead of the app. It also
removes technical complexities, enabling business to scale its volume capacity.
Working on this project has taught me to think of designs as part of design
system and how efficient design can be scaled and adapted to fit future
requirements. Since its introduction, we've utilized this component for more
than ten task items.
