A. Quelques notions de base

La Publication Assistée par Ordinateur, plus communément appelée PAO, désigne l’ensemble des techniques et logiciels utilisés afin de préparer divers documents graphiques. Sa maîtrise est devenue de plus en plus essentielle dans les métiers du marketing et de la communication, et ce même si vous n’avez pas pour vocation de devenir graphiste ou designer. En effet, les fonctions et utilisations de ces différents logiciels vous permettront de réaliser de nombreux supports aux destinations multiples, mais seront également très utiles dans le cadre d’une création de site web ou d’une gestion quotidienne de ce dernier.

Si la PAO regroupe énormément d’outils, les plus populaires et utilisés au quotidien sont ceux qui constituent la suite Adobe, parmi lesquels on retrouve Photoshop, InDesign ou Illustrator. Nous nous attarderons dans ce cours plus particulièrement sur les deux premiers, dont vous pourrez rapidement maîtriser les principaux outils vous permettant de créer des visuels de communication simplement. La maîtrise d’Illustrator sera davantage complexe et liée au design pur et dur, aussi ce logiciel sera plutôt exploré en cycle de Ms.

S’il est possible d’étendre les fonctionnalités de chaque logiciel pour y réaliser à peu près tout ce que l’on veut, chacun d’entre eux a été conçu afin de répondre à un besoin particulier.

• Photoshop, la star de la PAO

Connu de tous, Photoshop est un logiciel de retouche d’images. Il permet de faire des montages, de modifier des photographies tant au niveau de leur aspect que de leurs couleurs, mais également, et c’est surtout sur cet aspect qu’il a pu construire sa réputation, de retoucher et corriger les imperfections de nos photographies. Très utilisé dans le monde de la mode ou de la beauté, Photoshop a pu faire face à de nombreux détracteurs…

Au-delà de cet aspect, Photoshop se présente également comme un excellent outil de design web. Adapté à la résolution propre au web, il vous permettra de créer des outils de communication comme des bannières ou habillages de site. C’est sur cet aspect-là que nous pourrons notamment nous concentrer dans ce cours.

• InDesign, le roi du print

InDesign est un logiciel de mise en page. Il va vous permettre de travailler sur des outils print, c’est-à-dire destinés à l’impression, comme des affiches, des flyers ou des brochures. Intuitif, il pourra vous permettre de travailler simplement en haute définition, et comprendra tous les différents paramètres liés aux contraintes d’impression que vous imposera votre imprimeur. Nous verrons en effet que nous ne travaillerons pas du tout de la même façon un fichier destiné au web et un fichier destiné à l’impression.

• Illustrator, l’outil des plus créatifs

Illustrator est, comme son nom l’indique, un logiciel de création d’illustrations. Il s’agit d’un outil de design pur, sur lequel il est possible de créer des logos, des dessins… Et de concevoir ainsi ce que l’on appelle des images vectorielles, que l’on pourra modifier et redimensionner à volonté sans impact sur leur qualité, contrairement aux « images matricielles » constituées de pixels que l’on utilisera sur Photoshop. Cet outil sera surtout adapté aux graphistes purs, même si l’utilisation de ses outils principaux pourra vous être utile, notamment pour retoucher ou importer des images vectorielles, créées par ces graphistes, sur vos outils de communication.

Notez que ces trois logiciels sont complémentaires ; ils peuvent interagir. Ainsi, vous pourrez tout à fait créer une brochure sur InDesign et y importer un design spécifique créé sur Photoshop ou Illustrator. Leurs principaux outils sont relativement similaires, ainsi que leurs menus. Ils sont faits pour être utilisés ensemble, et il ne sera pas rare d’avoir ces trois logiciels ouverts en même temps sur votre ordinateur lorsque vous créerez un support donné.

On parlera de web pour désigner l’ensemble des visuels destinés à être utilisés en ligne, par exemple sur un site internet ou à l’intérieur d’un e-mail. Le print désigne quant à lui tous les visuels imprimés, hors ligne donc, comme les affiches, flyers, plaquettes de présentation, etc.

Ces deux formes de visuels ont ainsi des fonctions et des contraintes différentes, pour s’adapter à l’œil de leur spectateur. 

• Unité de mesure : Pixels VS système métrique

