К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Créer des interfaces utilisateur dynamiques pour des sites Web · LearnSpace
Назад в каталог
courseraПрограммирование

Créer des interfaces utilisateur dynamiques pour des sites Web

Курс от Google
Начальный≈ 39.6 чАрабский
О курсеНавыкиПрограммаПреподаватели

О курсе

Responsive Web Design dans Adobe XD est le sixième cours de ce programme qui vous permettra d’acquérir les compétences dont vous avez besoin pour postuler à des emplois de niveau débutant dans le domaine de la conception de l’expérience utilisateur (UX). Dans le cours 6, vous apprendrez à concevoir un site Web réactif à l’aide d’Adobe XD, un outil de conception connu. Vous pourrez étudier le processus de conception du début à la fin : l’empathie avec les utilisateurs, la définition de leurs points de contrariété, trouver des idées de solutions conceptuelles, créer des maquettes fonctionnelles (wireframes) et des prototypes et tester des conceptions pour obtenir des commentaires. À la fin du cours, vous aurez un nouveau projet de conception à inclure dans votre portfolio professionnel de conception d’expérience utilisateur. En outre, vous apprendrez à rechercher des emplois dans le domaine de la conception UX, à créer un CV qui met en valeur vos compétences et vos réalisations, ainsi qu’à créer un site Web pour votre portfolio professionnel. Des concepteurs et chercheurs UX de Google vous serviront d’instructeurs. Vous réaliserez des travaux pratiques simulant des scénarios de conception UX. Les participants qui termineront les sept cours de ce programme certifiant seront aptes à postuler aux emplois de concepteurs UX débutants. À la fin de ce cours, vous serez capable de : - Appliquer chaque étape du processus de conception UX (empathie, définition, idéation, prototype, test) afin de créer un site Web réactif. - Développer des conceptions à l’aide d’un outil de conception connu, Adobe XD. - Planifier l’architecture des informations et créer des plans de site pour la conception de sites Web. - Appliquer des mises en page courantes pour les pages Web. - Planifier et mener une étude d’utilisabilité afin de recueillir les commentaires sur vos conceptions. - Itérer les conceptions sur la base des informations de la recherche. - Travailler avec des systèmes de conception dans Adobe XD. - Ajouter un nouveau projet de conception à votre portfolio professionnel d’expérience utilisateur. - [Optionnel] Créer ou mettre à jour un CV axé sur l’UX. - [Optionnel] Apprendre à rechercher et à postuler à des emplois de niveau initiation dans le domaine de l’UX. Ce cours convient aux concepteurs UX de niveau débutant ayant suivi les cinq cours précédents du certificat en conception UX de Google. Sinon, les participants doivent posséder une solide compréhension des bases du processus de conception, une expérience dans la création de maquettes fonctionnelles, de maquettes et de prototypes et avoir la capacité de mener des études d’utilisabilité. Aucune expérience préalable avec Adobe XD n’est requise.

Навыки, которые вы освоите

User Interface and User Experience (UI/UX) DesignResponsive Web DesignPrototypingUser Interface (UI)User ResearchInformation ArchitectureUser Centered DesignExperience DesignUser Experience DesignMockupsAdobe XDWeb Design and DevelopmentWeb DesignUser ExperienceDesign ResearchUI/UX ResearchWireframingUsabilityPersona (User Experience)Usability Testing

Программа курса

6 модулей · 207 учебных материалов

01Démarrer le processus de UX Design : Empathie et définition43 материалов

Introduction au cours 6

Introduction au cours 6 : Responsive Web Design dans Adobe XDВидеоBienvenue dans le cours 6ЧтениеIntroduction au deuxième projet de portfolioЧтениеChoisir l’instruction de votre deuxième projet de portfolioЧтение

Учитесь у экспертов

Google Career Certificates

Преподаватель курса

Créer des interfaces utilisateur dynamiques pour des sites Web
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 39.6 ч

6 модулей

Язык: Арабский

Субтитры: Французский, Английский

Часть программы вашего университета
Activité : soumettre l’instruction de projet de portfolio de votre choixЗадание
Dave - Mon parcours vers l’UXВидео

Introduction à Adobe XD

Bienvenue dans la semaine 1ВидеоComprendre les sites Web réactifsВидеоTester vos connaissances en matière de design de sites Web réactifsЗаданиеIntroduction à Adobe XDВидеоPartager votre enthousiasme pour l’apprentissage d’Adobe XDОбсуждениеPremiers pas avec Adobe XDЧтениеOptionnel - Premiers pas avec FigmaЧтениеDémarrer un projet dans Adobe XDВидеоTester vos connaissances sur les bases d’Adobe XDЗаданиеComparez et opposez Adobe XD et FigmaОбсуждениеJennifer - Utiliser les outils de design numériqueВидео

