What they wanted
Pixl8 have worked closely wiht the Institute for many years. They wanted to redesign their existing website, previously built by Pixl8, and integrate with MS Dynamics CRM, to better support user and member needs. Meeting members’ needs was the key requirement in the redesign, to improve user journeys and increase member engagement.
The Institute wanted members to be able to:
- Navigate easily throughout the site
- Use an expanded Knowledge Hub for resources such as videos and podcasts
- Live chat with the Member Engagement Team
- Check qualification results
- Book exams
- Check progression
- Log CPD online
We delivered
User Research and Usability Testing
We carried out user research with Institute members, to understand the requirements of multiple audiences. Multiple audience sets were created and video interviews took place with senior members, members, students, press and international users to delve deeper into user behavior. The video interviews enabled users and members to talk at length about their requirements and needs. We also carried out a survey and received responses from over 400 users, listing their desires and any frustrations with the current website.
The designs were turned into clickable prototypes for quantitative task based usability testing sessions. Users from each audience were asked to find resources, check their qualification results, review their CPD log and comment on the homepage and navigation. This enabled the designs to be amended in line with member and user feedback.
Visual Design
During the design process, users commented on the need for the site to reflect the prestige of the Chartered Banker Institute. The simple, white, black and gold colour scheme reflects this aim and is in keeping with the way the Institute’s brand has evolved.
It was important that the site was adapted for users who are colour blind. Accessibility, contrasts, headings and body font size/weight were all to WCAG 2 level AA requirements. Where a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text is required.
