Gulf Bank - Redesign

This case was a redesign project for Gulf Bank, a leading financial institution in the Gulf Cooperation Council (GCC) region. Gulf Bank had been facing a number of challenges that affected its brand perception and customer experience, including an outdated visual identity, inconsistent communication, and a complex user interface for its digital channels.

In response, the bank engaged myself and a small team of designers and consultants to develop a comprehensive redesign strategy that would address these issues and position Gulf Bank as a modern, innovative, and customer-centric financial brand.

See Design

FINAL-01-Composition-MacBook-Pro-+-iMac-+-iPad-+-iPhone-Gulf01.png

Background

Gulf bank is a leading bank for a number of wealthy customers in the middle east however the experience of the bank is getting complaints.
The last refresh of their online experience was 10 years ago.

The challenge

Not all stakeholders were on-board to change the banking experience, and feared driving away their important customers - stakeholder management and strong communication was key.
To be the No1 leading Kuwaiti bank.

Project details

Role: Creative Lead
Team: 12
Budget: 300K
Timeframe:
- Testing: 3 Months
- Internal Handover: 6 months

00. Gulf Bank values

Gulfbank vision is to be the leading kuwatai bank of the future, its mission is to provide customers with simple and innovative services, in order to enable sustainable growth.

masrur-rahman-v-0B8gIWvOY-unsplash (1).jpg

Ambitious

Gulfbank are ambitious in meeting the challenges of the future, and in providing the best banking solutions.

People

Gulfbank engage, empower and develop their people in order to provide customer excellence and to serve the community.

Ownership

Gulfbank individually take ownership before they hold anyone else accountable, they stand up to their challenges and support each other as one family.

Simple

Gulfbank strive to remove unnecessary complexities in their processes to make banking enjoyable for their customers. Solutions that are simple, efficient and elegant.

01. Discover

During the discovery phase of Gulf Bank's user experience redesign, I conducted extensive research to understand the needs and pain points of the bank's customers. I analyzed user feedback, conducted workshops, and studied industry trends to gain insights into user behavior and expectations. This allowed me to identify key areas for improvement and develop a strategy for enhancing the bank's digital user experience.

Creating user journeys & use cases

Creating user flows

UX workshop with stakeholders

02. Define

In the define phase of Gulf Bank's user experience redesign, I used the insights gained during the discovery phase to define the project's goals and scope. I created user personas and customer journey maps to better understand the needs and expectations of Gulf Bank's target audience. I also conducted a competitive analysis to identify best practices and opportunities for differentiation. This information was used to develop a clear and focused design brief that served as a blueprint for the rest of the project.

Rapid prototyping | Whiteboarding

User personas

This persona was developed in the Gulfbank workshop, by defining and talking about their real customer needs and stressors.

This is one of many differing personas they were created.

03. Develop

During the develop phase of Gulf Bank's user experience redesign, I used the design brief to create wireframes, prototypes, and high-fidelity designs that addressed the identified user needs and pain points. I followed a user-centered design approach, incorporating feedback from user testing to refine the designs. I also ensured that the designs were accessible and met Gulf Bank's branding guidelines. The result was a set of fully functional, user-friendly designs that could be implemented in the next phase of the project.

Wire-framing | With interaction details

UX process

The design process typically consists of three main phases: inception, construction, and transition. During the inception phase, the project goals and requirements are defined, and the design team conducts research and creates initial design concepts. The construction phase involves creating detailed design specifications and prototypes, testing and iterating on the designs, and preparing for implementation. Finally, during the transition phase, the designs are implemented, tested, and refined as necessary to ensure that they meet the project goals and user needs. Throughout the entire process, the design team should maintain clear communication with stakeholders and users to ensure that the designs are meeting the necessary requirements and expectations.

Creating visual treatments | User accectence testing (UAT)

