Travaux01 / Banque de Détail
LivréBanque de détail2024 — 2026

Banque de Détail

Concevoir une expérience bancaire cohérente à travers une transformation organisationnelle.

Reporting · vue territoriale du portefeuille · Écran de production · données anonymisées · 1440 × 900
Domaine
Banque de détail — Saham Bank · refonte plateforme retail
Contrainte réglementaire
Bank Al-Maghrib · conformité groupe
Rôle
Designer produit senior — stratégie produit, UX/UI, design system
Périmètre
Quatre lignes de produits · banque retail + entreprise
Équipe
Design, produit, conformité, ingénierie répartis sur quatre équipes
Durée
24 mois · 2024 — 2026
Statut
Livré

Ce qui a changé

Concevoir une expérience bancaire cohérente à travers une transformation organisationnelle.

  1. 01Quatre équipes produit livrant sur un même socle de règles partagé.
  2. 02États, formulations et hiérarchie définis une fois et réutilisés au lieu d'être renégociés.
  3. 03Ouverture de compte à distance livrée au-dessus de ce système, de bout en bout.
Ma part

J'ai porté le système produit, les décisions d'interface et les définitions partagées. Les formulations réglementées sont restées du ressort de la conformité, les moments d'engagement des product owners, la livraison de l'ingénierie. Les indicateurs de performance internes ne sont pas publics.

On ne peut pas concevoir un produit cohérent sur une organisation incohérente.

Décisions

03 décisions clés

  1. 01

    Quatre équipes décrivaient le même client avec quatre vocabulaires différents, si bien que chaque livraison contredisait la précédente.

    Concevoir d'abord le système de référence, les écrans ensuite.

    Direction écartée

    Une refonte cosmétique — nouvelle coquille, nouvelle typographie, mêmes contradictions — qui aurait semblé finie en six semaines.

    Résultat

    Les états, les libellés et la hiérarchie sont écrits une fois : quatre équipes s'y réfèrent au lieu de rouvrir le débat en réunion.

    Zoom — le socle, écrit une fois
    Fragment 1 / 3 du schéma
    États
    vide, chargement, partiel, erreur, refus réglementaire
    Formulations
    libellés, messages d'erreur, confirmations
    Hiérarchie
    ce qui est une décision, ce qui est une information
    Composants
    saisie, relecture, engagement, preuve
  2. 02

    Le cycle séquentiel découverte → wireframes → UI produisait des écrans approuvés, puis invalidés.

    Changer la structure de décision avant l'interface : un responsable par surface.

    Direction écartée

    Faire tourner un processus de design classique, mais plus vite.

    Résultat

    Un responsable nommé par surface : ce qui est validé en mars tient encore au trimestre suivant.

    Zoom — une responsabilité par surface
    Fragment 2 / 3 du schéma
    Retail particuliers
    responsable nommé · consomme le socle
    Retail entreprises
    responsable nommé · consomme le socle
    Ouverture à distance
    responsable nommé · consomme le socle
    Services et cartes
    responsable nommé · consomme le socle
  3. 03

    L'IA pouvait produire des parcours, des états et des textes plus vite que l'organisation ne pouvait les valider.

    Laisser la machine générer la variation ; garder le jugement et la formulation humains.

    Direction écartée

    Des textes générés entrant dans des écrans réglementés sans validateur nommé.

    Résultat

    Trois variantes d'un parcours produites dans la journée, un seul verdict humain consigné par livrable.

    Zoom — la boucle de génération
    Fragment 3 / 3 du schéma
    Machine
    variantes de parcours, d'états et de textes
    Design
    choix de la variante, hiérarchie, formulation retenue
    Conformité
    validateur nommé sur tout texte réglementé
    Trace
    un verdict humain consigné par livrable

Chapitre suivantPreuves

Preuves

Artefacts · disponibles sur demande

Les écrans en production restent sous embargo client. Je peux montrer en entretien les règles d'états et de wording, la bibliothèque de composants, et les parcours tels que livrés à quatre équipes produit.

Un design system lisible par la machine

Optimisation d'un système existant

Le système ne servait plus seulement à dessiner des écrans : il devait aussi être interprétable par des outils qui génèrent des variantes. Cette passe a porté sur sa lisibilité, pas sur son apparence.

Ce qui bloquait
Un système lisible par des designers, mais ambigu pour un modèle : noms de composants implicites, états dispersés entre les fichiers, variantes utilisées sans être déclarées.
Ce qui a été normalisé
Nommage explicite, variables plutôt que valeurs, états déclarés au même endroit, et un seul vocabulaire partagé entre Figma et le code.
Pourquoi cela compte
Une IA produit une variante correcte quand la règle est écrite, pas devinée. Le système devient une source que la machine peut lire sans interprétation.
La limite
Le jugement produit et la formulation réglementée restent humains : la machine propose la variation, la décision garde un validateur nommé.

Ma part, et celle des autres

Design, produit, conformité, ingénierie répartis sur quatre équipes

Ce que j'ai porté
  • Système de référence : états, formulations, hiérarchie
  • Décisions d'interface sur les quatre lignes produit
  • Bibliothèque de composants et définitions partagées
  • Cadrage de la boucle de génération assistée
Ce qui ne venait pas de moi
Conformité
Formulations réglementées, mentions obligatoires, validation des textes.
Risques
Règles de refus, seuils, définition des cas bloquants.
Product owners
Moments d'engagement, priorisation par ligne produit.
Ingénierie
Implémentation du socle et livraison sur les quatre surfaces.

Chaîne de livraison

Découverte → livraison

  1. 01DécouverteJ'ai mené des ateliers avec quatre équipes produit et croisé leurs résultats avec des inventaires de parcours générés par IA, revus en direct.
  2. 02SystèmeJ'ai fixé un seul état, un seul wording et une seule hiérarchie, utilisés par toutes les équipes.
  3. 03LogiqueJ'ai écrit chaque règle une seule fois : éligibilité, états, comportement d'erreur, plutôt que de les dupliquer par écran.
  4. 04ÉvaluationChaque artefact produit par la machine a été soumis comme proposition, avec un approbateur nommé.
  5. 05PassationJ'ai livré une bibliothèque de composants et d'états, avec la règle derrière chaque état documentée.
  6. 06LivraisonDéployé sur quatre lignes de produits, 2024-2026.
Projet suivant02 / Contentieux & Recouvrement

Donner à la banque un seul endroit pour lire son risque de défaut et le défendre.

Ouvert aux postes senior product / UX-UI designer en télétravail

← Tous les travauxBadr Benali — Product design