E-COMMERCE CASE STUDY: HELP LOCAL BUSINESS TO IMPROVE THEIR ONLINE PRESENCE
By: Carla Fischer
Tags: Website, Prototype, Plants, Design Thinking, Ecommerce

Do you buy plants online? If not, now you will!

Unsplash

DISCOVER

Based in France, our team decided to focus on a French brand: Bergamotte.

Market research

Bergamotte is specialized in high-end plants and flowers selling online and engaged in sustainability.

Their customers are millennials and adults using online shopping, who wants to buy originals creations in a practical way.

Features Analysis

By looking into their competitors (Interflora, Aquarelle, France Fleurs), we noticed that Bergamotte differs in several ways:

The catalog does not include any filters to target the research on the website;

to target the research on the website; Score reviews from former clients are absent from the website;

from former clients are absent from the website; Though most of their competitors include live chat assistance , Bergamotte only provide an email address to contact them;

, Bergamotte only provide an email address to contact them; When ordering a product, the user account does not provide live package delivery tracking.

Brand Analysis

With the same group of competitors, we did a brand analysis to develop a Market positioning map.

Market positioning map

Based on the value proposition, audience, type of products, and brand guidelines we concluded that Bergamotte intends to provide premium quality products, as well as an innovative approach with sustainable choices.

Interviews

Now that we had further understandings of the brand and the market, we decided to deepen our understandings of the challenges by interviewing a stakeholder and four users.

Because of confidentiality matters, we could not gather a lot from the stakeholder but what we understand is that mostly the business works fine but the covid situation (especially the first lockdown) had great effects on deliveries.

In term of the user’s point of view, our interviews had lead us to several conclusions:

customers need precise information and transparency about delivery;

about delivery; filtering options are necessary to navigate efficiently in the website’s catalog.

DEFINE

Now that we gathered all of these useful insights, we wanted to create a persona that is a target user of Bergamotte’s website that we named Flower Flora.

Persona

And to visualize clearly her “ups and downs” emotions, we created a fictive journey map where she wants to buy flowers for her grandmother.

Journey map

This allowed us to understand Flower Flora's goals and frustrations, as well as where to find design opportunities to answer her issues.

As UX/UI designers our goals were to answer these questions:

How might we help her to find easily the flowers she wants?

How might we make her waiting time for delivery more enjoyable?

How might we provide her more transparency in the delivery steps?

DEVELOP

So we started brainstorming and ideate on different features to add to the website or the general experience of our user.

Because it is easy to get lost in the process and the huge amount of ideas everyone can have in this step, we decided to prioritize our ideas by using a MOSCOW matrix.

MOSCOW matrix

This allowed us to understand what the website must have no matter what, should have ideally, could have in a later launch, and won’t have because it is not that useful for the user.

So we had a clear vision of what our MVP (minimal viable product) is. The website must include a smooth research process of the products, and provide clear information on the delivery as well as quick access to client service.

In term of features, this implies:

filters to search in the catalog;

to search in the catalog; live delivery tracking (status bar / API) on every phase, directly on Bergamotte’s website;

(status bar / API) on every phase, directly on Bergamotte’s website; Live chat (first launch).

DELIVER

In order to deliver a proper prototype and test it, we firstly had to audit the actual website.

Information architecture

You can see below the actual Bergamotte’s site map.

Site map (As Is)

Later on, we thought about several user flows and how that would be illustrated in term of tasks for the user, and this is how it looks like:

User flow (To Be)

Prototyping

We now have a precise vision of the different tasks the user has to do in order to buy a plant (based on the user flow choose here).

Mid-Fi prototype

So as with any UX project, it is necessary to start sketching by hand prototype to be before going to mid-fi.

What is good by doing gradual fidelity is that before going on the next step, we can test and iterate without losing too much time and money. So this is what we did and we had to change several things such as button’s positions and title size before prototyping our high fidelity prototype below.

Hi-fi visuals including colors palette, typography, and screenshots of the prototype

This is how our final Hi-Fi prototype looks like: