Commercial Bank of Zimbabwe (CBZ)
https://www.cbz.co.zw/
Problem / Challenge
- Multiple websites for each SBU which resulted in a fragmented experience.
- Dated look & feel.
- Product visibility.
- Product visibility.
Project timeline:- July 2017 - Nov 2017
Role, Team & Process
Team:- UX/UI Designer, Project manager, Fullstack Developer
Role:- UX/UI Design
Process:-
- User Research
- Information Architecture & Mapping User Journeys.
- Creating Wireframes & Content Planning.
- Create Prototype.
- User Testing & Iteration.
- UI Design.
- Launch.
- Benchmark Performance.
- Information Architecture & Mapping User Journeys.
- Creating Wireframes & Content Planning.
- Create Prototype.
- User Testing & Iteration.
- UI Design.
- Launch.
- Benchmark Performance.
User research
We setup a survey to collect information from users to get the core reasons for visiting the website & to extract their frustrations with the existing (old) website.
Insights:-
- Drivers:- Users are coming to the websites to get to Internet banking, Contact information, Product information.
- Pain points:- Products are difficult to find.
Solution
We ran a brainstorming session to see how we could solve some of these problems.
We ran a brainstorming session to see how we could solve some of these problems.
- Customer first approach - Personalize the experience as well as increase product exposure.
- Make the drivers more salient.
- Update the website (look & feel).
Information Architecture & Mapping User Journeys
Using insights gathered from early research + my assumptions created the information architecture for categories & mapping the user journeys towards the goal (making the main drivers easily accessible).
Using insights gathered from early research + my assumptions created the information architecture for categories & mapping the user journeys towards the goal (making the main drivers easily accessible).
Wireframes, Content Planning & Prototype
The wireframes are high definition because the client requested high def wireframes. I skipped the prototyping stage because the user journeys were simple enough to be communicated as simple images.
UI Design
A fully styled mockup of what the final webpages would look like. Because these are similar to the wireframes, we conducted a few tests to make sure that there is nothing in the look & feel that prevents the user from completing their goals.
Validation (After Launch)
- We reduced the time it took to find products
- Users appreciated the personalization
- Users felt the new website and IA was more customer focused as opposed to representing the org structure.
Lessons
In order to practice user-centered design, you have to be ready to do a lot of educating, negotiating & compromosing.
In re-thinking the bank website we focused on the user & in order to achieve that goal we had to educate the client on user-centered design design & the importance of putting the user first.
