KPMG: A Project Snapshot
Project Overview
Client
KPMG, London 2018
Brief
Create a way to keep users engaged and able to navigate the issue-based marketing pages across the KPMG service pages.
Challenge
While KPMG’s underlying platform was great; the site being fast, responsive and its functionality working well, the presentation layer was underperforming, with questionable site analytics and conversion rates, on top of low user engagement. The site’s UI components presented a very poor user experience, scoring badly for navigation, signposting, template differentiation and primary CTAs. As part of a team, I would explore ways to troubleshoot problematic UI and navigation patterns to improve usability across the KPMG service pages.
Solution
Our enhanced designs significantly improved usability and user engagement through a series of changes to the UI, user flows, navigation and signposting. Users were kept informed of their location through deeper breadcrumb navigation; redesigned spotlight cards (staying true to KPMG’s strict brand guidelines) would ensure a clear distinction between different elements on the page, and what would happen when these were clicked. Dead-end pages were eliminated with the addition of in-page related articles, and the addition of a newsletter signup CTA to every page would significantly increase sign-up rates.
My role
UX Designer
Methodologies used in my role
Workshop facilitation | Workshop output analysis | Design studios | User journeys | Paper wireframe sketches | Low fidelity wireframes
Team
Ben Kay UX Director
Greg Docherty UI Designer
The Project: A Presentation Layer Falling Short of Expectations
KPMG had recently completed a redesign of their service pages across KPMG.co.uk, heading in a more issue-based marketing direction. These pages were critical for KPMG to connect with visitors and communicate the value they could deliver to their clients.
Despite these pages bringing together the best of capabilities, experts, insights, and points of view on the issues challenging KPMG customers and the business community. User engagement, subscriptions to newsletters, and registrations were falling well below target. Following a heuristic review of KPMG’s service pages by one of our digital partners. My team and I were brought on board to solve the usability and navigation issues that had been identified across the service pages. Our exploration of the site would show that while the content quality was up there with the best of KPMGs competitors, the site’s presentation layer was a confusing experience, rife with dead ends, unexpected navigation behaviours, and ambiguous UI elements.
Through the course of this project, we would improve user engagement through enhanced UI designs, crafted user journeys, better content display, and redesign the customer experience across the pages, ensuring that users could easily navigate and find the information they need.
Client Workshops: Understanding Content Through Discovery Workshops
At the outset of the project, I assisted in the facilitation of ‘discovery, design and content’ workshops at KPMG’s London headquarters to gain an understanding of the content types on the site and the expected level of user engagement. This would help feed into our redesign of the service page layouts, including content hierarchy, vertical rhythm, white space, content chunking, CTAs and how the pages work together when navigating vertically as well as horizontally.
The KPMG Brand Guide: A Lack of Guidance for Digital use
A major culprit behind the ambiguous use of UI elements was a limited number of component choices across KPMG’s style branding guide and a lack of proper instruction on how to use these elements across their digital estate.
Example One: Inconsistent Appearance of Links
The available components were leaving site designers using the same elements in multiple contexts and for very different purposes, leading to a confusing site experience. Some examples of this can be seen below, with the inconsistent use of links in text and a variety of header sizes across pages.
Example Two: Inconsistent Header Styles
User Flows: Tackling Deadends and the Absence of Clear Pathways
When reviewing the current site, there were no clear paths through it, with many pages being dead-ends displaying no way back to the previous page or related articles. We proposed a journey where hub pages could link to multiple directional issues and back again, with all pages displaying a CTA to sign up to the KPMG newsletter. Later, we created wireframes and prototypes to present how the new journeys and layouts could look and function. Below is an example of the existing journey through the pages to an article:
Our proposed user flow showcased how hub pages could link to multiple directional issues and back again, with all pages displaying a CTA to sign up to the KPMG newsletter.
Paper Sketches: Early Chunking Examples
Low Fidelity Wireframes: Outlining Content Blocks
Mid Fidelity Wireframes
Wireframe UI Breakdown
Final Designs
Our implemented design changes scored highly in usability lab tests and saw a real world increase in user engagement, subscriptions to newsletters and registrations across the KPMG website. In addition to ensuring that all pages included a newsletter signup CTA, we placed our focus on a return to standard content types that site visitors would be familiar with, adopting these throughout the site.
A redesign of the ‘spotlight cards’ meant that users could now differentiate whether the cards would link to an article, a blog or a report. We also ensured that those pages, once accessed, would have the ability to loop the user back to related articles and previously skipped content from the preceding page. The profile card components also saw a change, in that additional information to set one contact apart from another was added to the profile cards, showcasing more around their area of expertise to entice users to connect with them. The profile detail page itself, would also display links to articles and content relevant to the contact’s area of expertise, presenting the user with engaging content about what services KPMG can offer their clients.
The new designs and style changes implemented during my time on the project continue to live across KPMG’s web site today.