Designer l’OS du Ledger Stax

Dans cette nouvelle édition de notre newsletter Open!, on vous parle du Ledger Stax, le nouveau produit phare de la licorne française Ledger.

Jules Bassoleil, directeur créatif et co-fondateur de Source, a collaboré étroitement pendant deux ans avec les équipes de Ledger sur ce projet. Aujourd’hui, il revient sur 9 défis Design rencontrés lors de la création de l'interface embarquée et de l’expérience utilisateur de cet appareil révolutionnaire.

Un peu de contexte

Notre collaboration avec Ledger remonte à plusieurs années : refonte de leurs sites web, de leurs apps, et de l’expérience d’onboarding.

En juin 2021, Ledger nous confie une nouvelle mission : concevoir l’expérience utilisateur et l’interface embarquée du Ledger Stax, un portefeuille physique doté d’un écran e-ink incurvé, conçu sous la coupe de Tony Fadell, inventeur de l'iPod.

Deux années de travail entièrement dédiées à l’UX/UI suivront. En 2024, le produit final arrive entre les mains des utilisateurs.

1. Comprendre le produit et ses enjeux

Qu'est-ce qu'un portefeuille physique ? Et pourquoi est-ce si important ?

En résumé, un hardware wallet stocke votre clé privée (celle qui donne accès à vos cryptos et NFTs) hors ligne, sur un appareil dédié. Contrairement aux plateformes comme Binance ou Coinbase, vous gardez ici un contrôle total et une sécurité maximale sur vos actifs numériques.

2. Analyser l’expérience existante

Notre démarche a débuté par une analyse du Ledger Nano, leur produit phare, vendu à plus de 6 millions d’unités depuis 2014.

Le Ledger Stax reprend environ 80 % de ses fonctionnalités, mais notre mission était d’aller plus loin pour améliorer l’expérience.

Les priorités : réduire le nombre d’actions nécessaires (taps) et le temps d’onboarding (les étapes de configuration avant de pouvoir utiliser l'appareil)

Une grande partie de la complexité vient de la blockchain elle-même, et de la manière dont les données sont affichées. Par exemple, signer une transaction peut être intimidant : il faut valider des informations souvent techniques et difficiles à comprendre.

3. Concevoir sans le produit final

L’un des premiers défis a été de concevoir des interfaces sans avoir accès au produit final, ni à son écran.

Pour avancer, j’ai proposé de créer des prototypes papier à l’échelle 1:1. On a pu tester les gestes, la lisibilité, l’accessibilité.

Cette approche très concrète a changé la donne. Les décideurs chez Ledger ont pu valider rapidement des concepts, même sans maquette fonctionnelle.

Résultat : un gain de temps énorme dans la définition des règles ergonomiques, et une expérience pensée pour être fluide dès les premières interactions.

4. Composer avec les contraintes de l’E-ink

Adapter nos interfaces à la technologie E-ink a apporté un autre lot de défis.
Nous avons rapidement rencontré des limites, comme une forte rémanence des images, en testant nos maquettes sur un écran aux spécifications proches du produit final.

Cela nous a poussés à revoir certains choix dès les premières versions : par exemple, éviter les fonds noirs pleins pour garantir de bonnes performances et une sécurité optimale.

5. Soigner l’onboarding, sur tous les supports

L’une de nos priorités était de proposer une expérience de bienvenue fluide, à la fois sur le Ledger Stax et sur l’app compagnon (mobile ou desktop).

Grâce à des prototypes Figma pour les deux supports, nous avons pu couvrir tous les scénarios possibles, et garantir une cohérence totale dans le parcours utilisateur, quel que soit l'appareil.

6. Travailler la fonctionnalité clé : la signature de transaction

C’est la fonction centrale d’un portefeuille crypto. Signer une transaction, c’est ce moment où l’utilisateur approuve (ou non) un transfert d’actifs. Et si l’expérience est bancale ou peu claire, cela peut provoquer des erreurs, ou même décourager l'utilisateur de compléter son transfert.

On a itéré encore et encore sur cette étape : animations, vérification d'information, optimisation des taux de rafraîchissement...

Chaque version nous a rapprochés d’un processus de signature à la fois fluide et rassurant, avec une présentation des informations claire et vérifiable par l’utilisateur.

7. Un rendu soigné jusqu’au moindre pixel

Obtenir une interface soignée sur le produit final a été un travail de précision.
Les fonts n'étaient pas de simples fichiers .otf : chaque caractère devait être converti en image bitmap (.bmp).

Nous avons donc retravaillé nos trois typographies dans le détail, pour garantir un affichage parfait sur l’écran e-ink, en équilibre entre lisibilité et esthétique.

8. Gérer des contraintes de stockage extrêmes

Le Ledger Stax embarque seulement 2 Mo de mémoire. Cela nous a obligés à concevoir une interface ultra optimisée, avec un recours stratégique aux typographies pour économiser de l’espace.

On a dû faire des choix minutieux entre police et icône pour chaque élément.

Cette phase de direction artistique a été particulièrement difficile : j’ai dû défendre une refonte complète du design initial, dont je n’étais pas satisfait.

On a passé quatre semaines à tout revoir. Les décisionnaires étaient d’abord hésitants… mais ont fini par valider la nouvelle version, bien plus aboutie.

9. Optimiser la vitesse d’affichage

Nos tests sur le device ont révélé un frein majeur : le taux de rafraîchissement de l’écran.
L’E-ink peut afficher 16 niveaux de gris, mais plus on en utilise, plus le temps de rafraîchissement augmente.

Pour améliorer les performances, on a réduit la palette de gris sur certains écrans clés, comme celui du code PIN. Résultat : un gain de près de 2 secondes au déverrouillage.

Pour conclure

Il y aurait encore beaucoup à raconter, mais ce tour d’horizon donne une bonne idée du travail accompli.

Nous avons aussi mené des tests utilisateurs poussés, créé des librairies UI, et abordé tous les sujets classiques d’un projet d’interface, qu’on n’a pas détaillés ici.

Merci de nous avoir suivis ! Restez connectés pour un prochain focus : le Ledger Flex, avec un écran encore plus petit.