London
Alex logo

Barclays

Code Playground

The Code Playground website provides an introduction to basic programming skills, as well as allowing customers to book a teaching session in a branch with one of Barclays 12,000 ‘Digital Eagles’ staff.

Launch Code Playground>

Barclays Code Playground

Agency: BBH
Role: UX Design

Creative Team: Carl Broadhurst & Michael Russoff
Year: 2014

Featured in:
Creativebrief
Techworld

Awards:

The Breakdown

This award winning game was created to teach children about coding as part of ongoing plans to increase digital skills among Barclays' customers. In the game, we break coding down to such a basic level that those completely new to the subject can experience a taster without going into the detail of coding software or programming languages. The Code Playground website was the campaign hub, acting as a first taster of coding for kids and parents. From here, users were encouraged to sign up to free in-branch sessions run by Barclays Digital Eagles; or learn more by clicking through to a number of coding partners offering tutorials or in-depth explanation.

I helped with the preliminary wireframes and design of how the game mechanics would work. Later, I did a UX rework for a special version of the game re-launched for Fathers' Day. In this version, kids could create a custom Father's Day "card" by coding several variables, which they could then give to their dad. This new version worked a bit differently than the original game, as it's goal oriented rather than freeform experimental play, so the overall UX had to be changed accordingly.

77 percent of parents believe it is important for children to learn coding skills.

Barclays' Research

Code Playground TVCs
Code Playground on mobile
Barclays Wireframes
Barclays Wireframes 2