Sur le web, on parlera en « pixels » afin de définir la taille d’un visuel. Le pixel est une unité de mesure utilisée sur les écrans. Un pixel est rectangulaire ; et la multiplication de pixels va permettre de créer in fine une image, à la définition plus ou moins élevée.

On voit ici des visuels « pixelisés », c’est-à-dire qu’il est possible pour l’œil de voir les pixels, ou petits carrés, qui constituent l’image.

Plus une image comporte de pixels, plus sa définition est élevée. Il sera alors impossible pour l’œil de percevoir ces pixels, mais ils apparaîtront plus nettement en zoomant sur l’image :

Sur les supports print, on parlera simplement en unité de mesure classique : millimètres, centimètres, voire mètres pour les très grandes dimensions de visuels (exemple : affichage sur les quais de métro).

• Mode colorimétrique

Sur le web, on utilisera le mode colorimétrique RVB, Rouge Vert Bleu (parfois RGB, Red Green Blue).

Spécifiquement adapté aux écrans, il reprend les couleurs primaires que sont le rouge, le vert et le bleu, qui permettent à elles trois de créer n’importe quelle couleur, en fonction de leur dosage respectif. Ainsi on rentrera sur logiciel l’intensité (chiffrée de 0 à 255) du taux de rouge, vert et bleu que l’on souhaitera utiliser pour créer telle ou telle couleur. Le code R0 V0 B0 correspondra ainsi au noir, et le code R255 V255 B255 correspondra au blanc. Exemple ici pour obtenir une teinte de violet :

Pour le print, on utilisera le mode colorimétrique CMJN, Cyan Magenta Jaune Noir, ou quadrichromie.

En impression, c’est la superposition multipliée de ces 4 teintes qui va permettre de créer tout type de couleur.

Le CMJN s’exprimera aussi en codes chiffrés, représentant le pourcentage de chacune des teintes utilisées pour obtenir une couleur donnée. Reprenons ici notre teinte de violet pour voir son équivalence en CMJN :

• Résolution

La résolution d’une image représente pour ainsi dire sa qualité. La finesse d’une image va être déterminée selon sa résolution, élevée ou non. Sur le web, on aura besoin d’une résolution moins élevée que sur le print. En effet, on a sur le print besoin de travailler en haute définition, avec des visuels souvent représentés à grande échelle.

Sur nos différents logiciels, la résolution va s’exprimer en « DPI », « Dots per inch » ou « PPP », « Points par pouce » en français. Sur le web, on créera des fichiers en 72 DPI, contre 300 DPI pour le print.

Plus exactement, on a vu que les images web étaient composées de pixels, on parlera ainsi plutôt de « PPI », « Pixels per inch ». Il s’agit donc simplement du nombre de pixels présents sur un pouce de mesure sur votre image.

En impression, on parle de points, car une imprimante, pour reproduire un visuel, va superposer nos fameux points CMJN. Et là-aussi, plus il y a de points, plus la résolution sera élevée. Pour un rendu optimal et suffisamment fin, il faudra ainsi 300 points imprimés par pouce sur le visuel. Pour illustrer cela simplement, pensez à vous approcher des visuels publicitaires sur les quais de métro, si vous vous approchez réellement, vous pourrez nettement distinguer ces fameux points :

Ces différents éléments illustrent bien le fait qu’il sera absolument nécessaire de vous adapter à votre support de travail afin de produire un visuel en adéquation avec l’utilisation que vous souhaiterez en faire.

Dans tous les cas, il sera toujours primordial de créer vos fichiers avec les images les plus qualitatives possibles. Vous pouvez facilement accéder à des visuels hautes définitions libres de droit sur différents sites de banques d’images comme :

https://fr.freepik.com/
http://unsplash.com/
https://pixabay.com/fr/

Lors de vos créations de fichiers, il sera toujours impératif de respecter l’identité visuelle et la charte graphique de la marque au nom de laquelle vous communiquez. Une entreprise choisit d’exprimer ses valeurs et son positionnement à travers les couleurs qu’elle emploie, les polices de caractères… au même titre que sa tonalité de communication.

• Symbolique des couleurs

Chaque couleur véhicule un message. Il sera donc important de définir vos choix selon la symbolique de ces dernières. On n’utilisera par exemple pas du rouge pour représenter une marque liée à la quiétude ou au bien-être.

L’importance de la couleur peut par exemple s’illustrer sur cette campagne publicitaire :

