Il s’agit d’une introduction de base à la conception graphique. Vous ne serez pas un designer professionnel après avoir lu ce document, mais vous serez armé de quelques trucs simples que vous pourrez faire pour améliorer l’aspect de tout ce sur quoi vous travaillez.

Je n’entrerai pas dans le détail de ces sujets. Je les présenterai plutôt et vous donnerai suffisamment d’informations pour les mettre en pratique. Il peut être judicieux de faire des recherches plus approfondies sur ces sujets car il existe de nombreuses bonnes pages qui vont beaucoup plus loin dans le détail.

Théorie

Quand la plupart des gens pensent à un bon design, ils pensent à faire quelque chose qui a l’air incroyable et pensent à tort qu’ils peuvent y arriver avec des clochettes et des sifflets. Cela peut en fait jouer contre vous. Les articles bien conçus et élégants présentent le matériel de la manière qui convient le mieux à la façon dont notre subconscient absorbe les informations et en tire un sens. Vous constaterez que les objets qui ont l’air magnifiques sont normalement très simples, mais d’une manière qui les rend nets et clairs.

Chaque fois que nous regardons quelque chose (une page web, une photo, une plante, une personne, un jardin, etc.), notre subconscient commence immédiatement à essayer de comprendre et de donner un sens à ce qu’il voit. Il veut savoir ce qui est important et ce qui l’est moins, ce qui est lié à quoi et dans quelle mesure. Cela se passe en grande partie sans que nous nous en rendions compte et nous n’avons que peu de contrôle sur ce qui se passe. Notre subconscient le fera, que cela nous plaise ou non.

Nos esprits ont évolué pour ce faire au cours de plusieurs milliers d’années et ils sont bien préparés pour le faire d’une manière particulière. Pendant la grande majorité de ces années, nous avons existé dans le monde physique réel et notre esprit est donc le plus apte à interpréter les choses et les environnements physiques. C’est pourquoi il est souvent relaxant de s’asseoir dans un jardin ou de faire une promenade dans un buisson. L’esprit est entouré de choses qu’il est naturellement apte à comprendre, il doit donc faire peu de travail et est donc heureux.

Le monde moderne est cependant assez éloigné de cela. La présentation de documents sur papier et sur écran d’ordinateur, etc. est très récente et très différente de ce que notre esprit est habitué à faire. Le subconscient doit faire beaucoup plus d’efforts pour interpréter ce qu’il voit. Normalement, nous ne le remarquons pas, mais avec le temps, il va nous épuiser.

Une bonne conception vise à travailler avec les esprits de manière naturelle pour interpréter les informations et ainsi réduire la quantité de travail qu’ils ont à faire. Les concepts présentés ci-dessous visent à atteindre cet objectif.

Couleurs

La première chose à laquelle nous devons penser avec notre matériel est la couleur. La plupart des gens ont tendance à n’ajouter des couleurs qu’en fonction des besoins et le résultat final est souvent incohérent. Si vous choisissez une palette de couleurs limitée et complémentaire dès le départ et que vous vous en tenez à ces seules couleurs, votre contenu sera beaucoup plus cohérent.

Il est facile de choisir une palette de couleurs. Le choix d’un bon schéma de couleurs est difficile. Un bon schéma de couleurs fera briller votre travail.

La couleur est un aspect important de notre esprit, qui tire son sens de ce qu’il voit. Nous savons instinctivement que le rouge est synonyme de danger ou d’avertissement, par exemple. Les bleus et les verts composent notre environnement naturel et sont apaisants. Les choses qui sont plus proches de nous sont plus brillantes et plus vives en couleur, mais à mesure qu’elles s’éloignent, ces couleurs ont tendance à s’estomper. Nous devrions nous efforcer de traduire ces caractéristiques de la couleur dans le monde réel en notre propre matière.

Schémas de couleurs préfabriqués

Une palette de couleurs est un ensemble de couleurs que vous choisissez pour votre dessin. Tous les aspects du dessin ou modèle doivent alors utiliser uniquement ces couleurs. Le nombre de couleurs dont vous aurez besoin dépendra de votre travail et de sa complexité. En règle générale, vous souhaitez un ensemble de couleurs de base, puis quelques couleurs plus riches ou plus vives et quelques couleurs plus claires (il peut s’agir de variations de vos couleurs de base ou de couleurs complémentaires).

