Coursera Plus Annual is 50% Off — Ends June 17.

Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Google

Create High-Fidelity Designs and Prototypes in Figma

Google via Google Skills

Go to class Write review
DataCamp Ad

AI Engineer - Learn how to integrate AI into software applications

Learn More → Noble Desktop Ad

Live Online Classes in Design, Coding & AI — Small Classes, Free Retakes

Learn More →

Overview

AI, Data Science & Cloud Certificates from Google, IBM & Meta — 50% Off
One plan covers every Professional Certificate on Coursera. 50% off Coursera Plus Annual for 10 days only — price increases June 17.
Unlock All Certificates
Create high-fidelity designs and interactive prototypes in Figma, a popular design tool. You'll conduct research, collect feedback, and share your designs with development teams, building a professional UX portfolio. This is the fifth course in the Google UX Design Certificate, a series designed to prepare you for an entry-level UX designer role.

Syllabus

  • Starting to create mockups
    • Introduction to Course 5: Create High-Fidelity Designs and Prototypes in Figma
    • Welcome to Course 5
    • Kunal - My journey to UX
    • Welcome to module 1
    • Introduction to mockups
    • Chikezie - Transition from low-fidelity to high-fidelity designs
    • Foundational skills to build mockups in Figma
    • Review: Use low-fidelity designs to start project mockups
    • Introduction to foundational elements of visual design
    • Typography in UX design
    • The importance of typography
    • Practice Quiz: Test your knowledge of typography
    • Work with type in mockups
    • Add product copy to mockups
    • Review: Add typography to project mockups
    • Color in UX design
    • Practice Quiz: Test your knowledge on color
    • Work with color in mockups
    • Accessibility considerations for color
    • Review: Add color to project mockups
    • Iconography in UX design
    • Work with icons in mockups
    • Review: Add icons to project mockups
    • Learn about more visual design elements
    • Add images to your mockups
    • Find stock images for mockups
    • Additional design considerations
    • Introduction to layouts
    • Use grids to guide layouts
    • Create grids in mockups
    • Review: Create grids in project mockups
    • Use containment in layouts
    • Create containment in mockups
    • Review: Create containment in project mockups
    • Use negative (white) space in layouts
    • Use negative space in mockups
    • Review: Revise project mockups by adding negative space
    • Common design patterns in apps
    • Practice Quiz: Self-Reflection: Share what you've learned about page layouts
    • Wrap-up: Starting to create mockups
    • Glossary terms from module 1
    • Practice Quiz: Activity: Apply foundational elements of visual design to your portfolio project mockups
    • Graded Quiz: Module 1 Challenge
  • Applying visual design principles to mockups
    • Welcome to module 2
    • Emphasis in UX design
    • Use emphasis in mockups
    • Hierarchy in UX design
    • Use hierarchy in mockups
    • Practice Quiz: Test your knowledge on emphasis and hierarchy
    • Scale and proportion in UX design
    • Use scale and proportion in mockups
    • Practice Quiz: Test your knowledge on scale and proportion
    • Unity and variety in UX design
    • Use unity and variety in mockups
    • Practice Quiz: Test your knowledge on unity and variety
    • Review: Apply visual design principles to project mockups
    • Apply Gestalt Principles to mockups
    • Learn about additional Gestalt Principles
    • Practice Quiz: Test your knowledge of Gestalt Principles
    • Review: Apply Gestalt principles to project mockups
    • Reflect on your progress
    • Consider additional visual design elements and principles
    • Learn about interface design principles
    • Include navigation in mockups
    • Practice Quiz: Self-Reflection: Include navigation in your mockups
    • Wrap-up: Applying visual design principles to mockups
    • Glossary terms from module 2
    • Graded Quiz: Module 2 Challenge
  • Exploring design systems
    • Welcome to module 3
    • Introduction to design systems
    • Benefits of design systems
    • Practice Quiz: Test your knowledge on design systems
    • Google's design system: Material Design
    • Shopify's design system: Polaris
    • Explore popular design systems
    • Practice Quiz: Test your knowledge on features of open-source design systems
    • Create a sticker sheet in Figma
    • Create sticker sheets for design projects
    • Use a design system library in Figma
    • Get inspiration from design systems
    • Optional - Learn from Figma - Use a design system library
    • Practice Quiz: Test your knowledge on working with design systems in Figma
    • Shabi - Consider assistive technologies when working in design systems
    • Wrap-up: Exploring design systems
    • Glossary terms from module 3
    • Graded Quiz: Module 3 Challenge
  • Creating high-fidelity prototypes
    • Welcome to module 4
    • Review: Introduction to high-fidelity prototypes
    • Review: Create a high-fidelity prototype in Figma
    • Practice Quiz: Test your knowledge on creating a high-fidelity prototype in Figma
    • Gestures and motion in UX design
    • Explore types of gestures and motion
    • Add gestures and motion in Figma
    • Follow-along guide: Add gestures and motion in Figma
    • Practice Quiz: Test your knowledge on gestures and motion
    • Learn more about prototyping in Figma
    • Accessibility considerations for gestures and motion
    • Practice Quiz: Self Reflection: Address accessibility considerations when designing with motion
    • Jen - Design with accessibility in mind
    • Learn from Figma - Prototype interactions and feedback
    • Additional ways to enhance high-fidelity prototypes
    • Wrap-up: Creating high-fidelity prototypes
    • Glossary terms from module 4
    • Practice Quiz: Activity: Create a high-fidelity prototype for your mobile app
    • Exemplars: Create a high-fidelity prototype for your mobile app
    • Graded Quiz: Module 4 Challenge
  • Testing and iterating on designs
    • Welcome to module 5
    • Plan a UX research study
    • Learn more about planning a UX research study
    • Conduct a usability study
    • Learn more about conducting a usability study
    • Practice Quiz: Self-Reflection: Account for bias in your usability study
    • Analyze and synthesize usability study results
    • Learn more about analyzing and synthesizing usability study results
    • Practice Quiz: Test your knowledge on coming up with research insights
    • Review: Analyze and synthesize the results of a usability study
    • Iterate on high-fidelity designs
    • Identify when a design is complete
    • Learn more about identifying when a design is complete
    • Final designs of the dog walker app in Figma
    • Document and share designs
    • Hand off designs for production
    • Learn from Figma - Prepare for hand off
    • Practice Quiz: Test your knowledge on handing off designs
    • Practice Quiz: Test your knowledge on case studies in UX portfolios
    • Wrap-up: Testing and iterating on designs
    • Glossary terms from module 5
    • Graded Quiz: Module 5 Challenge
    • Portfolio project guide for creating hi-fi prototypes
    • Practice Quiz: Activity: Refine your portfolio project mockups
    • Review: Refine your high-fidelity portfolio project designs
    • Create a case study for your portfolio project
    • Learn more about creating a case study for your portfolio project
    • Congratulations on completing Course 5: Create High-Fidelity Designs and Prototypes in Figma
    • Course 5 glossary
    • Start the next course
    • Course 5 resources and citations

Tags

Reviews

Start your review of Create High-Fidelity Designs and Prototypes in Figma

Go to class

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.