Shahab Khan

Work

Work

About Me

About Me

Resume

Increasing Conversion Rate for Amoret Coffee

Solo, Business Need, Shopify

A freelance project undertaken for Amoret - A Specialty Coffee Shop based in Notting Hill, London. The Project focused on improving the conversion rate of their website.

Client

Amoret

Services

Primary Research

Secondary Research

Competitive Analysis

Prototyping

Development

Deployment

Industries

Commercial, Business, Shopify

Date

December 2023

Overview

Amoret is a specialty coffee shop located in Notting Hill, London. Amoret Specializes in sourcing specialty Arabica beans from various farmers around the world which is classically roasted in-house at Notting Hill daily.


Amoret has adopted e-commerce recently by building their website via Shopify to sell their coffee online. Their coffee is extremely good , evidence of which can be seen in the high customer return rate.

Problem

The Webpage was developed using Shopify. Although customer return rate is very high , conversion rate and time spent on website was very low, The conversion rate for Amoret was 0.7% compared to the average 2-5% for an ecommerce website.

Therefore, the aim of the project was to find out

  1. Why the conversion rate was low

  2. Develop and Deploy solutions to improve conversion rate and time spent on the website

Design Process

Since the problem is already defined , i.e Increasing Conversion rate and session duration, The Design process focused on the following Phases.

Desk Research

Website Analysis

Development

Testing

What Experts Say

Scientific Research proves that Conversion Rate of an e-commerce website can be affected by the following:

1. Load Speed of the Website (Di Fatta, D., et al, 2018)
2. Optimizing the checkout process (Saleem, H., et al, 2019)
3. Product packaging (Ahmed Rizwan, Parmar Vishnu, 2014)
4. Free Returns and Shipping (Michael Williams Rain J, 2022)
5. Website Design , Clutter (Michael Williams Rain J, 2022)
6. User Trust and Connection (Saleem, H., et al, 2019)

Website Analysis

A heuristic analysis of the website was carried out based on the characteristics defined in the previous section. The analysis revealed what could be improved in the website to increase the conversion rate.

Load Speed of the Website
The Load speed of the Website was already optimized by Shopify and will take a maximum of 2 seconds to load according to Google Page Speed Insights.