Empathie envers les utilisateurs

Faire preuve d'empathie envers les utilisateurs et comprendre les points douloureuxВидеоEn savoir plus sur l’empathie envers les utilisateursЧтениеDiscuter de l’importance de prendre en compte les besoins des utilisateursОбсуждениеTester vos connaissances sur l’empathie envers les utilisateursЗаданиеMener des entretiens pour les cartes d’empathie ЧтениеPartager les questions de l’entretienОбсуждениеCréer des cartes d’empathieЧтениеActivité : créer une carte d’empathieЗаданиеExemple d’activité : créer une carte d’empathieЧтениеCréer des personasВидеоEn savoir plus sur les personasЧтениеActivité : créer des personasЗаданиеExemple d’activité : créer des personasЧтение

Définir les besoins de l’utilisateur

Créer des user stories (récits utilisateur)ВидеоEn savoir plus sur les user storiesЧтениеCréer et partager une user story sur vous-mêmeОбсуждениеCréer une carte du parcours utilisateurВидеоEn savoir plus sur les cartes du parcours utilisateurЧтениеActivité : créer une user st ory et une carte du parcours utilisateurЗаданиеExemple d’activité : créer une user story et une carte du parcours utilisateurЧтение

Définir le problème

Élaborer un énoncé de problèmeВидеоEn savoir plus sur les énoncés de problèmesЧтениеTester vos connaissances sur les énoncés de problèmesЗадание

Révision de la semaine 1

Synthèse : démarrer le processus de UX design : Empathie et définitionВидеоGlossaire 1ЧтениеDéfi hebdomadaire 1 : créer un énoncé de problèmeВзаимная проверка
02Poursuivre le processus de UX design : Idéation26 материалов

Réaliser un audit concurrentiel

Bienvenue dans la semaine 2ВидеоRéaliser un audit concurrentielВидеоEn savoir plus sur les audits concurrentielsЧтениеActivité : réaliser un audit concurrentiel de votre site WebЗаданиеExemple d’activité : réaliser un audit concurrentiel de votre site WebЧтениеEn savoir plus sur l’utilisation des audits concurrentiels pour idéerЧтениеAuto-réflexion : utiliser la recherche concurrentielle pour éclairer les designssЗадание

Générer des idées de design

Idéer en utilisant How Might WeВидеоIdéer en utilisant Crazy EightsВидеоEn savoir plus sur How Might We et Crazy EightsЧтениеTester vos connaissances sur les techniques d’idéationЗаданиеActivité : idéer pour votre site WebЗаданиеExemple d’activité : idéer pour votre site WebЧтение

Planifier l’architecture de l’information

Planifier l’architecture de l’informationВидеоEn savoir plus sur l’architecture de l’informationЧтениеExplorer les structures de sites Web courantesВидеоExplorer les structures des sites WebPLUGINTester vos connaissances sur les structures de sites WebЗаданиеDiscuter des structures des sites Web que vous avez utilisésОбсуждение

Examen de la semaine 2

Synthèse : poursuivre le processus de UX design : IdéationВидеоGlossaire 2ЧтениеDéfi hebdomadaire 2 : créer un plan de site pour un site WebВзаимная проверка
03Création de wireframes pour un site web réactif33 материалов

Créer des wireframes papier

Bienvenue dans la semaine 3 ВидеоDécouvrez les mises en page courantes des pages d'accueil de sites webВидеоEn savoir plus sur les mises en page courantes des sitesЧтениеIdentifier la présentation du site webPLUGINLes bases des wireframesВидеоEn savoir plus sur les wireframesЧтениеActivité : Commencer les wireframes en papier pour votre site webЗаданиеExemple d’activité : Commencez les wireframes en papier pour votre site webЧтение

Planifier des pages web réactives

Tracer une mise en page réactiveВидеоEn savoir plus sur le traçage de mises en page réactivesЧтениеAjuster les mises en page en fonction de la taille de l'écranВидеоÉléments communs utilisés dans le design réactifЧтениеExplorer le responsive website designPLUGINActivité : Créez des variantes de vos wireframes sur papierЗадание

Créer des wireframes numériques dans Adobe XD

Transition des wireframes papier vers les wireframes numériquesВидеоCréer des wireframes numériques dans Adobe XDВидеоEn savoir plus sur la création de wireframes numériques dans Adobe XDЧтениеOptionnel - Créer des wireframes numériques dans FigmaЧтениеActivité : Créer des wireframes numériques pour une taille d'écran de bureauЗаданиеExemple d’activité : Créer des wireframes numériques pour une taille d'écran de bureauЧтение

Affiner les wireframes

