Dans ce cours, nous allons voir comment concevoir le diaporama sur lequel vous allez vous appuyer pour défendre un projet professionnel devant un jury, lors du passage d’un titre professionnel.
Nous allons également nous intéresser à la manière de préparer et de dérouler les commentaires qui accompagnent nécessairement ce diaporama (exposé oral).
Des ressources supplémentaires sont mises à votre disposition sur y-goguely.netboard.me/
Structurer la présentation visuelle et orale
Une présentation visuelle se conçoit et se finalise comme tout produit de communication. Une phase de documentation précède la phase de conception et de tests. Une finalisation précède la phase de publication, elle-même suivie par d’éventuelles mise à jour et un nécessaire archivage.
Utiliser un plan type
Quand on prend connaissance des modalités d’évaluation du titre concerné, un plan se dégage en fonction des contenus à présenter. Prenez connaissance du référentiel d’évaluation CDUI (document PDF) pour connaître les modalités de déroulement de la validation du titre.
Dans les titres validés par l’élaboration d’un projet (Graphiste ou Concepteur Designer UI), la structure du diaporama reprend en partie le plan du dossier de projet (dossier imprimé remis au jury).
Le diaporama, fil rouge de la présentation des données au jury, est introduit par une présentation contextualisée du candidat et de sa démarche de formation. Il est suivi par une mise en perspective professionnelle des acquis de la formation.
Optimiser le temps imparti
Le temps imparti (50 minutes de présentation et 20 minutes de débat avec le jury, pour le titre CDUI) détermine en théorie le nombre de diapositive
Il est habituel de prévoir 1 minute de commentaires par diapositive. Cependant de nombreux paramètres interviennent.
- Toutes les diapositives ne sont pas commentées de la même manière (une diapositive de titre est affichée moins longtemps qu’une diapositive présentant un processus complexe, par exemple).
- Une diapositive est parfois présentée en plusieurs fois (pour afficher de manière séquencée l’ensemble de ses contenus).
Seule la répétition chronométrée de la prestation peut donner une idée juste du temps nécessaire pour exposer images et commentaires.
Prendre en compte les spécificités des contenus présentés
La présentation d’un site Web ou d’un document accessible en ligne passe nécessairement par la consultation du site pendant la présentation. Il en est de même si il est fait référence à un travail de prototypage disponible en ligne, à votre portfolio, à un site réalisé en entreprise, etc.
Il est inutile de prévoir des diapositives montrant des captures d’écran d’un site auquel vous pouvez avoir accès depuis le poste utilisé.
Des liens, intégrés dans les diapositives, doivent permettre à l’orateur d’accéder rapidement aux sites à montrer pendant son exposé. Les captures d’écrans sont réservés à l’intégration dans les documents imprimés.
Présenter des planches imprimées
Imprimer en reprographie quelques unes des planches clés du dossier est vivement conseillé (planche de tendances — moodboard — ou planche de style — style tile, etc.).
Ces documents imprimés sont à remettre au jury en cours de présentation, au moment opportun.
Présenter des objets
Vous pouvez faire fabriquer des prototypes d’objets de communication tels que totbags ou mugs (goodies) et de présenter ces objets au jury pendant votre présentation. Des kakemonos, flags ou autres supports de communication peuvent être déployés dans la salle de présentation.
Nous verrons dans la suite du cours comment articuler paroles et diapositives. Auparavant, nous allons revenir sur la démarche de design graphique que nous avons suivie lors de nos productions en formation Com-Créa.
Utiliser les outils et plateformes d’édition appropriés
Il existe plusieurs outils permettant de réaliser des diaporamas. Ils se répartissent en différentes catégories :
- les logiciels spécialisés hors ligne (sur poste)
- les plateformes d’édition en ligne (sur le Web)
- les suites logicielles d’édition polyvalente
- les frameworks CSS dédiés à la présentation visuelle
Dans la première catégorie se trouvent l’incontournable Powerpoint et son alter ego Keynote mais aussi Impress, lié à la suite Open Office.
Dans la seconde catégorie se trouvent notamment Google Slides, Crello, Canva, Beautiful.ai et aussi Prezi ou Focusky (dans un genre différent). Il en existe de nombreux autres, gratuits ou payants.
Pour la validation du titre pro CDUI, l’outil Figma Slides est particulièrement adapté au type de contenus présentés.
Dans la troisième catégorie se trouvent les outils d’édition professionnels comme la suite Adobe ou la suite Infinity.
Dans la quatrième catégorie se trouve l’excellent Reveals (et son équivalent en ligne slides.com). Dans cette catégorie, vous disposez également de Big, de Shower, ou encore de Remark (utilisant le langage Markdown mais limité au format 4×3). Les utilisateurs du système MacOs peuvent se tourner vers Deckset (outil exclusif de stylisation de fichiers Markdown pour la projection).
Chacun(e) est libre d’utiliser l’outil qui lui convient le mieux, dans la mesure où il peut justifier que le résultat produit est bien ce qu’il comptait mettre en œuvre.
➜ Aucun défaut de conception ne pourra être mis sur le compte des limites de l’outil choisi.
Différencier slidedoc et diaporama commentée
Les nombreux gabarits de diaporama disponibles en ligne mélangent deux type de présentations visuelles : les diaporamas à lire sans commentaire et les diaporama à commenter devant un public.
Les premiers se nomment slidedocs. Ils sont présentés en détail par Nancy Duarte dans un diaporama disponible sur Slideshare. Ce sont des documents à lire à l’écran. Ils n’ont pas vocation à être projetés. Les diapositives sont chargées. Les texte sont longs. On approche ici du concept de livre électronique (e-book)… surtout quand le document fait plus de 150 pages !
Les seconds types de diaporamas sont des présentations visuelles commentées. Ces diaporamas sont destinés à être projetés et accompagnés d’un exposé oral. Les visionner sans le commentaire du présentateur prive le lecteur d’une grande partie de l’information. Les images sont impactantes, les textes sont brefs… mais il manque vraiment quelque chose !
Il est possible de se tenir à mi-chemin entre les 2 concepts. À condition toutefois de proposer des textes courts présentés de manière aérée.
Designer un diaporama
La conception d’un diaporama numérique suit les mêmes étapes que celle d’un produit imprimé ou hébergé.
- Décision
- Brief
- Documentation
- Production et structuration des contenus
- Choix du style graphique
- Maquettage, tests et affinage
- Intégration des contenus structurés
- Publication
- Mise à jour
- Archivage et débrief
On peut regrouper ces étapes par trois et ramener la démarche en trois phases : préparation, conception, publication.
La phase de préparation
Cette phase comprend le brief, la documentation et la production des contenus. Voyons ce qu’il en est concernant le diaporama à préparer.
Mener le brief technique
Le mode colorimétrique
Un diaporama projeté s’élabore en RVB. Les dimensions recommandées pour les images sont indiquées ci-dessous (tailles surlignées en gris).
Les dimensions des diapositives
Les diaporamas et documents projetés utilisent 2 ratios standards, le 16/9 et le 4/3. Nettement plus allongé horizontalement, le 16/9 est le plus moderne des deux. Le format 4/3 offre l’avantage de s’insérer dans une page A4 orientation paysage, ce qui en facilite l’édition imprimée en 1 ou 2 diapositive par page.
➜ Les résolutions des images affichées en plein écran au ratio 16/9 sont les suivantes :
- HD = 1280 x 720
- FHD = 1920 x 1080 (recommandé)
- QHD = 2560 x 1440
➜ Les résolutions des images affichées en plein écran au ratio 4/3 sont les suivantes :
- XGA = 1024 x 768
- Format non standard = 1080 x 810
- Format non standard = 1440 x 1080 (recommandé)
- U-XGA = 1600 x 1200
Les écrans des salles du Pôle Plurimédia, dans lesquelles vous projeterez votre diaporama lors du passage du titre pro, permettent la projection plein écran de diapositives 4/3. Les diaporamas au format 16/9 s’afficheront sur une moindre hauteur.
Les formats numériques de diffusion
Les logiciels d’édition de présentations numériques disposent de formats natifs. Les utilisateurs de la suite Microsoft connaissent par exemple le format PPT, en lien avec le logiciel Powerpoint.
Les plateformes d’édition en ligne proposent généralement l’export des diaporams au format PDF. C’est aussi le format utilisé pour l’exportation de diaporamas réalisés avec Illustrator ou inDesign.
Les diaporamas réalisés avec un framework CSS sont au format HTML et se gèrent comme un site Web statique.
Le format le plus simple à utiliser lors du passage d’un diplôme est le format PDF. L’affichage d’un diaporama PDF, à partir de n’importe quel poste, sera toujours conforme à votre maquette.
Se documenter
Il existe de nombreux gabarits de diaporamas disponibles en ligne, en particuliers pour leur mise en œuvre avec Powerpoint, Keynote ou Google Slides.
Il s’agit de disposer d’une référence en matière de stylisation, pour créer ensuite un diaporama qui présente une unité graphique évidente, d’une diapo à l’autre.
Canva propose aussi des templates intéressants.
➜ Il est souhaitable qu’une unité de style existe entre le diaporama et le press-book, voire entre le diaporama et le portfolio en ligne.
Produire les contenus
Adopter un plan logique
Le plan du diaporama est la structure logique sur laquelle s’appuie votre présentation visuelle et orale. Déterminé en amont de la phase de conception, ce plan sert de cadre à l’ensemble du travail effectué.
Je vous propose ci-dessous le développement d’un plan type que vous êtes libre d’adapter à votre propos.
➜ Compte tenu du temps imparti pour présenter vos diapositives et du volume d’information à transmettre, il est indispensable de se focaliser sur l’essentiel.
Le message à transmettre est le suivant : “Je suis prêt à exercer le métier de [préciser le méteier en fonction du titre visé]. En effet, j’ai acquis en formation et sur le terrain toutes les compétences requises.”
Il s’agit de répertorier les compétences clés à faire valoir pour exercer le métier visé. Ces compétences, clairement définies dans le référentiel du titre, vous permettent d’envisager un plan comportant le nombre de sections correspondantes (une section par compétence).
Une section se présente sous forme d’une suite de diapositives structurée de la manière suivante :
- Titre de section (1 diapo)
- Présentation d’une réalisation finie (1 ou 2 diapos)
- Présentation des étapes et de la méthode de conception (plusieurs diapositives)
- Présentation de la compétence acquise (1 ou 2 diapos)
Une section comprendra un minimum de trois diapositives.
Ajoutez à votre diaporamas les diapositives de début de diaporama (titre principal, sommaire et/ou intro, présentation personnelle) et les diapositives de fin de diaporama (perspectives d’avenir professionnel, conclusion, signature et/ou remerciements).
Je ne mentionne pas de nombre idéal de diapositives en lien avec la durée de l’exposé. Cela dépend d’un nombre trop élévé de paramètres inhérents à vos choix éditoriaux et d’animation.
Réalisez un plan schématique, sur une feuille de papier ou sur un support numérique. Vous pouvez aussi utiliser des adhésifs repositionnables (réels ou virtuels) pour donner corps à votre plan.
Voici un exemple de découpage réalisé dans Lino puis dans Scrumblr. Le plan est très simplifié, il ne correspond en rien à un plan type idéal !
➜ Voici une capture d’écran vous donnant quelques indications pour utiliser Scrumblr…
Collecter ou produire les images
Si vous avez bien préparé vos images pour votre portfolio en ligne, pour votre dossier de projet ou votre dossier professionnel, vous disposez déjà des images susceptibles d’être intégrées dans votre diaporama.
Collecter ou rédiger les textes
Dans une présentation visuelle commentée, l’essentiel du message verbal passe par l’oral. Le texte affiché doit être ramené au minimum et surtout ne pas être redondant avec l’image.
➜ Le texte accompagnant une image doit toujours amener des informations qui ne sont pas déductibles de la lecture de l’image.
La phase de conception
Cette phase comprend le choix du style, le maquettage et l’intégration des contenus structurés. le choix du style consiste à déterminer quelles seront les typos, les couleurs, les formes et les grilles utilisées pour la mise en page. Le maquettage inclue d’éventuelles recherches graphiques manuscrites et l’intégration peut relever du codage avec certains outils.
Choisir des couleurs contrastées
La projection sur écran opaque, en pleine journée, dans une salle dont les volets sont fermés, ne permettra jamais un affichage des couleurs aussi contrasté que sur un écran d’ordinateur.
La mise en œuvre d’un nuancier étagé allant du noir (ou très foncé) au blanc (ou très clair) est vivement recommandée. Pensez bien que le noir, votre couleur la plus foncée, ne sera jamais plus foncée que la couleur de l’écran une fois le projecteur éteint.
➜ Tout objet placé dans une diapositive sur un fond noir se trouve projeté comme flottant sur l’écran, sans que le cadre de la diapositive soit visible. Dans les salles du Pôle Plurimédia, c’est alors le tableau blanc, servant d’écran, qui devient l’espace de présentation. Un tel effet doit être maîtrisé.
Limitez vous autant que possible à 3 ou 4 couleurs (claire, moyenne et foncée ou très claire, claire, foncée et très foncée) avec un contraste de valeur entre 2 couleurs superposée d’au moins 60% pour le texte courant (ratio de contraste de 7 ou norme AAA) .
➜ En présentation visuelle, il est possible de construire des nuanciers en veillant à utiliser une couleur d’accent ou de focus. Cette couleur, généralement saturée (assez vive), est utilisée pour attirer l’attention sur certains mots ou certaines figures. C’est le rôle de la couleur rouge dans le diaporama intitulé “Les règles simples d’harmonie typographique” (voir plus bas).
Choisir une échelle typo adaptée à la lecture de diapositives
La lecture à l’écran nécessite de bien différencier les niveaux hiérarchiques entre les informations affichées.
Le choix d’une échelle typographique basée sur 1,618 (le nombre d’or) ou sur 1,5 est vivement recommandé.
➜ Sachant que la force du corps du texte courant affiché à l’écran doit être proche de 30 pt (ou 40 px), on peut utiliser les suites de Fibonacci ou de Lucas pour déterminer le corps des notes et celui des titres (2 à 3 niveaux successifs au dessus de celui du texte courant).
Sur la diapositive ci-dessus, la suite de Lucas a été utilisée pour différencier les niveaux d’information du titrage. Les valeurs suivantes se succèdent : 76pt, 123pt et 47pt.
D’autres exemples vous sont présentés dans ce document.
➜ Dans le diaporama suivant, les deux premières suites exponentielles (Fibonacci et Fibonacci x 2) sont combinées pour diversifier les niveaux de hiérarchisation.
Choix une grille de construction simple
La grille de construction est directement liée au ratio proportionnel des dimensions de chaque diapositive. La grille la plus simple à mettre en œuvre est par ailleurs une grille de carrés.
➜ Le ratio 4/3 présente naturellement une grille de 4 colonnes de 3 carrés superposés. Le ratio 16/9 présente une grille de 4 colonnes de 2 carrés superposés, à laquelle s’ajoute une rangée de 16 seizièmes de carrés (c’est un ratio de 4 par 2,25).
Une grille de 4×3 est loin d’être limitative en matière de composition. Ses agencements sont plus nombreux qu’on le pense. Une agence de design a inventorié les 892 possibilités de combiner des carrés dans une grille 4×3.
Si vous choisissez de travaillez à partir d’un template mis à votre disposition sur une plateforme en ligne, les différents modèles de diapositives proposés sont déjà construits en appui sur une grille.
➜ Le format 4/3 permet la mise en œuvre d’une grille de 16×16 rectangles aux propriétés intéressantes. Lisez le pdf ci-dessous pour plus de précisions.
Établir un juste rapport Texte/Image/Parole
Ce rapport varie en fonction des diapositives et du type de diaporama. Il est inutile de présenter des images lorsque du texte suffit (et inversement). Il est également inutile de commenter un texte dont le sens est très clair ou une image dont l’interprétation ne présente pas de difficulté.
Le dosage du texte, de l’image et de la parole donne à chaque présentation son caractère. Il n’y a pas de formule parfaite. L’alternance stricte des textes et des images est plus simple à mettre en œuvre. Il est plus facile de caler le commentaire sur les seules images et de simplement faire défiler les textes lus alors par l’auditoire.
La phase de publication
Utiliser le format pdf
Un diaporama au format pdf est facile à transmettre, à dupliquer, à sauvegarder en plusieurs lieux. Même si vous avez prévu de montrer un diaporama réalisé avec Keynote, Powerpoint ou Keynote, exportez une version pdf de votre travail. Vous perdrez vos transitions mais vous assurez vos arrières s’il vous faut déployer un plan B le jour de l’exposé !
Sauvegarder le diaporama en lieu sûr
Enregistré ou exporté au format PDF, le diaporama réalisé doit être confié au GRETA avant le passage du titre. Vous pourrez le modifier ultérieurement mais vous êtes ainsi assurés de pouvoir disposer d’une version à projeter lors de l’entretien avec le jury le jour J.
L’exposé oral
Adopter une posture et une gestuelle adaptées
Je vous invite à visionner cette vidéo pour apprendre comment vous positionner face au jury. La vidéo dure en tout un peu plus d’un quart d’heure mais vous pourrez sauter la dernière partie consacrée à la prise de parole en étant assis. Prévoyez cependant une prise de notes afin de ne rien oublier 😉
Ne jamais lire ce qui est projeté
Il est contreproductif de lire un texte affiché ou de décrire une image projetée sur l’écran. Les membres du jury sont venus avec leur tête, ne l’oubliez pas !
Gardez à l’esprit le fait que les spectateurs lisent ce qui est projeté à l’écran plus vite que vous n’êtes capable de le lire à haute voix. Ils n’ont donc pas besoin que vous leur répétiez ce dont ils viennent de prendre connaissance. La lecture d’un texte affiché est dangereusement soporifique !
S’entraîner en connaissant le plan de l’exposé par cœur
Une présentation orale se prépare comme le jeu d’un acteur-auteur sur une scène de théâtre. Il faut écrire son texte, le connaître par cœur (au moins le plan directeur) et s’entraîner… Cela prend du temps !
Je vous propose de lire les conseils rassemblés sur netboard.me à ce sujet.
Participer à la séance d’exposé blanc
➜ Il vous est proposé, avant le passage du titre, de présenter et de commenter votre diaporama face à un(e) professionnel(le). Il (elle) évaluera la manière dont vous procédez. Vous noterez les conseils qui vous seront donnés et vous effectuerez les éventuelles corrections suggérées.