Au Pied Levé - À Main Levée

APL-AML est une monographie fragmentée en plusieurs billets pour des raisons de volume.
Un billet SYNOPSIS et un billet SOMMAIRE agrègent tous les billets du blog via des liens hypertextes.

■ ■ ■ SOMMAIRE DU BILLET ■ ■ ■

• Identité visuelle d’une application, de ses développements
• Quelles sont les composantes d’une identité visuelle ?
• Comment construire une identité visuelle efficace de ses développements ?
• 10 conseils pour construire son identité visuelle

■ Identité visuelle d’une application, de ses développements

L’identité visuelle ne concerne pas seulement le logiciel en tant que produit fini mais également toutes les composantes de ses développements.

L’identité visuelle d’une application, de ses développements, c’est ce qui les caractérise, c’est la manière d’exprimer leur identité, de transmettre leurs valeurs.

• Elle s’exprime par le logo, par la typographie utilisée, par le choix des couleurs mais aussi par des règles de mise en page, par le design.
• Elle véhicule une image et constitue un élément essentiel pour en faciliter l’approche.
• Elle résulte de la vision que s’en fait le développeur.

■ Quelles sont les composantes d’une identité visuelle ?

1. Le nom de l’application, son logo
   
   Le logo est la base d’une identité visuelle, ne serait-ce que parce qu’il est présent partout, sur tous les supports de communication. Un logo réussi est un logo qui parvient à évoquer avec très peu d’éléments graphiques les valeurs et le positionnement de l’application. Un logo doit être facilement mémorisable, ce qui suppose qu’il soit compréhensible, donc simple. Il doit aussi être déclinable (version noir et blanc / version couleurs, toutes les tailles), pour qu’il s’adapte à tous les supports.
   
   Application Formation Continue : |O|S|M|O|S|E|
   
   L’idée était de trouver un nom d’application relativement court qui traduise la participation, l’investissement, la confiance, la complicité de chaque intervenant, qu’il soit utilisateur, gestionnaire ou développeur, un nom que chacun puisse s’approprier. Le nom trouvé (OSMOSE), je me suis aperçu que chaque lettre le composant pouvait correspondre à l’initiale d’un mot et que les trois premiers mots faisaient écho aux trois grandes fonctionnalités de l’application :
   

   Code :

   Sélectionner tout - Visualiser dans une fenêtre à part

   1
   2
   3
   4
   5
   Organisation   -> GESTION + BUDGET
   Statistiques   -> BILANS
   Mise en Œuvre  -> RENTRÉE
   Stages 
   Éducation Nationale

   Afin de concrétiser l’idée des initiales, j’ai séparé chaque lettre par un pipe en m’inspirant du logo |F|I|A|T|.
   
   Travaillant en mode caractère, la graphie du nom était immédiatement reconnaissable. Il restait à trouver une image symbolique forte et j’ai pensé aux Yin et Yang qui symbolisent deux composantes différentes d'une dualité en général opposées et complémentaires.
   
   Application Examen-Concours : Ex&Co
   
   Dans le même esprit, Ex&Co s’est tout de suite imposé comme nom d’application mais pas comme nom de BDD car le logogramme « & » (esperluette) est un caractère spécial sous unix qu’il faut protéger, ce qui complique trop la gestion au quotidien.
   
   En soulignant « Ex » et « Co », je transforme ces deux composantes en plateaux de la balance de Thémis, symbole de l’équité, avec le logogramme « & » comme fléau.
   
   L’image symbolique est toute trouvée avec le logogramme « & » qui résulte de la ligature des lettres de la conjonction de coordination « et ».
   
   
