Cleyrop - Travail sur la charte graphique
CHOIX DE LA CHARTE
L’ancienne charte Cleyrop portait des lacunes en termes de diversité de couleurs, elle était vue comme “triste”, “sombre” et elle ne reflétait en aucun cas le clair-obscur et la modernité du produit de Cleyrop. Même constat concernant la typographie ainsi que tous les autres éléments graphiques de cette charte.
Cette charte comportait de nombreuses lacunes également en termes d’accessibilité et d’ergonomie. En passant sur une version 2.0, j'ai pu remettre de nombreux éléments au propre.
Les mots qui définissent la nouvelle charte sont : professionnelle - moderne - colorée - minimaliste.
L’ancienne charte Cleyrop portait des lacunes en termes de diversité de couleurs, elle était vue comme “triste”, “sombre” et elle ne reflétait en aucun cas le clair-obscur et la modernité du produit de Cleyrop. Même constat concernant la typographie ainsi que tous les autres éléments graphiques de cette charte.
Cette charte comportait de nombreuses lacunes également en termes d’accessibilité et d’ergonomie. En passant sur une version 2.0, j'ai pu remettre de nombreux éléments au propre.
Les mots qui définissent la nouvelle charte sont : professionnelle - moderne - colorée - minimaliste.
Comment j'ai procédé ?
Côté design, j'ai élaboré une veille approfondie des concurrents, puis j'ai travaillé sur 3 chartes très différentes :
- charte minimaliste : très simple, épurée, peu de couleurs. Bi-colore pour accentuer son côté eco-responsable et minimaliste poussé à l'extrême.
- charte pop mode : à destination des jeunes, elle utilise habilement des dégradés, des couleurs vives...
- charte blue salmon : avec des couleurs aimées par les fondateurs de Cleyrop, quelques illustrations et des ajouts graphiques.
Côté design, j'ai élaboré une veille approfondie des concurrents, puis j'ai travaillé sur 3 chartes très différentes :
- charte minimaliste : très simple, épurée, peu de couleurs. Bi-colore pour accentuer son côté eco-responsable et minimaliste poussé à l'extrême.
- charte pop mode : à destination des jeunes, elle utilise habilement des dégradés, des couleurs vives...
- charte blue salmon : avec des couleurs aimées par les fondateurs de Cleyrop, quelques illustrations et des ajouts graphiques.
À partir de ces maquettes types avec des écrans représentatifs de la plateforme, j'ai fait une présentation au comité de direction et j'ai pu recueillir leurs avis.
L'objectif était de garder du minimalisme mais d’emprunter habilement les couleurs de la charte blue salmon.
J'ai fait de nombreuses déclinaisons et retravaillé avec le marketing les éléments à mettre en avant.
Ensuite, j'ai choisi le détail de toutes les couleurs, la typographie et l’ensemble des éléments composants la charte graphique. J'ai proposé de nombreux écrans type de la plateforme, une fois validés, j'ai pu appliquer cette charte au design system.
L'objectif était de garder du minimalisme mais d’emprunter habilement les couleurs de la charte blue salmon.
J'ai fait de nombreuses déclinaisons et retravaillé avec le marketing les éléments à mettre en avant.
Ensuite, j'ai choisi le détail de toutes les couleurs, la typographie et l’ensemble des éléments composants la charte graphique. J'ai proposé de nombreux écrans type de la plateforme, une fois validés, j'ai pu appliquer cette charte au design system.
CHOIX DES COULEURS
Pourquoi avoir choisi le saumon et le bleu ?
Après avoir fait l’état des couleurs de nos principaux concurrents. J'ai pu m'appuyer sur le fait que le saumon était un bon moyen de nous distinguer sur le marché mais également de montrer le dynamisme et l’énergie de Cleyrop.
Le choix du bleu a été rapidement fait pour mettre le saumon en valeur, le rendre plus accessible et apporter également un peu de gaieté à l’interface ainsi qu’un côté professionnel.
À cela j'ai ajouté des couleurs complémentaires, accessibles et complémentaires du bleu et du saumon !
Pourquoi avoir choisi le saumon et le bleu ?
Après avoir fait l’état des couleurs de nos principaux concurrents. J'ai pu m'appuyer sur le fait que le saumon était un bon moyen de nous distinguer sur le marché mais également de montrer le dynamisme et l’énergie de Cleyrop.
Le choix du bleu a été rapidement fait pour mettre le saumon en valeur, le rendre plus accessible et apporter également un peu de gaieté à l’interface ainsi qu’un côté professionnel.
À cela j'ai ajouté des couleurs complémentaires, accessibles et complémentaires du bleu et du saumon !
CHOIX DE LA BARRE DE NAVIGATION
Nous souhaitions faire une barre de navigation optimisée, colorée et structurée en utilisant bien entendu les couleurs de notre nouvelle charte.
Le chevron a été directement intégré dans la barre de navigation afin de ne pas rogner de place sur le reste de la page. L’accueil du projet est disponible en cliquant directement sur son nom.
L’idée est également pour l’utilisateur de retrouver avec facilité les actions dont il pourrait avoir besoin :
- notifications
- configuration
- son profil et ses paramètres
- la version de cleyrop
- le nom du projet
Le chevron a été directement intégré dans la barre de navigation afin de ne pas rogner de place sur le reste de la page. L’accueil du projet est disponible en cliquant directement sur son nom.
L’idée est également pour l’utilisateur de retrouver avec facilité les actions dont il pourrait avoir besoin :
- notifications
- configuration
- son profil et ses paramètres
- la version de cleyrop
- le nom du projet
Déclinaisons de la charte
Cartes de visite, bannière pour les réseaux sociaux, masques powerpoint, visuel de communication pour les réseaux sociaux et signature de mail, voici les différents éléments que j'ai pu décliner.
