Je clarifie les parcours. Du besoin à l’interface.

Senior Product DesignerRecherche utilisateur · Design UX/UI · Prototypage avec l’IA

Je pars des usages, définis les priorités avec les équipes et conçois des interfaces où l’on comprend quoi faire ensuite.

Voir les projets
Gabriel Nion, Product Designer

Une sélection de mes travaux

Trois missions clients et AppHalt, un produit macOS que je conçois et développe.

La recherche a orienté un choix concret : montrer le reste à charge d’abord, puis expliquer sa composition sans perdre le détail.

Explorer mes réalisations
Malakoff HumanisParcours de l’espace client

Comprendre les usages.
Repenser l’espace client.

Mon rôle : UX Designer. Recherche utilisateur et conception des parcours et interfaces pour la refonte de l’espace client, sur ordinateur et mobile.

Livré

Parcours de remboursement et démarches intégrés à l’espace client

sur ordinateur et mobile
Explorer mes réalisations
Planche de présentation de l’espace client Malakoff Humanis
Planche de présentation du projet

Recherche utilisateur et conception UX. Écrans adaptés pour le portfolio.

Malakoff HumanisVoir le projet en détail
Cetelem

J’ai conçu et testé un préremplissage qui explique les données partagées avant la connexion et conserve la saisie manuelle. Prototype non déployé.

Explorer mes réalisations
BNP Paribas Personal Finance

De l’atelier à l’interface.

Préremplir une demande de crédit, tout en laissant la personne décider quelles données partager.

Mon rôle · Cadrage UX, wireframes & interface

Prototype testé, non déployé · écrans présentés pour le portfolio

Préparer la séquence · l’explication complète reste disponible plus bas

UX · Wireframes & interfaces

CetelemVoir le projet en détail
Les écrans, sans animation
01

Poser les questions

Comment réduire la saisie tout en expliquant clairement ce que le client autorise ?

Interface de préremplissage avec consentementAgrandir
02

Structurer les choix

Préremplir avec l’accord du client, expliquer les données partagées et conserver la saisie manuelle.

Information sur la connexion et les données transmisesAgrandir
03

Concevoir les écrans

L’atelier mène au wireframe puis à une interface de demande de crédit. Les choix de saisie restent explicites tout au long de cette démonstration.

Interface de sélection bancaireAgrandir

Une décision testée, pas une conversion revendiquée. Les tests ont confirmé l’intérêt du temps gagné. L’interface explique le partage des données et propose la saisie manuelle. Ce prototype n’a pas été déployé.

Captures produit authentiques. Atelier et wireframes reconstitués pour expliquer les choix de conception. Démonstration sans connexion réelle.

Un prototype testé · d’autres parcours conçus

Choix éclairé. Bénéfice, données partagées et saisie manuelle expliqués avant connexion.

Chez Apple France et Orange, un autre enjeu : garder les repères de la commande jusqu’au financement.

Les parcours partenaires Allianz Trade

J’ai relié le paiement acheteur et le suivi marchand autour d’un même repère : la commande, son statut et la prochaine action.

Explorer mes réalisations
Allianz Trade

Refondre une solution de paiement B2B.

De l’audit au parcours acheteur et à l’espace de gestion marchand.

Audit et tests utilisateurs

Repartir
de l’existant.

Audit et tests : remboursements et réglages trop complexes.

Architecture & wireframes

Une commande.
Deux parcours.

Un repère commun pour l’acheteur et le marchand.

Interface acheteur

Choisir
en confiance.

Conditions avant validation. Une alternative accessible.

Espace marchand

Voir la suite.
Savoir agir.

Échéancier, remboursement et prochaine action réunis par commande.

Résultat du projet

Une nouvelle version,
mise en production.

Un parcours acheteur et un espace marchand reliés par une commande.

Refonte UX et améliorations techniques menées en parallèle.

Allianz TradeVoir le projet en détail
Mon rôle

De la recherche à la livraison

J’ai pris en charge l’ensemble du design : audit de l’existant, tests utilisateurs, architecture, parcours acheteur, espace de gestion marchand, UI web/mobile, prototypage et accompagnement du développement. Les wireframes et interfaces sont reconstitués pour expliquer les choix de conception.

Enjeu B2B

Servir l’acheteur et le marchand

Les clients avaient besoin d’un paiement sûr, mais aussi d’une gestion plus simple des commandes, remboursements, automatisations et litiges.

Solution livrée

Relier paiement et pilotage

Le parcours couvre le paiement côté acheteur et, côté marchand, le suivi des commandes, des paiements échelonnés, des incidents et des impayés.

