Body & Fit

UX Design / CRO

Body & Fit

Since 1995, Body & Fit has been the place to be for sports nutrition, nutritional supplements, diet products and a healthy lifestyle.

I’ve worked for this client during my job at Wunderman Thompson Commerce.

Role

Jr UX Designer / Business Analist

Deliverables

Strategy documents, Jira Tickets, Test spec documents, UX Designs, Optimizely Test, Data analysis

Year

2019/2020

The project & me

This project was mainly an Optimization program where we as a team, helped Body & Fit with their strategy, create test hypothesis, design (UX) wireframes and screens, build A/B tests in Optimizely and conduct regular data analysis.

My original role was a Jr UX Designer, where later on I gained more additional responsibility (Business Analist role).
Things I did in this continues project:

  • Assist in strategy sessions
  • Assist on client communications
  • Manage internal workflow by creating jira tickets (writing detailed user stories and providing enough context) and aligning teammembers
  • Create test idea’s based on Data and UX research
  • Write ready to go test hypothesis
  • Create UX Designs and upload them to Abstract/Zeplin
  • Assist on Front-End development where needed
  • Perform after test period data analysis

Deliverables

The project had an agile workflow, formed in a cycle where multiple deliverables came into place. Starting with the strategy, where we held a session to define a goal tree where we aligned business KPI’s to test metrics. Followed by A/B test concepts, alignment with the client stakeholders and a roadmap of where to test and why.

During the workcycle we created for every test a test spec (containing details of the test like; where to test, why to test and what to track), screen (UX) designs, a developed test in Optimizely, a result sheet of the outcomes with conclusions and last but not least recommendations on how to proceed.

Test cycle, example #1

Data analysis

First step was to discover in Google Analytics on where users are struggling. Turning out the cart page had a 72% exit rate, which was a great opportunity to optimise as the page had high enough traffic as well.

Analyse user behavior

The question to be answered was; Why do users exit the cart page at a 72% rate? I used the tool SessionCam (which is similar to Hotjar) to research user behavior to come up with possibilities. These were defined based on User Experience or Behavior principles.

Hypothesis (PSR-framework)

Problem

Users are currently abandoning the cart page with a 72% drop-off rate. This implies that the user is currently either distracted from progressing from the cart to the checkout on the body en fit FR site.

Solution

In order to test this hypothesis, we will first investigate the reduction of friction and distraction on the cart. We will reorder the cart information flow and remove/ reduce distracting elements that arguably inhibit the user from progressing to the checkout.

Result

This way we will see if users are more motivated to check out following the changes. This should influence our Click Through Rate to checkout and ultimately, our Conversion Rate.

Define relevant metrics

Primary metric

Clicks on “Proceed to Checkout” button (Cart to Checkout – Click Through Rate (CTR))

Secondary metrics

  • Cart Exit Rate
  • Cart Bounce Rate
  • Conversion Rate (Number of orders)

A/B Test designs

Several variant were designed based on the hypothesis. While designing A/B test designs, I had to take into account the technical limitations and frameworks of the tool and the website.

A/B Test results

After reaching statistical significance on several metrics, we paused the test to conclude results and learn why the test was a winner.

Test cycle, example #2

Data analysis

On Google Analytics we saw a 31% overall drop off rate on the homepage. And after some deeper analysis we knew thatusers who have seen a Product Lister Page (PLP) then a Product Detail Page (PDP) add to cart with a much higher rate than users who go straight to PDP​.

Look at where users come from

From a deeper analysis we saw that 49% of all traffic came from paid search, meaning money spend to attract visitors. 63% of those visitors were bouncing of the website. This was for us an indication for optimization.

Hypothesis (PSR-framework)

Problem

Visitors to the homepage are currently bouncing at a 31% overall rate and paid search vistors with 63%. This implies that a significant minority of users are not finding the content or seeing the experience that they are looking for/expecting when they arrive to the website.

Solution

To reduce bounce rates we aim to give users a better position and direct experience on the first step of the user journey, and in the first screen shown upon landing on the page (as high up on the page design as possible).We will use a mechanism for position and direct which surfaces different combinations of the product categories on the website, in a new and user-friendly design.

This will enable users to instantly understand the key brand and product information about Body and Fit.

Result

As a result of our changes, we expect to see reduced bounce rates from the homepage. This should in turn leas to a greater click through rates to our category pages and provide a better guided experience for users on the first user journey stage.

Define relevant metrics

Primary metric

Bounce rate – on the homepage

Secondary metrics

  • Exit Rate

  • # of PLP views

  • # of PDP views

A/B Test designs

Several variant were designed based on the hypothesis. While designing A/B test designs, I had to take into account the technical limitations and frameworks of the tool and the website.

A/B Test results

After reaching statistical significance on several metrics, we paused the test to conclude results and learn why the test was a winner.

Tools/processes used in this project

KPI Strategy session
To define business goals in a Goal Tree

PSR Framework
To define test hypothesis

Optimizely
To develop A/B tests in and gather data results

Google Analytics
To gather data insights

Sketch
To create designs

Abstract
To hand-over designs to development

Sessioncam
To analyse user behavior

Jira
To create user stories and tickets

Powerpoint
To create decks for presenations