Affiner les wireframes pour améliorer l'accessibilitéВидеоTenez compte des titres, des points de repère et des points focaux dans vos maquettesОбсуждениеÉvaluer les wireframes à l'aide des principes de la GestaltВидеоEn savoir plus sur l'utilisation des principes de la Gestalt dans les wireframesЧтение

Revue de la semaine 3

Synthèse : Création de wireframes pour un site web réactifВидеоGlossaire 3ЧтениеDéfi hebdomadaire 3 : Affiner les wireframes pour qu'ils répondent aux normesВзаимная проверка
04Créer et tester des prototypes basse-fidélité31 материалов

Élaborer un prototype basse-fidélité dans Adobe XD

Bienvenue dans la semaine 4ВидеоComprendre les prototypes basse-fidélitéВидеоTester vos connaissances sur les maquettes par rapport aux prototypesЗаданиеÉlaborer un prototype basse-fidélité dans Adobe XDВидеоEn apprendre davantage sur la création d'un prototype basse-fidélité dans Adobe XDЧтениеFacultatif - Créer un prototype basse-fidélité dans FigmaЧтениеActivité : Créez un prototype basse-fidélité pour votre site Web réactif ЗаданиеExemple d'activité : Créez un prototype basse-fidélité pour votre site Web réactifЧтениеContrôler un prototype basse-fidélitéЧтение

Planifier et réaliser une étude d’utilisabilité pour un prototype basse-fidélité

Planifier une étude de recherche UXВидеоEn savoir plus sur la planification d'une étude de recherche UXЧтениеActivité : Planifier une étude de recherche UXЗаданиеExemple d'activité : Planifier une étude de recherche UXЧтениеMener une étude sur la facilité d’utilisationВидеоEn savoir plus sur la réalisation d'une étude d’utilisabilitéЧтение

Modifier les designs en fonction des résultats de la recherche

Itérer les designs basse-fidélité en fonction des résultats de la rechercheВидеоEn savoir plus sur l'itération des designs basse-fidélitéЧтениеTestez vos connaissances sur la modification des designs en fonction des conclusions issues de la rechercheЗаданиеExpliquez comment vous avez itéré les designs en fonction des conclusions issues de la rechercheОбсуждение

Examen de la semaine 4

Synthèse : Créer et tester des prototypes basse-fidélitéВидеоGlossaire 4ЧтениеDéfi hebdomadaire 4 : Mettre à jour le prototype basse-fidélité en fonction des constatations issues de l'étude d'utilisabilitéВзаимная проверка
05Créer et tester des designs haute-fidélité38 материалов

Commencer à concevoir des maquettes

Bienvenue dans la semaine 5ВидеоCommencer à concevoir des maquettesВидеоExaminer les éléments fondamentaux du visual designЧтениеExaminer comment disposer les éléments dans les maquettesЧтениеAppliquer les principes de visual designЧтениеTester vos connaissances sur les bases des maquettesЗадание

Créer des maquettes pour un site Web de bureau

Commencer à créer des maquettes pour la page d'accueil d'un site Web dans Adobe XDВидеоOptionnel - Commencer à créer des maquettes de sites Web dans FigmaЧтениеAjouter des images et des logos aux maquettes dans Adobe XDЧтениеTester vos connaissances sur la création d'une page d'accueil dans Adobe XDЗаданиеContinuer à créer des maquettes pour la page d'accueil d'un site Web dans Adobe XDВидеоUtiliser des grilles de répétition pour concevoir dans Adobe XDЧтение

Créer des maquettes pour un site Web mobile

Créer des maquettes pour un site Web mobile dans Adobe XDВидеоEn savoir plus sur les menus de navigation cachésЧтениеOptionnel - Créer des maquettes pour un site Web mobile dans FigmaЧтениеActivité : créer une maquette pour la page d'accueil d'un site Web mobileЗаданиеExemple d’activité : créer une maquette pour la page d'accueil d'un site Web mobileЧтение

Travailler avec des design systems

Travailler avec des design systemsВидеоTester vos connaissances sur l'utilisation des design systems dans FigmaЗаданиеUtiliser des design systems externes dans Adobe XDВидеоEn savoir plus sur les design systemsЧтениеPartager vos design systems préférésОбсуждениеActivité : documenter vos décisions de designЗадание

Créer un prototype haute-fidélité

Créer un prototype haute-fidélité dans Adobe XDВидеоAnnoter les prototypes pour l'accessibilité du WebВидеоEn savoir plus sur l'accessibilité du WebЧтениеTester vos connaissances sur l'accessibilité du WebЗаданиеPartager une ressource sur le design inclusif et accessibleОбсуждение

Révision de la semaine 5

Synthèse : créer et tester des designs haute-fidélitéВидеоGlossaire 5ЧтениеDéfi hebdomadaire 5 : créer un prototype haute-fidélité pour un site WebВзаимная проверка

