Web application to do the grocery shopping online from home, quickly and easily.
Mercadona.
Introduction.
This case study aims to improve the user experience during online shopping. For this I focus mainly on usability and desirability.
Role
Product Designer
Date
October 19, 2020
Category
Proposals
TAGS
Web app, Product Design, User Experience
Current design
Proposal
Understanding with data.
Users feedback
Google Play and App Store user reviews are very valuable data for us. Many times we focus on conducting interviews, surveys, focus groups... And we forget to access the information that we have in front of our eyes. With this analysis we can understand the main paint points of the user and the functionalities that are most missing in the product.
Benchmark
This is a very important stage in projects because it shows us how others are currently doing the job.
The result of a good benchmark is not to copy the competition, but to thoroughly analyze every detail, learn and finally design an even better solution.
Field study
In this phase of the research is where I empathize with the user and begin to understand their needs. In this field study I use a sample of 18 users and use two methods to collect the information: direct observation and qualitative interviews.
Direct observation I do it in their natural environment (shopping physically in the supermarket and online with some of the available platforms) to understand how is the real process of the user during their tasks.
The output I get from this phase are the following artifacts:
Persona
&
Journey Map.
Usability testing
For usability testing I recruit 10 users, following the good practice of testing with 5 users from each segment that has been defined in the field study and interviews.
The usability test plan consists of 10 tasks, objectives, location, business case, etc.
You can see it in detail by tapping the button below.
Solving problems.
"I find it very useful to have the product categories at hand, but there are so many and I have a hard time finding the one I want."
Sofía V. (Tester)
Category finder
Mercadona has 26 drop-down categories in the Sidebar Menu of its web application.
This generates a lot of cognitive friction in the micro-task of finding the category you want, since in addition to there being too many options, there is a scroll that makes the search more complicated considering how our
short-term memory.
works.
The solution to these problems is a search engine.
Shopping lists
A functionality that is highly requested by users of the Mercadona App is to be able to create their own shopping lists, which would make the shopping process much simpler. In my analysis of this new functionality I include only the most important features. The idea is to launch an MVP and see how it works in order to iterate it in the following sprints.
"How long will it take to get here? [...] Will they let me know in time to be home?"
María R. (Tester)
Order control
A critical part of delivery applications is the experience once the customer has placed the order.
Therefore, based on the user's needs, I decide to include:
• Order history.
• Shipment tracking.
• View all products of the order placed.
• Chat with real time support.
Task-oriented IA
The information architecture of this project begins with four options that comprise the four functional blocks, from which different possibilities open up when making the online purchase. The first three options are focused on the tasks performed during the purchase, while the last option groups the needs that may arise after the purchase has been made.
Complete interface.
