Case study : Online grocery shopping

7 min readSep 6, 2020


In 2004, the Auchan Group developed Chronodrive, the first concept of online grocery shopping in France. We had to wait until 2006, for the competition to get involved in it : Leclerc, Carrefour, Casino, Super U, Intermarché…

Hundreds of people use these platforms every week or month to save time.

According to a Hopps Group study, 23% of the French use online services as a priority: 9% for delivery and 14% for drive. 8 out of 10 French people are ready to use local and drive e-commerce services and would like their retailers to implement them.

However, customers have access to thousands of products at the tip of their mouse and can feel drowned in all this information. These platforms, which are supposed to save us time, actually waste our time in front of a computer and also lead to frustration when an item is no longer available.


I had the chance to work on a fictitious case, as part of a team, to evaluate the user-friendliness of the online shopping experience of the Course U’s platform, owned by Super U.


Our objective for this project was to work on an enhancement to enable Courses U users to buy relevant replacement products, when a product is not available, based on their purchase habits, without changing the existing functionality so that users do not lose their habits.

I collaborated throughout the project with two other UX/UI designers in order to understand the usage habits and the main frustrations of the Course U platform users and to propose the most adapted solution possible.

Fun fact : we did not know each other which added a little extra challenge!

The process

This project was during one week and remotely and we decided to follow the IDEO’s human-centered design process to ensure that our design decisions were supported by research and user feedback. However, we stopped at the prototype stage because it was a fictitious project.


At the beginning of the project, we had no specific knowledge in the field of online racing.

So we started researching to find out a little more about French people’s habits regarding the online grocery platform.

Then we did a big brainstorming to know how the users behave on these platforms. Thanks to this we were able to define some key questions to ask them during a user interview and usability test.

We interviewed 6 women, from 23 to 68 years old.

Why only women and not a mix interview would you tell me ?

Because according to a study published by the “Caisse d’allocations familiales”, 36% of men ignore shopping and leave it to women, it’s crazy, I know !

This interview was in 2 stages :

  1. Some questions in order to know their habits (frequency of use, platform used), their motivations to use an online racing platform, and finally their main frustrations or difficulties when using them.
  2. A usability test: we asked them to perform a task on their usual online racing platform :
    You have to organize a dinner and you want to make a fishing gratin, you have worked out your shopping list before, now you have to buy the necessary ingredients.

What we learn ?

Despite the fact that our users use different platforms and different modes of withdrawal: “drive” or “delivery”, they have the same habits and motivations to use an online grocery platform.

  • Saving time: not going to the store and queuing to pay.
  • Buy dry, heavy and hygienic products and fresh produce at the market or supermarket.
  • Buying less impulsively when shopping.
  • Uses the “list” feature.

For the pain points, there were several at different points in their user experience.

The most relevant was on :

  • Stock : late availability notice, the replacement products have not always the same quality, sometimes some items missing on the order, not being able to choose replacement products, learn that the product is no longer available at the time of payment…

« It’s a shame you have to wait until the end to know if a product is available and a waste of time »

  • Time / practical : they use the drive to save time so every actions that makes them lose time is frustating : websites slow, search engine not performant…
  • Freshness product : they usually don’t buy their freshness items on the plateform due to the lack of informations on the freshness and maturity of the products but also because we can’t see the expiration dates.

After analyzing the main pain points, we decided to focus on the Stock point.

Why ? because it was the most raised point and the one that wasted the most time for them in each of our interviews.


To help us in our process we have created a fictitious persona, which gathers the main motivations and frustrations of Course U’s users.

« I hate when they don’t have a product and I need to go to the actual store when it’s exactly what I wanted to avoid. »

Following this persona, we were able to establish her User journey map to to visually bring out design opportunities :

  1. No suggestion or link from the pop-up to buy a replacement product.
  2. Suggested replacement product has nothing to do with the unavailable product. Platform suggests other types of product : it’s a waste of time.
User journey- designed with Sketch

Framing the problem

Marie, the busy woman who knows what she wants, needs a way to instantly choose a relevant replacement product in case of product unavailability.

Because she hates having to go to the physical store to complete her groceries when it’s exactly what she wanted to avoid.


In order to find the “big idea”, we must first brainstorm to generate idea’s emulation between our team members. We chose the Crazy 8 method to think about the craziest and most realistic ideas for our project.

Thanks to this we were able to choose the idea that was most relevant to us:

Integrate into the existing pop-up that announces that the product is no longer available an artificial intelligence that allows us to suggest the product that is closest to our product according to the brands we are used to buying and the prices. In order not to block the user, we have also chosen to integrate a “no more suggestions” button if the choice does not suit him.

This idea saves time for the user:

  • He is instantly aware that a product is no longer available.
  • We offer a replacement product that corresponds to it
  • If it does not match, we offer other products.

What better than a storyboard to illustrate our idea?



We then started to do a user flow of a Course U’s website section we wanted to redesign. It helped us to clarify how we wanted to lay our new feature, so we could start prototyping our solutions. We chose to do mid-fi wireframes on Sketch to quickly test their usability and get rapid feedbacks.

You can see here our prototype :

Designed on Sketch and Marvel


We tested our idea with 6 new women users of online grocery platforms.

We had developed 2 scenarios :

  1. With a coherent replacement product.

2. With an inconsistent replacement product.

The goal was to see if they understood the pop-up and buttons (“add to cart” and “view more suggestions”) and if the pop-up arrives on the right time, in order to determine if the user experience was fluid and understandable.
We also wanted to see if this new feature saved them time.

Key metrics

  1. The time spent on the suggested product pages and the rate of dropped-off cart lower.
  2. The satisfaction rating on that specific point improves.

What we learn ?

About the pop-up window :

« I’m stuck ! It’s either I buy it or I see more suggestions, I can’t just leave »

« I really like having a pop up window telling me straight if a product is unavailable »

When the pop up window comes up :

« Oh nice ! »

On the results page :

« I don’t understand why I should filter the results, it should already be filtered for me »

« I’d like to see more suggestions, for a quick purchase, it’s too long to click on a button »

Next steps

After those users feedbacks, we have already in mind new ideas for improve our prototype :

  • Give an exit to the pop-up window.
  • Indication that the products on the list have been added before the pop-up window shows up
  • Details on the suggested replacement products on the pop-up window ?
  • Are the filters on the results page really useful ?


This project was a very good way to realize that every step in the design thinking method is important and that none is to be neglected, as well as all the tools that allow us to get to our idea: interview, persona, user journey, crazy 8,…

Working at a distance and with people I didn’t know before was the most rewarding part, it forced us to adapt at all levels. And we realized that a lot of tools are available to work efficiently at a distance.

I am really happy with the work we were able to achieve with my team and I worked with them without hesitation for my next projects.

To conclude, I would say that it was a project rich in learning both professionally and on a human level.