Dr. John's

Role

Lead UX Designer

Quick Summary

Redesigned a Responsive E-Commerce Site by updating the content through Google Analytics and optimizing the ordering process

Contact Me

Background Information

As part of a $6 Million dollar project, Deloitte was contracted by Vertiv to replatform and redesign Partnerweb, their product configurator, so that any salesperson would find it easy and quick to customize a Vertiv product. Deloitte had redesigned the configurator using out of the box elements from Oracle's CPQ framework. The problem was that Deloitte's new experience was just as bad, if not worse than the original.

The Current Site

Discovery & User Research

I used a combination of User Interviews and Google Analytics to identify problems with the site.

Who We Interviewed For User Research

6
New Users
1
Current Customer

Who are Our Users

Users aware of the Dr. John's Brand & Products

Users that aren't aware of the Brand but are looking for healthy candies

How Do We Know?

Despite a lack of real customers to interview, Google's Search Console allowed us to make assumptions about the user based on their search queries that brought them to the site.

50% of search queries included the brand name — we can assume these users are aware of the brand and product.

Within the other 50% of search queries, 20% of that segment had search queries that included the term 'Sugar-free' and another 20% of that segment had search queries that contained the term 'Xylitol'. We can assume a good portion of these users aren't aware of the brand but are interested in healthy candies.

How do they Behave On Dr. John's Site?

Looking at Google Analytics, We see that Dr. John's has a stellar conversion rate at 6%. One area that can be improved upon is the 52.6% bounce rate (users that leave as soon as they enter the website). Clues as to why this number was so high were revealed in user interviews.

6.29%

Conversion Rate

$59.98

Average Cart Value

52.59%

Bounce Rate

60.0%

New Users

Problems & Solutions

Problem -
Dr. John's Attracts the Right Audience but Fails to Communicate the Product

Through user interviews, I discovered that the homepage was not effective in communicating the product's value proposition. Most had no idea the product was sugar-free. Of the users that did notice, some equated sugar-free to mean that it was using harmful artificial flavoring.

This offered a possible explanation of why the bounce rate was so high. The site was attracting health-concious users but the homepage did failed to show them how the product could fill their needs.

When redesigning the site, I made sure to plenty of space was dedicated to highlight that the candy was Sugar-Free AND All-Natural. I introduced a section that explained how the product's main ingredient, Xylitol, was derived from trees and was not artificial.

Problem -
Users Underestimate The Amount of Candy That Comes In Lb Increments

Instead of selling candy by quantity, Dr. John's sold candy by the pound. Through user interviews, I discovered that users frequently underestimated the amount of candy that was in a pound. User's were buying and paying for more candy than what they thought they needed, which created the perception that Dr. John's candy was too expensive.

This misconception was fixed by adding quantity estimates in the product page.

Final UI

Dr. John's is currently developing a new site, based on the wireframes and UX research that I put together. Below is an early look at the new site.