My role:
UX designer creating a mobile ordering chatbot app for a bicycle shop from conception to delivery.
The problem: 
Busy adults prefer the convenience of online shopping but get overwhelmed with options and are unsure if they are selecting the best options for their specific needs and budget.
The goal: 
Design an app that save shoppers time in waiting for assistance from real shop attendants and human error resulting in wasting time with returns and help them optimize their budgets.  
User research: summary
I conducted interviews and created empathy maps to understand the user needs. One user group identified through research was busy working adults who want recommendations from experts to help them select the best items for their specific needs and budget.
User research: pain points
1. Support - With the absence of real-time assistance to give recommendations customers are overwhelmed with the options online and often unsure if they’re selecting the best option for their specific need and budget.
2. Financial - Products in bike shops are usually more expensive than online.
3. Time - Busy adults find it difficult to shop in-store where they have to wait for staff to assist or stand in long check out lines. 
Persona
Oliver is a recent graduate starting up in a new city who needs a quicker way to get help selecting the best products for his cycling needs & budget because he wants more time to focus on exploring his new city and making friends.
User journey map
Mapping Oliver’s user journey revealed how helpful it would be for users to have access to expert help conveniently through an app. 
Paper wireframes​​​​​​​
Iterating different versions of each screen of the app ensured that the elements chosen to create the digital wireframes would be the most ideal to address user pain points. For the home screen, I focused on making sure the chatbot button caught the users attention.
Low-fidelity prototype
I created a low-fidelity prototype which displayed the primary user flow of a customer using the chatbot to receive assistance selecting a bicycle tire. 
Usability Study: parameters
Study type: Unmoderated usability study
Location: United States, remote
Participants: 5 bicycle owners of different genders, age 18-65. 
Length: Each session lasted 15-20 minutes
Usability study: findings
I conducted two unmoderated usability studies. Findings from round one helped guide design decisions used in turning wireframes into mockups. For my second study I used a high-fidelity prototype and used the study findings to further refine my design
Round 1 findings
1. Bike shop menu categories are not familiar to most people.
2. Users want visuals to accompany instructional correspondence with chatbot.
3. Users want to be presented with more than one product option to feel confident about their recommendation. 
In the original design the chatbot only offered one recommendation to users. Most participants wanted to see more than one recommended product so I revised the design so users would receive more options.
Round 2 findings
1. Users need pricing information to feel comfortable adding items to cart. 
2. Users want an option to adjust quantity of products in chat.
Participant feedback from the second usability study revealed that users were hesitant to add items recommended by the chatbot to cart without seeing price and having the ability to adjust quantity. 
Key Mockups
High-fidelity prototype
The final high-fidelity prototype displayed titles, icons and preview features to ensure better understanding of menu options as well as more recommended options and pricing. 
Impact: 
The mobile ordering chatbot saves users time and money by providing users with expert assistance just like a real shop attendant would from any convenient location.
One quote from participant feedback:  
“The chatbot is useful because it speeds things up by narrowing options so I don't have to do the narrowing, sorting, and filtering.”
What I learned:
While designing the Hex mobile ordering chatbot app, I learned how valuable gaining user feedback from usability studies is in improving and refining initial design ideas.
Next Steps:
1. Conduct a third usability study to confirm that user pain points have been resolved. 
2. Further research to determine if anything else is missing. 

You may also like

Back to Top