Riyad Bank - Public Website
A visual revamp of Riyad Bank's public website — modernising the user experience and realigning the digital presence with the bank's evolved brand identity and marketing direction. Visit riyadbank.com ↗
- Lead Product Designer & Product Owner
- Design of the main target picture and visual concept
- Lead and coordinate the external design team (Jeel, 2 designers)
- Product Owner, decision-maker and bridge across Design, Devs, BAs and Stakeholders
- Design system governance
By end of 2024, Riyad Bank's public website had fallen visually behind competitors, creating a gap between perception and reality at the most critical customer touchpoint. As the bank's primary brand touchpoint and first interaction for most customers, its visual quality directly shapes perceived credibility and trust. The brief: modernise the visual layer to close the gap with market standards and improve digital consistency — without disrupting existing interactions or backend infrastructure.
Problem
The problem was defined through an initial alignment phase with key stakeholders, combining business goals, competitive benchmarking, and an assessment of existing technical and organisational limitations. Early analysis revealed a gap between Riyad Bank's desired market positioning and the current perception conveyed by the public website.
Strategy
Given the constraints — no interaction changes, no backend modifications, and a tight delivery timeline — the approach centred on defining a strong visual target picture first. Working with the Riyad Bank data team, we identified the most visited pages on the current site to prioritise design effort where it would have the most impact.
Execution
- UI Kit & key templates — Designed the UI Kit and 15 key screen templates (Home, Products, Offers, Cards and others) to establish visual standards, hierarchy and patterns. These became the source of truth for the rest of the website, ensuring consistency before any external team was involved.
- Internal planning — Scoped the full effort across pages, teams, timelines and ownership. Defined handover protocols between internal designers, vendor designers, developers and business analysts to ensure a smooth and traceable delivery.
- Page rollout — Scaled the validated direction across the remaining pages, distributing work between internal and external teams under the shared UI Kit as the single reference system.
- Cross-team alignment — Regular daily and weekly sessions with design, development, branding and marketing teams to align content delivery, resolve visual inconsistencies, and maintain momentum across the full rollout.
Design evolution — from the original Riyad Bank website through the visual refresh process. Each version shows a key stage of the redesign journey.
Click on any item to expand and view.
Riyad Bank — PO & Stakeholders
Development & BA
Designing within constraints
Knowing when not to redesign everything is a skill in itself. A visual leap forward — without touching UX or IA — was the right call given the timeline. And even within tight constraints, small improvements are worth fighting for: separating accounts from debit and credit cards was a minor backend change with real impact on user clarity.
Beyond the design role
As an external vendor acting as internal Product Owner, I became the decision-maker and bridge across UX, Development, Business Technology, Branding and Marketing at Riyad Bank — as well as external vendors including Efigence and Synpulse. That level of cross-functional ownership taught me more about organisational dynamics than any purely design role had before.
Leading under pressure
Managing delivery across multiple external teams requires calibrating between being a collaborative partner and a firm project lead. Knowing when to push — and doing it clearly, without burning trust — is a leadership skill you can only learn under real pressure.