When you enroll in this course, you'll also be enrolled in this Professional Certificate.
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 5 modules in this course
Create High-Fidelity Designs and Prototypes in Figma is the fifth course in a certificate program that will equip you with the skills you need to apply to entry-level jobs in user experience (UX) design. In this course, you will follow step-by-step tutorials to learn how to create high-fidelity designs, called mockups, in Figma, a popular design tool. Then, you’ll turn those designs into an interactive prototype that works like a finished product. You’ll conduct research to collect feedback about your designs and make improvements. Finally, you’ll learn how to share your designs with development teams and highlight your work in your professional UX portfolio.
Current UX designers and researchers at Google will serve as your instructors, and you will complete hands-on activities that simulate real-world UX design scenarios. Learners who complete the courses in this certificate program should be equipped to apply for entry-level jobs as UX designers.
By the end of this course, you will be able to:
- Build mockups and high-fidelity prototypes in Figma.
- Define and apply common visual design elements and principles.
- Demonstrate how design systems can be used to organize, standardize, and enhance designs.
- Understand the role of design critique sessions and feedback while iterating on designs.
- Learn how to hand off finished design projects to engineering teams.
- Complete mobile app designs to include in a professional UX portfolio.
This course is suitable for beginner-level UX designers who have completed the previous four courses of the Google UX Design Certificate. Alternatively, learners who have not completed the previous courses should have a strong understanding of the design process, how to create low-fidelity designs on paper and in Figma, and how to conduct usability studies.
Turn your focus to visual design, which is how a product or technology appears to users. In this part of the course, you'll start to create mockups, which are high-fidelity designs that represent a final product. To create mockups, you'll use visual design elements, like typography, color, and iconography. Elements are often arranged into layouts using methods like grids, containment, and negative space. You'll apply all of these visual design learnings to build on the mobile app designs you've been working on throughout the certificate program.
What's included
16 videos23 readings4 assignments2 plugins
Show info about module content
16 videos•Total 52 minutes
Introduction to Course 5: Create High-Fidelity Designs and Prototypes in Figma•2 minutes
Kunal - My journey to UX•3 minutes
Welcome to module 1•2 minutes
Introduction to mockups •4 minutes
Chikezie - Transition from low-fidelity to high-fidelity designs •2 minutes
Introduction to foundational elements of visual design •2 minutes
Typography in UX design•3 minutes
The importance of typography •6 minutes
Color in UX design•8 minutes
Iconography in UX design•5 minutes
Add images to your mockups•3 minutes
Introduction to layouts•1 minute
Use grids to guide layouts •4 minutes
Use containment in layouts•3 minutes
Use negative (white) space in layouts•4 minutes
Wrap-up: Starting to create mockups •1 minute
23 readings•Total 146 minutes
Welcome to Course 5•8 minutes
Helpful resources and tips•4 minutes
Foundational skills to build mockups in Figma•8 minutes
Review: Use low-fidelity designs to start project mockups•4 minutes
Work with type in mockups•8 minutes
Add product copy to mockups•8 minutes
Review: Add typography to project mockups•4 minutes
Work with color in mockups •8 minutes
Accessibility considerations for color•8 minutes
Review: Add color to project mockups•4 minutes
Work with icons in mockups •8 minutes
Review: Add icons to project mockups•4 minutes
Learn about more visual design elements •8 minutes
Find stock images for mockups•8 minutes
Additional design considerations•8 minutes
Create grids in mockups•8 minutes
Review: Create grids in project mockups•4 minutes
Create containment in mockups•8 minutes
Review: Create containment in project mockups•4 minutes
Use negative space in mockups•8 minutes
Review: Revise project mockups by adding negative space•4 minutes
Common design patterns in apps•8 minutes
Glossary terms from course 5, module 1•2 minutes
4 assignments•Total 72 minutes
Test your knowledge of typography•8 minutes
Test your knowledge on color•4 minutes
Self-Reflection: Share what you've learned about page layouts•10 minutes
Module 1 Challenge•50 minutes
2 plugins•Total 60 minutes
Build a mockup from foundational elements•30 minutes
Test your knowledge on containment and negative space in design•30 minutes
Applying visual design principles to mockups
Module 2•3 hours to complete
Module details
In this part of the course, you’ll use visual design principles to refine mockups. First, you'll use emphasis to guide users to the most important parts of a page. Next, you'll apply hierarchy, scale, and proportion to organize the elements on each page of your app. Then, you'll consider unity and variety to help elements of your app function together or stand out. Finally, you'll revisit Gestalt Principles, like similarity, proximity, and common region, to help users interpret your designs easily.
What's included
8 videos11 readings6 assignments1 plugin
Show info about module content
8 videos•Total 29 minutes
Welcome to module 2•1 minute
Emphasis in UX design•4 minutes
Hierarchy in UX design•4 minutes
Scale and proportion in UX design•5 minutes
Unity and variety in UX design•4 minutes
Apply Gestalt Principles to mockups•6 minutes
Reflect on your progress •4 minutes
Wrap-up: Applying visual design principles to mockups •1 minute
11 readings•Total 74 minutes
Use emphasis in mockups•8 minutes
Use hierarchy in mockups•8 minutes
Use scale and proportion in mockups •8 minutes
Use unity and variety in mockups •8 minutes
Review: Apply visual design principles to project mockups•4 minutes
Learn about additional Gestalt Principles •8 minutes
Review: Apply Gestalt principles to project mockups•4 minutes
Consider additional visual design elements and principles •8 minutes
Learn about interface design principles •8 minutes
Include navigation in mockups•8 minutes
Glossary terms from course 5, module 2•2 minutes
6 assignments•Total 96 minutes
Test your knowledge on emphasis and hierarchy•8 minutes
Test your knowledge on scale and proportion•6 minutes
Test your knowledge on unity and variety •4 minutes
Test your knowledge of Gestalt Principles•8 minutes
Self-Reflection: Include navigation in your mockups•10 minutes
Module 2 Challenge•60 minutes
1 plugin•Total 10 minutes
Apply visual design principles•10 minutes
Exploring design systems
Module 3•2 hours to complete
Module details
Come explore the world of design systems! In this part of the course, you'll be introduced to the parts of a design system, as well as the benefits of using a design system. You'll examine various companies' design systems, and you’ll have an opportunity to use them in your own mockups. You'll also learn how to use and create sticker sheets in Figma.
What's included
9 videos5 readings4 assignments
Show info about module content
9 videos•Total 36 minutes
Welcome to module 3•1 minute
Introduction to design systems•3 minutes
Benefits of design systems •4 minutes
Google's design system: Material Design •8 minutes
Shopify's design system: Polaris •4 minutes
Create a sticker sheet in Figma•4 minutes
Use a design system library in Figma•9 minutes
Shabi - Consider assistive technologies when working in design systems•2 minutes
Wrap-up: Exploring design systems•1 minute
5 readings•Total 30 minutes
Explore popular design systems •8 minutes
Create sticker sheets for design projects•4 minutes
Get inspiration from design systems•8 minutes
Optional - Learn from Figma - Use a design system library•8 minutes
Glossary terms from course 5, module 3•2 minutes
4 assignments•Total 83 minutes
Test your knowledge on design systems•6 minutes
Test your knowledge on features of open-source design systems•6 minutes
Test your knowledge on working with design systems in Figma•6 minutes
Module 3 Challenge•65 minutes
Creating high-fidelity prototypes
Module 4•4 hours to complete
Module details
You’re ready to build high-fidelity prototypes in Figma! Following six steps, you'll turn your mockups into a prototype that's ready for testing. In addition, you'll explore two new concepts, gestures and motion, which can help enrich the user experience and increase the usability of prototypes.
What's included
9 videos6 readings5 assignments
Show info about module content
9 videos•Total 32 minutes
Welcome to module 4•1 minute
Introduction to high-fidelity prototypes •4 minutes
Create a high-fidelity prototype in Figma •4 minutes
Gestures and motion in UX design •2 minutes
Add gestures and motion in Figma •6 minutes
Accessibility considerations for gestures and motion •3 minutes
Jen - Design with accessibility in mind•4 minutes
Learn from Figma - Prototype interactions and feedback •8 minutes
Follow-along guide: Add gestures and motion in Figma•4 minutes
Learn more about prototyping in Figma •8 minutes
Additional ways to enhance high-fidelity prototypes•8 minutes
Glossary terms from course 5, module 4•2 minutes
Exemplars: Create a high-fidelity prototype for your mobile app•4 minutes
5 assignments•Total 148 minutes
Test your knowledge on creating a high-fidelity prototype in Figma•10 minutes
Test your knowledge on gestures and motion•8 minutes
Self Reflection: Address accessibility considerations when designing with motion •10 minutes
Activity: Create a high-fidelity prototype for your mobile app•60 minutes
Module 4 Challenge •60 minutes
Testing and iterating on designs
Module 5•4 hours to complete
Module details
Now that you have a high-fidelity prototype, it’s time to test your designs. To get started, you’ll conduct a usability study to test your high-fidelity prototype of a mobile app. You'll analyze the feedback you receive to come up with actionable insights and iterate on your designs. Then, you’ll learn how to hand off designs to engineers for production. Finally, you’ll turn everything you’ve learned about user research, ideation, wireframes, designs, and prototypes into a case study for your professional UX portfolio.
What's included
12 videos13 readings5 assignments
Show info about module content
12 videos•Total 40 minutes
Welcome to module 5•1 minute
Plan a UX research study•4 minutes
Conduct a usability study•3 minutes
Analyze and synthesize usability study results•2 minutes
Iterate on high-fidelity designs•10 minutes
Identify when a design is complete•2 minutes
Document and share designs•1 minute
Hand off designs for production•2 minutes
Learn from Figma - Prepare for hand off•5 minutes
Wrap-up: Testing and iterating on designs•1 minute
Create a case study for your portfolio project•7 minutes
Congratulations on completing Course 5: Create High-Fidelity Designs and Prototypes in Figma•2 minutes
13 readings•Total 84 minutes
Learn more about planning a UX research study•8 minutes
Learn more about conducting a usability study•8 minutes
Learn more about analyzing and synthesizing usability study results•8 minutes
Review: Analyze and synthesize the results of a usability study•4 minutes
Learn more about identifying when a design is complete•8 minutes
Final designs of the dog walker app in Figma•4 minutes
Glossary terms from course 5, module 5•4 minutes
Portfolio project guide for creating hi-fi prototypes•10 minutes
Review: Refine your high-fidelity portfolio project designs•10 minutes
Learn more about creating a case study for your portfolio project•10 minutes
Reflect and connect with your peers•4 minutes
Course 5 glossary•2 minutes
Start the next course•4 minutes
5 assignments•Total 118 minutes
Self-Reflection: Account for bias in your usability study•10 minutes
Test your knowledge on coming up with research insights•8 minutes
Test your knowledge on handing off designs•10 minutes
Activity: Refine your portfolio project mockups•30 minutes
Module 5 Challenge •60 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
Instructor ratings
Instructor ratings
We asked all learners to give feedback on our instructors based on the quality of their teaching style.
Grow with Google is an initiative that draws on Google's decades-long history of building products, platforms, and services that help people and businesses grow. We aim to help everyone – those who make up the workforce of today and the students who will drive the workforce of tomorrow – access the best of Google’s training and tools to grow their skills, careers, and businesses.
"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."
Jennifer J.
Learner since 2020
"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."
Larry W.
Learner since 2021
"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."
Chaitanya A.
"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."
Learner reviews
4.8
4,810 reviews
5 stars
87.44%
4 stars
10%
3 stars
1.55%
2 stars
0.45%
1 star
0.54%
Showing 3 of 4810
V
VK
5·
Reviewed on Oct 21, 2023
Amazing content from google, they not only cover figma also they concentrated on UX and other design aspects, Very helpful to build by career. Thank you Coursera & Google.
M
MV
5·
Reviewed on Aug 22, 2022
This has been an increadible course, you learn a lot about design and the different elements that are important for the user's experience. If you can take this course straight will be much easier.
E
EL
5·
Reviewed on Oct 18, 2023
I am absolutely delighted with the course I have taken. The course is very intensive, interesting, I received a lot of useful information. I went up another level. Thanks Google!!!
User experience (UX) designers focus on the experience that users have while using products like websites, apps, and physical objects. UX designers make those everyday interactions useful, enjoyable, and accessible. The role of an entry-level UX designer might include coming up with ideas to address user problems, conducting research with users, and designing wireframes, mockups, and prototypes.
If you enjoy talking to and empathizing with people, drawing, thinking creatively, or paying attention to details, a job as a UX designer might be a good fit for you!
What background is required?
This course is the fifth of seven courses that will equip you with the skills you need to apply to entry-level jobs in user experience design. We strongly recommend that you complete the first four courses of the Google UX Design Certificate before completing this one:
Alternatively, you should have experience conducting user research in order to empathize with user needs and determine specific user pain points. You also need to have the ability to create personas, user stories, and user journey maps, as well as draft problem statements and value propositions. You need to know how to create wireframes and low-fidelity prototypes on paper and in the design tool Figma. It’s helpful to have experience conducting usability studies and iterating on designs, as well. If you are unfamiliar with any of these topics, they are covered in earlier courses of the Google UX Design Certificate.
What tools or platforms are included in the curriculum?
Figma and Adobe XD are the design tools taught in the seven courses of the Google UX Design Certificate. This course focuses on creating designs in Figma.
Spreadsheets, word processing applications, and presentation applications will also be used. Throughout the program, you will create a professional portfolio, using the platform of your choice, to showcase your UX design work.
Which jobs will this certificate help me prepare for?
One of the most exciting parts about joining the field of user experience is the large number of job opportunities available. Nearly every company needs UX designers to help create their digital and physical products. While the need for UX designers continues to grow, there is currently a shortage of UX design professionals to fill those roles.
A career in UX design allows you the opportunity to work as a generalist, finding a role as a UX designer, UI designer, or UX researcher, or as a specialist, like a visual designer or interaction designer. Upon completion of this certificate program, you will be able to search for jobs with all of these titles, and find the role that best suits you.
Do I need to take the course in a certain order?
This is the fifth of seven courses in the Google UX Design Certificate. We highly recommend completing the seven courses in this certificate program in the order presented, because the content and applications in each course build on information presented and practiced in earlier courses.
When will I have access to the lectures and assignments?
To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
What will I get if I subscribe to this Certificate?
When you enroll in the course, you get access to all of the courses in the Certificate, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.