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.
涵盖的内容
16个视频23篇阅读材料4个作业2个插件
显示有关单元内容的信息
16个视频•总计52分钟
Introduction to Course 5: Create High-Fidelity Designs and Prototypes in Figma•2分钟
Kunal - My journey to UX•3分钟
Welcome to module 1•2分钟
Introduction to mockups •4分钟
Chikezie - Transition from low-fidelity to high-fidelity designs •2分钟
Introduction to foundational elements of visual design •2分钟
Typography in UX design•3分钟
The importance of typography •6分钟
Color in UX design•8分钟
Iconography in UX design•5分钟
Add images to your mockups•3分钟
Introduction to layouts•1分钟
Use grids to guide layouts •4分钟
Use containment in layouts•3分钟
Use negative (white) space in layouts•4分钟
Wrap-up: Starting to create mockups •1分钟
23篇阅读材料•总计146分钟
Welcome to Course 5•8分钟
Helpful resources and tips•4分钟
Foundational skills to build mockups in Figma•8分钟
Review: Use low-fidelity designs to start project mockups•4分钟
Work with type in mockups•8分钟
Add product copy to mockups•8分钟
Review: Add typography to project mockups•4分钟
Work with color in mockups •8分钟
Accessibility considerations for color•8分钟
Review: Add color to project mockups•4分钟
Work with icons in mockups •8分钟
Review: Add icons to project mockups•4分钟
Learn about more visual design elements •8分钟
Find stock images for mockups•8分钟
Additional design considerations•8分钟
Create grids in mockups•8分钟
Review: Create grids in project mockups•4分钟
Create containment in mockups•8分钟
Review: Create containment in project mockups•4分钟
Use negative space in mockups•8分钟
Review: Revise project mockups by adding negative space•4分钟
Common design patterns in apps•8分钟
Glossary terms from course 5, module 1•2分钟
4个作业•总计72分钟
Module 1 Challenge•50分钟
Test your knowledge of typography•8分钟
Test your knowledge on color•4分钟
Self-Reflection: Share what you've learned about page layouts•10分钟
2个插件•总计60分钟
Build a mockup from foundational elements•30分钟
Test your knowledge on containment and negative space in design•30分钟
Applying visual design principles to mockups
第 2 单元•小时 后完成
单元详情
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.
涵盖的内容
8个视频11篇阅读材料6个作业1个插件
显示有关单元内容的信息
8个视频•总计29分钟
Welcome to module 2•1分钟
Emphasis in UX design•4分钟
Hierarchy in UX design•4分钟
Scale and proportion in UX design•5分钟
Unity and variety in UX design•4分钟
Apply Gestalt Principles to mockups•6分钟
Reflect on your progress •4分钟
Wrap-up: Applying visual design principles to mockups •1分钟
11篇阅读材料•总计74分钟
Use emphasis in mockups•8分钟
Use hierarchy in mockups•8分钟
Use scale and proportion in mockups •8分钟
Use unity and variety in mockups •8分钟
Review: Apply visual design principles to project mockups•4分钟
Learn about additional Gestalt Principles •8分钟
Review: Apply Gestalt principles to project mockups•4分钟
Consider additional visual design elements and principles •8分钟
Learn about interface design principles •8分钟
Include navigation in mockups•8分钟
Glossary terms from course 5, module 2•2分钟
6个作业•总计96分钟
Module 2 Challenge•60分钟
Test your knowledge on emphasis and hierarchy•8分钟
Test your knowledge on scale and proportion•6分钟
Test your knowledge on unity and variety •4分钟
Test your knowledge of Gestalt Principles•8分钟
Self-Reflection: Include navigation in your mockups•10分钟
1个插件•总计10分钟
Apply visual design principles•10分钟
Exploring design systems
第 3 单元•小时 后完成
单元详情
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.
涵盖的内容
9个视频5篇阅读材料4个作业
显示有关单元内容的信息
9个视频•总计36分钟
Welcome to module 3•1分钟
Introduction to design systems•3分钟
Benefits of design systems •4分钟
Google's design system: Material Design •8分钟
Shopify's design system: Polaris •4分钟
Create a sticker sheet in Figma•4分钟
Use a design system library in Figma•9分钟
Shabi - Consider assistive technologies when working in design systems•2分钟
Wrap-up: Exploring design systems•1分钟
5篇阅读材料•总计30分钟
Explore popular design systems •8分钟
Create sticker sheets for design projects•4分钟
Get inspiration from design systems•8分钟
Optional - Learn from Figma - Use a design system library•8分钟
Glossary terms from course 5, module 3•2分钟
4个作业•总计83分钟
Module 3 Challenge•65分钟
Test your knowledge on design systems•6分钟
Test your knowledge on features of open-source design systems•6分钟
Test your knowledge on working with design systems in Figma•6分钟
Creating high-fidelity prototypes
第 4 单元•小时 后完成
单元详情
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.
涵盖的内容
9个视频6篇阅读材料5个作业
显示有关单元内容的信息
9个视频•总计32分钟
Welcome to module 4•1分钟
Introduction to high-fidelity prototypes •4分钟
Create a high-fidelity prototype in Figma •4分钟
Gestures and motion in UX design •2分钟
Add gestures and motion in Figma •6分钟
Accessibility considerations for gestures and motion •3分钟
Jen - Design with accessibility in mind•4分钟
Learn from Figma - Prototype interactions and feedback •8分钟
Wrap-up: Creating high-fidelity prototypes•1分钟
6篇阅读材料•总计34分钟
Explore types of gestures and motion •8分钟
Follow-along guide: Add gestures and motion in Figma•4分钟
Learn more about prototyping in Figma •8分钟
Additional ways to enhance high-fidelity prototypes•8分钟
Glossary terms from course 5, module 4•2分钟
Exemplars: Create a high-fidelity prototype for your mobile app•4分钟
5个作业•总计148分钟
Module 4 Challenge •60分钟
Test your knowledge on creating a high-fidelity prototype in Figma•10分钟
Test your knowledge on gestures and motion•8分钟
Self Reflection: Address accessibility considerations when designing with motion •10分钟
Activity: Create a high-fidelity prototype for your mobile app•60分钟
Testing and iterating on designs
第 5 单元•小时 后完成
单元详情
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.
涵盖的内容
12个视频13篇阅读材料5个作业
显示有关单元内容的信息
12个视频•总计40分钟
Welcome to module 5•1分钟
Plan a UX research study•4分钟
Conduct a usability study•3分钟
Analyze and synthesize usability study results•2分钟
Iterate on high-fidelity designs•10分钟
Identify when a design is complete•2分钟
Document and share designs•1分钟
Hand off designs for production•2分钟
Learn from Figma - Prepare for hand off•5分钟
Wrap-up: Testing and iterating on designs•1分钟
Create a case study for your portfolio project•7分钟
Congratulations on completing Course 5: Create High-Fidelity Designs and Prototypes in Figma•2分钟
13篇阅读材料•总计84分钟
Learn more about planning a UX research study•8分钟
Learn more about conducting a usability study•8分钟
Learn more about analyzing and synthesizing usability study results•8分钟
Review: Analyze and synthesize the results of a usability study•4分钟
Learn more about identifying when a design is complete•8分钟
Final designs of the dog walker app in Figma•4分钟
Glossary terms from course 5, module 5•4分钟
Portfolio project guide for creating hi-fi prototypes•10分钟
Review: Refine your high-fidelity portfolio project designs•10分钟
Learn more about creating a case study for your portfolio project•10分钟
Reflect and connect with your peers•4分钟
Course 5 glossary•2分钟
Start the next course•4分钟
5个作业•总计118分钟
Module 5 Challenge •60分钟
Self-Reflection: Account for bias in your usability study•10分钟
Test your knowledge on coming up with research insights•8分钟
Test your knowledge on handing off designs•10分钟
Activity: Refine your portfolio project mockups•30分钟
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.
确定
人们为什么选择 Coursera 来帮助自己实现职业发展
Felipe M.
自 2018开始学习的学生
''能够按照自己的速度和节奏学习课程是一次很棒的经历。只要符合自己的时间表和心情,我就可以学习。'
Jennifer J.
自 2020开始学习的学生
''我直接将从课程中学到的概念和技能应用到一个令人兴奋的新工作项目中。'
Larry W.
自 2021开始学习的学生
''如果我的大学不提供我需要的主题课程,Coursera 便是最好的去处之一。'
Chaitanya A.
''学习不仅仅是在工作中做的更好:它远不止于此。Coursera 让我无限制地学习。'
学生评论
4.8
4,810 条评论
5 stars
87.44%
4 stars
10%
3 stars
1.55%
2 stars
0.45%
1 star
0.54%
显示 3/4810 个
M
MV
5·
已于 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·
已于 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!!!
V
VK
5·
已于 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.
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.