Optionnel - Tester votre prototype haute-fidélité

Optionnel - Tester votre prototype haute-fidélitéВидеоOptionnel - Examiner comment planifier et mener une étude d’utilisabilité ЧтениеTester vos connaissances concernant les études d’utilisabilitéЗадание
06Documenter le travail de design et rechercher des emplois36 материалов

Transmettre des designs

Bienvenue à la semaine 6ВидеоCollaborer avec les équipes d'ingénieursВидеоTransmettre les spécifications de design dans Adobe XDВидеоTestez vos connaissances sur le transfert des designersЗаданиеCollaborer à distance avec Adobe XDЧтение

Ajouter un projet à votre portfolio

Ajouter un projet à votre portfolioВидеоEn savoir plus sur les études de cas de portfolioЧтениеTestez vos connaissances sur les études de cas de portfolioЗаданиеPartagez les études de cas de portfolio avec les designs de sites WebОбсуждениеAjoutez une nouvelle étude de cas à votre portfolioВзаимная проверка

Facultatif - Recherche d'emplois dans le domaine de l'UX

Comprendre les emplois fréquents des designers UXВидеоEn savoir plus sur les emplois dans le domaine de l'expérience utilisateurЧтениеDécouvrez les types d'entreprises dans lesquelles les designers UX travaillentВидеоAuto-réflexion : Partagez vos objectifs et intérêts professionnelsЗаданиеKenny - PersévéranceВидеоIdentifier où postuler pour des emplois de design UXВидео

Facultatif - Créer un CV de designer UX

Comprendre les CV de design UXВидеоAuto-réflexion : réfléchissez aux informations à inclure dans votre CVЗаданиеÉléments d'un CV typique de designer UXЧтениеDane - Mon conseil pour les CV de design UXВидеоTim - Les conseils d'un recruteur pour les CV de design UXВидеоActivité : rédiger un CV de designer UXЗадание

Revue de la semaine 6

Synthèse : documenter le travail de design et rechercher des emploisВидеоGlossaire 6ЧтениеDéfi hebdomadaire 6 : Documenter le travail de design et rechercher des emploisЗадание

Examen du cours

Félicitations, vous avez terminé le Cours 6 : Responsive Web Design dans Adobe XDВидеоPartagez votre expérience du cours ОбсуждениеCommencez le cours suivantЧтение
Discuter de votre technique d’idéation préféréeОбсуждение
Explorer les plans de siteВидео
Créer un plan de site pour votre site WebВидео
En savoir plus sur la création d’un plan de siteЧтение
Exemple d’activité : Créez des variantes de vos wireframes papierЧтение
Créer des wireframes pour des tailles d'écran supplémentaires dans Adobe XDВидео
Facultatif : créer des wireframes pour des tailles d'écran supplémentaires dans FigmaЧтение
Activité : Créer des wireframes numériques pour des tailles d'écran supplémentairesЗадание
Exemple d’activité : Créer des wireframe numériques pour des tailles d'écran supplémentairesЧтение
Jay - design avec Adobe XDВидео
Réduire les préjugés dans une étude d’utilisabilitéВидео
Auto-réflexion : Déterminez comment réduire les préjugés dans vos propres étudesЗадание
Activité : Menez une étude d’utilisabilité pour un prototype basse-fidélitéЗадание
Exemple d'activité : Menez une étude d'utilisabilité pour un prototype basse-fidélitéЧтение
Analyser et synthétiser les résultats de la rechercheВидео
En savoir plus sur l'analyse et la synthèse des résultats de la rechercheЧтение
Activité : Analyser et synthétiser les résultats d'une étude d’utilisabilitéЗадание
Exemple d'activité : Analyser et synthétiser les résultats d'une étude d’utilisabilitéЧтение
Partager les constatations de votre étude sur la facilité d’utilisationОбсуждение
Activité : créer des maquettes pour un site WebЗадание
Exemple d’activité : créer des maquettes pour un site WebЧтение
Optionnel - Activité : créer une feuille d'autocollants dans FigmaЗадание
Optionnel - Exemple d'activité : créer une feuille d'autocollants dans FigmaЧтение
Découvrir les opportunités d'emploi dans le design UXЧтение
Activité : Commencez à rechercher des emplois dans le domaine de l'UX en utilisant un trackerЗадание
Exemple d’activité : Commencez à rechercher des emplois dans le domaine de l'UX en utilisant un trackerЧтение
Recherchez les mots clés dans les descriptions de postesВидео
Activité : Mettre en évidence les mots clés et les exigences dans les descriptions de posteЗадание
Exemple d’activité : Mettre en évidence les mots clés et les exigences dans les descriptions de posteЧтение
Exemple d’activité : rédiger un CV de designer UX Чтение
Mettre à jour un CV en fonction des descriptions de postesВидео