DesignDelivering new e-commerce experience

company. Allpress

timeframe. October 2019 - December 2020

category. design

team. 2 designers

Project background

One of the main strategic goals for Allpress Espresso for the upcoming years is to double the revenue from their online sales. As Allpress is experiencing strong and steady growth and global expansion as a brand, the team realised that their current e-commerce solution was not sufficient to support them in the time of growth. Prior to designing a new solution we were able to conduct a discovery that helped us to understand the customer and technical requirements (READ HERE).

Process

Following the discovery, we already had a number of valuable insights about the Allpress customers, internal processes we understood the business goals and had a had list of metrics ready to be applied to an actual solution. The technical team, project lead and client gain conclusion around the new e-commerce engine - Shopify Plus. 

While the development team was doing additional technical discovery, the design team of two started the creation process, which included: 

  1. Content mapping. 

  2. Use cases and user flows creation. 

  3. The Core Model workshop. 

  4. Sketching. 

  5. Wireframing. 

  6. Design consultation.

1. Analysing the original e-commerce solution. 

Based on the client requirements we knew that the big part of the originally existing content should be kept and transfer in the same or modified version to the new solution. To identify all the content on the page we used the technique called content mapping. We listed all the existing sites, mapped the content, different type and relations between the sites. 

Content mapping.jpeg

Content mapping helped us to create a map of the elements that we needed to consider in a new service. During the design process, we were able to update the list if it was necessary. Mapping the content is a great way to understand the additional technical requirements in regards to the content and opportunity to notice a need for additional content.

2. Creating a list of use cases and designing user flows. 

From the conducted previously user research, content mapping and understanding the business goals we created a list of use cases - list of actions that website visitor wants to achieve. The use cases became a foundation to create user flows which visually represent all of the steps and interactions that user needs to make to achieve their goal. 

Identifying the steps is a simple way to spot a potential gap in the process, for example, a lack of certain information that might stop or slow the user in reaching their destination. 

User flows.png

3. The Core Model Workshop. 

From the content mapping workshop, we already gather a list of content that would be used in the new service. From the interviews we conducted during the discovery phase we identified that the decision-making process around buying a coffee is confusing for a majority of the buyers. Allpress wanted to increase their sale and compete with supermarkets which meant they needed to provide a customer with an easy to absorb and understand information. Therefore, the coffee product page became the core site that could decide on success or failure for customer goal (buying coffee) and the overall company goal. 

 

Based on the conducted research we knew that customers when in doubt about which coffee to buy, they were seeking help at the salesperson or barista in a local cafe. Buying coffee online, a customer was deprived of that additional help and we knew we need to fulfil this need, especially for customers with basic coffee knowledge. 

To understand all the information needed to be displayed on the coffee product page we decided to run quick workshops. Core Model helps not only to define the content of the page that helps the user but also takes inward and outward paths into account. Understanding the business goals, the page content and how user can enter and exit the page, we are able to improve the flow and customer interactions with the site. 

The amount of listed content for the coffee page was quite impressive and we knew we won't be able to display all the information. We decided to add another step, where we asked participants to vote on the importance of the information.

 

Allpress wanted to target both utilitarian and experienced coffee drinkers and though they have the same end goal, their requirements to make a decision was quite different. We understood that if we want to accommodate the needs of both groups we needed to apply the progressive disclosure approach. The previous prioritisation activity helped with understanding what information is crucial for all the customers, which meant we were able to can empower customers to engage with additional coffee or brewing information if they wanted. At the same time, the extra details didn't clutter the core page data. 

Core Model Workshop
Core model workshop - prioratisation
1/1

4. Sketching session.

Understanding the core pages and content it needed to include allowed us to start the next step - brainstorming. Sketching sessions are quick and valuable time where designers have an opportunity to create multiple ideas, discuss the pros and cons and build on the ideas of others. 

5. Wireframing. 

Throughout the process, we've learnt that client wants to keep the creation of the high-fidelity design in house. We were aware that the brand identity is a very important aspect for the Allpress team but at the same time, we were conscious of the possible consequences of the decision. As a result, we needed to adjust the process and inform the client of the potential risks, e.g. timeframe increase. 

In regards to this project, designing wireframes with additional explanatory notes was exceptionally important.

Summary

The Allpress project was an engaging and fulfilling project that quickly became very challenging. Personally, I have learned a lot of valuable lessons that will help me to make more conscious decisions in the future.
Good communication, patience and transparency were the keys to successfully delivering the new solution. The new New Zealand Allpress e-commerce store was realised into production at the beginning of this year. The four remaining countries followed within the next 2 months. 

The subscription feature, that was added to the online store as an outcome of the discovery phase is steadily growing. Increasing e-commerce revenue, number of loyal customers and making the coffee demand and production more predictable. 

Jump to another project