Nouvelle version mise en production. Les interfaces présentées ici sont reconstituées pour le portfolio ; aucun taux d’adoption vérifiable n’est publié.

AppHalt

AppHalt Produit personnel · macOS

J’ai conçu et développé AppHalt pour mettre les apps inactives en pause sans fermer leurs fenêtres, puis les reprendre quand on en a besoin.

Découvrir AppHalt
  1. 01 · Le constat

    Des apps restent actives. Même oubliées.

    Certaines consomment encore des ressources et de la batterie. Je voulais pouvoir les mettre en pause sans perdre mes fenêtres.

  2. 02 · L’idée

    Mettre en pause. Sans fermer.

    Je choisis une app à mettre en pause sans la fermer. Les exclusions protègent les activités essentielles ; je peux reprendre l’app à tout moment.

  3. 03 · Du wireframe au produit

    Voir l’état. Agir. Reprendre.

    Du premier wireframe au Dashboard, j’ai gardé trois repères ensemble : l’app choisie, son état et l’action possible.

  4. 04 · Le produit

    La pause, à portée de main.

    Le Dashboard montre l’activité des apps et permet de suspendre celle que je sélectionne, sans la fermer.

    9 332téléchargements
AppHaltVoir le projet en détail
Mon parcours

Parcours & expériences

De la recherche au produit.

Depuis 2016, je conçois des parcours et des interfaces avec les équipes produit, métier et développement. Finance, assurance, paiement B2B : des sujets où la clarté compte. Avec AppHalt, je porte aussi un produit de sa conception à son développement macOS.

Consulter mon CV (PDF)

Expériences clés

  1. 2026
    BNP Paribas Personal Finance

    Senior Product Designer

    Financement, consentement et parcours partenaires.

  2. 2025
    Allianz Trade

    UX/UI Designer

    Paiement B2B : relier les besoins des acheteurs et des marchands.

  3. 2023–2024
    BNP Paribas Personal Finance

    Senior UX/UI Designer

    Financement, de la demande aux interfaces.

  4. 2020–2023
    Malakoff Humanis

    UX Designer

    Refonte de l’espace client, recherche et conception UX.

  5. 2016–2020
    Indépendant

    UX/UI Designer

    Missions pour Colas, Nexter et Adopte un Bureau : refonte de parcours, wireframes, prototypes et interfaces.

CONCEPTION & PROTOTYPAGE

Comment j’utilise l’IA

Pour trier des informations, comparer des solutions et donner vite forme à une idée. Je garde la main sur le problème, le choix et les tests.

Exemple fictif : choisir entre préremplissage et saisie manuelle dans une demande en ligne. Ces supports illustrent ma méthode, pas un résultat client.

Comprendre

Des notes au problème.

Je demande à l’IA de regrouper des notes par difficulté : données partagées, choix et retour arrière. Je vérifie chaque thème dans les notes de départ.

Entrée · notes fictives
« Quelles données seront partagées ? »« Puis-je saisir moi-même ? »« Puis-je revenir sur mon choix ? »
Sortie · question de conceptionComment expliquer le partage avant de demander un choix ?

Mon contrôle · Je corrige les regroupements et écarte les conclusions sans trace dans les notes.

Explorer

Deux pistes à comparer.

À partir de cette question, je fais proposer deux structures : une page complète ou une explication suivie du choix. Je garde la saisie manuelle dans les deux.

Deux wireframes
Tout sur une page
ChoixInformationsConfirmation
Par étapes À tester
ComprendreChoisirConfirmer
Ce qui changeL’explication précède le choix.

Ma décision · Explorer l’explication avant le choix ; sa compréhension reste à tester.

Prototyper

Un écran à éprouver.

Je transforme la piste en prototype avec l’IA, puis je corrige les états : choisir, revenir et continuer. Le code produit sert de support aux vérifications.

Prototype de travail
Votre demande
Étape 1 sur 3Comment remplir la demande ?
Préremplir mes informations
Saisir moi-même
Quelles données partager ?
Continuer

À vérifier · Comprendre les données partagées, choisir la saisie manuelle et revenir au choix, au clavier et sur mobile.

1 / 3
Contact · Paris · Travail hybride

Et si on travaillait
ensemble ?

Vous recrutez, vous faites évoluer un produit ou vous souhaitez en savoir plus sur un projet ? Parlons-en. Je peux aussi vous présenter d’autres travaux.

Mon profil LinkedIn (nouvel onglet)

M’écrire

Adresse email et message obligatoires.

Quelques mots sur le poste, la mission ou le produit dont vous souhaitez parler.

Ces informations servent uniquement à vous répondre. Confidentialité

En haut