Unilever

AXE

Inspiring a new generation to find their magic

The new online AXE digital experience is to fulfil their new brand proposition - helping young men to find their magic.

BRIEF

 

I joined the project midway through the detail design phase. From the start my brief was to understand the offering of content and work towards a six-week sprint to deliver a "Lookbook" template and several landing page templates.

OBJECTIVE

 

This will be a new online experience delivered on an AEM platform created by SapientRazorfish. The platform itself is made up of a series of components which have a set number of characteristics within them.

The main challenges from an experience design viewpoint is the need to adhere to a set number of rules and characteristics that the components are pre-built with.

Young men can find more of the same anywhere and AXE has to provide an experience that not only provides a showcase of their products but also reinforces it with creative, inspirational and educational content.

EXPERIENCE PRINCIPLES

 

The team defined five experience principles to help craft our ideas around:

BUDDY TEAMS AND PROCESS

 

As a Junior UX on the project I had a Lead UX oversee the work I did.

I worked closely with another visual designer and had daily catch-ups with the development teams to confirm the designs we were creating were deliverable from a platform perspective.

UNDERSTANDING THE USER

 

Not all website visitors are created equal. Users come from different sources with varying levels of knowledge and engagement with different goals.

  • Where are our users joining us from?
  • What is the role of an editorial Hub/Sub Hub?
  • How best can we funnel users down to the inspirational/educational content?

These can be distilled into entry points bearing in mind each visitor has their own needs, expectations, levels of knowledge and they need to be treated accordingly.


Potential entry routes:

CONTENT TYPES

 
  • Lookbooks

    Cross-category galleries on specific aesthetics or moods.

  • Guides

    Similar to lookbooks but more definitive guides to a specific subject.

  • Styles/Inspirational pieces

    Made up of hair, beard and fashion style. How-to guides are embedded within.

  • Ways To

    Shorter how-tos that are purely step by step.

  • Long-form articles

    Thought pieces predominately text based, can highlight product histories, culture and lifestyle.

  • External Sources

    "Instagrooms", AXE Culture and London Barber.

SITEMAP

 

Understanding the current IA and proposing a structure that helps readers get to the information easily and cohesively.

Segment of sitemap showcasing Hub IA

STRAWMANS

 

To help illustrate the story of the page, I put together these high level strawmans.

Hub page narrative

Sub Hub pages narrative

SKETCHES

 

Here's a selection of sketches I put together during the detail design phase. As part of the buddy team system I collaborated with my visual design buddy to bring these sketches to life.

Initial scamps

Scamps - Hub and Sub Hubs

Scamps - Lookbook layout - Desktop

Scamps - Lookbook layout - Mobile

PROTOTYPING

 

During this fast moving project, the team tend to work on several streams at the same time. I found myself helping the other two sprint teams when it came to prototyping and animations for the Homepage and Navigation.

Here are some recordings of these prototypes which we presented to the client during the sprints.

Homepage concept - On scroll effect

Navigation concept

TEMPLATE CONFIGURATIONS AND COMPONENT MAPPING

 

An important role of any big build project is the need to create template configurations and component mapping documentation to help our teams understand how our designs can come together on a page.

I created the initial documentation and structure for both the template configurations and component maps for this whole new online experience. This was then finalised by another member of the team but provided a key learning block for me which I later used on Knorr.


Document samples:

Initial scamps

Scamps - Hub and Sub Hubs

OUTCOME

 

AXE US went live in late 2016 and can be viewed here: AXE - Home

Menu