Le travail de Charles Bordet consiste à élaborer des applications en R Shiny qui permettent à ses clients de visualiser leurs données pour les comprendre et de les utiliser à bon escient.
Je connais bien son travail, car je collabore régulièrement avec lui sur ces projets clients.
Il me sollicite souvent pour que je travaille sur les parcours utilisateurs (UX design) de ses applis, que je les rends plus agréables visuellement et/ou que les mettre aux couleurs des différentes chartes graphiques (UI design).
Et c'est aussi à moi qu'il a confié la création entière de son identité visuelle : charte graphique, logo et webdesign.
Sa demande : Avoir une identité sobre, mais fun.
La charte graphique
Le logo
Pour le logo, j'ai joué avec les initiales D et C de Data Champ' pour réaliser un "R", "R" étant le nom du langage utilisé pour la création de ses applications.
Derrière ses initiales, deux bandes vertes permettent de faire encore plus ressortir cette troisième lettre. C'est comme un bandage qui réunit deux parties d'une même lettre. Il représente le cœur du métier de Charles. C'est-à-dire : accompagner, professionnaliser et consolider des applications existantes "bricoler" par ses clients.
Les couleurs
Les couleurs de la charte graphique se veulent assez classique : Bleu foncé, bleu clair et une pointe d'orange, couleur complémentaire du bleu, pour faire ressortir certaines informations.
Le vert, presque fluo, est là pour apporter un contraste supplémentaire et du peps.
Les typographies
Il y a deux typographies principales :
- celle pour les contenus, choisie pour être très lisible
- et celle pour les titres, avec un aspect un peu plus design pour apporter de personnalité à l'ensemble, sans être excentrique non plus.
Deux autres typographies se rajoutent à ça :
- une typographie manuscrite, utiliser avec parcimonie pour apporter de la vie et une petite touche humaine à un domaine très numérique.
- Enfin, une dernière typographie est prévue. Destinée uniquement aux passages en "code" dans ses articles de blog, son usage est surtout là pour une question de compréhension.
Le site web
Pour le site web, le contenu avait été rédigé de manière très précise avant même le début du projet. La mise en page a été imaginé à partir de chaque bout de texte pour le mettre en valeur et animer sa lecture. L'objectif était de donner l'impression que Charles s'adresse directement au visiteur personnellement. Comme s'il connaissait déjà exactement son besoin.
Pour rajouter du caractère à l'ensemble, nous avons collaboré avec une dessinatrice, Aline Dessine, pour des illustrations sur mesures. Elles servent notamment à apporter la petite pointe d'humour nécessaire pour coller à la personnalité de Charles.
Ensuite, l'incroyable Diane, Mahii conception, a intégré le site en utilisant l'outil et le langage web, très spécifique, dont se sert Charles.