Optimizing checkout process
Shopify boasts the fastest checkout process of all ecommerce sites and as a result claims to have 15% higher conversion rate than the average (https://www.shopify.com/checkout)

Free Returns and Shipping
The website offered free returns for all orders above 15 GBP, They also had offers for first time customers which was displayed as a banner for all first time customers

No Product Packaging Pictures
Research shows that Product packaging can play an important part in convincing the customer to buy a product, it also creates User trust by showing something tangible and letting the user know what to expect when buying a product. The Website however did not have any product pictures , rather it had an infographic which would inform users of the coffee's taste and smell as shown in the picture below

Website Design , User Trust
The website was designed as a portal to solely buy their coffee and thus contained a single page with just their products and how to find their shop , There was no information about the shop and what makes them different from other coffee shops. This results in decreased user trust and willingness to buy products. The User interface did not contain any pictures to grab the user's attention. Research shows that User Interface and Colors can play a big role in getting users to click and explore.

Navigation
The navigation for Amoret Coffee showed a hamburger menu for the desktop. This would hide information regarding what possible actions could be taken by the user and would discourage users from exploring the webpage further

Complex Flavor Profiles
Each coffee has a multitude of flavor profiles which are carefully roasted and developed. The website did not take this into account and users had to click on each product to check the coffee's flavor profiles, the users could alternatively squint and try to see the flavor profiles listed on the infographic pictures of each product.

Constraints and Decision Matrix

Amoret used Shopify to create their website and uses it extensively to track orders, receive payments , ship orders and SEO. Although Shopify is sufficient for the aforementioned tasks, their website builder is restrictive and has many constraints, It doesn't nearly offer the same freedom as compared to other website builders. For this project , only features supported by Shopify's website builder could be built.

Redesign and Development

The Designs were developed and deployed directly using Shopify's website builder which constricted what was possible to design. the following changes were made to the website as a result

Product Images

Since there were no product images available , Images of each coffee had to be taken via a mobile phone and edited to match the cozy vibe of the coffee shop. These images were then uploaded and added to the website.
It is also important that the images of the different coffee are consistent to build user trust. Therefore a detailed guide was created to recreate the images for new Coffee

Landing Page

A good Landing Page can have a big impact of the user's initial impressions of the page, it also captures the user's attention and gives them a reason to continue exploring. Therefore a full width banner slideshow was added under the navigation bar , ensuring that the navigation bar remains transparent. A dark overlay was put over the slideshow to make the accompanying text readable

Simplifying Navigation

The Information Architecture of the Menu was simplified and added to the Topbar which is transparent when there is a picture in the background and solid as the user scrolls. The Webpage Sitemap was also modified to remove redundant webpages.

Choose your flavor profile

Tags were created for the wide variety of flavor profiles, Users could filter their coffees based on their flavor profiles

Adding Content

Content including Amoret's USP was added to show users how Amoret is different and why they should consider buying from them. Their social media posts were also integrated which would redirect users to their instagram when clicked. This would increase credibility and trust among the youths.

Results

After deploying these changes on the Shopify site, KPIs such as Conversion rate , time spent on site and number of new orders were monitored for 4 months, Here are the results

Conversion Rate


As we can see , the conversion rate increased from 0.9% to 3.3% and continues to rise. Which is well within the 2-5% average of e-commerce sites globally. However, In this case specifically Conversion rate might not give the whole picture due to the following reasons:

1. Seasonality: This increase in conversion rate could be attributed to end of the year holidays like Christmas and New Year.
2. Site Traffic: Conversion rate is directly proportional to traffic on the site , the traffic on Amoret is very less to determine this increase and therefore can vary significantly.

Therefore, the next KPI would help us get the complete picture

New Customers Acquired

The number of New Customers doubled since September to January when compared to the 4 months before September. This is a strong indication that the conversion rate we see is less affected by variation due to seasonality

Iteration

Customer Behavior was observed for 3 months which brought forward some issues with the current re-design. These issues affected the following subsets of the customers
Type A: Customers who had advanced knowledge about coffee
Type B: Customers who had basic knowledge about coffee

Nuances of Roast Type and Coffee

Problem
1. Certain Coffees are specifically roasted for specific types of coffee brewing methods. Using the wrong brewing method could result in poor quality coffee and would not capture the actual taste of the impeccably roasted coffee.
2. Customers of Type B did not have knowledge about this and therefore would often select wrong coffees for their brewing methods.

Solution
A short infographic which gave the required information about which roast to select for the different brew methods.
This infographic has the following specifications
1. It was placed before the coffees could be seen so that users were forced to scroll through the infographic
2. Pictures were smaller compared to the rest of the card and was cropped, giving the hint that there was incomplete information thus encouraging users to read the text and understand which roast they should select

"I know what I want"

Problem
Type A Customers were also loyal and knew exactly what they wanted. Therefore they needed a Faster way to checkout and/or Lesser clicks to checkout

Solution
1. Quick Checkout functionality was added to allow the user to checkout without viewing all the details of the coffee - This took the form of a modal and reduced the number of clicks by 1
2. The Dropdowns which showed the different types of variants was replaced with pill shaped buttons for each variant. This reduced the number of clicks to choose the different types of variants for Roast, Grind and Size by 1 click each totaling to 3 lesser clicks to select variant

1 and 2 combined to reduce the number of clicks to checkout by 4 clicks

"Flavour Profile ?"

Problem
1. Type A and Type B Customers rarely used the flavour profile filter.
2. Information and filtering by flavour profile could show users coffee which was not roasted for their specific brewing methods

Solution
The Flavour Profile filter was replaced by regular more useful filtering options

Future Scope and Limitations

As mentioned before , the re-design of the website was constrained due to limitations of Shopify's website builder. In the future re-designing the website from a different website builder which offers more flexibility like Webflow or Framer would yield better results since UI design plays a big part in conversion rate as well. This new website would need to be integrated with Shopify's Backend API service to ensure that Amoret can still use all of Shopify's essential features such as Order Tracking, Payment tracking and Handling shipping and delivery.