Ce site de rencontre extra-conjugale joue ici sur l’interdit et « l’immoralité » de son concept, avec un visuel extrêmement provocateur permettant de faire réagir le public et de retenir l’attention, en mêlant l’infidélité aux codes visuels de la religion chrétienne : la pomme, certes, mais également la couleur. En effet le violet est à la fois une couleur historique ecclésiastique (liée notamment à la soutane violette des évêques), et une couleur symbolisant le mystère et le secret, ici relatif justement à la relation extra-conjugale.

Toujours dans cette idée de choix et d’association, certaines couleurs sont dites « complémentaires ». Les couleurs peuvent en effet être organisées en « cercle chromatique », comme suit :

Ce cercle nous indique, par opposition, les couleurs complémentaires : le rouge s’oppose au vert, ces deux couleurs sont complémentaires, de même que le bleu et l’orange ou le violet et le jaune. Elles sont complémentaires en ce sens qu’elles vont naturellement, pour l’œil humain, se mettre mutuellement en valeur. En associant géométriquement les couleurs du cercle chromatique, on va ainsi pouvoir obtenir des conditions de couleurs harmonieuses en terme de design.

Vous pourrez constater que de nombreux logos de marques utilisent la complémentarité des couleurs :

• Tendances

Le graphisme est comme tout, sujet à différentes tendances. L’harmonie et l’esthétique d’un visuel de communication n’ont rien de subjectif. Ce dernier répond à des règles et à des évolutions de tendances. Chaque année par exemple, l’entreprise Pantone, créateur historique de nuanciers, définit une couleur de l’année, qui prévoie les tendances à venir.

En 2016, les couleurs de l’année Rose Quartz et Serenity ont par exemple été particulièrement présentes, que ce soit dans le graphisme, dans la mode, la décoration…

En 2020, la couleur de l’année est le « Classic Blue ».

De la même façon, alors qu’on utilisait beaucoup de relief auparavant au graphisme, on aura dorénavant avoir une réelle tendance sur la couleur en aplat ou flat design et sur le minimalisme.

Ces différents éléments nous montrent toute l’importance de se tenir au courant des différents courants de tendances artistiques. Comme pour la mode textile, la mode graphique évolue chaque année et de nouveaux codes sont adoptés par l’ensemble des marques, qui renouvellent même parfois leur logo et leur identité en fonction de ces évolutions.

Tout comme pour les couleurs, le choix des polices de caractère, ou typographie, est essentiel afin de retranscrire tel ou tel positionnement, telle ou telle émotion.

• Familles de polices

Il existe différentes classifications des familles de polices. La plus connue est la classification Thibaudeau, qui range les différents type de police selon leur forme d’« empattement », ce dernier représentant l’extrémité des lettres :

On peut rajouter à cette classification, datant des années 1920, les typographies manuscrites, qui sont depuis quelques années très répandues, et qui ont vocation à reproduire une écriture manuelle.

Chaque famille véhicule ainsi différentes valeurs. Le secteur du luxe utilisera ainsi beaucoup de polices Elzevirs, tandis que les start-up grand public par exemple, comme Air BNB ou BlablaCar, utiliseront des polices Antiques, sans empattement (ou sans serif), plus modernes.

Si l’on reprend notre annonce du site Gleeden, on peut cette fois s’attarder sur la police utilisée :

On retrouve une police de la famille des Elzévirs, avec un empattement triangulaire. Ce choix n’est pas anodin, de même que le fait que le texte principal soit en majuscules uniquement. Toujours dans cette idée de choquer, liée à la religion, cette mise en forme renvoie immédiatement aux 10 commandements de la Bible, qui dans l’esprit collectif se matérialisent souvent comme un texte gravé sur pierre dans un style antique romain qui symbolise l’ordre formel et indiscutable.

• Tendances

En accord avec les tendances liées aux couleurs, le choix des polices va de plus en plus s’orienter vers le minimalisme. A la naissance d’internet et lors de la démocratisation des outils comme Word, on pouvait utiliser de nombreuses fantaisies, une tendance tout simplement liée à la découverte d’un outil qui nous permettait de faire des choses originales et très éloignées de ce que l’on pouvait exécuter manuellement, où ce que l’on pouvait voir dans des supports imprimés classiques comme les journaux.

Aujourd’hui le minimalisme et les polices sans empattement ont largement pris le dessus. Même dans un secteur habitué aux polices avec empattements comme les Elzévirs, on note aujourd’hui un véritable revirement de situation :

