Étude de cas
Lamyline. Refonte d'identité
et d'expérience
Direction artistique · Design système · UI · Communication
Comment redonner de la désirabilité à un outil de référence sans sacrifier la crédibilité qu'exigent ses utilisateurs professionnels ?
Contexte
La valeur existait.
Il fallait la rendre visible.
Lamy Liaisons publie depuis des décennies les références doctrinales du droit français. Sa plateforme numérique Lamyline donne accès à des milliers de ressources. Son interface n'incarnait plus la valeur du contenu qu'elle portait.
Le projet est né d'un constat : la proposition de valeur existait déjà, il fallait la rendre visible. Refonte complète de l'identité visuelle, du design system et des interfaces pour un outil utilisé quotidiennement par des juristes, avocats et professionnels du droit.
La problématique
Un outil sérieux est devenu désirable sans perdre sa crédibilité.
Périmètre du projet
Ce qui a été conçu
01
Identité visuelle
Logo, charte graphique, système chromatique et typographique.
02
Design system
Tokens, composants UI, règles de couverture des revues.
03
Design d'interface
SERP, actualités, responsive sur 3 breakpoints.
04
Communication numérique
Bannières display, posts LinkedIn, newsletter HTML.
Processus
Cinq phases, de la veille au prototype
Définition
Brief, veille marché, veille concurrentielle
Enquête
Interviews public cible : juristes et avocats
Conceptualisation
Moodboard, dossier créatif, ligne artistique
Système
Charte graphique, design system
Production
Prototype Figma, supports communication
La ligne artistique
Un système visuel qui s'efface
pour laisser place au contenu
Le logo
Le renvoi typographique. Ce signe circulaire des documents juridiques, associé à la lettre L, produit une forme à la fois discrète et signifiante. Il parle aux juristes sans s'expliquer aux autres.
Quatre pistes rejetées avant d'atteindre la solution : chaque exploration a renforcé la conviction que le signe devait venir du droit lui-même.
Avant la refonte
Essai 1
Essai 2
Essai 3
Logo retenu
La palette
Fond cassé
Surface principale
#F7F6F2
Bleu ardoise
Accent principal, héritage Lamy
#2A5A8A
Jaune IA
Surface dédiée à l'IA, non invasive
#FED506
Dark
Texte, surfaces sombres
#1A1917
Palette désaturée. L'accent bleu ardoise référence l'héritage éditorial Lamy sans reproduire les codes de la concurrence. Le jaune IA crée une surface distincte et non invasive pour l'intelligence artificielle intégrée à la plateforme.
La typographie
Karnov Display
IBM Plex Sans
Interface, navigation, métadonnées
Le résultat de la Cour de cassation du 14 mars précise que les conditions d'application de l'article 1382 doivent être appréciées strictement.
Design system
Un système, pas une bibliothèque
Les composants ne sont pas une liste d'éléments figés. Ils forment un vocabulaire cohérent dont chaque règle est justifiée par un usage réel. Les couvertures de revues obéissent à leur propre grammaire : 10 couleurs de domaine, SVG typographique pur, sans aucune image bitmap.
Le système a été conçu pour être transmissible : chaque décision de design est documentée dans la charte, avec sa justification et ses contre-exemples.
Les interfaces
Du contenu juridique rendu accessible
Page de résultats (SERP)
La page centrale de l'outil. Chaque résultat est une entrée dans un corpus juridique dense. Le design révèle la nature du contenu sans surcharger.
- 13 types de contenus distincts représentés
- Accordion filtres latéral, présent sans imposer
- Breadcrumb comme anatomie du résultat
- Zéro thumbnail, typographie seule
Page Actualités
L'actualité juridique exige une hiérarchie claire entre l'analyse complète et la brève. Le design résout cette distinction par la typographie seule, sans recourir à des images.
- 16 domaines du droit représentés
- Distinction actualité complète / brève par hiérarchie typographique
- Zéro image éditoriale
Responsive : 3 breakpoints
1280px+, 768–1279px, 375–767px. Le padding s'adapte, la densité d'information se réduit sans que la navigation perde en clarté.
Prototype interactif
Communication numérique
Cohérence du système
sur tous les formats
Stratégie 100% numérique. Aucun print. Lamy Liaisons a achevé sa transition vers le digital. Les formats déclinent la même tension visuelle : fond cassé, accent bleu, surface IA jaune.
Post LinkedIn · Carré
Post LinkedIn · Paysage
Bannière display · Verticale
Bannière display · Leaderboard
Bannière display · Rectangle
Éco-conception
Faire plus avec moins
Couvertures SVG typographiques
Zéro image bitmap. Chaque couverture de revue est générée par un SVG typographique, décliné sur 10 couleurs de domaine. Poids réduit, rendu parfait à toute résolution.
Composant colonne unique et variable
Un seul composant adaptatif remplace plusieurs variantes figées. Gain estimé de 20% sur les cycles de maquette. Moins de composants à maintenir, plus de cohérence.
Footer réduit à l'essentiel
De ~30 liens à 10. Le footer existant était un cimetière de liens. La réduction force à prioriser ce qui a une valeur réelle pour l'utilisateur.
"Faire plus avec moins ne veut pas dire appauvrir le produit, mais éliminer ce qui n'apporte pas de valeur."
Résultats et apprentissages
Ce que le projet visait à produire
Objectifs du projet
+30%
Satisfaction interface (objectif mesuré)
40%
Sessions avec LamyLia (taux cible)
−40%
Attrition (réduction visée)
AA
Conformité WCAG, 100% des composants
Ce que j'ai appris
La tension entre crédibilité et désirabilité n'est pas soluble par le compromis. Elle se résout par la précision. Chaque décision qui semblait "trop sobre" cachait en réalité une peur de ne pas en faire assez.
Travailler sur un outil professionnel exigeant m'a appris que la sobriété n'est pas un manque d'ambition. C'est la forme d'ambition la plus difficile à tenir.
La richesse éditoriale de Lamyline n'avait pas besoin d'être illustrée. Elle avait besoin d'espace.