Bank Leumi
Project Overview
Type of Work
UX App Redesign
The Industry
Fintech, B2C
The Need
The existing app was cluttered, hard to navigate and dated.
The Solution
Transform the app into a leading FinTech Product that can help users to manage their finance more effectively.
My Role
UX lead designer and UX researcher.
Client
Leumi Bank.
As part of my work at Firma
Year
2020-ongoing
![Leumi screen.png](https://static.wixstatic.com/media/a1a52e_1906b8eec10f4d57b8c250ff5bc1fdeb~mv2.png/v1/crop/x_84,y_0,w_911,h_1080/fill/w_540,h_640,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/Leumi%20screen.png)
![work_504_work_body_eng_12_1_1638106916.jpg](https://static.wixstatic.com/media/a1a52e_1bda99d745cc4518b323456bf466c696~mv2.jpg/v1/fill/w_143,h_72,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/work_504_work_body_eng_12_1_1638106916.jpg)
![19_Onboarding v2.jpg](https://static.wixstatic.com/media/a1a52e_d1fea08481064304a83e8fad7c5f717f~mv2.jpg/v1/fill/w_143,h_72,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/19_Onboarding%20v2.jpg)
UX Design Process
User and Market Reserch
Concept Design
Information Architecture
MVP Design
The process to understand the needs of the users and the wider fintech ecosystem direction
Design and user test an initial concept
The mapping of all the user flows
Wireframe the whole app, and test the final UI design with users.
User Research
To understand better what the users' needs are, we interviewed a vast array of bank application users, bankers, and fintech professionals.
Among the many questions we had, We wanted to know:
-
Why do bank app users use their apps and how often?
-
What do app users do with their apps?
-
Where is banking headed?
Market Research
We opened bank accounts in leading banking applications and download a variety of applications from crypto trading to budgeting.
![research.png](https://static.wixstatic.com/media/a1a52e_d4e79016718e4c5ba5b6225bdac56eac~mv2.png/v1/fill/w_49,h_30,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/research.png)
Findings
The app needs to abide by following
Empathy
Personalization
Short Flows
Multiple Accounts
Educate
Budgeting
Omnichannel
Solution
Design an innovative and technologically leading app that empowers the users
Accessible
User Empowering
Flexible
![06_Site map.jpg.jpg](https://static.wixstatic.com/media/a1a52e_3f31ba1fa52c4489b059f3abaed4e615~mv2.jpg/v1/fill/w_143,h_72,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/06_Site%20map_jpg.jpg)
![07_UX screens.jpg](https://static.wixstatic.com/media/a1a52e_d6ac482568014e738bf6f84b5e9ace3b~mv2.jpg/v1/fill/w_147,h_80,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/a1a52e_d6ac482568014e738bf6f84b5e9ace3b~mv2.jpg)
UX Design
Accessible
User Empowering
Flexible
![old leumi hp.png](https://static.wixstatic.com/media/899b49_1a319e5ee91e40b0bc2d84dd1ae6a65b~mv2.png/v1/fill/w_177,h_360,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/old%20leumi%20hp.png)
![old leumi menu.png](https://static.wixstatic.com/media/899b49_9c270fd7d7e64e9b907ebe2b64c04cd1~mv2.png/v1/fill/w_179,h_360,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/old%20leumi%20menu.png)
Home Screen
Menu
Before
![one account.png](https://static.wixstatic.com/media/899b49_b59fcb01ab164d959df41dd53a7ff91d~mv2.png/v1/fill/w_56,h_93,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/one%20account.png)
Sticky Bottom navigation
After
Accessible
User Empowering
Flexible
![old leumi actions.png](https://static.wixstatic.com/media/899b49_026b7d0a66db401eaa5f29989de065f4~mv2.png/v1/fill/w_179,h_360,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/old%20leumi%20actions.png)
![new leumi actions.png](https://static.wixstatic.com/media/899b49_283a9a714a224dabaacd2a2df482acf4~mv2.png/v1/fill/w_42,h_84,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/new%20leumi%20actions.png)
Action List
Before
Users main actions slide up
After
Accessible
User Empowering
Flexible
Transactions
page
![old leumi transation page.png](https://static.wixstatic.com/media/899b49_dd2cd97f1546444a9d7a989a05add57f~mv2.png/v1/fill/w_180,h_389,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/old%20leumi%20transation%20page.png)
![new leumi transaction page.png](https://static.wixstatic.com/media/899b49_f05e61731f9f46fd831292b9a2aaa814~mv2.png/v1/fill/w_57,h_114,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/new%20leumi%20transaction%20page.png)
Transactions
page
Before
Transactions page with inner actions
After
Accessible
User Empowering
Flexible
![new leumi with insights.png](https://static.wixstatic.com/media/899b49_9036ea8bede3493c8bd50b1ef5f22228~mv2.png/v1/fill/w_54,h_108,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/new%20leumi%20with%20insights.png)
![new leumi with expenses bar.png](https://static.wixstatic.com/media/899b49_6aa3f053617b433ab4d4e8939a8a0eed~mv2.png/v1/fill/w_55,h_110,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/new%20leumi%20with%20expenses%20bar.png)
User centric insights
Shows spending behaviour
Before
After
Accessible
User Empowering
Flexible
![one credit card.png](https://static.wixstatic.com/media/899b49_effb732e2d094b2ca35cb797d4c40dfa~mv2.png/v1/fill/w_50,h_88,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/one%20credit%20card.png)
![many cards.png](https://static.wixstatic.com/media/899b49_7293f610e0d748b1a54dedfd318af8b1~mv2.png/v1/fill/w_57,h_96,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/many%20cards.png)
One item- Carousel view
Before
Many items- List view
After
Accessible
User Empowering
Flexible
![one account.png](https://static.wixstatic.com/media/899b49_b59fcb01ab164d959df41dd53a7ff91d~mv2.png/v1/fill/w_59,h_98,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/one%20account.png)
![many accounts.png](https://static.wixstatic.com/media/899b49_61919499339f44c1a098d3c91f20d913~mv2.png/v1/fill/w_56,h_95,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/many%20accounts.png)
One Account
Before
Multiple Accounts
After
UI Design
The UI was designed by the UI designers of the team. We made sure we worked closely together and were both in all meetings to make sure that each others vision was not comprimised
![old leumi hp.png](https://static.wixstatic.com/media/899b49_1a319e5ee91e40b0bc2d84dd1ae6a65b~mv2.png/v1/fill/w_56,h_114,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/old%20leumi%20hp.png)
Old Home Page
![new leumi hp.png](https://static.wixstatic.com/media/899b49_c8740e9354d14fb98bdb7259ea2a5e54~mv2.png/v1/fill/w_60,h_118,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/new%20leumi%20hp.png)
New Homepage
![14_UI screens_blue.jpg](https://static.wixstatic.com/media/a1a52e_e4aef88a5119468c85c16f07c493043e~mv2.jpg/v1/fill/w_147,h_74,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/a1a52e_e4aef88a5119468c85c16f07c493043e~mv2.jpg)
Design Validation
User testing
We tested the initial concept and the final design with existing Leumi users, both female and male from 25- 75 years of age.
Users were given tasks to do starting from easy to escalating to more complicated tasks.
We wanted to confirm that users could find what they are looking for fast and they could perform the basic actions they usually do (e.g money transfers and check deposits)
![user testing .png](https://static.wixstatic.com/media/899b49_9113b1e332734efbbd848985e34b52c1~mv2.png/v1/crop/x_0,y_4,w_2822,h_1588/fill/w_70,h_40,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/user%20testing%20.png)
Reflections
-
Defining design guiding values early on helps to focus on a team that consists of many Product Managers and Designers.
-
UX and UI designers need to be together in all meetings and review each other's work, to ensure that each party's visions are not compromised.
![13_collection.jpg](https://static.wixstatic.com/media/a1a52e_fef6bac2798546e89eac497745043261~mv2.jpg/v1/fill/w_146,h_74,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/13_collection.jpg)
![18_mockup_shutterstock_1752105869 v2.jpg](https://static.wixstatic.com/media/a1a52e_566d5e1aeb164466823330cd4c7a7e0a~mv2.jpg/v1/crop/x_39,y_55,w_1846,h_970/fill/w_139,h_73,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/18_mockup_shutterstock_1752105869%20v2.jpg)
The work I did
Worked directly with the client
User Research
Market Research
Site Architecture
User Flows
Wire-framing
Prototyping
User Testing
Spec write up for the dev team
Design requirements manual for the PMs
The tools I used
Axure - for wireframing and prototyping
Sketch - for sketching
Zoom - for User testing
Google Sheets - for analyzing data
Keynote and Power point - for presentations
Lots of Post-it notes and Sharpies