Learn how to build a design system in Figma through this 8-hour course. By the end of the course, you will master creating design systems in Figma and understanding master components. The course covers topics such as creating a color system, building a type system, working with icons, text legibility, layout, spacing methods, responsive grid layout, and various UI components like buttons, cards, dialogs, and more. The teaching method includes video lectures and practical demonstrations. This course is intended for individuals interested in design, particularly those looking to enhance their skills in creating design systems using Figma.
Overview
Syllabus
Introduction.
Creating a Color System.
Building a Type System in Figma.
Elevation.
Product & System Icons.
Text Legibility.
States.
Selection (Interaction).
Understanding Layout.
Pixel Density.
Spacing Methods.
Responsive Grid Layout.
App Bar - Bottom.
App Bar - Top.
Backdrop.
Banners.
Bottom Navigation.
Buttons - Floating Action Button.
Buttons.
Cards.
Chips.
Dialogs.
Date Pickers.
Dividers.
Taught by
freeCodeCamp.org
Related Courses
Related articles
Reviews
4.5 rating, based on 2 Class Central reviews
-
Sathwik Kumarnice i understood it very good thank you i am very happy to see this vedio so i request every one to watch this video so thank you free code camp for this superb explanination i also done html course i free code camp i am very happy -
Ajay RamanAt first i thought, this is boring.
But it's compulsory to learn the Design System because you need to follow the guidelines to design a Web or Mobile application.
It's good and informative.