2. La typographie
   
   La typographie est l’une des trois composantes utilisées pour le logo, avec le symbole et les couleurs. Mais, bien au-delà du logo, la typographie est utilisée sur tous les supports texte de communication. C’est par exemple la typographie choisie pour un site web, une application mobile, des emails, etc.
   
   Le choix de la typographie doit être particulièrement bien réfléchi. À la limite, on doit passer autant de temps à choisir une typographie qu’à créer le symbole de son logo. Son impact sur la perception de son logo est absolument décisif.
   
   Les codes pour identifier une typographie cohérente avec son identité :
   
   
   • Une police de caractères inclinée (en italique) évoque le mouvement, la souplesse, le dynamisme.
   • Une police épaisse évoque la puissance, la force.
   • Une police fine évoque l’élégance.
   • L’utilisation des majuscules évoque le sérieux, la distance, le prestige.
   • L’utilisation de minuscules évoque au contraire l’affectif, la jeunesse.
   • Une police bâton (sans serif) évoque la force, la précision. Elle convient très bien pour les univers techniques ou scientifiques.
   • Une police avec empattement (serif), à l’inverse, s’adapte bien au domaine artistique. Elle symbolise le raffinement, la tradition, la douceur.
   
   
3. Les couleurs
   
   Tout élément visuel est caractérisé par deux composantes : la forme et la couleur. Le choix des couleurs n’est pas anodin dans la mesure où à chaque couleur correspond une symbolique bien précise, des codes émotionnels et culturels.
   
   
   • Le vert symbolise la nature, l’environnement, l’humanisme aussi.
   • Le bleu évoque la sécurité, la confiance, d’où son utilisation très fréquence sur les sites de banques par exemple.
   • Le violet est souvent associé quant à lui à la créativité et au luxe.
   • Le rouge évoque la passion et l’audace, etc.
   
   Pour connaître la symbolique associée à chaque couleur :
   
   Comment choisir les couleurs de votre site internet (impact psychologique et exemples).
   
   Un conseil : pour le logo, ne pas dépassez trois couleurs. Au-delà, cela rend son logo peu lisible, difficilement compréhensible et donc difficilement mémorisable.
   
   
4. La mise en page
   
   La mise en page désigne la façon d’organiser les éléments graphiques sur un support de communication : une carte de visite, un site internet, une application mobile, une carte de vœu, un email, une affiche promotionnelle, etc. La mise en page des supports de communication joue un rôle clé. L’identité visuelle de son application n’est pas seulement définie par les éléments graphiques utilisés, mais aussi par la manière dont ils sont organisés entre eux. Pour donner une image positive de son application, la mise en page doit être soignée sur tous les supports. Choisir la déclinaison du logo qui convient le mieux au support.
   
   
5. Les formes, les pictogrammes et les signes
   
   L’identité visuelle se compose également des petits éléments disséminés à droite et à gauche : petites formes, pictogrammes, icônes, signes. Privilégier les icônes et les signes précis et simples. Utiliser à chaque fois le même signe. Par exemple, si l’on utilise des flèches, utiliser toujours la même forme de flèche.

■ Comment construire une identité visuelle efficace de ses développements ?

• Influencer positivement la manière dont le lecteur les perçoit,
• Trouver un compromis entre le rationnel et l’émotionnel
  
  • Parler au cerveau : montrer clairement la réalité fonctionnelle du développement
  • Parler au cœur : susciter de l’intérêt, de la curiosité et des émotions
• Rester fidèle à ses choix et à ses valeurs,
• Partager les mêmes valeurs,
• Enrichir le lecteur d’une manière ou d’une autre,
• Être cohérent avec soi-même.

■ 10 conseils pour construire son identité visuelle

• L’identité visuelle doit refléter sa propre personnalité
• Jouer sur l'émotion
• Rechercher la simplicité
• Assurer la cohérence
• Être facile à comprendre
• Utiliser une typographie en phase avec son identité
• Utiliser les bonnes couleurs
• Créer un logo qui se décline en noir et blanc
• Créer une charte graphique
• Intégrer des vidéos

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

PS : Ce billet s'inspire d'un article du site "lafabriquedunet.fr"

I-2.1. Les bonnes pratiques de développement

▲ I-2.1.3. Liste chronologique des fonctionnalités
► I-2.1.4. Charte graphique
▼ I-2.1.5. L’espace de travail improvisé du développeur APL-AML