Notre approche du design rend notre processus de travail plus cohérent

Legal Doctrine place l’expérience utilisateur au cœur de son système de design.Notre définition de l’expérience utilisateur est claire : il s’agit du ressenti que l’utilisateur éprouve avant, durant et après chaque interaction avec la marque Legal Doctrine.
Qu’il s’agisse de création artistique, de rédaction, et même de technologie, nos choix sont étudiés afin de garantir à l’utilisateur la meilleure expérience.Nous faisons évoluer l’aspect visuel de la marque Legal Doctrine continuellement, toujours dans le respect des règles que nous nous sommes fixées, et avec pour objectif d’enrichir l’expérience de nos utilisateurs.
La présente charte détaille notre vision et les règles qui l’entourent.

01.

02.

03.

04.

05.

06.

07.

Logo

Couleur

Typographie

Iconographie

Composition

Photographie

Impression

Le logo constitue l’un de nos actifs d’entreprise les plus précieux, distinguant notre startup de manière unique.Aspect minimaliste, épuré, aidant à le rendre instantanément reconnaissable.

Construction

Le logo est basé uniquement sur deux figures géométriques : le carré et le cercle. En plus de maintenir l’aspect épuré tout en permettant une parfaite lisibilité dans toutes les tailles et tous les contextes, chacune de ces figures possède une signification dans l’inconscient collectif.
Le carré véhicule des notions d’entreprise, de fabrication humaine et a tendance à refléter un corps stable, des actions structurées et organisées, par conséquent un sentiment de sérieux.
Le cercle représente un symbole du développement constant, d’harmonie, de la circulation d’énergie et du mouvement qui avance sans fin.
Par opposition au carré qui représente le corps, le rond symbolise l’esprit.

Zone de sécurité

L’espace libre autour du logo équivaut à 3 fois l’épaisseur du trait.

Exception

Icons App et RS. L’espace libre peut être réduit jusqu’à deux fois la largeur du trait.

Taille minimum

- Notre logo est optimisé pour s’adapter à de petites tailles sur impression et écran.

- La taille minimale : 20px de hauteur/0,7 mm de hauteur.

- À partir de 12 mm de hauteur, le logotype est affiché sans la notion “legal-doctrine.com”.

Couleur

Le logo doit être Legal Green/Slate Grey sur les fonds plus clairs et blanc sur les fonds plus foncés.

Partenariats

L’alignement des logos dans le cadre d’un partenariat doit suivre des règles d’espace claires. Une marque X est placée entre le logo LD et le logo partenaire.

Les interdits

Toute modification du logo diminue l’impact de la marque.Il est donc strictement requis d’en respecter toutes les règles d’application sans trahir la conception définie.

Nos couleurs reflètent notre dynamique optimiste et assurée en tant que plateforme legaltech. De même, elle s’accorde parfaitement avec les principes du legal design. Le “Legal Green” et sa gamme secondaire s’adaptent parfaitement aux exigences UI/UX.

Couleurs praimaires

Nos couleurs de marque principales sont le Legal Green et le Slate Grey. Le choix de ces couleurs apporte de la cohérence en lien avec le legal design et les principes d’UI/UX.

Palette et couleurs secondaires

La palette secondaire doit être utilisée avec parcimonie dans le contenu et les illustrations afin de conserver sa puissance.

Application des couleurs

Il est important de suivre les règles d’utilisation des palettes afin de maintenir la cohérence.
Le Legal Green joue un rôle capital dans toutes les communications de la marque et fournit un équilibre avec le Slate Grey.

Sur la plateforme, la palette secondaire n’est employée que pour les actions nécessitant l’introduction d’une couleur autre que le Legal Green : 
- Orange pour avertissement,
- Rouge pour erreur et notification,
-Bleu pour confirmation.

Pour tout autre type de communication, les couleurs secondaires ne sont utilisées que de manière limitée :
-Cas d’illustration,
-Animation,
-Iconographie,
-Photographie.

La palette secondaire ne doit jamais être utilisée dans la typographie, seule la palette primaire est utilisée.

Notre choix de typographie combine sérif et sans-sérif : Inspirés de l’aspect juridique de la marque, nous avons choisi la police de caractères Lora pour refléter cet aspect. Pour permettre un équilibre avec la partie « tech » de notre identité, nous avons choisi Source Sans Pro, l’une des meilleures polices Google utilisées en UX/UI.

