Figma is a collaborative prototyping tool that allows you to responsively design your applications, with resolution presets for all of the most popular devices. In this course, we will explore the fundamentals of Figma’s toolset that you can use for various design functions.
The Beginner's Guide to Figma
24m 19s
English
Paid
We will start from scratch, then walk through scenarios you may encounter when designing a website or application. We will cover building reusable designs — known as “components” in Figma — all the way up to prototyping your designs to show screen transitions and animations between state.
By the end of the course, you will understand the basics of Figma so you can use it to your advantage when building your next app or website.
Additional
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=0:1
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=50:3
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=113:26
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=115:30
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=76:12
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=141:44
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=143:15
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=143:70
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=163:86
https://www.figma.com/file/VrNgGY4JsPNLt6GHS1dS5qog?node-id=163:87
About the Author: egghead.io
egghead.io is a US-based subscription video platform focused on short, focused screencasts on JavaScript ecosystem topics. Founded in 2012 by John Lindquist (a Google Developer Expert) and run by Joel Hooks, egghead pioneered the short-screencast format that most modern developer-education platforms now use — courses are typically broken into 2-5 minute lessons that each cover one specific concept or API.
The instructor roster includes many of the most cited names in the JavaScript ecosystem — Kent C. Dodds (whose Testing JavaScript launched on egghead before EpicWeb.dev), Andrew Del Prete, Hannah Davis, Lukas Ruebbelke, Tomasz Łakomy, Andy Van Slaars, and many others. Course material covers React, Next.js, TypeScript, Node.js, GraphQL, Vue, the testing tracks, RxJS / observables, and a long list of smaller libraries and tools.
The CourseFlix listing under this source carries over 20 egghead courses spanning that range. Material is paid; egghead itself runs on a monthly / annual subscription on the original platform. The bite-sized format suits developers learning incrementally during work hours rather than committing to multi-hour video sessions.
Watch Online 10 lessons
0:00
/ #1: Create a Mobile, Tablet and Desktop Frame in Figma
All Course Lessons (10)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Create a Mobile, Tablet and Desktop Frame in Figma Demo | 01:01 | |
| 2 | Build Reusable Designs with Figma Components | 03:47 | |
| 3 | Add a Reusable Figma Component to Multiple Frames | 02:15 | |
| 4 | Create a Simple Icon with Figma Ellipse and Pen Tool | 02:02 | |
| 5 | Duplicate Grouped Vectors to Create a Patterned Logo in Figma | 02:15 | |
| 6 | Establish a Typography System in Figma with Text Styles | 02:59 | |
| 7 | Create Figma Color Styles to Reuse Across Frames | 04:05 | |
| 8 | Reuse a Drop Shadow in Figma with Effect Styles | 01:55 | |
| 9 | Prototype a Screen Transition in Figma | 02:17 | |
| 10 | Export and Share Figma Frames | 01:43 |
Unlock unlimited learning
Get instant access to all 9 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionRelated courses
-
Updated 9mo agoFigma Academy 2.0
By: Michael RidderingLearn Figma through clear steps and real examples. This course helps you build strong habits and apply design skills with confidence.11h 19m -
Updated 2y agoMastering Figma
By: Level Up Tutorials (Scott Tolinski)This video is about Mastering Figma Introduction. Figma has similar uses to adobe XD and I'll be bringing you more videos to go more in-depth on how to use.3h 37m -
Updated 2y agoBeginner Figma Video Course
By: Andrija PrelecThere is no better place to start learning design than the most popular design application! Learn by doing and begin or enhance your knowledge in Figma.3h 22m5/5
Frequently asked questions
What prerequisites are needed for enrolling in this course?
This course is designed for beginners with no prior experience in Figma or design tools. Basic computer skills and familiarity with web navigation are sufficient to get started.
What kind of projects will I build during the course?
Throughout the course, you will engage in creating various design elements such as mobile, tablet, and desktop frames, reusable components, simple icons, patterned logos, and prototypes for screen transitions. These projects will help solidify your understanding of Figma's design capabilities.
Who is the target audience for this course?
The course is aimed at anyone interested in learning the fundamentals of Figma, particularly those new to design or looking to transition from other design tools to a collaborative platform like Figma.
How does the depth of this course compare with other Figma courses?
This course focuses on the basics of Figma, covering fundamental tools and functions such as creating frames, components, and prototypes. It is suitable for beginners, whereas more advanced courses might cover complex design systems or advanced prototyping techniques.
What specific tools or platforms are covered in this course?
The course specifically covers Figma's design tools, such as the ellipse and pen tools for icon creation, typography and color styles for design consistency, and effect styles like drop shadows. You will also learn how to export and share your designs using Figma.
What topics are not covered in this course?
The course does not cover advanced functionalities such as Figma's auto-layout features, advanced prototyping interactions, or integration with other tools like Sketch or Adobe XD. It is focused on providing a solid foundation in the basics of Figma.
How can skills from this course benefit my career or other courses?
Skills gained from this course will benefit careers in UI/UX design, graphic design, and any role requiring collaborative design tools. The foundational knowledge of Figma can also serve as a stepping stone for more advanced design courses or tools, enhancing your design proficiency and versatility.