UX / UI Design, Interaction

BAE Systems

BAE Systems plc is a British multinational defence, security, and aerospace company. Its headquarters are in London, UK with operations worldwide. I have worked on a variety of internal and external projects with BAE Systems over the past 6 years. Most recently the redesign of their .com site after their external rebrand by Ogilvy.

BAE Systems wanted to restructure their content to better serve their user needs and shift their offering from a purely capability focus to a personalised solution focus.

Role
Senior
UX/UI designer

Discovery

I began the project by running a series of discovery workshops and stakeholder interviews to better understand the primary user needs and define the brief to meet their business goals. This included developing core proto personas, building affinity maps, competitor analysis and ideation sessions. Through these exercises we built up a clear picture of our users, their pain points, their needs vs business need. We identified a key set of new features, as well the need for a complete redesign of the site structure and navigation. BAE wanted to reposition their offerings to a more customer centric mindset, moving away from a single capability focus and instead allow users to browse the site by capability or user requirement. We developed detailed user flows to unpick the new site structure, allowing for multiple content entry points and personalised content.

bae_workshop_002

Competitor analysis, persona development and feature prioritisation

bae_workshop_001

Competitor analysis to identify common themes

bae_workshop_08

Group competitor analysis exercise

bae_workshop_008-1

Empathy mapping to better understand new user needs (vs business needs)

bae_workshop_00

Prototyping

We went through multiple rounds of prototyping, starting with paper sketches right through to high fidelity wireframes for testing to unpick the new components, content structure and flexible navigation patterns. Detailed user flows were presented to validate the new structure with the client, working through key user journeys. The new .com site would be entirely component based which helped speed up the design process. Whilst prototyping I started to document key interaction patterns. 

BAE_D_Homepage-03
BAE_D_Homepage-01
BAE_D_Homepage-04
BAE_D_Homepage-carousel-02
BAE_D_Nav-01
BAE_D_Nav-Mega

Design

Extending on from Ogilvy's print focused rebrand, we defined the new digital standards for the brand, mindful of accessibility. The final designs included 30+ key pages containing over 80+ components. Being a large organsiation with a global reach, designs had accomodate LtR and RtL languages and cater for AA accessibility.
The site is built on Oracle cloud, given its rigidity we were keen to push the platform to work better for our content first needs and work towards dynamically serving personalised content.

BAE_D_row
BAE_D_Colour
BAE_D_Grid
BAE_D_Typography
BAE_D_Common-Components
BAE_D_Headers
BAE_D_Cards
BAE_D_Homepage-01-2
BAE_D_Cyber-01-1

Outcomes

The new BAE Systems website is still in development, I handed off the project to the development team at Infomentum with all reasearch, prototypes, designs, interaction patterns and design system still being utilised by the team. The new site structure and design language was a big success internally with BAE, helping them better understand their customer needs and explain their offering.

 

© James Jack 2020.