Al Baraka Bank Mobile Banking
Al Baraka Bank Mobile Banking
Banking Reimagined: Al Baraka's Leap into Next-Gen Mobile Solutions
Banking Reimagined: Al Baraka's Leap into Next-Gen Mobile Solutions
Crafting a Unique, User-Centric Mobile Banking Experience
Crafting a Unique, User-Centric Mobile Banking Experience
FinTech
Banking
iOS
My Role & Project Info
My Role & Project Info
My Role
UX & UI Designer
My Role
UX & UI Designer
Industry
FinTech
Industry
FinTech
Team
Freelance
Team
Freelance
Timeline
2018 (3 Months)
Timeline
2018 (3 Months)
Al Baraka Bank Mobile Banking
Banking Reimagined: Al Baraka's Leap into Next-Gen Mobile Solutions
Crafting a Unique, User-Centric Mobile Banking Experience
FinTech
Banking
iOS
My Role & Project Info
My Role
UX & UI Designer
Industry
FinTech
Team
Freelance
Timeline
2018 (3 Months)
Key Impacts
25% Growth
In user adoption
25% Growth
In user adoption
Awarded
The Best Islamic Digital Offering
Awarded
The Best Islamic Digital Offering
Trnx. Volume
Increased
Trnx. Volume
Increased
25% Growth
In user adoption
Awarded
The Best Islamic Digital Offering
Trnx. Volume
Increased
01
What?
About The Project
01
What?
About The Project
01
What?
About The Project
01
What?
About The Project
A concept for a next-gen mobile banking app with innovative features for Al Baraka Bank.
A next-generation mobile banking app for Al Baraka Bank, Bahrain, to deliver a smooth and advanced banking experience, incorporating innovative features uncommon in traditional mobile banking solutions.
02
Why?
The Problem
02
Why?
The Problem
02
Why?
The Problem
02
Why?
The Problem
To help the client pitch advanced banking solutions to stakeholders for future development.
To help the client pitch advanced banking solutions to stakeholders for future development.
To help the client pitch advanced banking solutions to stakeholders for future development.
To help the client propose a cutting-edge concept to stakeholders, showcasing the potential for an enhanced user experience and advanced functionalities, with the goal of securing approval for future development.
Key Challenges
Key Challenges
This project started as a concept to get stakeholder approval for the next steps, and I faced several challenges along the way. The key challenges were –
Lack of User Information
No access to user demographics or behavioral data, making it difficult to tailor the experience.
Lack of User Information
No access to user demographics or behavioral data, making it difficult to tailor the experience.
Lack of User Information
No access to user demographics or behavioral data, making it difficult to tailor the experience.
Lack of User Information
No access to user demographics or behavioral data, making it difficult to tailor the experience.
Unclear Requirements
The project lacked defined goals or clear direction, leading to ambiguity in the design process.
Unclear Requirements
The project lacked defined goals or clear direction, leading to ambiguity in the design process.
Unclear Requirements
The project lacked defined goals or clear direction, leading to ambiguity in the design process.
Unclear Requirements
The project lacked defined goals or clear direction, leading to ambiguity in the design process.
No Early Testing or Validation
No means to test prototypes or validate design decisions, increasing the risk of user dissatisfaction.
No Early Testing or Validation
No means to test prototypes or validate design decisions, increasing the risk of user dissatisfaction.
No Early Testing or Validation
No means to test prototypes or validate design decisions, increasing the risk of user dissatisfaction.
No Early Testing or Validation
No means to test prototypes or validate design decisions, increasing the risk of user dissatisfaction.
Limited Domain Experience
I personally had no prior experience designing a banking app, requiring additional research and industry insights.
Limited Domain Experience
I personally had no prior experience designing a banking app, requiring additional research and industry insights.
Limited Domain Experience
I personally had no prior experience designing a banking app, requiring additional research and industry insights.
Limited Domain Experience
I personally had no prior experience designing a banking app, requiring additional research and industry insights.
From a Concept to Reality
In 2022, this concept project was partially developed and launched in Al Baraka Bank's South Africa operations.
Launched in South Africa
Al Baraka Bank SA launched this app in 2022
Launched in South Africa
Al Baraka Bank SA launched this app in 2022
Launched in South Africa
Al Baraka Bank SA launched this app in 2022
Launched in South Africa
Al Baraka Bank SA launched this app in 2022
Best Islamic Offering Award
Honored with the Best Islamic Offering Award in 2022 by Islamic Finace New 2022.
Best Islamic Offering Award
Honored with the Best Islamic Offering Award in 2022 by Islamic Finace New 2022.
Best Islamic Offering Award
Honored with the Best Islamic Offering Award in 2022 by Islamic Finace New 2022.
Best Islamic Offering Award
Honored with the Best Islamic Offering Award in 2022 by Islamic Finace New 2022.
Validation
Validated as an innovative solution in the Islamic banking sector making real impact
Validation
Validated as an innovative solution in the Islamic banking sector making real impact
Validation
Validated as an innovative solution in the Islamic banking sector making real impact
Validation
Validated as an innovative solution in the Islamic banking sector making real impact
Freelance projects often don't provide the opportunity to follow up, test, validate, and iterate on designs, and this project was no exception—I concluded my involvement upon delivering the designs. However, driven by personal interest, I continued to monitor its progress post-delivery. While the execution didn't fully align with the vision, the launch served as an important step in bringing the idea to life.
03
How?
The Process
03
How?
The Process
03
How?
The Process
03
How?
The Process
Primary Research
Primary Research
To design a user-focused application, I first needed to uncover the challenges users faced, as I didn’t have prior data or access to a well-designed mobile banking app. Here’s the step-by-step approach I followed to understand their needs and craft a solution:
Survey
To understand what users want from a mobile banking app, I created a quick survey due to limited time and resources. I shared it with individuals matching the target demographic, and 100 participants responded, providing valuable insights.
Survey
To understand what users want from a mobile banking app, I created a quick survey due to limited time and resources. I shared it with individuals matching the target demographic, and 100 participants responded, providing valuable insights.
Survey
To understand what users want from a mobile banking app, I created a quick survey due to limited time and resources. I shared it with individuals matching the target demographic, and 100 participants responded, providing valuable insights.
Survey
To understand what users want from a mobile banking app, I created a quick survey due to limited time and resources. I shared it with individuals matching the target demographic, and 100 participants responded, providing valuable insights.
Online Survery Results. Participants could select as many as they wanted and also input their own features.
User Interviews
I conducted casual conversations with 10 participants to explore their frustrations and unmet needs with existing banking apps. While these interviews were undocumented and unstructured due to my lack of preparation at the time, they gave me clear insights into common pain points and desired features.
User Interviews
I conducted casual conversations with 10 participants to explore their frustrations and unmet needs with existing banking apps. While these interviews were undocumented and unstructured due to my lack of preparation at the time, they gave me clear insights into common pain points and desired features.
User Interviews
I conducted casual conversations with 10 participants to explore their frustrations and unmet needs with existing banking apps. While these interviews were undocumented and unstructured due to my lack of preparation at the time, they gave me clear insights into common pain points and desired features.
User Interviews
I conducted casual conversations with 10 participants to explore their frustrations and unmet needs with existing banking apps. While these interviews were undocumented and unstructured due to my lack of preparation at the time, they gave me clear insights into common pain points and desired features.
Secondary Research
Secondary Research
I researched available case studies and analyzed competitors’ apps to understand existing trends. Unfortunately, most banks at that time (2018) lacked user-friendly, high-quality mobile apps, leaving very few strong examples to draw from.
Some designs that inspired me. All copyrights belong to their respective owners.
Paint Point Analysis
Paint Point Analysis
Combining insights from research, I identified key pain points –
Complex Signup Processes
Some banks required purchasing hardware/software tokens for login.
Complex Signup Processes
Some banks required purchasing hardware/software tokens for login.
Complex Signup Processes
Some banks required purchasing hardware/software tokens for login.
Complex Signup Processes
Some banks required purchasing hardware/software tokens for login.
Limited Features
Many banking functions were missing in mobile apps.
Limited Features
Many banking functions were missing in mobile apps.
Limited Features
Many banking functions were missing in mobile apps.
Limited Features
Many banking functions were missing in mobile apps.
Excessive Friction
Security measures often disrupted user experience.
Excessive Friction
Security measures often disrupted user experience.
Excessive Friction
Security measures often disrupted user experience.
Excessive Friction
Security measures often disrupted user experience.
Overwhelming Numbers
Transactions or banking data was hard to scan or interpret.
Overwhelming Numbers
Transactions or banking data was hard to scan or interpret.
Overwhelming Numbers
Transactions or banking data was hard to scan or interpret.
Overwhelming Numbers
Transactions or banking data was hard to scan or interpret.
Poor Usability
Navigation was confusing and not user-friendly.
Poor Usability
Navigation was confusing and not user-friendly.
Poor Usability
Navigation was confusing and not user-friendly.
Poor Usability
Navigation was confusing and not user-friendly.
Slow Performance
Apps were sluggish, leading to frustration.
Slow Performance
Apps were sluggish, leading to frustration.
Slow Performance
Apps were sluggish, leading to frustration.
Slow Performance
Apps were sluggish, leading to frustration.
04
Overview
The Solution
04
Overview
The Solution
04
Overview
The Solution
04
Overview
The Solution
Design Overview
Design Overview
User Flows
Based on my research and identified pain points, I created a user flow.
User Flows
Based on my research and identified pain points, I created a user flow.
User Flows
Based on my research and identified pain points, I created a user flow.
User Flows
Based on my research and identified pain points, I created a user flow.
Wireframe Exploration
Created and explored multiple ideas through wireframes.
Wireframe Exploration
Created and explored multiple ideas through wireframes.
Wireframe Exploration
Created and explored multiple ideas through wireframes.
Wireframe Exploration
Created and explored multiple ideas through wireframes.
Why Hi-Fi? The client wanted to present the idea in the initial stage and get stakeholder approval first.
Stakeholder Collaboration
Presented wireframes to stakeholders, gathered feedback, and engaged in detailed discussions.
Stakeholder Collaboration
Presented wireframes to stakeholders, gathered feedback, and engaged in detailed discussions.
Stakeholder Collaboration
Presented wireframes to stakeholders, gathered feedback, and engaged in detailed discussions.
Stakeholder Collaboration
Presented wireframes to stakeholders, gathered feedback, and engaged in detailed discussions.
UI Design
UI Design
After finalizing the wireframes, we moved on to designing the user interface. Here’s a glimpse of the key features –
Key Features
Dashboard
All vital information at a glance
Balance Details
Balance at your fingertips!
Transactions
Your transactions, transparent!
Budgeting
Plan ahead!
Bill Payment
Pay utility bills from your home
Send Money
Easy & fast fund transfer
Saving Plans
Save for your dream purchase!
Find ATMs
Where is the nearestt ATM?
AI Assistant
Your handy little AI Assistant!
Financing
Get the help you need
Investments
Multiply your idle funds!
Card Management
Manage and request cards
Beneficiary Management
Manage like contacts on your phone!
Request
Request money fast & easy!
Key Features
Dashboard
All vital information at a glance
Balance Details
Balance at your fingertips!
Transactions
Your transactions, transparent!
Budgeting
Plan ahead!
Bill Payment
Pay utility bills from your home
Send Money
Easy & fast fund transfer
Saving Plans
Save for your dream purchase!
Find ATMs
Where is the nearestt ATM?
AI Assistant
Your handy little AI Assistant!
Financing
Get the help you need
Investments
Multiply your idle funds!
Card Management
Manage and request cards
Beneficiary Management
Manage like contacts on your phone!
Request
Request money fast & easy!
Key Features
Dashboard
All vital information at a glance
Balance Details
Balance at your fingertips!
Transactions
Your transactions, transparent!
Budgeting
Plan ahead!
Bill Payment
Pay utility bills from your home
Send Money
Easy & fast fund transfer
Saving Plans
Save for your dream purchase!
Find ATMs
Where is the nearestt ATM?
AI Assistant
Your handy little AI Assistant!
Financing
Get the help you need
Investments
Multiply your idle funds!
Card Management
Manage and request cards
Beneficiary Management
Manage like contacts on your phone!
Request
Request money fast & easy!
Dashboard
Balance Details
Transactions
Budgeting
Bill Payment
Send Money
Saving Plans
Find ATMs
AI Assistant
Financing
Investments
Card Management
Beneficiary Management
Request
Dashboard
Balance Details
Transactions
Budgeting
Bill Payment
Send Money
Saving Plans
Find ATMs
AI Assistant
Financing
Investments
Card Management
Beneficiary Management
Request
This UI Design followed Al Baraka's already existing Brand Guidelines, especially for logo and colors.
This UI Design followed Al Baraka's already existing Brand Guidelines, especially for logo and colors.
This UI Design followed Al Baraka's already existing Brand Guidelines, especially for logo and colors.
These animations were designed using Principle for Mac, showcasing just a few features of the app.
While I adhered closely to Al Baraka's Brand Guidelines for colors and logo usage, I made adjustments in other areas like typography. The original guidelines were primarily created for print media, so I adapted them to better suit the digital medium.
The project also involved a Brochure and a Landing Page design.
05
Impact
What's the outcome?
05
Impact
What's the outcome?
05
Impact
What's the outcome?
05
Impact
What's the outcome?
Key Impacts At A Glance
Key Impacts At A Glance
Key Impacts At A Glance
25% growth
In user adoption within a year
25% growth
In user adoption within a year
25% growth
In user adoption within a year
25% growth
In user adoption within a year
More Transactions
Transaction volume increased
More Transactions
Transaction volume increased
More Transactions
Transaction volume increased
More Transactions
Transaction volume increased
The Best Islamic Digital Offering Award
Won the Best Islamic Digital Offering 2022 award
The Best Islamic Digital Offering Award
Won the Best Islamic Digital Offering 2022 award
The Best Islamic Digital Offering Award
Won the Best Islamic Digital Offering 2022 award
The Best Islamic Digital Offering Award
Won the Best Islamic Digital Offering 2022 award
Project Outcomes
Project Outcomes
Comprehensive Conceptual Design
Delivered a detailed conceptual design, ready for stakeholder review and feedback.
Comprehensive Conceptual Design
Delivered a detailed conceptual design, ready for stakeholder review and feedback.
Comprehensive Conceptual Design
Delivered a detailed conceptual design, ready for stakeholder review and feedback.
Comprehensive Conceptual Design
Delivered a detailed conceptual design, ready for stakeholder review and feedback.
User-Centric Problem Solving
Addressed significant user pain points to enhance the mobile banking experience
User-Centric Problem Solving
Addressed significant user pain points to enhance the mobile banking experience
User-Centric Problem Solving
Addressed significant user pain points to enhance the mobile banking experience
User-Centric Problem Solving
Addressed significant user pain points to enhance the mobile banking experience
06
Learnings
What Did I Learn From This Experience?
06
Learnings
What Did I Learn From This Experience?
06
Learnings
What Did I Learn From This Experience?
06
Learnings
What Did I Learn From This Experience?
Key Learnings
Key Learnings
Key Learnings
Balance Visibility
Users need to see their current balance during transactions for better decision-making.
Balance Visibility
Users need to see their current balance during transactions for better decision-making.
Balance Visibility
Users need to see their current balance during transactions for better decision-making.
Balance Visibility
Users need to see their current balance during transactions for better decision-making.
HIG Compliance
Adhering to Human Interface Guidelines (HIG) and using native UI elements simplifies app development.
HIG Compliance
Adhering to Human Interface Guidelines (HIG) and using native UI elements simplifies app development.
HIG Compliance
Adhering to Human Interface Guidelines (HIG) and using native UI elements simplifies app development.
HIG Compliance
Adhering to Human Interface Guidelines (HIG) and using native UI elements simplifies app development.
Simplified Journeys
Simplified user journeys improve usability and user satisfaction.
Simplified Journeys
Simplified user journeys improve usability and user satisfaction.
Simplified Journeys
Simplified user journeys improve usability and user satisfaction.
Simplified Journeys
Simplified user journeys improve usability and user satisfaction.
Typography Matters
Typography plays a crucial role in financial apps; better font choices can enhance readability.
Typography Matters
Typography plays a crucial role in financial apps; better font choices can enhance readability.
Typography Matters
Typography plays a crucial role in financial apps; better font choices can enhance readability.
Typography Matters
Typography plays a crucial role in financial apps; better font choices can enhance readability.
Structured Interviews
Effective planning for structured interviews ensures more actionable insights.
Structured Interviews
Effective planning for structured interviews ensures more actionable insights.
Structured Interviews
Effective planning for structured interviews ensures more actionable insights.
Structured Interviews
Effective planning for structured interviews ensures more actionable insights.
Conclusion
Conclusion
The conceptual design served as a foundation for future explorations in FinTech and mobile banking solutions.
Tackling Ambiguity
My first foray into FinTech taught me how to handle ambiguous requirements effectively.
Tackling Ambiguity
My first foray into FinTech taught me how to handle ambiguous requirements effectively.
Tackling Ambiguity
My first foray into FinTech taught me how to handle ambiguous requirements effectively.
Tackling Ambiguity
My first foray into FinTech taught me how to handle ambiguous requirements effectively.
Foundation For FinTech
The conceptual design laid the foundation for future explorations in FinTech product design.
Foundation For FinTech
The conceptual design laid the foundation for future explorations in FinTech product design.
Foundation For FinTech
The conceptual design laid the foundation for future explorations in FinTech product design.
Foundation For FinTech
The conceptual design laid the foundation for future explorations in FinTech product design.
Love For FinTech
This project sparked my interest in FinTech and I fell in love with designing financial soltuions!
Love For FinTech
This project sparked my interest in FinTech and I fell in love with designing financial soltuions!
Love For FinTech
This project sparked my interest in FinTech and I fell in love with designing financial soltuions!
Love For FinTech
This project sparked my interest in FinTech and I fell in love with designing financial soltuions!
Personal Growth
Overall, this project helped me grow as a designer and prepared me for more complex, user-focused challenges in the future.
Personal Growth
Overall, this project helped me grow as a designer and prepared me for more complex, user-focused challenges in the future.
Personal Growth
Overall, this project helped me grow as a designer and prepared me for more complex, user-focused challenges in the future.
Personal Growth
Overall, this project helped me grow as a designer and prepared me for more complex, user-focused challenges in the future.
07
Gallery
Screens
07
Gallery
Screens
07
Gallery
Screens
07
Gallery
Screens
The End
The End
The End
The End
View Next
View Next
Accelerating Merchant Acquisition: 150% Efficiency Boost and Annual Savings
Achieving a 150% efficiency boost in merchant onboarding while saving millions annually through digital innovation.
Industry
FinTech
Timeline
2020 - 2024
Key Impact
150% Efficiency Boost
My Role
Lead Product Designer
Accelerating Merchant Acquisition: 150% Efficiency Boost and Annual Savings
Industry
FinTech
Timeline
2020 - 2024
Key Impact
150% Efficiency Boost
Accelerating Merchant Acquisition: 150% Efficiency Boost and Annual Savings
Achieving a 150% efficiency boost in merchant onboarding while saving millions annually through digital innovation.
Industry
FinTech
Timeline
2020 - 2024
Key Impact
150% Efficiency Boost
My Role
Lead Product Designer
Accelerating Merchant Acquisition: 150% Efficiency Boost and Annual Savings
Industry
FinTech
Timeline
2020 - 2024
Key Impact
150% Efficiency Boost
Other Projects
Other Projects
Boosting SR Effectiveness by 85%, Enhancing Keyphrase Accuracy by 39%, and Detecting Fraud
Harnessing AI for Precise Communication Analytics in FMCG Sector
Industry
FMCG
Timeline
2022
Key Impact
SR Effectiveness Up by 85%
My Role
Lead Product Designer
Boosting SR Effectiveness by 85%, Enhancing Keyphrase Accuracy by 39%, and Detecting Fraud
Industry
FMCG
Timeline
2022
Key Impact
SR Effectiveness Up by 85%
Boosting SR Effectiveness by 85%, Enhancing Keyphrase Accuracy by 39%, and Detecting Fraud
Harnessing AI for Precise Communication Analytics in FMCG Sector
Industry
FMCG
Timeline
2022
Key Impact
SR Effectiveness Up by 85%
My Role
Lead Product Designer
Boosting SR Effectiveness by 85%, Enhancing Keyphrase Accuracy by 39%, and Detecting Fraud
Industry
FMCG
Timeline
2022
Key Impact
SR Effectiveness Up by 85%
Tuning into Diversity: Crafting Saawt's Streaming Experience
Designing a User-Centric, Multicultural Audio Experience for Emerging Markets
Industry
Media & Entertainment
Timeline
2019
Tuning into Diversity: Crafting Saawt's Streaming Experience
Industry
Media & Entertainment
Timeline
2019
Tuning into Diversity: Crafting Saawt's Streaming Experience
Designing a User-Centric, Multicultural Audio Experience for Emerging Markets
Industry
Media & Entertainment
Timeline
2019
Tuning into Diversity: Crafting Saawt's Streaming Experience
Industry
Media & Entertainment
Timeline
2019
Simplicity is not the goal. It is the by-product of a good idea and modest expectations.
Paul Rand
American Art Director and Graphic Designer
Simplicity is not the goal. It is the by-product of a good idea and modest expectations.
Paul Rand
American Art Director and Graphic Designer
Simplicity is not the goal. It is the by-product of a good idea and modest expectations.
Paul Rand
American Art Director and Graphic Designer
Simplicity is not the goal. It is the by-product of a good idea and modest expectations.
Paul Rand
American Art Director and Graphic Designer