Il existe de nombreux sites qui proposent des tas de combinaisons de couleurs préétablies par des personnes qui savent ce qu’elles font. Il peut être bon de les utiliser directement ou comme base pour les modifier et obtenir exactement ce que vous voulez.

La roue des couleurs

La roue des couleurs est un outil de base que les concepteurs utilisent pour créer des combinaisons de couleurs. Deux très bons outils sont Kuler d’Adobe et Color Scheme Designer. L’idée de base est que les 3 couleurs primaires (rouge, vert et bleu) sont espacées autour d’une roue et qu’il y a une transition régulière entre elles. Vous choisissez ensuite votre palette de couleurs en choisissant des points uniformément espacés autour de la roue.

Comme la plupart de ces choses, avec de la pratique, vous vous améliorerez, alors ne vous découragez pas si vos premières tentatives de création de couleurs ne sont pas si bonnes. Il n’est pas rare de passer une demi-heure ou plus à expérimenter et à modifier différents agencements de couleurs avant d’en trouver un qui fonctionne. Une bonne approche consiste à examiner d’autres travaux pour trouver l’inspiration et avoir une idée de la palette de couleurs générale que vous souhaitez. Ensuite, rendez-vous sur les sites de couleurs préfabriquées mentionnés ci-dessus et choisissez celles qui vous plaisent. Ensuite, rendez-vous sur les outils de la roue des couleurs pour les modifier et poursuivre l’expérience.

Profondeur

Nous pouvons utiliser l’idée de profondeur mentionnée ci-dessus (que les éléments plus proches sont plus vivants et que les éléments plus éloignés sont effacés) pour transmettre l’importance. Notre esprit considère les éléments proches comme plus importants que les éléments éloignés. Une menace par exemple qui est plus proche est beaucoup plus importante à traiter qu’une menace qui est plus éloignée. Utilisez des couleurs plus vives pour les objets importants et des couleurs plus claires pour les objets moins importants.

Typographie

Une fois que nous avons trié nos couleurs, la prochaine chose à considérer est l’aspect de notre texte. Pour la plupart des documents, le texte transmet la majorité des informations. C’est pourquoi un texte plus lisible (lisibilité) peut jouer un rôle important dans la façon dont votre matériel est considéré.

La typographie est un domaine très vaste. La typographie concerne la façon dont nous organisons et affichons le texte. Nous pouvons influencer de nombreux aspects du texte de nos documents, notamment

Police de caractères

Taille de la police – taille du texte

Leading – Espacement entre les lignes de texte

Suivi – Espacement des caractères à l’intérieur d’un mot

Affichage des caractères, en gras, en italique, etc.

La largeur de la colonne, c’est-à-dire le nombre de mots par ligne

et plus encore…

Votre objectif est de créer un texte aussi facile à lire que possible. Pour ce faire, il faut obtenir le bon mélange de tous ces éléments. Vous aurez probablement besoin d’expérimenter un peu pour le faire correctement.

Il existe de nombreuses polices différentes qui peuvent avoir un impact important sur la lisibilité. En règle générale, les polices sans empattement sont plus faciles à lire à l’écran et les polices à empattement imprimées sont plus faciles à lire. N’hésitez cependant pas à les mélanger et à les assortir. Une combinaison courante consiste à utiliser une police sans empattement pour le contenu et une police avec empattement pour les titres. Limitez également votre utilisation des polices. La plupart des concepteurs aiment travailler avec seulement deux polices sur un ouvrage. Ils peuvent en toucher trois, mais seulement en dernier recours.

Taille de la police

Trop petit, il sera difficile à lire pour vos lecteurs. Trop grand et il n’est pas beau à voir. N’ayez pas peur d’essayer votre texte un peu plus grand que la normale. Vous pourriez être surpris par la tournure qu’il prend (tant pour les titres que pour le corps du texte).

En tête

Si les lignes sont trop proches les unes des autres, cela rend le contenu trop étroit et votre esprit doit faire plus d’efforts pour rester sur la bonne ligne. Si les lignes sont trop éloignées les unes des autres, cela peut avoir pour effet de donner l’impression que votre texte est incohérent. Je trouve que l’introduction par défaut n’est généralement pas mauvaise, mais qu’elle peut être améliorée en l’éloignant un peu plus.

