BT banner

BT Group Plc

Skills used: UI, Basic UX, User Research, Prototyping, Agile

I’m currently working here as a Product designer. BT is one of the world's leading communications services companies. They serve the needs of customers in the UK and in 180 countries worldwide. It’s main activities are the provision of fixed-line services, broadband, mobile and TV products and services as well as networked IT services.

Role: Product / UI designer

Depending on what product team I was part of my main duties would usually consist of translating, optimising and designing user needs and business goals into interactive customer journeys for the BT.com site.

BT Broadband

Incorporating Lean and Agile principles into our workflow

Using an Agile and Lean workflow methodology we worked in 2-3 week sprints using JIRA to track it (examples below), these involve daily scrum sessions, having an kaizen iterative approach to designing and collaboration between the UX team, user researchers, product owners and development teams.

JiraAttachments

Depending on what product team I was part of my main duties would usually consist of translating, optimising and designing user needs and business goals into interactive customer journeys for the BT.com site.

Incorporating Atomic Design into our design system

I collaborated in the development and creation of the online BT style guide and incorporated Atomic Design to create the BT design system. By incorporating the design system into our workflow it helped speed up the work process. Below are a two screens from our design system.

styleguidestyleguide 2

BT Help

One of the main products I worked on was the BT Help. I was the lead UI designer embedded in the Help product team. The main purpose for the team was to create a better user experience for the customer, to reduce call rates and provide solutions to customer problems faster.

BT help

We made design decisions and adjusted strategies based on data gained from workshops, A B testing and user testing at the Insights Rooms with the assistance from our in house user research team.

teamplanning

We also used the Usability Hub site for fast user testing.

usability-hub

The old Help had a confusing intimidating customer journey coupled with a dated look and UI altogether this didn’t make for a satisfying customer journey.

Below are a couple of screen shots of what the BT Help looked like before optimisation.

old-helpold-help-landline

I worked closely with the UX designer on the team to ensure that the finalised designs were as accurate as could be in both UX and UI.

Below is the User flow that was used on the Help project.

Customer journey

For the visual designs we started with a mobile first approach this was mainly to see what could we have as a minimum on the site we then built the responsive designs on our findings.

Using the wireframes and including all the responsive breakpoints I created over 220 visual designs for the Help site.

wireframes

This is a prototype of what the basic BT Help customer journey looked like after the first round of optimisation.

help launch

After months of research, optimising the UX and simplifying and updating the UI so the designs were in-line with the latest style guide, we relaunched the help section which resulted in a 15 percentage points Net Promoter Score improvement in the Help digital journey, a £1.5M yearly business cost saving via cost, a reduction in call rates and even winning an award at the Global Telecoms awards 2018 for the Best Digital Transformation Project.

awardNPF

Prototyping and micro-interactions

When presenting the customer journey to my team and stakeholders I would upload the designs to InVision and create and a prototype to help tell the story of the customer journey.

Also, when the designs were finalised, if we had the time we would include the usage of micro interactions to breath a bit of life into the pages.

Below is an example of a customer journey on the Help part of the BT.com site looking for a guide for what the coloured lights on their internet hub mean. I wanted to add an animation that would help the customer clearly see what hub they were selecting.

Bt hub help page

This is a prototype to show a micro-interaction when using live chat on the BT Help. I felt that we could improve the customer experience on the chat by delighting the user with the micro-interaction of the send plane icon flying off when sending the message.

live chat

This is a prototype I created using Sketch and Invison. The purpose of this prototype was to show the customer journey starting at the service checker page to booking an engineer if there was a persistent problem with their Wi-Fi.

Schedule an engineer visit

Mentorship

Worked with a few designers doing internships and juniors who were hungry to learn. I was given the chance to soldify their knowledge in the design basics such as colour, typography and layout.