Un autre exemple probant, dans un autre registre, est celui du géant Google, dont l’évolution historique du logo représente parfaitement les différents points évoqués ci-dessus, à savoir le minimalisme, le flat design, et le sans empattement :

Le sens de lecture représente l’ordre de priorité des éléments d’un visuel, et ce vers quoi va être attiré notre œil en premier lieu. Il est en effet essentiel de trier dans vos créations les informations selon leur importance. Quel élément doit à tout prix être retenu par le spectateur ? Quel élément est le moins important ?

On va simplement pouvoir prioriser les informations grâce à la taille des différents éléments textuels, à leur couleur, leur épaisseur, le fait qu’ils soient en majuscules ou minuscules, etc.

Au-delà de l’aspect visuel, on peut structurer l’information simplement en titres, sous-titres, paragraphes, puis détails, tels que les mentions légales.

Le sens de lecture le plus naturel de l’œil humain se fera « en Z ». Mais d’autres sens de lecture peuvent exister : axial avec un simple axe central vertical ou horizontal, ou encore focalisée, en attirant l’œil sur un élément principal mis en avant (souvent utilisé en publicité pour mettre en avant le produit, par exemple un bijou).

Dans tous les cas, l’important sera d’organiser logiquement votre information, quel que soit votre support, afin que votre cible ne passe pas à côté de votre message. Dites-vous en effet qu’il y a peu de chance que cette dernière s’attarde pour regarder tous les détails de votre visuel. Il est ainsi nécessaire d’attirer son œil vers l’information principale qui retiendra son attention, suscitera sa curiosité et la poussera à consulter le reste des éléments de votre annonce.

Pour résumer, il faudra retenir que le graphisme répond à des codes stricts, qu’il faut savoir respecter afin d’obtenir un rendu optimal et professionnel. Nous terminerons cette partie avec quelques conseils, résumant ce qu’il faut faire et ne pas faire lorsque vous créez un visuel :

A faire :

– Chercher l’inspiration ! N’hésitez pas à regarder ce que font les autres et à vous en inspirer. Observez les annonces, les bannières, les brochures de votre secteur. Vous pouvez également consulter des sites où vous trouverez de nombreuses idées de visuels et vecteurs comme  https://fr.freepik.com/

– Hiérarchiser vos informations, afin d’établir directement le contact avec votre cible et d’éveiller son intérêt.

– Bien organiser vos dossiers et calques : nous parlerons des calques dans la partie dédiée à Photoshop. En graphisme, il est nécessaire d’être organisé et de bien ranger vos créations et éléments graphiques en dossiers et sous-dossiers afin de ne pas créer d’erreurs de liens sur vos fichiers comme nous le verrons.

– Sauvegarder ! Vous n’êtes pas à l’abri d’un bug de logiciel qui vous fera potentiellement perdre de longues heures de travail. Enregistrez régulièrement votre travail afin de ne pas le perdre. Les logiciels de PAO nécessitent un ordinateur adapté et suffisamment puissant, surtout lorsque l’on utilise plusieurs logiciels en même temps.

A ne pas faire :

– Trop charger vos visuels : vous risquez de perdre votre lecteur et d’obtenir un visuel qui ne sera pas harmonieux. N’oubliez pas la tendance du minimalisme, vos visuels doivent respirer et être confortables à la lecture !

– Utiliser trop de polices et de couleurs différentes : là aussi, vous risquez de saturer l’œil de votre lecteur et pourrez vite basculer vers une faute de goût inévitable. Encore une fois, l’harmonie d’un visuel est tout sauf subjectif.

– Utiliser des visuels de mauvaise qualité : que vous travailliez pour du web ou du print, essayez d’utiliser les photos et images les plus qualitatives possibles. Un visuel pixelisé ne pardonnera pas et donnera une piètre image de votre marque, peu soignée.

– Faire des choses qu’on ne maîtrise pas : mieux vaut faire des créations simples et bien maîtrisées pour avoir un rendu optimal. Ne vous lancez pas dans un détourage hasardeux ou dans un design de vecteur sans bien avoir connaissance des outils nécessaires. On apprend certes en pratiquant, mais attendez d’avoir une vraie maîtrise avant d’utiliser telle ou telle méthode dans le milieu professionnel.