BTS 1 TC – M5 – Canva – Design Web
TD n°1 – Design web – Prise en main de Canva
Table des matières
1- Créer un compte..........................................................................................................................................................2
2- Gérer le tableau de bord...........................................................................................................................................3
3- Choisir un type de publication................................................................................................................................4
4- Prise en main de l’interface.....................................................................................................................................5
4.1- La barre de menu...............................................................................................................................................6
4.2- L’espace de travail au centre.........................................................................................................................7
4.3- Le menu de gauche...........................................................................................................................................7
5- Personnaliser votre design......................................................................................................................................8
5.1- Gérer les textes...................................................................................................................................................8
5.2- Gérer les images.................................................................................................................................................9
6- Exporter / Partager son design...........................................................................................................................10
7- Travail à faire.............................................................................................................................................................12
Source : Cours de Chloé Polledri
[Link]
TD n°1 – Design web – Prise en main de Canva
Canva est un studio graphique en ligne qui visuels professionnels. Connaître et maîtriser
permet de créer facilement des documents de cet outil est donc un atout pour réaliser des
toute sorte (bannière, affiche, journal, citation présentations convaincantes et percutantes.
illustrée…). La version gratuite a des limites que la
Il permet de pouvoir créer rapidement des version éducation n’a pas.
Les avantages de Canva :
• Une grande variété de modèles tant pour le digital que pour différents supports (papier, t-
shirt, mug, etc)
• Des banques d’images de qualité
• Des exports très variés
• Vous pouvez regarder le tutoriel vidéo sur la présentation
de Canva
[Link]
Page 1/12 - [Link]
1- Créer un compte
• Se créer un compte avec votre adresse mail @[Link]
1. Se rendre à l’adresse [Link]
2. Choisir « S’inscrire avec Google »
3. Rentrer vos identifiants « [Link] »
4. Éventuellement, rejoindre une équipe.
Page 2/12 - [Link]
2- Gérer le tableau de bord
Une fois connecté, vous avez accès à votre La version « éducation » vous donne accès à
espace de travail avec : pratiquement tous les outils de Canva pour la
• Vos designs : pour reprendre un travail durée de votre scolarité dans l’établissement.
commencé.
• Vos projets : pour organiser le travail Pour commencer à travailler, il ne vous reste
• Votre ou vos équipes qu’à choisir un type de publication.
• Travail de classes : pour échanger avec
vos enseignants sur les travaux en Attention à bien
cours. sélectionner le bon
• Les identités visuelles partagées avec espace en haut à
vous : couleurs, logos, polices du lycée. droite.
Page 3/12 - [Link]
3- Choisir un type de publication
Canva propose différents modèles pour une d’écran, CV, courrier, couverture de
grande variété de contenus. Une première magazine ;
sélection des formats les plus utilisés • Blogging & eBooks : couverture de
apparaît. livre, infographie ;
Si vous ne trouvez pas votre bonheur, cliquez • Marketing : poster, menu, carte de
sur la dernière icône « Plus ». Vous aurez alors visite, dépliant publicitaire;
le choix entre plus de 50 types de • Évènements : carte postale, invitation,
modèles pour tout type d’utilisation : carte, collage de photos ;
• Documents : présentation, A4, fond
• Présentations
• Canva Docs
• Tableau blanc en ligne
• Présentations
• Réseau social (Instagram,
Facebook, LinkedIn)
• Vidéos
• Impressions sur divers supports
• Sites Web
• Plus :
◦ Marketing : Affiche, Logo, Flyer, Carte de visite, Bannière, Étiquette, Carte cadeau, etc
◦ Office : CV, document A4, Agenda, Lettre, etc
◦ Infographie, Montage photo, Graphique, Couverture, Arrière-plan, Calendrier, etc
Page 4/12 - [Link]
4- Prise en main de l’interface
Lorsqu’on sélectionne un design, il s’affiche dans la partie droite de l’écran.
1- Pour le modifier dans une autre fenêtre, il suffit de cliquer sur « ouvrir dans un nouvel onglet ».
2- Pour revenir à l’accueil, il faut utiliser le menu burger à gauche.
Page 5/12 - [Link]
3- L’interface de travail est très intuitive et facile à prendre en main.
• En haut, une barre de menu pour travailler votre fichier : nommer, partager, envoyer
• Au centre, l’espace de travail où apparaît votre visuel / document
• À gauche, un menu pour personnaliser votre création
De gauche à droite, tout fonctionne avec un système de « glisser > coller » : vous glissez un
élément du menu de gauche et vous le positionnez sur votre design dans la partie de droite.
2
9 1 5 3 4
10
6
13
11
12
14
15 7
4.1- La barre de menu
Elle vous permet de travailler sur votre fichier (changer les dimensions, copier, annuler, renommer,
partager, télécharger etc.).
1. Transformation magique (Redimensionner) : Changer les dimensions de la page
2. Nommer : Cliquer sur le titre par défaut pour le modifier.
3. Partager : Partager votre design avec une équipe, un camarade, récupérer un lien de
partage.
4. Télécharger : Enregistrer au format PNG, JPG, PDF, MP4, GIF, SVG sur votre ordinateur.
5. Envoyer au professeur : Rendre un travail.
Page 6/12 - [Link]
4.2- L’espace de travail au centre
Chaque élément est directement cliquable et modifiable.
6. Dupliquer un design pour créer des variations d’un même modèle
7. Ajouter des pages vierges pour créer une brochure par exemple
8. Zoomer et dézoomer votre visuel pour évaluer l’effet d’un visuel
4.3- Le menu de gauche
Vous pouvez personnaliser les outils disponibles dans cette partie en cliquant sur « … Plus »
9. Design, il existe de nombreux modèles gratuits
10. Éléments : pour rajouter des photos, cadres, icônes, illustrations, formes graphiques
(triangle, carré, ligne …) à votre design de base
11. Texte : un choix intéressant de polices de caractères ainsi que des titres préformatés ou
des bulles de texte
12. Marque : les identités graphique de l’établissement
13. Importer : pour télécharger vos propres images.
14. Dessin : pour dessiner sur la page
15. Projets : pour accéder à vos designs.
16. Applis : pour ajouter des éléments à la barre d’outils.
Ci-dessous, quelques exemples :
Page 7/12 - [Link]
5- Personnaliser votre design
Tous les éléments du modèle choisi peuvent Si vous n’avez pas beaucoup de temps,
être modifiés, transformés, remplacés. modifier les images et les messages
uniquement.
5.1- Gérer les textes
Vous pouvez utiliser l’élément texte du menu. Vous avez le choix entre de nombreux motifs,
Canva vous propose une grande variété de textures, typos, tailles, couleurs … et vous
titres, sous-titres ou paires textuelles pouvez ensuite jouer sur la transparence et
préformatées. écrire votre propre texte.
• Vous pouvez regarder le tutoriel vidéo sur les textes dans
Canva
[Link]
4 6 8 10
1 2 3 5 7 9 11 12
14
13
1. Nom de la police 8. Espacement
2. Taille de la police 9. Transparence
3. Couleur du texte [Link]
4. Gras [Link]
5. Italique [Link]
6. Alignement [Link]
7. Liste [Link]
Page 8/12 - [Link]
5.2- Gérer les images
Pour choisir une image, taper un ou deux payantes.
mots-clés dans la barre de recherche, et Une fois que vous avez trouvé l’image
choisir parmi les photos ou illustrations. parfaite, la faire glisser sur votre dessin et la
La vaste photothèque héberge une grande déposer là où elle doit aller.
variété de sujets et de thèmes, tels que des Canva vous permet également de télécharger
images abstraites, des textures, des vos propres images et de les utiliser sur votre
paysages, des personnes et des animaux. design. Attention aux droits !
Certaines images sont gratuites, d’autres sont
• Vous pouvez regarder le tutoriel vidéo sur les images dans
Canva
[Link]
6 8 10
4 1 3 5 7 9
11
Une fois importée dans votre design, en 3. Effaceur d’arrière-plan : Supprimez
cliquant sur l’image vous pourrez l’éditer. l’arrière-plan de votre image en un seul
Canva vous propose toute une série d’outils : clic
1. Éditer l’image : 4. Ajuster : Luminosité, Contraste,
2. Filtres: contrôler l’intensité, la Saturation
luminosité, et bien plus 5. Couleur d’arrière plan : changer les
Page 9/12 - [Link]
couleurs de fond [Link] de la page
6. Rogner : conservez uniquement ce qui [Link] : Smartmockups, Photogenic,
vous intéresse Ombre portée, Cadre, etc
7. Retourner : horizontalement ou
verticalement Tous ces réglages permettent de changer
8. Transparence facilement le ton d’une image, ses couleurs,
9. Animer : Animation de l’élément son cadrage, etc...
sélectionné
Pour modifier le cadrage d’une image il suffit de la sélectionner et de double cliquer dessus.
2
1
1. Pivoter : pour faire faire une rotation à la zone sélectionnée.
2. Recadrer : après avoir double cliquer sur l’image, on peut la repositionnée dans le cadre.
6- Exporter / Partager son design
• Vous pouvez regarder le tutoriel vidéo sur les exportations
dans Canva
[Link]
1- Télécharger : Lorsqu'on cherche à produire Canva offre de nombreuses solutions :
un support de communication, la question du • Export PNG : image de haute qualité
format d'exportation est primordial. Aura-t-on • Export JPG : image de taille réduite
besoin d'une image en haute qualité • Exports PDF standard, PDF impression
imprimable ou d'un visuel léger à intégrer • Export SVG : image vectorielle
dans un e-mailing ? • Exports Vidéo MP4, GIF
Page 10/12 - [Link]
1
2- Partager : Pour travailler à plusieurs sur un document,
avec toute une équipe, un groupe ou en fournissant un lien
2
de partage.
3
3- Envoyer au professeur : Pour rendre un travail à votre
enseignant pour vérification.
Page 11/12 - [Link]
7- Travail à faire
Deux exercices vous sont proposés, au choix :
• Se créer une bannière pour LinkedIn : une image personnalisée qui vous
ressemble (pas de petit chien ou de petit chat, pas de petites fleurs...).
• Se créer une bannière pour votre site web : une photo avec un texte de présentation par
exemple.
Page 12/12 - [Link]