PLEASE NOTE THERE IS A <a href="https://skl.sh/405O7fs" rel="nofollow noreferrer noopener" target="_blank">NEW VERSION OF THIS COURSE AVAILABLE! </a>
In this class, I am going to teach you everything you need to know about Figma as a UX/UI Designer. 
We will start from zero, setting up an account and getting to know the Figma structure. 
I will then introduce you to the brief as throughout the course we will work on a real project to create a tracking app from the first stroke to finish design.
We will start with setting up a wireframe and flowchart using Figma whereby I will show you all the Figma basics such as
<ul>
<li>Setting up frames</li>
<li>Adding shapes, text, and color</li>
<li>Vector drawings in Figma</li>
<li>learn about the layers panel, grouping, and positioning</li>
<li>The magic of auto layout</li>
<li>Using pages in Figma for structure</li>
<li>Creating simple flow charts</li>
</ul>
We will then bring the wireframe alive and set up the UI Design, where we will get to know powerful features such as
<ul>
<li>Styles for your color and typography settings to create a hierarchy</li>
<li>Setting up Grids in Figma</li>
<li>Learn about components and variants, a must for any UX/UI Designer</li>
<li>Use constraints to test your design on different screen sizes</li>
<li>Learn how to use the Figma community section</li>
<li>Clipping and fixing elements for presentation mode </li>
</ul>
To finish off I will show you how to create a team library and share your files with your design and development team the right way. 
In under two hours, you will find out everything about Figma that you need to tackle any project.  Let's start!
© moonlearning.io with moon learning

0000 Figma Intro

NEW VERSION AVAILABLE!

0101 What Is Figma? Who Does the Coding? 

0102 Course Project – What We Will Build

0103 Getting Figma – Registration Process

0104  Figma Working Structure 

0105 Figma in the Browser vs Figma App

0106 Setting up First Frames

0107 Useful Shortcuts   Pan, Zoom and More

0108 Adding Shapes to a Frame

0109 Duplicating

0110 Drawing in Figma

0111 Creating Groups

0112 Adding and Styling Text

0113 Positioning Alignment and Nudging 

0114 Changing Colour Strokes and Fills

0115 Creating Styles in Figma

0116 Working with Components and Istances   make into comp and overrides

0118 Pages in Figma

0119 Creating a Simple Flowchart With a Plugins

0120 Figma Community Section

Note: Before we start with auto layout

0121 Auto Layout Introduction

0122 Nested Auto Layout – Building a Nested Card

0123 Finishing off Our Wireframe

0124 Organizing our File to Start the UI Design

0125 Which Frame Size Should I Use? 

0126 Setting up Grids in Figma

0127 Colour Styles and Naming Conventions

0128 Setting up a Typescale

0129 Images in Figma

0130 Responsive Layouts With Constraints

0131 Boolean Operations in Figma

0132 Nested Components and Variants

0133 More About Variants   Creating the Calendar Bar

0134 More Constraints  Creating a Responsive Calendar

0135 Scaling in Figma   Building the Mood Pages

0136 Clipping Content   Building the Magazine Pages 

0137 Presentation Mode with Scrollable and Fixed Elements

0138 Figma Mirror – Preview on Your Device

0139 Sharing Files With Designers and Developers

0140 Figma Inspect Panel

0141 Exporting Assets

0142 Figma Team Library

0143 Setting up a Thumbnail

UPDATE: Auto Layout

Thank You

Figma: The Absolute Beginner to Pro Class building an App

Shantanu Kumar gave you 1 free month of Skillshare

Get 1 free month of Skillshare

Figma: The Absolute Beginner to Pro Class building an App

Creative Learning Made Easy

Company

Work With Us

Teach with Us

Shop

Mobile