Lora est un sérif contemporain bien équilibré avec des racines dans la calligraphie. Il s’agit d’une police de texte au contraste modéré bien adaptée au corps des textes.
Un paragraphe en Lora donnera une apparence mémorable. La voix typographique globale de Lora transmet parfaitement l’ambiance d’une histoire moderne ou d’un essai artistique.
Techniquement, Lora est optimisée pour l’UI et fonctionne aussi bien en impression.
En mars 2019, la famille a été mise à jour pour devenir une famille de polices variables.

Lora Serif

Lora Regular

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt UuVv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Lora Bold

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt UuVv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Source Sans Pro est une police sans empattement créée pour Adobe Systems. Il s’agit de la première famille de polices open source d’Adobe. 
Elle est destinée à bien fonctionner sur toutes les interfaces utilisateur.
En plus d’être est disponible en six poids (Regular, ExtraLight, Light, Semibold, Bold, Black) et dans les styles verticaux et italiques, Source Sans Pro est également disponible en tant que police variable avec des valeurs de poids continues allant de 200 à 900. 
La police possède une large prise en charge linguistique pour le script latin.

Source Sans Pro

Source Sans Pro Regular

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt UuVv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Lora Bold

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt UuVv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Lora Bold

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt UuVv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Almarai est une famille de caractères arabes modernes en 4 poids. La police a été créée pour une lisibilité et une adéquation optimales pour application UI et aussi impression.La beauté d’Almarai réside dans sa clarté et sa simplicité. Sous l’aspect géométrique de la police se trouve une stricte adhérence à la structure et aux règles calligraphiques. Les lettres ont un faible contraste et une grande ouverture dans les quatre poids. Ces caractéristiques ont été conçues pour améliorer la lisibilité de la police sur divers supports, notamment à l’écran.

Almarai

Almarai Regular

ا أ آ إ ب بـ ت تـ ة ـة ث ثـ ج جـ ح حـ خ خـ د ذ ر ز س سـ ش شـ ص صـ ض ضـ ط ظ ع عـ ـعـ ـع غ غـ ـغـ ـغ ف فـ ق ـق ك كـ ل لـ م مـ ن نـ ه هـ ـه و ؤ ي  يـ ى ئ ئـ ء

Almarai Bold

ا أ آ إ ب بـ ت تـ ة ـة ث ثـ ج جـ ح حـ خ خـ د ذ ر ز س سـ ش شـ ص صـ ض ضـ ط ظ ع عـ ـعـ ـع غ غـ ـغـ ـغ ف فـ ق ـق ك كـ ل لـ م مـ ن نـ ه هـ ـه و ؤ ي  يـ ى ئ ئـ ء

Almarai Extrabold

ا أ آ إ ب بـ ت تـ ة ـة ث ثـ ج جـ ح حـ خ خـ د ذ ر ز س سـ ش شـ ص صـ ض ضـ ط ظ ع عـ ـعـ ـع غ غـ ـغـ ـغ ف فـ ق ـق ك كـ ل لـ م مـ ن نـ ه هـ ـه و ؤ ي  يـ ى ئ ئـ ء

Material Icons

Les Material icons sont conçues pour être simples et modernes.
Chaque icône est réduite à sa forme minimale pour représenter les concepts universels couramment utilisés dans les interfaces utilisateur. 
Assurant la lisibilité et la clarté en grandes et petites tailles, ces icônes ont été optimisées pour un bel affichage sur toutes les plateformes et résolutions d’affichage courantes.

Règles essentielles pour créer des infographies

Faire valoir un point important

Idéalement, l’infographie délivre un message unique et cohérent.
Chaque infographie est conçue pour éclairer un fait ou pour diriger le spectateur vers une conclusion qu’il n’aurait pas atteinte autrement.

Utiliser des combinaisons simples de couleurs primaires

En règle générale:

Utiliser moins de couleurs secondaires que de couleurs primaires,Si l’ajout d’autres couleurs secondaires est nécessaire, il ne dépassera pas deux couleurs.

Espacez-le!

L’espace blanc est un élément fondamental d’une bonne conception. Une infographie encombrée n’est pas une bonne infographie.

Utiliser une espace négative pour guider le lecteur d’un point à un autre jusqu’à ce qu’il arrive à la conclusion.

L’équilibre et l’harmonie priment. Le lecteur ne doit pas être submergé ou ennuyé par un flot d’informations.