Construire des wireframes (maquettes fonctionnelles) et des prototypes basse fidélité from Coursera

« Élaboration d’armatures et de prototypes basse-fidélité » est le troisième cours d'un programme de certification qui vous dotera des compétences dont vous avez besoin pour travailler en tant que Concepteur UX débutant. Dans ce cours, vous continuerez à concevoir une application mobile pour votre portfolio UX professionnel. Vous commencerez par créer des storyboards et vous familiariserez avec les bases du dessin. Ensuite, vous créerez des wireframes sur papier et des wireframes numériques à l'aide de l'outil de conception Figma. Vous créerez également un prototype papier et un prototype numérique basse-fidélité dans Figma.

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 apprenants qui termineront les sept cours de ce programme de formation seront aptes à postuler aux emplois de concepteurs UX débutants.

À la fin de ce cours, vous serez capables de :

- Élaborer un énoncé d'objectif.

- Créer deux types de storyboards : une vue d’ensemble et un gros plan.

- Expliquer la différence entre la conception basse-fidélité et haute-fidélité.

- Appliquer les bases du dessin.

- Appliquer les principes de l'architecture des informations pour organiser une application mobile.

- Créer des armatures papier pour la conception d'une application mobile.

- Élaborer des wireframes numériques dans l’outil de conception Figma.

- Construire un prototype papier pour ajouter de l'interactivité aux conceptions.

- Concevoir un prototype basse-fidélité dans Figma.

- Identifier les biais implicites et les schémas trompeurs dans la conception.

- Continuer à concevoir une application mobile à inclure dans votre portfolio professionnel.

Pour réussir ce cours, vous devez terminer les deux cours précédents de cette formation certifiante ou avoir la capacité de mener des recherches utilisateur pour éclairer la création de cartes d'empathie, de personas, d'histoires utilisateur, de cartes de parcours utilisateur, d'énoncés de problèmes et de propositions de valeur. Vous aurez également besoin de papier et d'un stylo ou d'un crayon.

What's inside

Syllabus

Design de storyboards et de wireframes

Bienvenue dans le monde des wireframes ! Vous commencerez par apprendre à utiliser les résultats de la recherche pour éclairer l'idéation pendant le processus de design. Ensuite, vous créerez deux types de storyboards : vue d’ensemble et gros plan. Puis, vous dessinerez vos premiers wireframes et vous découvrirez les avantages du design de wireframes. Gardez à l'esprit qu'à ce stade du processus de design, vous devriez avoir de nombreuses idées de design qui répondent aux besoins réels de l’utilisateur. Vous devrez affiner ces idées et le design de wireframes peut vous aider à le faire.

Créer des wireframes papier et numériques

Il s'agit d'une partie du cours pleine d'action dans laquelle vous dessinerez des wireframes pour une application mobile ! Tout d'abord, vous allez dessiner de nombreux wireframes sur papier. Ensuite, vous passerez aux wireframes numériques dans l'outil de design Figma. Vous apprendrez même directement de Figma comment utiliser au mieux leur outil. Enfin, vous appliquerez les principes de Gestalt, comme la similarité, la proximité et la région commune, à vos wireframes.

Construire des prototypes basse-fidélité

Vous avez traversé les trois premières étapes du processus de design : l’empathie, la définition et le design. Vous allez maintenant entrer dans la quatrième étape du processus de design : le prototype. Tout d'abord, vous allez créer un prototype papier de votre application mobile. Ensuite, vous passerez à un prototype numérique basse-fidélité dans Figma. Par ailleurs, vous découvrirez les moyens d’identifier les préjugés potentiels dans vos designs et vous apprendrez à éviter les schémas trompeurs.

Good to know

Know what's good

, what to watch for

, and possible dealbreakers

S'adresse à des concepteurs UX débutants qui cherchent à développer leurs compétences pour travailler dans le domaine

Fournit des projets pratiques qui simulent des scénarios de conception UX

Enseigné par des concepteurs et des chercheurs UX de Google

Requiert des connaissances préalables en recherche utilisateur et en création de personas, de storyboards et de parcours utilisateurs

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Construire des wireframes (maquettes fonctionnelles) et des prototypes basse fidélité with these activities:

Créer un storyboard pour votre application

Show steps

Créer un storyboard vous aidera à visualiser le parcours utilisateur et à identifier les points d'interaction clés dans votre application.

Browse courses on Storyboarding

Show steps

Définissez les objectifs et les utilisateurs cibles de votre application
Esquissez les principaux écrans et flux de votre application
Ajoutez des annotations et des descriptions pour expliquer le comportement de l'utilisateur
Obtenez des commentaires d'autres personnes sur votre storyboard

Dessiner des wireframes papier

Show steps

Dessiner des wireframes papier vous permet de concrétiser vos idées de conception et de mieux comprendre l'architecture de votre application mobile.

Browse courses on Wireframes

Show steps

Réunissez le matériel nécessaire (papier, crayons, règles)
Esquissez les éléments clés de votre application
Créez des wireframes pour différentes pages de votre application
Connectez les wireframes pour créer un flux utilisateur

Construire un prototype papier

Show steps

Construire un prototype papier vous permet de tester l'ergonomie et l'interaction de votre application avant de passer au développement.

