We are tasked to design voice assistant on Kiosk and/ or APP for a company that could benefit from such solution. We choose USPS to be the client as its current postal experience is cumbersome and unintuitive and often requires the help of real human services. It makes USPS a perfect candidate for conversational design. The problem space we define:
We introduce voice assistant, Hugo, in both kiosk and mobile APP to help users filter their options by asking a few simple questions in AI-enabled natural language. Furthermore, we redesign the APP to ensure a seamless task transition from mobile to kiosk. Lastly, predictive reminders and shipping status are integrated into APP to enhance the overall user experience
We choose USPS to be the client because:
Logo
Iconography
Colors
We first try the APP. It redirects us to their website in every task. We then visit the post office at Squirrel Hill to try kiosk. There are vast potential opportunities:
We randomly interview customers at the post office at Squirrel Hill. Although they generally enjoy using the kiosk, they all love to see some improvements. One of the interviewees is the clerk working there, and he mentions how little knowledge he has about the kiosk.
Current mobile experience only covers part of user flow, and the integration and transition between mobile and Kiosk are not well designed
Kiosk Flow
This scenario assumes users bring the object and need to select the type of service and create shipping label through the kiosk. Shipping a package needs to go through many steps.
Problem 1 - Too many Options
After landing page, users are faced with an overwhelming number of options that might be irrelevant to your task. We see potential opportunities for voice assistant that can help with narrowing down the options in a quick one-sentence exchange
Problem 2 - Non-descriptive Options
The language that is used to describe these options is non-descriptive and technical that it is unclear to the user what the differences are. USPS even has to provide a glossary on their website to describe terms like express, legal means
Problem 3 - Dead Ends
After going through all these cumbersome steps, you can run into dead ends if your package is overweight and does not comply with their standards or you prefer to pay in cash at the very end of this process
Mobile APP Flow
We focus on postal services only for mobile flow
Problem 4 - Limited In-app Experience
After the landing page, each option takes users to the mobile web version rather than staying within the app. There is not much in-app experience. We see the opportunity here, aligning the simplified structure of Kiosk to mobile would create a united and a less-friction user experience
We explore more scenarios while storyboarding, aiming to find more design opportunities and cover major use cases, we look into:
Scenario 1 Sara ( Kiosk - after hours )
"I use kiosk a lot, the biggest advantage is that it is open after hours."
Customer, female
Scenario 2 Jane ( Mobile APP -> Kiosk )
"I usually get everything ready at home and just drop off "
Customer, female
Scenario 3 Robert ( Kiosk -> Counter )
"You can not ask the kiosk which shipping type, for that you have to ask the staff at the counter."
Customer, female
Given it’s a short project (7 weeks), we narrow down our scope to focus on Jane’s scenario, which is preparing shipping at home and dropping it off using Kiosk. We also add stamps browsing & purchasing at Kiosk into the scenario. We choose the mobile-heavy scenario because compared to Kiosk, mobile is less developed in the current flow. Besides, we have a doubt people would be comfortable using voice commands at kiosks in a public setting for concerns that personal information might be overheard, and talking to a machine in public is not a widely-adopted idea yet.
To understand and design conversation, we first studied model of coversations by Paul Pangaro. We build our conversations based on the models
Also, we reference to Google’s conversation design to categorize Hugo’s conversations with users to make sure Hugo has a consistent voice
We looked into Google assistant, Cortana, and Siri. Insights we have:
We define USPS voice assistants as friendly, efficient, dependable, and perceptive.
Name
We start with Benjamin Fraklin, who is the founder of USPS, so the candidates include Frankie and Fran. We also have Atlas and Hugo on the list. We then conduct a vote, Hugo is the name because:
Voice
After many rounds of iterations, we decide to go with the design that is inspired by the logo of USPS. It origins from the logo and assembles to the image of box and mail, which resonates with the postal service
During storyboarding, we define 8 states of Hugo. We design motions to reflect these emotional status, and categorize them on a matrix map
State-to-state Transition
While designing motions for each state, we also think about how to transit from state to state smoothly
In wireframe, we set up a couple of important UI features,
Dialogues blobs
Dark Mode
We try several key screens in dark mode as it helps increase the visual weight to balance the conversation design that is largely left empty in some single-question pages. But we all agree the image is less associated with the current USPS, so we switch back to white theme
Progress Bar & Navigation Bar
We try several different progress bar designs and end up going bigger icon one (the second from the left) as it also serves as a navigation bar for users to go between steps. Bigger icons give users a clickable feeling and carry a larger clickable area
In the final version, we place the task title and navigation bar at the top and voice assistant at the bottom. At the center, it shows the summary of the next step and buttons for the next actions
Why Only User Dictation
One of the major changes from wireframe is we decide only to show user dictation, but not Hugo dictation
In the case Hugo fails to understand commands, it would show Hugo dictation by confirming what he thinks he heard
Kiosk UI
Kiosk has a rather relaxing real estate, so we separate the progress bar and navigation bar.
Problem
There are tons of options here, I am not familiar with any
Solution
Simplify shipping process by asking users a few simple questions to find out their needs and get rid of an overwhelming number of non-descriptive options
Problem
My hands are full of stuff. I don’t have hands for screens
Solution
AI-enabled voice assistant that accepts voice inputs, even several requests in a single command
Problem
What type of box would fit the stuff I am sending?
Solution
AR technology to give box size tip on mobile APP
Problem
I want my package to arrive New York tomorrow, which option works for me?
Solution
Personalized shipping cards to suggest the optimal shipping rate using AI on speed, preferences, and cost
Problem
I want to send a birthday present to my friend, but I’m worried the upcoming holiday season will impact ETA
Solution
Timely notification to advise customers on future delays due to weather, holidays, or calendar events
Problem
Tracking # is too long to remember. Any easy way to share package status?
Solution
Integrated sharing feature in the mobile APP
Problem
I am at the post office, how do I finish dropping off? And which box is Priority Express Box?
Solution
Location-based notification to inform customers on next steps in their tasks
We use ProtoPie for high-fi mobile APP prototyping. Check out the whole prototype screen recording in our concept video
Core Scenario UI Flow
The prototype is based on core scenarios, Jane’s