Séance 3 · Figma · 3 h en autonomie

Vérifier et rendre

La dernière séance : tu vérifies tout le kit avec la liste de contrôle, tu corriges, tu ajoutes tes vidéos, puis tu déposes le kit du groupe sur le Drive, avant jeudi 13 h.

⏱️ 3 h en autonomie ☑ Une liste de contrôle à cocher 📁 À la fin : le kit déposé (jeudi, 13 h)

Ta progression

0% 0 / 9 parties

Version Figma du bootcamp. Elle remplace la version Affinity quand Affinity n’est pas installé sur ton poste : même projet, mêmes livrables, mêmes vérifications. Seuls les gestes changent. Tu as Affinity ? Suis la version Affinity.

Pas de nouvelle technique aujourd’hui. Tu as trois heures, en autonomie, pour vérifier ton kit point par point, corriger ce qui doit l’être, puis le déposer sur le Drive (jeudi, avant 13 h). Coche chaque case quand le point est bon : ta liste reste cochée dans ce navigateur. Un geste oublié ? Les séances 1 et 2 restent ouvertes. Ton formateur passe voir chaque groupe.

Ton plan pour les 3 heures. 0:00 parties 0 à 2 (fichiers, formats, noms) · 0:55 partie 3 (story) · 1:10 pause · 1:25 parties 4 et 5 (charte, textes) · 2:20 partie 6 (vidéos) · 2:35 parties 7 et 8 (export, dépôt).

Rassembler le kit

≈ 15 min · tout est-il là ?

✓ Terminé›

Ouvre ton dossier kit, puis ton fichier kit-… dans Figma (figma.com, tes fichiers Récents). Coche chaque case quand le point est bon.

☑ Liste de contrôle · les fichiers

Mon fichier Figma kit-commerce s’ouvre, avec mes 5 frames. kit/exports contient 5 PNG : -post, -story, -carrousel-1, -2, -3. Il n’y a rien d’autre dans exports (les vieux essais et le .zip sont supprimés). kit/photos contient mes photos du commerce (ou celles d’exemple si la séance photo n’a pas encore eu lieu). La charte validée tient sur une page (PDF ou PNG) : les 3 couleurs avec leurs codes, les 2 polices. Les pièces faites hors de Figma sont prêtes : la fiche diagnostic, le calendrier éditorial sur 7 jours, la note d’intention d’une page (avec les sources des images, polices et musiques).

Il manque un PNG ? Refais l’export : séance 2, partie 6.

Formats et poids

≈ 25 min · la bonne taille, un poids raisonnable

✓ Terminé›

Pour chaque PNG : clic droit › Propriétés › onglet Détails (Mac : ⌘+I). Lis Dimensions et Taille.

Fichier	Dimensions attendues
`commerce-post.png`	1080 × 1080
`commerce-story.png`	1080 × 1920
`commerce-carrousel-1.png`, `-2`, `-3`	1080 × 1080 chacun

☑ Liste de contrôle · formats et poids

Le post fait 1080 × 1080. La story fait 1080 × 1920. Les trois images du carrousel font 1080 × 1080. Chaque fichier pèse 4 Mo au plus.

Plus de 4 Mo ? C’est presque toujours une photo plein cadre. Exporte ce visuel en JPG (section Exporter de sa frame : remplace PNG par JPG) et compare : garde le JPG si les textes restent nets. Mauvaise taille ? Clique le nom de la frame et lis W et H dans le panneau Design (section Mise en page) ; si la frame est juste, l’export était en 2x : remets 1x et réexporte. S’ils sont faux, appelle ton formateur avant de toucher à quoi que ce soit.

Le panneau Design de Figma, défilé jusqu'en bas : la section Exporter montre une ligne 1x et PNG et le bouton Exporter suivi du nom de la frame. — Pour vérifier un export : 1x (pas 2x), et le bon format, **PNG** ou JPG (la liste à droite de 1x). Clique l’image pour l’agrandir.

Noms des fichiers

≈ 15 min · minuscules, sans accent, sans espace

✓ Terminé›

La règle : commerce-format.png. Des minuscules, des tirets, ni accent ni espace.

