Créer des conceptions et des prototypes haute-fidélité dans Figma est le cinquième cours de cette formation certifiante qui vous dotera des compétences dont vous avez besoin pour postuler à des emplois de premier niveau dans le domaine de la conception d'expérience utilisateur (UX). Dans ce cours, vous suivrez des tutoriels étape par étape pour apprendre à créer des conceptions haute-fidélité, appelées maquettes, dans Figma, un outil de conception courant. Ensuite, vous transformerez ces conceptions en un prototype interactif qui fonctionne comme un produit fini. Vous effectuerez des recherches pour recueillir des commentaires sur vos conceptions et apporter des améliorations. Enfin, vous apprendrez à partager vos conceptions avec les équipes de développement et à mettre en valeur votre travail dans votre portfolio UX professionnel.

Création de designs et de prototypes haute fidélité dans Figma

Création de designs et de prototypes haute fidélité dans Figma
This course is part of Google UX Design Professional Certificate

Instructor: Google Career Certificates
What you'll learn
Construire des maquettes et des prototypes haute-fidélité dans Figma.
Définir et appliquer des éléments et des principes de conception visuelle courants aux conceptions.
Démontrer comment les systèmes de conception peuvent être utilisés pour organiser, standardiser et améliorer les conceptions.
Comprendre le rôle des sessions de critique de conception et des commentaires lors de l'itération des conceptions.
Skills you'll gain
Tools you'll learn
Details to know

Add to your LinkedIn profile
39 assignments
See how employees at top companies are mastering in-demand skills

Build your Design and Product expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate from Google

