-
Improving Help Section
-
App Redesign
Project Overview:
-
This is an academic project done under the guidance of professors Yvonne Shek, Yves Rannou, and Asma Arslan at Humber College.
-
This project focuses on addressing accessibility, functionality, and visual representation challenges within the UberEats help page.
-
The goal is to create a support system that will leave customers more satisfied, less confused, and create a better experience for all users.
My Contributions:
-
Conducted primary and secondary research to find out why and where users are having difficulty resolving their issues through the UberEats help section.
-
Integrated the users point of view and redesigned the Interface experience of the UberEats help section to align better with the users’ mental model.
-
Introduced 3 main pathways for help; a call option, a chat option, and the automated pathway which is revamped with clear icons and choices.
-
Fixed visual inconsistencies that contradict the users’ mental model of a help page.
Timeline:
-
Sep - Dec, 2021
Tools & Methods:
-
Figma, Miro
-
Competitive Analysis
-
User Interviews
-
Affinity Mapping
-
User Persona
-
User Journey Map
-
Task Flows
-
Wire Flows
-
Mid-Fidelity Wireframes
-
Prototype
-
Usability Testing
Credits:
-
Vijay Kumar
-
Arshdeep
-
Kevin
-
Yorlady
Competitive Analysis:
Identified Doordash, Skip the dishes as competitors for Uber Eats.
User Interviews:
Interviewed fellow UXD students who have had to contact UberEats customer support.
Affinity Mapping:
Analyzed the rich data obtained from user interviews and then synthesized it.
User Persona & Journey Map:
Developed User Persona and Journey Map to draw final task flows and wireframes.
Task Flows & Wire flows:
Drew Task flows and Wire flows in a logical sequence based on the user Journey Map and the data gathered from interviews.
Low-fidelity Prototype:
Based on data collected, low-fidelity wireframes and a prototype were designed, which was then used in the usability tests to uncover issues with the new UberEats help section designed.
Usability Testing:
was conducted to uncover issues with the new UberEats help section and improve wherever needed.
Mid-fidelity prototype:
Based on the user feedback, the wireframes were polished and a final mid-fidelity prototype was created.
Competitive Analysis:
-
Identified Doordash, and Skip the dishes as competitors for UberEats and created a report reflecting each company's site features, user and business needs, advantages and disadvantages, and goals based on the heuristic evaluation.
UberEats
Doordash
Skip the dishes
What did UberEats miss?
Visual Interface:
-
Small buttons make it harder to locate issues and request help.
-
There is an absence of icons and instead, there is a lot of content that the users have to read instead of being able to quickly scan.
Accessibility:
-
Many of the common issues users face are not listed.
-
Customer service option and the chatbox are not readily available anywhere.
-
The phone number is difficult to find in the app.
Functionality:
-
Customer service is known to be poor and incompetent.
-
The process to reach the customer service is long and inefficient.
-
Sections are not clear and they don't use of case numbers which make it hard for users to recall or recognize issues.
Where do the opportunities lie?
Visual Interface:
-
Bigger buttons and more easier scannable icons.
-
Content to be more easy to read.
Accessibility:
-
Have an accessible phone number for customer service within the app and to establish a call centre.
-
Updated FAQ with relevant information.
-
Introduce a search bar feature that users can easily access.
-
A “Follow-Up” button for customers to request that the agent should contact them.
Functionality:
-
Make ‘help’ section more visible.
-
Bring essential or key features such as, call and live chat in the forefront.
-
Reword labels and associate case number with the restaurant to make it easier to recognize the order issue.
User Interviews:
-
Interviewed 8 fellow UXD students and others from outside the program who have had to contact Uber Eats customer support to better understand UberEats’ customer service from a user’s point of view.
-
We focused majorly on improving key features. Such as;
-
Customer support relations.
-
Help accessibility and visibility.
-
Support choices and options.
-
General problems the users face.
-
A discussion guide was created prior to conducting the user interviews. This helped to facilitate the conversation between the participant and the interviewer. The guide comprised of semi-structured questions to leave space for open-ended conversations to gain better insights into the users’ behaviours and attitudes towards the current app’s help and support systems.
Meet the Interviewees:
What did users say?
-
Users thought of UberEats as the best option for food delivery because of convenience, food selection, and reliability when compared to its competitors in the GTA.
-
Many of the users perceived the “Help” section of the app to be flawed and believe the customer service experience to be non-existent.
The worst part is there is no option to register the complaint and find out why the order was cancelled after 1.5 hours. If your 'help' question doesn't fit their list then good luck. No help for you!
User Pain Points:
Help Section:
-
The users were unable to find the customer support contact number and have to Google it.
-
Users have to read through a lot of content pages before getting help.
-
The “Help” tab should be easier to find in the app.
-
“FAQ” does not share relevant information.
-
Users have difficulty locating their issue within the help section.
Interface Issues:
-
Involves a lot of clicking and browsing through each section in order to find the appropriate issue.
-
Small buttons make it harder for users to locate issues and request for help.
-
There is an absence of icons and instead there is a lot of content that the users have to read instead of being able to quickly scan.
Driver Interactions:
-
The driver finishes existing orders before delivering the user’s order, which makes the food cold and ruins the user’s experience.
-
The driver may be tampering with the order that is why users feel uncertain about the way their order is handled.
-
Users may feel helpless even with face-to-face interaction, as the driver is unable to help them and there is a poor level of communication.
Define...................................................................................................
Affinity Mapping:
Analyzed the rich data obtained from user interviews and then synthesized it.
User Persona & Journey Map:
Developed User Persona and Journey Map to draw final task flows and wireframes.
Affinity Mapping:
-
Analyzed the rich data obtained from user interviews and then synthesized the information the data into the following groups: high-level issues, what we observed, new issues, solutions.
In summary, from our interviews we noticed many key issues were voiced by the interviewees with the users often mentioning problems with the “Help” section and how it is not useful in its current state. They wish for more options to exist so that they can get in contact with Uber Eats and for the process to be more streamlined, from how the food is prepared, bagged, picked-up, and delivered to the user.
After synthesizing the data we obtained from user interviews, we developed a User Persona and Journey Map to draw final task flows and wireframes.
User Persona:
Riley
-
Full-time student, working part-time.
-
In their 20’s.
-
Busy schedule.
-
Relies on food delivery apps.
Goals
Needs
-
To receive an accurate order in a convenient and smooth way.
-
To be able to reach customer service easily.
-
To reach out through the app to UberEats’ support, restaurant, or driver.
-
To have access to communicate with front-end and back-end.
-
Easy access to customer service’s phone number, chatbox, and overall “Help” section.
-
Less clicking and digging to find issues.
-
Proper packaging and being able to verify with the driver upon arrival of order.
Behaviour
Attitudes
-
Abandons the app if the customer support is not very helpful.
-
Annoyed when they have to leave the app to Google phone numbers or check email for responses.
-
Feels disrespected when customer service provides copy/paste answers.
-
Uses the UberEats app when they do not have time to cook.
-
Not being able to find an efficient way to talk to customer service ruins the experience.
-
Expects quick resolutions from UberEats because they frequently order from the app.
User Journey Map:
Stages
Tasks
-
Hungry and scrolls through UberEats app to find a restaurant to order from.
-
Places the order and waits.
Orders Food
-
Waits for the order and keeps tracking for it on the status view section.
-
Food gets delivered.
Delivery
Pain
Points
-
The estimated delivery time is almost an hour.
-
Sometimes the payment method declines debit.credit cards.
-
It is difficult to contact the driver because he is driving.
-
The driver has to finish an existing order delivery, so it's going to take some extra time.
-
Checks for the quality of the Food.
-
Checks if the order is correct
-
Realizes there is a mistake with order.
-
Goes to UberEats app to find help.
-
Opens 'Help' section to find a customer support number.
-
Finds it difficult to locate, closes the app and searches for it on Google.
-
Contacts customer care and shares their concerns.
-
Shares the picture of the order received.
-
Gets an option to choose the solution, either a full refund or credits in their account.
Contact
customer
service
Find
customer service
contact
Finds an issue
-
Packaging is poor, order could leak and/or be tampered with.
-
Hard to access the 'Help' section
-
Too many clicks and content to read
-
Phone number is nowhere to be found
-
Chatbox hard to find
-
Check email and app to see response
-
customer service does not respond immediately
-
Customer service requests for additional information.
-
Receives a refund.
-
Cannot place another order because restaurant closed.
Final solution
-
UberEats keeps asking more questions, disregards proof previously provided
-
Time-consuming process
Feelings
Touch
Points
-
Home
-
Smartphone
-
UberEats app
-
Debit/Credit Card
-
Home
-
Smartphone
-
UberEats app
-
Home
-
Smartphone order
-
UberEats app
-
Home
-
Smartphone
-
UberEats app
-
Google
-
Home
-
Smartphone
-
UberEats app
-
Google
-
Home
-
Smartphone
-
UberEats app
Task Flows:
-
Task 01, Contacting live agent: Having easy access to either call or live chat in just a couple of clicks.
-
Task 02, Order never arrived: Having many options to deal with the issue. The user can get a solution or can make a complaint and have it resolved later.
-
Task 03, Missing Item: Users can quickly find and select the appropriate method to communicate their problem.
Wire Flows:
-
Existing UberEats Help section: Involves a lot of clicking and browsing through each section in order to find the appropriate issue.
-
UberEats Help section redesigned: Created 3 main pathways for help; a call option, chat option, and the automated pathway which is revamped with clear icons and choices
Prototype................................................................................................
Low-Fidelity Prototype:
Based on data collected, low-fidelity wireframes and a prototype were designed, which was then used in the usability tests to uncover issues with the new UberEats help section designed.
Low-Fidelity Wireframes:
Usability Testing:
-
Conducted remotely from November 25th to November 30th, 2021.
-
A total of eight participants were recruited in Canada for the qualitative style user testing, with some participants from Humber College and others from outside the institution.
Usability Test Tasks:
What would the customer do if an item in the order is missing?
Contact customer
care support.
Report the driver for stealing
an item.
1 2 3
Key Insights from Usability Testing:
1 2 3
Success Rate- 100%
Success Rate- 87%
Success Rate- 100%
-
Structure was straight forward.
-
All users solved within a minute.
-
Preset options made it easier for users and reduce their time to receive help
-
Structure needs context page.
-
Most users solved within a minute.
-
Failure due to confusion on where the call button lead, as they thought it would give phone number right away.
-
Structure was straight forward.
-
Most users solved in a minute.
-
Users liked that they could get to driver related issues from all paths.
-
The help icon on the home page was disregarded - 13 times.
-
Asking for Phone number/Email - 5 times (why does it ask? uber should have).
-
Search Bar disregarded - 6 times.
-
Semicircle contact not used/noticed - 7 users.
-
Titling and word issues - 7 times.
-
2 users preferred to call.
-
2 users preferred to use the automated system.
-
4 users preferred to use the live chat.
Annotations:
-
Icon choice - The user was unsure if the help icon on the main page was for help or to contact support.
-
Icon missed – The user went to the “Account” tab to access the help section.
-
Semi circle contact small - Did not notice the circle at the bottom
-
Confusion - The user thought the “Other issues” tab under “Order issues” is to check their past issued tickets.
-
Confirmation page - Should not be input fields as Uber already has contact info, should be check marks as default with option to input number/contact if they want.
-
Confusion - The user thought of clicking “Missing items” , but then clicked on “Drive issue” as soon as they saw this option when asked to report the driver for stolen food.
-
Reference number missing in chat - At the end of each experience or path for help the customer is given a reference number and way to receive updates.
-
Match between system and the real world – “ clarify my order” did not see the purpose of that.
-
Link FAQ - Link questions for phone or chat to FAQ if the answer is there to reduce uber server stress.
-
Bounced off the call option - left the call option for support because the user was confused about having to put order with the problem before seeing the phone number.
-
Help Icon – The user could not realize the icon on the top right corner was the “Help” button. They thought that the icon might be better to have the word “Help”.
-
Confusing titles - The user was unsure if stealing food items would be under safety issue or order issue as it would apply to both.
-
Confusing titles - The user was unsure if stealing food items would be under safety issue or order issue as it would apply to both.
-
Search bar disregarded - The user used tabs/buttons to find issues and complete task.
-
Help icon disregarded -The user while going back and forth with screens, still used the “Accounts” tab to get to help
-
Confusion - The user was unsure which section to go to: “Call”, “Live Chat”, “FAQ”, “Get Help”.
Potential solutions after Usability Testing:
-
Combine pages with lists of issues instead of breaking up issues into different categories with different pages.
-
Create a naming scheme for buttons that are easier to understand, For example, archives/past issues/tickets
-
Prioritize the placement of buttons and issues users may face.
-
Associate case/reference numbers with restaurant ordered from to reduce the load on users and make it visible in Live Chat for easy access
-
Make the help icon on the home page more noticeable, better icon, with text like on the account page.
-
Place text fields where users would expect to find them, with big descriptions near the bottom.
-
Make automated path semicircle contact more noticeable for users.
Mid-Fidelity Wireframes:
Primary routes to 'Help':
-
Route 1: The help section can be accessed from the Account tab and alternatively from the Orders section.
-
Route 2: Help icon can be used as a shortcut to access the section.
Shortcut to 'Contact':
-
Users can swipe the Contact button up to reach the Call centre or Live chat at any time, and when not in use, the button hides away automatically.
Automated path, order related:
1. Click on help with an order.
2. Select order.
3. Select order issue.
4. Select order related issue.
5. Fill out order related form.
6. Confirmation - The user’s email and phone number are set by default, but they can choose to input alternate details.
Automated path, driver related order issue:
1. Click on order issue.
2. Click on driver related issue.
3. Click on Issue not listed.
4. fill out related forms.
5. Confirmation
4. fill out related forms.
Search bar feature:
1. Click on search bar.
2. Search for problem or solution.
3. Select order with that problem searched.
4. Fill out form.
5. Confirmation.
Account & Payment:
1. Click on account and payment.
2. Select option.
3. Select option.
4. Read article for help, use links to reset password.
FAQ articles:
1. Click on FAQ.
2. Select option.
3. Read overview.
4. Read more about the article.
Mid-Fidelity Prototype:
-
Based on the user feedback, the help section was redesigned to make it easier for users to navigate the app. Hopefully, these changes can have a positive impact on the users journey through UberEats and create a better experience while searching for help in the UberEats application.
