Direction artistique & Charte de marque· 2026

Hezign

Direction artistique & charte de marque de l'agence Hezign

Client: Hezign
Secteur: Agence Web & Design
En ligne: hezign.fr ↗

Le contexte

En tant qu'agence web & design, Hezign se devait d'incarner son propre savoir-faire. L'identité devait être premium sans être tape-à-l'œil, directe, précise et vivante - le mouvement faisant pleinement partie de la marque. L'ensemble a été consigné dans une charte de marque v1.0 structurée en 8 sections, de l'essence de marque jusqu'aux applications réelles.

Les enjeux

Créer un symbole ownable, lisible du favicon (24 px web) au print (60 px+)
Tenir un système visuel complet : couleur, typographie, grammaire graphique et motion
N'utiliser qu'une seule couleur vive sans jamais tomber dans le tapageur
Faire du mouvement une composante de l'identité, pas un simple habillage
Documenter des règles d'usage claires (zone de protection, tailles mini, interdits)

Notre approche

Symbole à deux rubans miroir formant un « H » stylisé - précision géométrique, énergie du magenta
Système de logo complet : lockups horizontal et vertical, proposition B en Space Grotesk (esprit loader)
Palette à couleur unique : Magenta #D30F57 et gradient signature #D21158 → #E35D79 (120°), sur base sombre (Encre #0A090C, Panneau #17151A)
Système typographique à deux voix : Schibsted Grotesk (display & texte), JetBrains Mono (labels, index de section, data)
Grammaire visuelle : sparkle ✦, index de section mono, pilules 100% arrondies, rubans défilants « Featured work »
Bibliothèque de motion : assemblage des rubans au loader, tracé de contour, cascade des segments, tissage, halo au survol
Règles d'usage strictes : zone de protection ½x, tailles minimales, interdits (ne pas incliner, déformer, désaturer, fond criard)

Les résultats

8 Sections de charte

10+ Séquences de motion

Magenta #D30F57 Couleur signature

100% Système

Une charte de marque v1.0 complète et cohérente, du favicon aux applications

En détail

Un impact concret et durable

Une couleur signature ownable (magenta) posée sur une base sombre qui la laisse respirer
Un système typographique et une grammaire graphique réutilisables sur tout le site
Une identité vivante grâce aux séquences de motion (loader, hero, transitions, micro-interactions)
Des applications déclinées : header du site, carte de visite, avatar réseaux sociaux

Stack & outils