Suivi

Comme vous le devinez probablement, il y a un motif qui se forme ici. Encore une fois, trop proche et difficile à lire, et trop éloigné brise le flux. Parfois, les titres étant un bon exemple, jouer avec le suivi peut en fait créer de jolis effets.

Afficher

Les caractères gras, italiques et soulignés sont bons pour mettre en évidence des parties importantes de votre contenu. Comme pour les autres aspects, réduisez-les au minimum pour un meilleur effet. Idéalement, n’en utilisez qu’un ou deux au maximum.

Largeur de la colonne

Cela dépendra en grande partie de la conception générale de votre travail, mais c’est un aspect que vous devez prendre en considération. Le nombre de mots recommandé par ligne se situe entre 9 et 15, mais vous pouvez généralement vous en tirer avec un peu plus que cela si vous équilibrez vos autres aspects (police, taille de la police, tête et suivi). Si vous concevez des pages web en particulier, il est important de garder à l’esprit que les lignes s’adaptent à la largeur de l’écran. C’est particulièrement vrai de nos jours, où les grands écrans larges sont courants. Vous voulez vous assurer que vos lignes ne deviennent pas trop longues et trop lourdes.

Mettons cela en pratique

Essayez l’exemple de paragraphe ci-dessous. Par exemple, vous constaterez que si vous augmentez l’espacement des caractères, il semblera un peu étrange, jusqu’à ce que nous augmentions la hauteur de la ligne pour l’adapter.

Regardez les œuvres d’autres peuples pour trouver des exemples de bonne typographie. Les sites web de graphisme sont un bon point de départ car ces personnes ont tendance à être particulièrement douées dans leur domaine.

Structure

Le prochain point à l’ordre du jour est la structure de notre matériel. Vous devez réfléchir à l’endroit où vous placerez les différents éléments tels que les titres, les menus, etc., à leur forme et à leur taille.

Les idées suivantes concernent la façon dont notre esprit perçoit naturellement l’information et le monde qui nous entoure. Lorsque les choses sont conçues pour s’adapter à la façon dont notre esprit fonctionne, il peut alors absorber et comprendre ce qui lui est présenté avec beaucoup moins d’efforts. Lorsque nous pouvons faire cela, nous sommes heureux et c’est une bonne conception.

Théories de la perception de la Gestalt

Ce sont des observations générales sur la façon dont notre esprit tire son sens de ce que nos yeux voient. Les comprendre vous permet d’organiser votre matériel de manière à ce que les gens puissent le comprendre très facilement. Il s’agit d’un domaine assez vaste, c’est pourquoi je vais aborder ici certains des principaux points, mais je vous encourage à poursuivre votre lecture.

Fermeture

Cela consiste à prendre des indices visuels de plusieurs objets ou formes séparés qui impliquent une continuité, puis à les combiner en un seul objet.

Sur l’image ci-dessus, nous voyons un carré plutôt que 4 cercles avec un morceau enlevé.

Il le fait parce qu’un carré nous est plus commun que 4 cercles avec des morceaux enlevés et que c’est plus simple. L’esprit cherche toujours l’explication la plus simple.

Une bonne mise en page sera considérée comme un élément cohérent.

Simplicité

Parfois, c’est le contraire qui se produit. Nous avons une forme complexe, mais l’esprit peut la décomposer en une série de formes simples.

Dans l’image de gauche, voyez-vous 4 lignes, 2 lignes qui se chevauchent ou 1 élément avec 4 lames ? Dans l’image de droite, voyez-vous une forme complexe ou 3 formes simples ?

L’esprit est heureux lorsqu’il peut facilement distinguer des formes simples et régulières dans ce qu’il voit. Bien qu’il ne soit pas nécessaire de se limiter à les utiliser, les incorporer dans votre conception globale de manière subtile peut ajouter du style.

Relations

Beaucoup de gens aiment regrouper les choses à l’aide de boîtes. Le problème est que le monde naturel qui nous entoure n’a pas tendance à relier les choses en les mettant dans des boîtes. Ce n’est donc pas une façon naturelle pour notre esprit de voir les relations. Il faut beaucoup plus d’efforts à l’esprit pour traiter les boîtes.

