beforeBank selection
A dense list to work through.
- 1Small recognition cuesLogos and names sit in compact rows with similar visual weight.
- 2A long reading sequenceThe user scans down the list to identify the right institution.
I redesigned Tarabut’s bank connection journey to address the fears behind abandonment: who gets access, what they can see, how long access lasts, and what happens next.
At the point of consent, a user is deciding whether to trust a service with their financial life. The existing flow asked for that trust through dense explanations, risk-focused wording, and unclear handoffs. My work made the request easier to understand and the user’s control easier to see, within a shared experience for partner banks.
Selected final designs. Every image opens in an enlarged viewer.
The baseline funnel recorded 530 sessions at launch, 282 at provider selection, and 136 at consent. It showed substantial loss before people reached the bank-authentication handoff, giving us a clear part of the journey to investigate.
Alongside the user sessions and support feedback described in the original study, I reviewed what the interface was asking people to understand. The central design problem was confidence: recognising the bank, understanding the request, and feeling in control before continuing.
As Lead Product Designer, I led the design work with partner banks and worked across research review, design exploration, user comparisons, and the detailed states prepared for development.
Original funnel from the research page in Figma. The chart shows losses across the journey; it does not assign a cause to each lost session.
The permission screen explicitly named payments, bank usernames, and passwords in a section explaining what access did not allow. That reassurance was factually intended to reduce concern, but it put the most alarming possibilities directly in the user’s reading path.
The user also had to connect several separate ideas: a service requesting access, a 12-month period, a generic “Confirm” action, a redirect, and an account-selection screen. Each step could leave a different question unresolved.
I organised the redesign around those questions, making the scope, purpose, control, and next step visible at the moment each mattered.
The earlier four-screen journey. Bank identities in the data screens are anonymised for display; the bank-selection list is unchanged. Click to inspect the sequence.
Explain the permitted data in clear, inspectable categories.
See the design decision →Name the requester and connect the data request to the service.
See the design decision →Keep the dates and revocation message visible near the decision.
See the design decision →Name the next destination and explain the handoff.
See the design decision →The earlier list already included bank logos, but presented them as small entries in a dense sequence. I gave each bank more visual space, with a larger recognition target and a consistent relationship between its logo and name.
This was the first opportunity to make the flow feel deliberate and understandable. The same card system could accommodate the bank sets for Saudi Arabia and Bahrain while preserving a familiar interaction.
beforeBank selection
afterBank selection
Both versions use bank identities. The change strengthens recognition through size, spacing, and grouping.
I shifted the emphasis toward a concrete explanation of the request: the bank being connected, Tarabut acting on behalf of the requesting service, why data is needed, and the categories of data involved.
The final screen separates that explanation from the legal terms. Users can expand a category to inspect its contents while keeping a manageable overview. The interface leads with what the request means, allowing the person to judge it before moving on.
beforePermission review
afterPermission review
The numbered callouts connect each interface change to the uncertainty it was designed to address.
The earlier design already mentioned a 12-month period and the ability to revoke consent. I made that control more visible: explicit sharing dates and a dedicated revocation notice appear below the data categories and close to the primary action.
The expanded view adds examples of the data within each category. Users can see the overview, inspect the details, and return to the same decision without losing the sharing period or the explanation of control.
The dates and revocation notice remain part of the main reading sequence. The change improves their prominence; it does not introduce revocation as a new capability.
The earlier redirect paired a bank handoff with “get approved instantly,” introducing another outcome while the user was still connecting an account. I kept the transition focused on the destination and the connection task.
A short “How it works” explanation introduces the sequence before consent. On the return journey, the interface names the original app and explains that the user has been logged out of the bank. Together, these states make the boundary between organisations easier to follow.
beforeBank handoff
afterBank handoff
The comparison shows a change in emphasis and expectation-setting, rather than attributing a separate conversion result to this screen.
Expectation-setting before the decision, and reassurance at the point of return.
The permission system had to accommodate differences between markets and use cases. The Bahrain flow documents account details as required, while transaction details depend on the service being provided. The developer notes identify income checks and personal finance categorisation as cases that need transaction data.
I designed the responses to those choices: a required-data explanation, a route that allows limited data where supported, and an inline message when the selection is insufficient to continue.
This made the handoff more specific than a set of ideal screens. It connected the interface to the conditions under which a user could proceed, and gave market-specific disclosures a defined place within the layout.
The same permission structure accommodates a different category set and an explicit validation state.
Different conditions need different explanations. A mandatory requirement and an optional data request should lead to the appropriate next action.
Arabic and English were designed across the journey, including selection, permissions, help, and the handoff states. Permission descriptions, dates, navigation, and legal copy all had to remain readable within the same system.
Placing the versions side by side makes this work visible: text aligns with the reading direction, navigation follows it, and the relationship between the bank, the request, and the primary action stays clear.
Parallel permission designs show how the information hierarchy carries across both reading directions.
On desktop, the same content takes advantage of a wider canvas. Bank options sit within a contained grid; the permission layout separates the request from the sharing summary and action. On mobile, those elements follow a single reading sequence.
The handoff includes desktop and mobile designs, alongside intermediate viewport layouts for permissions, so the experience is defined beyond one ideal screen size.
The bank grid and permission review adapt to desktop while preserving the same underlying decisions.
The handoff also covers a connection that starts on one device and uses another for bank authentication. I designed a choice between continuing on the current device and logging in elsewhere, followed by a QR screen that explains how to make that transition.
The original device then shows a waiting state that explains where the user is in the process. On the second device, the completion screen confirms the account connection, states that the user is logged out, and tells them to return to the original device.
Designing those states made the start, wait, and finish of the connection visible on both sides of the handoff.
The cross-device branch, documented in the developer handoff. These designs show the scope of the journey; no separate conversion result is attributed to this branch.
Completion includes an instruction to return to the original device, closing the loop between the two screens.
In the documented Arabic bank-selection comparison, 77% of 26 participants preferred the grid layout. The accompanying feedback repeatedly mentions clarity, organisation, and the visibility of bank icons.
A separate Arabic permission-layout comparison recorded a 63% preference among 30 participants for the design with more visibly grouped information. These comparisons helped inform the direction. The final expandable permission system continued to develop beyond the layouts shown in that test.
These are preference results. They give evidence about the designs people favoured, rather than directly measuring journey completion or comprehension.
Original comparison results: 77% of 26 participants preferred the bank grid; 63% of 30 participants preferred the grouped permission layout. The bank identity in the permission screenshots is anonymised for display. The consent test compares design alternatives, rather than the final expandable interface.
Original feedback from the bank-selection comparison, retained as supporting evidence.
The project’s reported outcome was a 27% improvement in consent-journey completion. The redesign also established reusable patterns for bank selection, permission review, market-specific requirements, and device handoffs.
The central contribution was making confidence part of the interaction: a recognisable bank, an understandable request, visible control, and a clear path through authentication and back to the app. Each decision addressed a place where uncertainty could make someone stop.
I had the pleasure of working with Saleh at Tarabut, where he brought deep knowledge of the Middle Eastern market and a rare ability to quickly grasp the nuances of diverse industries, from e-commerce and high-value retail to financial services. He has an exceptional talent for translating complex business needs and customer behaviors into intuitive, effective UX and designs. Any team in Riyadh would be lucky to have him.

Saleh is a fantastic designer who always puts the product experience first. He is detail-oriented and genuinely curious about the business problems behind the work, which means his designs are not just intuitive but also make a real impact. Beyond his technical expertise, Saleh is highly collaborative, open to feedback, and consistently seeks opportunities to improve the product experience. Any team would be lucky to have him.

I had the pleasure of working with Saleh at Tarabut. He is a fantastic designer, always asking the right questions and truly thinking about the product experience. He is incredibly receptive to feedback and constantly seeks to improve. He would be a valuable asset to any team.

Work with me