There are 6 modules in this course
Concentrez-vous sur le Visual design, c'est-à-dire la façon dont un produit ou une technologie apparaît aux utilisateurs. Dans cette partie du cours, vous commencerez à créer des maquettes, qui sont des designs haute fidélité qui représentent un produit final. Pour créer des maquettes, vous utiliserez des éléments de Visual design, comme la typographie, la couleur et l'iconographie. Les éléments sont souvent organisés en mises en page à l'aide de méthodes telles que les grilles, le confinement et l'espace négatif. Vous appliquerez tous ces apprentissages de Visual design pour vous construire les designs de l'application mobile sur lesquelles vous avez travaillé tout au long du programme de certificat.
What's included
16 videos24 readings12 assignments1 peer review2 discussion prompts2 plugins
16 videos•Total 52 minutes
- Introduction au Cours 5 : Créer des designs et des prototypes haute-fidélité dans Figma•2 minutes
- Kunal - Mon parcours vers l'UX•3 minutes
- Bienvenue dans la semaine 1 •2 minutes
- Introduction aux maquettes •4 minutes
- Chikezie - Transition des designs basse-fidélité aux designs haute-fidélité •2 minutes
- Introduction aux éléments fondamentaux du Visual design •2 minutes
- La typographie dans le design UX•3 minutes
- L’importance de la typographie •6 minutes
- La couleur dans le design UX•8 minutes
- L’iconographie dans le design UX•5 minutes
- Ajouter des images à vos maquettes•3 minutes
- Introduction aux mises en page•1 minute
- Utiliser des grilles pour guider les mises en page •4 minutes
- Utiliser la séparation dans les mises en page•3 minutes
- Utiliser un espace négatif (blanc) dans les mises en page•4 minutes
- Synthèse : Commencer à créer des maquettes •1 minute
24 readings•Total 230 minutes
- Bienvenue dans le Cours 5•10 minutes
- Facultatif - Lire ceci s'il s'agit de votre premier cours dans le programme de certificat•10 minutes
- Facultatif - Interpréter les résultats de votre quiz•5 minutes
- Compétences de base pour construire des maquettes dans Figma•10 minutes
- Exemple d’activité : Utiliser des designs basse-fidélité pour démarrer vos maquettes de projet de portfolio•10 minutes
- Travailler avec une police dans les maquettes•10 minutes
- Ajouter le texte rédigé correspondant au produit dans les maquettes•10 minutes
- Exemple d’activité : Ajouter de la typographie aux maquettes de vos projets de portfolio•10 minutes
- Travailler avec la couleur dans les maquettes •10 minutes
- Considérations relatives à l’accessibilité pour la couleur•10 minutes
- Exemple d’activité : Ajouter de la couleur aux maquettes de vos projets de portfolio •10 minutes
- Utiliser des icônes dans des maquettes •10 minutes
- Exemple d’activité : Ajouter des icônes aux maquettes de vos projets de portfolio•10 minutes
- En savoir plus sur les éléments de Visual design •10 minutes
- Trouver des images existantes pour vos maquettes•10 minutes
- Considérations de design supplémentaires•10 minutes
- Créer des grilles dans des maquettes•10 minutes
- Exemple d’activité : Créer des grilles dans les maquettes de votre projet de portfolio•10 minutes
- Créer du confinement dans les maquettes•10 minutes
- Exemple d’activité : Créer un confinement dans les maquettes de projet de votre portfolio•10 minutes
- Utiliser l’espace négatif dans les maquettes•10 minutes
- Modèle d’activité : Revoyez les maquettes de votre projet de portfolio en ajoutant de l’espace négatif•10 minutes
- Modèles de design courants dans les applications•10 minutes
- Glossaire 1•5 minutes
12 assignments•Total 314 minutes
- Facultatif - Tester vos connaissances sur les concepts antérieurs•42 minutes
- Facultatif - Soumettre l'instruction de projet de portfolio de votre choix•30 minutes
- Activité : Utiliser des designs basse-fidélité pour démarrer vos maquettes de projet de portfolio•30 minutes
- Tester vos connaissances en typographie•8 minutes
- Activité : Ajouter de la typographie aux maquettes de vos projets de portfolio•30 minutes
- Tester vos connaissances sur les couleurs•4 minutes
- Activité : Ajouter de la couleur aux maquettes de vos projets de portfolio •30 minutes
- Activité : Ajouter des icônes aux maquettes de vos projets de portfolio•30 minutes
- Activité : Créer des grilles dans les maquettes de votre projet de portfolio•30 minutes
- Activité : Créer un confinement dans les maquettes de projet de votre portfolio•30 minutes
- Activité : Revoyez les maquettes de votre projet de portfolio en ajoutant de l’espace négatif•30 minutes
- Auto-réflexion : Partagez ce que vous avez appris sur les mises en page•20 minutes
1 peer review•Total 60 minutes
- Défi hebdomadaire 1 : Appliquer les éléments fondamentaux du Visual design aux maquettes de vos projets de portfolio •60 minutes
2 discussion prompts•Total 20 minutes
- Partager un exemple de typographie intéressante dans une application •10 minutes
- Partager un exemple d’icônes de votre application préférée•10 minutes
2 plugins•Total 25 minutes
- Créer une maquette (mockup) à partir d’éléments fondamentaux•15 minutes
- Testez vos connaissances sur le confinement et l’espace négatif dans le design.•10 minutes
Dans cette partie du cours, vous utiliserez les principes de Visual design pour affiner les maquettes. Tout d'abord, vous utiliserez l'emphase pour guider les utilisateurs vers les parties les plus importantes d'une page. Ensuite, vous appliquerez la hiérarchie, l'échelle et la proportion pour organiser les éléments sur chaque page de votre application. Ensuite, vous considérerez l'unité et la variété pour aider les éléments de votre application à fonctionner ensemble ou à se démarquer. Enfin, vous revisiterez les principes de la Gestalt, tels que la similarité, la proximité et la région commune, pour aider les utilisateurs à interpréter facilement vos designs.
What's included
8 videos11 readings7 assignments1 peer review2 discussion prompts1 plugin
8 videos•Total 29 minutes
- Bienvenue dans la semaine 2•1 minute
- L’emphase en design UX•4 minutes
- Hiérarchie dans le design UX•4 minutes
- Échelle et proportions dans le design UX•5 minutes
- Unité et variété dans le design UX•4 minutes
- Appliquer les principes de la Gestalt aux maquettes•6 minutes
- Réfléchissez à votre progression •4 minutes
- Synthèse : Application des principes de Visual design aux maquettes •1 minute
11 readings•Total 105 minutes
- Utiliser l'emphase dans les maquettes•10 minutes
- Utiliser la hiérarchie dans les maquettes•10 minutes
- Utiliser l'échelle et les proportions dans les maquettes •10 minutes
- Utilisez l'unité et la variété dans les maquettes •10 minutes
- Exemple d’activité : Appliquez les principes de Visual design aux maquettes de projets de votre portfolio •10 minutes
- En savoir plus sur les principes de la Gestalt supplémentaires •10 minutes
- Exemple d’activité : Appliquez les principes de la Gestalt à vos maquettes de projet de portfolio•10 minutes
- Envisagez des éléments et des principes de vis •10 minutes
- En savoir plus sur les principes de design d'interface •10 minutes
- Inclure la navigation dans les maquettes•10 minutes
- Glossaire 2•5 minutes
7 assignments•Total 98 minutes
- Testez vos connaissances sur l'emphase et la hiérarchie•8 minutes
- Testez vos connaissances sur l'échelle et la proportion•2 minutes
- Testez vos connaissances sur l'unité et la variété •4 minutes
- Activité : Appliquez les principes de Visual design aux maquettes de projets de votre portfolio •30 minutes
- Testez vos connaissances sur les principes de Gestalt•4 minutes
- Activité : Appliquez les principes de la Gestalt à vos maquettes de projet de portfolio•30 minutes
- Auto-réflexion : Inclure la navigation dans vos maquettes•20 minutes
1 peer review•Total 60 minutes
- Défi hebdomadaire 2 : Affinez vos maquettes de projets de portfolio•60 minutes
2 discussion prompts•Total 20 minutes
- Expliquez vos choix sur l’application des principes de Visual design•10 minutes
- Expliquez le raisonnement derrière votre application des principes de Gestalt•10 minutes
1 plugin•Total 15 minutes
- Appliquer les principes de Visual design•15 minutes
Venez explorer le monde des design systems ! Dans cette partie du cours, vous découvrirez les parties d'un design system, ainsi que les avantages de l'utilisation d'un design system. Vous examinerez les design systems de diverses entreprises et vous aurez l'occasion de les utiliser dans vos propres maquettes. Vous apprendrez également à utiliser et à créer des feuilles d'autocollants dans Figma.
What's included
9 videos5 readings5 assignments1 discussion prompt
9 videos•Total 34 minutes
- Bienvenue dans la semaine 3•1 minute
- Introduction aux design systems•3 minutes
- Avantages des design systems •4 minutes
- Le design system de Google : Material Design •5 minutes
- Le design system de Shopify : Polaris •4 minutes
- Créer une feuille d'autocollants dans Figma•4 minutes
- Utiliser une bibliothèque de design systems dans Figma•9 minutes
- Shabi - Tenir compte des technologies d'assistance lorsque l'on travaille sur les design systems•2 minutes
- Synthèse : Explorer les design systems•1 minute
5 readings•Total 45 minutes
- Explorer les design system populaires •10 minutes
- Exemple d’activité : Créez une feuille d'autocollants pour vos designs de projets de portfolio•10 minutes
- S’inspirer des design systems•10 minutes
- Facultatif - Apprendre depuis Figma - Utiliser une bibliothèque de design systems•10 minutes
- Glossaire 3•5 minutes
5 assignments•Total 104 minutes
- Défi hebdomadaire 3 : Explorer les design systems•60 minutes
- Testez vos connaissances sur les design systems•6 minutes
- Testez vos connaissances sur les fonctionnalités des design systemss open source•4 minutes
- Activité : Créez une feuille d'autocollants pour vos designs de projets de portfolio•30 minutes
- Testez vos connaissances sur l'utilisation des design systems dans Figma•4 minutes
1 discussion prompt•Total 10 minutes
- Partagez un design system open source que vous souhaitez utiliser dans vos propres designs•10 minutes
Donner, recevoir et mettre en œuvre un feedback est une partie nécessaire du processus de design UX. Dans cette partie du cours, vous explorerez des méthodes efficaces pour donner et recevoir un feedback. Vous en apprendrez également davantage sur les sessions de critique de design, qui constitueront une partie importante de votre premier emploi en tant que designer UX. Enfin, vous apprendrez à transformer le feedback en mesures concrètes que vous pouvez prendre pour réviser les designs.
What's included
10 videos2 readings4 assignments2 discussion prompts1 plugin
10 videos•Total 36 minutes
- Bienvenue dans la semaine 4•1 minute
- Donner et recevoir un feedback en tant que designer UX•5 minutes
- Les bases des sessions de critique de design•4 minutes
- Meilleures pratiques pour les sessions de critique de design•3 minutes
- Kunal - Mon expérience avec les sessions de critique de conception•4 minutes
- Introduction à une simulation de session de critique•2 minutes
- Observer une simulation de session de critique•6 minutes
- Transformer le feedback d’une session de critique en actions•6 minutes
- Itérer sur les simulations en fonction du feedback des sessions de critique•5 minutes
- Synthèse : Participation à des sessions de critique de design•1 minute
2 readings•Total 15 minutes
- En savoir plus sur les sessions de critique de design•10 minutes
- Glossaire 4•5 minutes
4 assignments•Total 99 minutes
- Défi hebdomadaire 4 : Participer à des sessions de critique de design•65 minutes
- Tester vos connaissances sur les sessions de critique de design•6 minutes
- Auto-réflexion : Demander un feedback sur votre travail•20 minutes
- Tester vos connaissances sur la mise en œuvre du feedback des sessions de critique•8 minutes
2 discussion prompts•Total 20 minutes
- Partager le feedback que vous avez reçu•10 minutes
- Partager les enseignements tirés de la simulation de session de critique•10 minutes
1 plugin•Total 15 minutes
- Donner et recevoir un feedback en tant que designer UX•15 minutes
Vous êtes prêt à construire des prototypes haute-fidélité dans Figma ! En suivant six étapes, vous transformerez vos maquettes en un prototype prêt à être testé. De plus, vous explorerez deux nouveaux concepts, les gestes et les mouvements, qui peuvent contribuer à enrichir l'expérience utilisateur et à accroître la convivialité des prototypes.
What's included
9 videos4 readings3 assignments1 peer review
9 videos•Total 32 minutes
- Bienvenue dans la semaine 5•1 minute
- Introduction aux prototypes haute-fidélité •4 minutes
- Élaborer un prototype haute-fidélité dans Figma •4 minutes
- Gestes et mouvements en design UX •2 minutes
- Ajouter des gestes et des mouvements dans Figma •6 minutes
- Considérations d'accessibilité pour les gestes et les mouvements •3 minutes
- Jen - Le design avec l’accessibilité à l’esprit•4 minutes
- Apprendre de Figma - Interactions et retours sur les prototypes •8 minutes
- Synthèse : Créer des prototypes haute-fidélité•1 minute
4 readings•Total 35 minutes
- Explorer les types de gestes et mouvements •10 minutes
- En savoir plus sur le prototypage dans Figma •10 minutes
- Autres moyens d'améliorer les prototypes haute-fidélité•10 minutes
- Glossaire 5•5 minutes
3 assignments•Total 38 minutes
- Tester vos connaissances sur le design d'un prototype haute-fidélité dans Figma•10 minutes
- Tester vos connaissances sur les gestes et les mouvements•8 minutes
- Auto-réflexion : Tenir compte des considérations d'accessibilité lors du design avec mouvement •20 minutes
1 peer review•Total 60 minutes
- Défi hebdomadaire 5 : Créez un prototype haute-fidélité pour votre projet de portfolio•60 minutes
Maintenant que vous avez un prototype haute-fidélité, il est temps de tester vos designs. Pour commencer, vous allez mener une étude d'utilisabilité afin de tester votre prototype haute-fidélité d'application mobile. Vous analyserez le feedback que vous recevrez pour obtenir des informations exploitables et itérer vos designs. Ensuite, vous apprendrez à transmettre les designs à des ingénieurs pour la production. Enfin, vous allez transformer tout ce que vous avez appris sur la recherche utilisateur, les idées, les wireframes, les designs et les prototypes en une étude de cas pour votre portfolio UX professionnel.
What's included
12 videos12 readings8 assignments1 peer review3 discussion prompts
12 videos•Total 40 minutes
- Bienvenue à la semaine 6•1 minute
- Planifier une étude de recherche UX•4 minutes
- Mener une étude d'utilisabilité•3 minutes
- Analyser et synthétiser les résultats d’étude d'utilisabilité•2 minutes
- Itération des designs haute-fidélité•10 minutes
- Identifier le moment où un design est terminé•2 minutes
- Documenter et partager des designs•1 minute
- Transmettre les designs pour production•2 minutes
- Apprendre de Figma - Se préparer à la transmission•5 minutes
- Créer une étude de cas pour votre projet de portfolio•7 minutes
- Synthèse : Test et itération des designs•1 minute
- Félicitations, vous avez terminé le Cours 5 : Créer des designs et des prototypes haute-fidélité à l’aide de Figma•2 minutes
12 readings•Total 110 minutes
- En savoir plus sur la planification d'une étude de recherche UX•10 minutes
- Exemple d’activité : Planifier une étude de recherche UX pour votre projet de portfolio•10 minutes
- En savoir plus sur la réalisation d'une étude d'utilisabilité•10 minutes
- Exemple d’activité : Réalisez une étude d'utilisabilité pour votre projet de portfolio•10 minutes
- En savoir plus sur l'analyse et la synthèse des résultats des études d'utilisabilité•10 minutes
- Exemple d’activité : Analyser et synthétiser les résultats de l'étude d'utilisabilité de votre projet de portfolio•10 minutes
- Exemple d’activité : Affiner le design de vos projets de portfolio haute-fidélité•10 minutes
- En savoir plus sur l'identification du moment où un design est terminé•10 minutes
- Designs finaux de l'application de promeneur de chiens dans Figma•10 minutes
- En savoir plus sur la création d'une étude de cas pour votre projet de portfolio•10 minutes
- Glossaire 6•5 minutes
- Commencez le cours suivant•5 minutes
8 assignments•Total 160 minutes
- Activité : Planifier une étude de recherche UX pour votre projet de portfolio•30 minutes
- Auto-réflexion : Tenez compte des préjugés dans votre étude d'utilisabilité•20 minutes
- Activité : Réalisez une étude d'utilisabilité pour votre projet de portfolio•30 minutes
- Tester vos connaissances sur la découverte d’informations de recherche•8 minutes
- Activité : Analyser et synthétiser les résultats de l'étude d'utilisabilité de votre projet de portfolio•30 minutes
- Activité : Affiner le design de vos projets de portfolio haute-fidélité•30 minutes
- Tester vos connaissances sur la transmission des designs•4 minutes
- Tester vos connaissances sur les études de cas dans les portfolios UX •8 minutes
1 peer review•Total 90 minutes
- Défi hebdomadaire 6 : Créer une étude de cas pour votre portfolio•90 minutes
3 discussion prompts•Total 30 minutes
- Partager les leçons tirées de votre étude d'utilisabilité •10 minutes
- Partager un exemple d'étude de cas dans un portfolio de design UX•10 minutes
- Partagez votre expérience de cours •10 minutes
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor

Offered by
Why people choose Coursera for their career

Felipe M.

Jennifer J.

Larry W.