Creating a visual treatment for Gulf Bank's redesign involved designing a new visual identity that reflected the bank's brand values and personality. I began by conducting a visual audit of the existing brand elements and identifying areas for improvement. I then created several design concepts that included typography, color palette, iconography, imagery, and other visual elements. These concepts were presented to Gulf Bank's stakeholders and user groups for feedback, and the chosen direction was refined based on the feedback received. The final visual treatment was then documented in a brand style guide that ensured consistency across all design deliverables.

04. Deliver

Homepage

I focused on creating a modern and engaging homepage experience for users. I used a design approach that emphasised simplicity and clarity, with a clean layout that highlighted key information and services. I incorporated new calls-to-action and easy-to-use navigation that improved usability. The design also featured dynamic content such as interactive sections that encouraged user engagement.

Card comparison

The credit card comparison page for Gulf Bank was designed to help users make informed decisions when selecting a credit card. I created a clear and easy-to-use layout that allowed users to compare features and benefits side by side. I used a visual hierarchy to highlight the most important information, such as interest rates, fees, and rewards, and provided filtering and sorting options to help users find the best card for their needs.

Article page

The article page for Gulf Bank was designed to provide users with valuable information and resources related to banking and finance. I created a clean and easy-to-read layout that allowed users to focus on the content. We used a consistent visual style, typography, and color palette that aligned with Gulf Bank's new visual identity. The result was an article page that is visually appealing and user-friendly, providing Gulf Bank's customers with a valuable resource.

Privite banking

The private page redesign for Gulf Bank focused on creating a secure and personalized experience for the bank's customers. I designed a clear and easy-to-use layout that allowed users to access their account information and perform transactions in a secure environment. I used the new visual identity, and incorporated features such as personalization options and customized notifications to enhance the user experience.

Ipad privite banking

The iPad private page redesign for Gulf Bank focused on creating a responsive and optimized experience for tablet users. I used a design approach that prioritized touch-based interactions and gestures, with larger and more easily tappable elements. I optimized the layout to fit the iPad screen size and resolution, and incorporated features such as personalization options and customized notifications to enhance the user experience.

Retail banking

The retail banking page redesign for Gulf Bank focused on creating an intuitive and user-friendly experience for customers seeking information about Gulf Bank's retail banking services. I designed a clear and easy-to-use layout that allowed users to easily navigate through the available services and find the information they needed.

Simple Style guide for development

A style guide is a crucial tool in the development process as it provides a comprehensive set of guidelines for creating a cohesive and consistent visual design. Creating a style guide for the Gulf Bank redesign helped ensure that all elements on the site follow the same design principles and branding guidelines.

I started by identifying the key elements of the design, such as the colour scheme, typography, and layout. Then, documented each element in the style guide, providing clear instructions on how they should be used throughout the site. For example, the colour palette could include primary and secondary colours, along with guidelines for using them in text, background, and accent colours.

The integrated solution

The Gulf Bank redesign resulted in an improved user experience and modernized retail and private banking functionalities. By implementing a new design that was visually appealing and easy to navigate, users were able to access banking services more efficiently and effectively. The redesign also introduced modernized features such as mobile banking and online account management, which improved accessibility and convenience for customers. Additionally, the updated design aligned with the bank's overall branding strategy, which helped to increase brand recognition and loyalty. Overall, the Gulf Bank redesign was successful in enhancing the user experience and modernizing the banking functionalities, making it more competitive in the digital banking space.

06. Impact

The impact of Gulf Bank's redesign can be seen through the improved user experience and increased accessibility of retail and private banking functionalities. The new design provided a more visually appealing and modernized interface for customers, making it easier to navigate through the bank's services. Additionally, the inclusion of new features such as mobile banking and online account management enhanced the convenience and accessibility of banking services.

Customer complaints decreased by
over 35%

These figures were measured over the whole implementation course which in total was over 2 years. Retraining staff and aligning products also contributed to this gain.

Increase market share releasing App on Huwai

By having an adaptive design Gulf Bank to maintain their user experience and release on multiple native app stores. Increasing their reach with their customer base.

Self-activation of users decreased
in-person bank visits

Getting access to bank account was previously troublesome. By automating and aligning that process online and in the users banking system, the need to visit a branch went down dramatically.