Oui	Non
`boulangerie-story.png`	`Story Finale V3 (2).png`
`fleuriste-carrousel-2.png`	`carrousel 2 fleuriste é.png`

☑ Liste de contrôle · les noms

Mes 5 PNG suivent la règle. Mon fichier Figma s’appelle kit-commerce.

Un nom à corriger ? Renomme la frame dans Figma (double-clic sur son nom dans Calques), puis réexporte : le nom du fichier suit tout seul. Renommer le PNG dans l’Explorateur marche aussi, mais le prochain export reprendrait l’ancien nom.

Story : la zone de sécurité

≈ 15 min · rien d’important sous l’avatar ni sous la barre de réponse

✓ Terminé›

Dans Figma, rends visibles zone-haut et zone-bas (leur œil, dans Calques), et regarde ta story.

☑ Liste de contrôle · la story

Aucun texte, logo, prix ou appel à l’action ne touche une bande rouge. Le fond va jusqu’aux bords : pas de bande blanche. J’ai masqué les deux bandes avant de réexporter. Sur le PNG exporté, il n’y a aucune bande rouge.

Cohérence de la charte

≈ 30 min · une série, pas cinq images

✓ Terminé›

Ouvre kit/exports en grandes icônes (Explorateur : Affichage › Grandes icônes) : c’est ce que verra un visiteur du compte. Puis, dans Figma, clique les formes et compare leur code (section Remplissage) à ta palette ; clique les textes et lis leur police (section Typographie). Astuce : une frame sélectionnée affiche, dans le panneau Design, la section Couleurs sélectionnées : toutes les couleurs qu’elle utilise, avec leur code. Il ne doit y en avoir que celles de ta charte (et, dans la story, le rouge des bandes de repère).

☑ Liste de contrôle · la charte

Les 3 mêmes couleurs partout (même code, pas « à peu près »). Les 2 mêmes polices partout, et seulement elles. Le nom du commerce est au même endroit, à la même taille, sur tous les carrés. Aucun texte à moins de 60 px d’un bord (un texte centré : 960 px de large au plus). Les photos ont la même lumière : pas une sombre à côté d’une claire. Le carrousel se lit comme une suite : l’image 1 donne envie, l’image 3 dit quoi faire.

Textes relus

≈ 25 min · zéro faute, zéro information fausse

✓ Terminé›

Fais relire tes textes par un autre membre du groupe, et lis-les à voix haute : l’oreille trouve ce que l’œil laisse passer.

☑ Liste de contrôle · les textes

Orthographe et accents : zéro faute, majuscules accentuées comprises (À, É). Nom, adresse, horaires et prix sont exacts (vérifiés auprès du commerce ou sur sa fiche). L’appel à l’action est faisable : passer, appeler, réserver (pas « Commandez en ligne » s’il n’y a pas de site). En petit, je lis encore l’accroche. Les photos sont les miennes, celles de mon groupe ou celles d’exemple : aucune image prise sur internet. Polices et musiques sont libres de droits, et leurs sources sont citées dans la note d’intention.

Ajouter tes vidéos au kit

≈ 15 min · les ranger et vérifier leur format

✓ Terminé›

Tes vidéos ont été tournées et montées en séance vidéo. Figma ne les modifie pas : ici, on les range dans le kit et on vérifie leur format. Une vidéo à corriger se reprend dans l’outil de montage de la séance vidéo.

Copie ta vidéo montée du téléphone vers kit/videos (même chemin que les photos : câble, OneDrive, mail à toi-même).C’est bon si elle est dans kit/videos.
Renomme-la selon la règle : boulangerie-reel.mp4.C’est bon si minuscules, tirets, ni accent ni espace.
Clic droit › Propriétés : Type de fichier. Puis onglet Détails, rubrique Vidéo : Largeur de l’image et Hauteur de l’image. Mac : ⌘+I.C’est bon si le type est MP4 (.mp4), et la hauteur est plus grande que la largeur : 1080 × 1920 (ou 720 × 1280), soit du 9:16.

☑ Liste de contrôle · les vidéos

