Barclaycard Guidelines

arrow icon
Return to case studies
Return

UI/UX guidelines: fully-integrated digital platforms and assets.

‍Clear, comprehensive and easy to apply, our microsite guide has been the starting point for all apps, websites and digital interfaces launched by Barclaycard, until the rebrand in 2015.

Challenge

Barclaycard is a multinational credit card and payment services provider, employing a wide-range of platforms: mobile, tablet, laptop, desktop and retail point. It was critical that the UX and UI of each of these modes remained consistent - not only with each other, but also with offline touchpoints - in order to enhance the experience and build trust and loyalty with the customer.

Insights

Barclaycard approached us to distill their brand personality into a set of UI and UX guidelines and assets which could then be translated to the design team via an updatable online microsite.


To establish the rule book, we created a number of exemplars which could define (and subsequently test) the UI and UX principles. By sense-checking the impact on peripheral interfaces (such as card machines and large format displays used in office building foyers) we ensured that the principles would remain consistent and effective.


The exemplars were codified into a set of UI guidelines which could be translated across each medium. These were delivered to the design teams at Barclaycard via an online microsite which could be updated as the brand and platform requirements evolved.

Outcome

Less of a style guide and more of an interactive kit, with assets, tools and instructions included.

Client

Barclaycard

Core Capabilities

Digital Design Language
UX / UI Guidelines
Microsite Guidelines Tool

UI/UX guidelines: fully-integrated digital platforms and assets.

Impact

Clear, comprehensive and easy to apply, our microsite guide has been the starting point for all apps, websites and digital interfaces launched by Barclaycard, until the rebrand in 2015.