Show steps

Imprimez ou dessinez les wireframes de votre application
Découpez les éléments et assemblez-les
Simulez les interactions de l'utilisateur avec votre prototype
Obtenez des commentaires d'autres personnes sur votre prototype

One other activity

Expand to see all activities and additional details

Show all four activities

Développer un prototype numérique basse-fidélité dans Figma

Show steps

Développer un prototype numérique basse-fidélité vous permettra de tester l'expérience utilisateur et la fonctionnalité de votre application dans un environnement interactif.

Browse courses on Figma

Show steps

Familiarisez-vous avec l'interface et les fonctionnalités de Figma
Importez ou créez les wireframes de votre application
Ajoutez des éléments interactifs (boutons, liens, etc.)
Créez des transitions et des animations pour améliorer l'expérience utilisateur

Career center

Learners who complete Construire des wireframes (maquettes fonctionnelles) et des prototypes basse fidélité will develop knowledge and skills that may be useful to these careers:

Web Designer

A Web Designer creates the visual layout of a website. They make sure that a website is visually appealing and easy to navigate. This course may be useful for someone who wants to become a Web Designer because it teaches the basics of web design, including how to create wireframes and prototypes.

See salaries and explore the career path for Web Designer

Interaction Designer

An Interaction Designer designs how a user interacts with a product. They make sure that a product is easy to use and enjoyable to interact with. This course may be useful for someone who wants to become an Interaction Designer because it teaches the basics of interaction design, including how to create storyboards, wireframes, and prototypes.

See salaries and explore the career path for Interaction Designer

Product Designer

A Product Designer is a person who designs the overall experience of a product. They make sure that a product is useful, usable, and desirable. This course may be useful for someone who wants to become a Product Designer because it teaches the basics of product design, including how to create storyboards, wireframes, and prototypes.

See salaries and explore the career path for Product Designer

User Experience (UX) Designer

A UX Designer is a person who designs how a product looks and feels for a user. They make sure that a product is easy to use and enjoyable to interact with. This course may be useful for someone who wants to become a UX Designer because it teaches the basics of UX design, including how to create storyboards, wireframes, and prototypes.

See salaries and explore the career path for User Experience (UX) Designer

Visual Designer

A Visual Designer creates the visual elements of a product. They make sure that a product is visually appealing and consistent with the brand. This course may be useful for someone who wants to become a Visual Designer because it teaches the basics of visual design, including how to create storyboards, wireframes, and prototypes.

See salaries and explore the career path for Visual Designer

Graphic designer

A Graphic Designer creates visual content for a variety of purposes, including marketing, branding, and advertising. This course may be useful for someone who wants to become a Graphic Designer because it teaches the basics of graphic design, including how to create storyboards and prototypes.

See salaries and explore the career path for Graphic designer

Information Architect

An Information Architect is a person who designs the structure and organization of a website or application. They make sure that a website or application is easy to navigate and find information. This course may be useful for someone who wants to become an Information Architect because it teaches the basics of information architecture, including how to create wireframes and prototypes.

See salaries and explore the career path for Information Architect

Content Strategist

A Content Strategist is a person who plans and manages the content of a website or application. They make sure that a website or application has the right content for its target audience. This course may be useful for someone who wants to become a Content Strategist because it teaches the basics of content strategy, including how to create storyboards and prototypes.

See salaries and explore the career path for Content Strategist

Project Manager

A Project Manager is a person who plans and executes projects for a company. They make sure that projects are completed on time, within budget, and to the required quality. This course may be useful for someone who wants to become a Project Manager because it teaches the basics of project management, including how to create storyboards and prototypes.

See salaries and explore the career path for Project Manager

Marketing Manager

A Marketing Manager is a person who plans and executes marketing campaigns for a company. They make sure that a company's products and services are marketed effectively. This course may be useful for someone who wants to become a Marketing Manager because it teaches the basics of marketing, including how to create storyboards and prototypes.

See salaries and explore the career path for Marketing Manager

Business Analyst

A Business Analyst is a person who analyzes a company's business processes and makes recommendations for improvements. This course may be useful for someone who wants to become a Business Analyst because it teaches the basics of business analysis, including how to create storyboards and prototypes.

See salaries and explore the career path for Business Analyst

Technical Writer

A Technical Writer is a person who writes technical documentation, such as user manuals and training materials. This course may be useful for someone who wants to become a Technical Writer because it teaches the basics of technical writing, including how to create storyboards and prototypes.

See salaries and explore the career path for Technical Writer

Data Analyst

A Data Analyst is a person who analyzes data to find trends and patterns. This course may be useful for someone who wants to become a Data Analyst because it teaches the basics of data analysis, including how to create storyboards and prototypes.

See salaries and explore the career path for Data Analyst

Computer Programmer

A Computer Programmer is a person who writes code to implement software applications. This course may be useful for someone who wants to become a Computer Programmer because it teaches the basics of computer programming, including how to create storyboards and prototypes.

See salaries and explore the career path for Computer Programmer

Software Engineer

A Software Engineer is a person who designs, develops, and maintains software applications. This course may be useful for someone who wants to become a Software Engineer because it teaches the basics of software engineering, including how to create storyboards and prototypes.

See salaries and explore the career path for Software Engineer