Three Mobile Omni-channel Service Redesign

July 2017 - October 2018

During my time as design director at the Bio Agency - I was fortunate enough to build and lead a team on one of the most significant projects of my career to date. Three approached BIO with the ambition of a complete service redesign across their web experience, customer service platform and app.

To achieve this goal, BIO needed to scale up the team considerably. So I recruited fifteen contract designers to work alongside 16 service designers, five business analysts, five project managers, two scrum masters and an entire team of developers based out of Three's head office in Maidenhead.

A new way of managing large design teams

Ensuring consistency of assets across the large team was paramount; traditionally, designers at BIO would work in parallel, passing assets back and forth as updates were made, but this wasn't going to work with 15 designers all working at the same speed. Fortunately, the team at BIO had been testing out an advanced design file management tool called Abstract, and I saw this as an excellent opportunity to see what it was made of. Read more about my team's experience with Abstract here.

After the success of introducing the Atomic Design System's way of working on the Savills project, it was clear that Three would benefit significantly from an advanced system of components for their digital platforms. The client team were on board from the start as they had attempted to get their design system off the ground previously; now, with such a significant program backing this decision, they were excited for it to come to fruition.

A new team structure

Originally the project had been planned based on design team members strengths, however with the aggressive timeline, it proved a better method to break the team up into customer life cycle stages, whilst ensuring that the teams had an even split of designers with app/responsive web experience. The teams were broken up as so:

EXPLORE

When the user is exploring the brand through the website and contemplating a purchase in order to become a Three customer. This life stage would focus on the responsive web experience as this is the platform that all products are readily available for browsing and purchase.

When the user makes a purchase and signs up as a customer. This stage would focus predominantly on the responsive web experience
as data showed that most people would use their desktop to make this significant purchase decision.

JOIN

GET HELP / LEAVE

This life stage predominantly covered troubleshooting when users needed support so would focus heavily on article content and videos spanning the responsive web experience, app and customer service system.

HYGIENE

This life stage covered global pages and modules that would sit across multiple customer life stages eg. The site header/footer,
promotional banner content and live chat elements.

CONSISTENCY

This team was formed of the heads of each discipline, whose job it was to sit across all life cycle stages, ensuring all ideas, directions and visual styles were aligning with the project goals and remaining consistent. As design director on the project, I sat on the consistency team and attended weekly client meetings to review and approve new additions to the Atomic Toolkit whilst ensuring all teams were aligned with any changes in direction whilst maintaining a consistent experience-led vision.

Motion as a design tool

Interaction mockups proved to be a very useful tool in communicating design direction to stakeholders, providing a feel for how elements of the site would react and bringing the clean designs to life through playful micro-interactions.

In addition to the standard atomic toolkit elements of grid systems font styles, colours, buttons etc the team worked on a set of motion principles which would be applied to all digital platform elements to ensure interaction pattern consistency throughout the designs.

A future-proof design system

BIO’s partnership with Three in designing, developing and implementing their first Atomic Design System was a successful step in a long term plan for the business, building a solid foundation for the company to take their design system into the future.

Previous
Previous

Nissan Global

Next
Next

Scotia Bank