Project Description

OzoneAir

Website revamp for a Swedish company that markets ozone-based air purifiers for residential and commercial use.

I helped to redefine the site user experience and interface for OzoneAir, to improve customer time on site and conversion rates. By analysing the site’s visitor behaviour and patterns through various tools, I updated the website’s design to provide a more pleasant, informative experience from navigating the landing page through to the checkout process.

Visit Site

Introduction

OzoneAir is a high-tech, university start-up creating value for their customers by cleaning the air in their home/office environment. They offer air purifiers for the B2C, and to a lesser extent, the B2B market. that transforms oxygen into ozone which attacks and eliminates mold spores, bacteria, allergens and micro-organisms in the air.

The Swedish climate, with long, dark winters and damp springs and autumns causes problems, such as mould and the smell of damp material and fabrics.

While already having a steady local customer base attained through its well-performing products and existing website, OzoneAir intended to branch out to other countries in the Scandinavian region with their current product range.

Identifying The Problems

Upon analysis of the current site statistics, there was a distinct high percentage of visitor drop-off rates in the homepage, which had a ‘snowball’ effect to the subsequent pages. Therefore one of the main goals here would be the redesign and optimization of the landing page primarily for mobile, as almost 2/3 of all visitor traffic was on mobile devices, with desktop coming in second at almost a quarter.

Above: The typical customer journey consisted of

  • Homepage
  • ‘Remove Bad Odors’ Page
  • ‘Clean A Space’ Page
  • Product Page
  • Checkout
  • Thank You Page
Above: Conversion rate analysis, Google Analytics and Heatmaps were used to diagnose the issues faced.

Summary of Insights

  • It wasn’t clear enough that the products are ‘quick and easy to use’
  • There should be a separate section for “Reviews and ratings” in the homepage
  • There was a need to ‘clarify’ what Ozoneair is for. While the current content is good at describing what the products do, it didn’t explain as well what their purpose was for.
  • There was a need to mention keywords such as “air purifier”, which would also benefit from SEO and Adwords.
  • Customer ratings on the site are not easily findable.
  • The products only appear too far down different category pages, forcing users to scroll more before arriving to browse through products.
  • Many click on non-clickable icons
  • The buy button is far from the product image when viewed on mobile devices

Method

I worked with Linnea, the Head of Marketing of the company to find out areas where we could further improve the customer experience. We came up with a map of the customer journey flow to help us identify and triangulate where along the journey users would encounter paint points based on which task, and which page the user would be on.

Following that, a more refined sitemap with the agreed changes in information architecture was drawn up too, so that all members of the team were aware of any content that needed to be added or moved based on the heuristic analysis.

This proposed sitemap also included two major additions: A ‘For Businesses’ page, which would help to channel visits by users who were were working in companies that were looking to purchase in bulk amounts, and a FAQ/Support page, which would provide additional information about product usage, purchase and shipping info and health information, when working with ozone.

Other suggested additions included chunks of content that would increase customer conversion rates, such as testimonials, video reviews, company interviews and a loyalty/rewards program.

We wanted to make ozone technology a key selling point that was more beneficial compared to traditional air purifiers, hence the need for the appropriate content to inform users.

The biggest challenge for this project was deciding whether the amount of content to educate users about the benefits of ozone technology was sufficient enough, while at the same time making the customer journey as seamless and as straightforward as possible.

User Interface Design Phase

Typography
Color Palette

The new brand direction consisted of a selection of refreshing tones, namely a more sky blue hue complemented by hints of mint green to signify a natural touch. This combination is meant visually reflect the tone and purpose of the brand. Since the products are also developed in Sweden, the primary blue was similar to that found in the Swedish flag and we wanted to communicate that as well.

Charcoal Grey Secondary

R – 49
G – 53
B – 61

#31353D

Slate Grey Accent

R – 122
G – 125
B – 151

#7A7D97

OzoneAir Primary Blue

R – 59
G – 124
B – 204

#3B7CCC

Mint Green Secondary

R – 227
G – 242
B – 243

#E3F2F3

Light Grey Accent

R – 244
G – 245
B – 248

#F4F5F8

Moodboard

Core values – Throughout the UI design phase, the new identity was encompassed by four core values, which we incorporated into the website experience:

  • Innovation
  • Design
  • Quality of Life
  • Environmentally friendly

Final Design

The engaging design of the new site homepage better described what purpose of the products were for within the first two folds of the browser height, hence letting site visitors be better informed about the product line, which in turn, decreased the bounce rate. The icons were better designed to be less ‘clickable’ which resulted in less confusion for users. I wanted Ozoneair to establish its growing credibility and increase the visibility of positive feedback by users by adding a Reviews section, which helped to increase conversion rate. The overall UI was entirely revamped to better portray the airy and breathable nature of the brand.