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.
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.
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.
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:
Understanding the current IA and proposing a structure that helps readers get to the information easily and cohesively.
Segment of sitemap showcasing Hub IA
To help illustrate the story of the page, I put together these high level strawmans.
Hub page narrative
Sub Hub pages narrative
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.
Scamps - Hub and Sub Hubs
Scamps - Lookbook layout - Desktop
Scamps - Lookbook layout - Mobile
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
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.
Scamps - Hub and Sub Hubs
AXE US went live in late 2016 and can be viewed here: AXE - Home