Ma vidéo est dans kit/videos, nommée selon la règle. Elle est en MP4. Elle est verticale, en 9:16 (1080 × 1920 ou 720 × 1280), pour la story ou le reel. Elle dure de 15 à 30 secondes, et elle est sous-titrée si on y parle.

Pas encore de vidéo ? Selon ta classe, la séance vidéo peut tomber après celle-ci : coche ces cases quand elle sera prête, et dépose-la dans le dossier du groupe avant jeudi 13 h.

Dernier export

≈ 20 min · les fichiers à jour, et une copie

✓ Terminé›

Dans Figma : masque zone-haut et zone-bas. Sélectionne les 5 frames (Maj+clic dans Calques) › section Exporter › Exporter 5 calques. Extrais le .zip dans kit/exports (remplace les anciens), puis supprime le .zip.C’est bon si 5 PNG, datés d’aujourd’hui.Autre chemin : Fichier › Exporter… (Maj+Ctrl+E) à vérifier.
Copie tout ton dossier kit sur ta clé USB ou ton OneDrive.C’est bon si la copie contient photos, videos et exports. Ton fichier Figma, lui, reste dans ton compte.

☑ Liste de contrôle · prêt à rendre

Mes 5 PNG sont à jour. Tout le dossier kit est copié ailleurs que sur ce poste.

Dépose le kit du groupe sur le Drive

≈ 15 min · un dossier par groupe, avant jeudi 13 h

✓ Terminé›

Le kit se rend par groupe, sur le Drive étudiants, au plus tard jeudi 15 octobre à 13 h. Pas sur MyGES : il n’accepte pas les zip. Un membre du groupe dépose, les autres vérifient.

Ouvre le Drive étudiants, dossier 0 - RENDUS ETUDIANTS (CC - EXAMENS).C’est bon si tu vois le dossier, vide ou avec ceux des autres groupes.Pas d’accès au Drive ? Préviens ton formateur tout de suite, sans attendre 13 h.
Crée le dossier du groupe, nommé Classe_Groupe_Commerce : ta classe, ton numéro de groupe, le nom du commerce, sans accent ni espace.C’est bon si un seul dossier pour tout le groupe, à ce nom.
Dépose dedans : la charte (PDF ou PNG), les 5 PNG de kit/exports, la vidéo (MP4), le calendrier éditorial et la note d’intention (PDF, DOCX ou PPTX), la fiche diagnostic.C’est bon si tout le kit est dans le dossier.Formats attendus : PDF, PNG, JPG, MP4, DOCX ou PPTX. Pas de zip. Ton fichier Figma n’est pas demandé : il reste dans ton compte.
Ouvre chaque fichier depuis le Drive.C’est bon si chacun s’affiche. Un fichier qui ne s’ouvre pas compte comme non rendu.

☑ Dernières cases

Le dossier du groupe est sur le Drive avant jeudi 13 h, et chaque fichier s’ouvre. Je suis déconnecté de Figma sur le poste de l’école.

Jeudi après-midi

Le QCM, puis la soutenance du groupe

14 h : le QCM, seul, sur papier : 40 questions, une seule bonne réponse, 40 minutes. Il compte pour la moitié de la note du bootcamp.

Dès 14 h 45 : la soutenance du groupe, au moins 7 minutes, puis 2 à 3 minutes de questions. Chaque membre prend la parole. Tes visuels et ta vidéo en plein écran, dans l’ordre du fil.

Temps	Ce que vous montrez
1 min 30	Le commerce et le diagnostic : qui il est, où, pour qui, et ce qui manquait sur ses réseaux.
1 min 30	Le parti pris créatif : la charte (couleurs, polices, ton) et pourquoi ces choix.
2 min 30	La démonstration : le post, la story, le carrousel, puis la vidéo.
1 min 30	Le calendrier éditorial : quoi publier, quel jour, sur quel réseau, pendant 7 jours.

Répartissez les parties entre vous et répétez une fois à voix haute, chronomètre en main.

La note du groupe, la même pour chaque membre : le kit sur 15 (diagnostic 3, charte 3, visuels 4, photo-vidéo 3, calendrier 2) et l’oral sur 5 (soutenance 3, travail de groupe 2 : le carnet de bord y compte). Elle pèse l’autre moitié de la note, à côté du QCM.