L’esprit préfère de loin dessiner des relations à partir de caractéristiques similaires. Ce pourrait être le cas :

Des objets qui sont disposés les uns à côté des autres

Les articles de couleur similaire

Articles de taille similaire

Relations

Dans la série de points ci-dessus, je suis sûr que vous pouvez facilement distinguer trois groupes différents.

Trouvez des moyens naturels d’illustrer les relations entre les différents éléments de votre contenu et celui-ci deviendra net et élégant.

Parfois, il s’agit d’utiliser ces principes à votre avantage. D’autres fois, il s’agit de s’assurer que vous n’avez pas mis en place votre matériel pour invoquer par inadvertance l’un d’entre eux et introduire une confusion.

Structure silencieuse

Comme nous l’avons vu avec les théories de la Gestalt ci-dessus, notre esprit cherche naturellement à tirer un sens de ce qu’il voit. Ils veulent savoir ce qui est important et ce qui ne l’est pas, ce qui est lié et l’ordre dans lequel ils doivent travailler à travers les informations. La structure silencieuse cherche à empêcher notre esprit de faire cela dans des domaines où il n’est pas nécessaire. Nous y parvenons en ayant un espacement régulier autour des différentes sections de notre conception.

Lorsque les espacements sont inégaux, notre esprit décide que cela doit signifier que des relations sont présentes entre les éléments et notre subconscient s’efforce de les comprendre. Lorsque nous espacons tout de manière égale, nous disons à notre subconscient qu’il n’y a pas de signification inhérente ici pour en déduire qu’il faut plutôt se concentrer sur d’autres domaines. La quantité de travail que notre esprit doit faire est réduite et il est heureux.

Rythme vertical

Le Rythme vertical est similaire en théorie à la Structure tranquille. Nous visons à introduire une cohérence qui réduise l’effort que l’esprit doit fournir pour assimiler l’information. Cette fois-ci, nous nous concentrons sur le texte.

Imaginez un ensemble de lignes horizontales, régulièrement espacées, tracées vers le bas de la page. Si tout le texte de votre page se trouve sur l’une de ces lignes, vous avez atteint le rythme vertical.

Cela peut demander beaucoup de travail, mais le résultat peut être spectaculaire.

Ratio d’or

Le Golden Ratio est l’une de ces choses qui « fonctionnent ». On le trouve partout dans la nature et si vous l’utilisez dans vos créations, il a tendance à rendre les choses équilibrées et agréables. Nous ne savons pas vraiment pourquoi, mais il le fait, il suffit de l’accepter et d’en tirer profit.

Le Golden Ratio est de 1 : 1,61

Le Golden Ratio peut être appliqué dans de nombreux domaines de votre dessin ou modèle, notamment

Les images – faites en sorte que la hauteur et la largeur suivent le ratio (dans le portrait ou le paysage).

La typographie – augmentez la taille des titres en fonction du ratio.

Mise en page – par exemple, la colonne du menu par rapport à la colonne du contenu.

le rapport d’or de la conception graphique

Autres conseils

Voici quelques autres conseils pour vous aider en cours de route :

Restez simple – En cas de doute, trouvez les points principaux et concentrez-vous sur ceux-ci. Les cloches et les sifflets semblent cool sur le moment, mais vous devez vous demander si cela apporte vraiment une valeur ajoutée et si cela ne fait qu’encombrer les choses.

Imitez les autres – Ne vous contentez pas de copier de manière flagrante, ce n’est pas cool. Mais s’inspirer des autres, c’est bien.

Restez toujours à l’affût d’un bon design. Demandez-vous pourquoi cela fonctionne. Gardez également un œil sur les mauvais designs et demandez pourquoi ils ne fonctionnent pas.

Les concepts de conception graphique abordés ici doivent être utilisés comme des guides, et non comme des absolus. Mettez en œuvre votre projet en utilisant ces concepts, mais n’ayez pas peur de les plier ou de les casser dans les zones où ils ne fonctionnent pas bien. Par exemple, sur ces pages, j’ai utilisé le rythme vertical pour la majorité du contenu, mais cela a rendu le menu et le titre principal gênants, et j’ai donc rompu le rythme vertical en faveur d’un espacement plus net.

0 réponses

Laisser un commentaire

Participez-vous à la discussion?
N'hésitez pas à contribuer!

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *