Veyrac & Associés

(01) Brief

Le point de départ.

Contexte

Le cabinet perdait des appels d’offres face à des structures plus grandes, alors que ses dossiers récents valaient les leurs. Son site, bleu marine et photos de poignées de main, listait des domaines de compétence sans jamais montrer une opération. Les directeurs juridiques ne voyaient pas la différence.

Objectif

Affirmer une position, un cabinet resserré qui répond vite, et la prouver par les dossiers et les chiffres. Le site doit générer des demandes de rendez-vous qualifiées et servir de support lors des appels d’offres.

Public

Dirigeants d’ETI, directeurs juridiques et fonds d’investissement, 40 à 65 ans, qui consultent le site après une recommandation, souvent juste avant un premier rendez-vous et toujours sur ordinateur.

Contraintes

• Respecter les règles déontologiques de communication des avocats : pas de promesse de résultat, des faits vérifiables
• Dossiers anonymisés, validés un par un par les associés concernés
• Un site bilingue français et anglais pour la clientèle internationale
• Une équipe qui publie régulièrement des analyses : gestion autonome des publications

(02) Direction artistique

Laque verte et filets de laiton

« Un vert bouteille profond, des filets de laiton et un serif éditorial qui prend son temps : l’élégance d’une bibliothèque de cabinet, la netteté d’une note de synthèse. »

• Vert bouteille
• Laiton
• Éditorial
• Retenue
• Preuves
• Clarté

(03) Palette

Des couleurs qui ont un rôle.

(04) Typographie

Les voix du site.

• Titre, intitulés des dossiers, chiffres clés, sceau et esperluette géante

  Instrument Serif

  400 romain et italique

  Droit des affaires, sans détour.

  Un serif éditorial qui évoque la presse économique plutôt que le papier à en-tête. L’italique laiton sur « sans détour » porte la promesse du cabinet.

• Texte courant, nom du cabinet en capitales espacées, bouton

  Switzer

  400 et 600

  VEYRAC & ASSOCIÉS

  Aa400Aa600

  Une grotesque neutre pour les textes longs et les rôles des dossiers. En capitales espacées de 32 %, elle compose la signature du cabinet à côté du sceau.

• Années, montants, villes, libellés

  Geist Mono

  400, capitales

  2026 · 340 M€ · PARIS · LYON

  Les faits sont composés comme les références d’un dossier, alignés et sans effet. La chasse fixe sépare ce qui se vérifie de ce qui se raconte.

(05) Grille & mise en page

La structure sous l’image.

1. 01Chaque zone est délimitée par un filet laiton d’un pixel plutôt que par des fonds ou des ombres, comme les lignes d’un registre.
2. 02Une esperluette italique géante, à 9 % d’opacité, déborde en bas à droite : l’identité du cabinet tient dans un signe.
3. 03Un voile horizontal assombrit la gauche pour que le texte reste lisible sur le fond animé.
4. 04Sur mobile, l’ovale disparaît, la liste se réduit aux trois derniers dossiers et les chiffres passent à deux.

(06) Composants

Les pièces de l’interface.

• C.01

  Liste des dossiers récents

  Année, intitulé de l’opération, rôle du cabinet et montant ou issue (« 340 M€ », « 1 200 emplois », « Gagné »). Le premier dossier est marqué d’un trait laiton. C’est la preuve qui manquait à l’ancien site.

• C.02

  Sceau V&A

  Monogramme en italique dans un cercle à filet laiton, à côté du nom du cabinet en capitales espacées. Il remplace l’ancien logo à balance.

• C.03

  Ovale photographique

  Un escalier en colimaçon en bichromie laiton et vert, dans un ovale à double filet, avec l’étiquette « Siège · Paris VIIIe ».

• C.04

  Chiffres clés

  38 avocats, 1 200 opérations, 27 ans d’exercice, 4 langues de travail : des faits, sans adjectifs.

• C.05

  Bouton « Prendre rendez-vous »

  Bloc laiton à angles vifs, texte en capitales espacées : sobre, sans arrondi, cohérent avec le reste de la mise en page.

• C.06

  Lien « Rendez-vous » de navigation

  Encadré laiton toujours visible, à côté de « Paris · Lyon » en mono, dans un en-tête qui reste en haut et se resserre dès qu’on fait défiler.

• C.07

  Liste des expertises

  Sous la ligne de flottaison, cinq pratiques numérotées avec leur périmètre et le nombre d’avocats, à côté d’une citation de l’associée fondatrice. Au survol, un lavis laiton glisse sous la ligne et une flèche apparaît.

• C.08

  Choix du créneau

  Le bouton ouvre un petit panneau : trois créneaux pour un premier rendez-vous de 45 minutes, le créneau choisi se remplit de laiton et la confirmation s’affiche juste dessous.

(07) Motion

Chaque mouvement a un rôle.

• boucle

  Laque en mouvement

  Fond génératif en WebGL vert sapin avec un reflet laiton, très lent (vitesse 0,14) : on le remarque à peine, comme un reflet sur un meuble verni.

• entrée

  Titre

  Deux lignes qui sortent de leur masque à 40 et 140 ms, 1,1 s en ease-out-expo cubic-bezier(0.16, 1, 0.3, 1) : l’essentiel du trajet est fait en un tiers de seconde.

• Ovale

  transition

  Ovale

  Il se dévoile de bas en haut par clip-path à 60 ms (1,3 s, cubic-bezier(0.7, 0, 0.2, 1)) pendant que la photo dézoome lentement de 118 % à 100 % en 2,4 s.

• lecture

  Registre des dossiers

  Le filet d’en-tête s’étire de gauche à droite à 160 ms, puis chaque dossier monte à son tour (200 ms, puis +70 ms par ligne) : la liste se lit dans l’ordre où elle apparaît.

• entrée

  Chiffres clés

  Les quatre chiffres montent en dernier, de 380 à 560 ms, pour conclure la lecture.

• VisiteVisiteVisiteVisiteVisiteVisiteVisiteVisite

  boucle

  Visite simulée

  Toutes les 12 s, un visiteur fictif survole « Expertises », fait défiler jusqu’aux cinq pratiques en deux coups de molette (en-tête qui se compacte, ovale en parallaxe, lignes qui montent à leur arrivée), en parcourt trois, remonte, puis clique sur « Prendre rendez-vous » : un créneau se sélectionne et le rendez-vous se confirme. Un reflet laiton traverse lentement l’ovale.

(08) Choix expliqués

Ce qu’on a décidé, et pourquoi.

1. 01

   Choix 1 : Les dossiers avant les expertises

   Un directeur juridique ne choisit pas un cabinet sur une liste de domaines : il veut savoir ce que le cabinet a déjà fait. Quatre opérations datées et chiffrées sur l’accueil répondent avant même la première question du rendez-vous.

2. 02

   Choix 2 : Des faits, pas de superlatifs

   Les règles déontologiques interdisent de promettre un résultat. Le site n’emploie donc aucun « leader » ni « excellence » : il montre des chiffres, des années et des rôles, vérifiables et validés par les associés.

3. 03

   Choix 3 : Sortir du bleu marine

   Tous les cabinets concurrents sont bleus. Le vert bouteille et le laiton évoquent la même confiance (bibliothèque, cuir, banquier d’affaires) tout en rendant le cabinet immédiatement reconnaissable en soutenance d’appel d’offres.

4. 04

   Choix 4 : Une photo d’architecture, pas de portraits sur l’accueil

   Les portraits des associés ont leur page. Sur l’accueil, l’escalier en bichromie dit la rigueur et l’élévation sans montrer une poignée de main de plus.

5. 05

   Choix 5 : Un mouvement presque imperceptible

   Le fond bouge à une vitesse trois fois plus lente que celui d’un site grand public : il donne simplement de la profondeur au vert. Le seul mouvement visible est celui d’une visite, lente et lisible, qui montre le chemin vers les expertises puis vers le rendez-vous, sans rien ajouter de décoratif.

6. 06

   Choix 6 : Performance et sobriété techniques

   Le fond génératif ne se charge qu’après le contenu et un dégradé CSS identique le remplace sans carte graphique. La seule photo est servie en AVIF ou WebP à 640 px, chargée en différé.

7. 07

   Choix 7 : Accessibilité d’un document officiel

   Le laiton sur vert et le vélin sur vert dépassent le contraste AA. Avec « réduire les animations », la page s’affiche directement dans son état final. Les dossiers sont une vraie liste, lisible au clavier et par les lecteurs d’écran.

(09) Arborescence

7 pages, une intention chacune.

(10) Objectifs

Ce qu’on vise.

Objectifs visés — projet fictif, aucun chiffre mesuré

Demandes de rendez-vous qualifiées

+30 %

Objectif sur douze mois, mesuré sur le formulaire de rendez-vous.

Consultation des dossiers

1 visite sur 2

Au moins la moitié des visiteurs ouvrent la page Dossiers ou une fiche d’opération.

Audience internationale

20 %

Part des visites sur la version anglaise, pour soutenir les dossiers transfrontaliers.

Abonnés aux publications

800

Une base de lecteurs à constituer dans la première année.