Getting Started with Figma (2h)

 

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.

 

Part 1: Figma Basics - Creating a wireframe 

We will start with setting up a wireframe and flowchart using Figma whereby I will show you all the Figma basics such as

• Setting up frames
• Adding shapes, text, and color
• Vector drawings in Figma
• learn about the layers panel, grouping, and positioning
• The magic of auto layout
• Using pages in Figma for structure
• Creating simple flow charts 

 

Part 2: Setting up the UI Design

We will then bring the wireframe alive and set up the UI Design, where we will get to know powerful features such as

• Styles for your color and typography settings to create a hierarchy
• Setting up Grids in Figma
• Learn about components and variants, a must for any UX/UI Designer
• Use constraints to test your design on different screen sizes
• Learn how to use the Figma community section
• Clipping and fixing elements for presentation mode 

 

Part 3: Sharing your Files with Design and Development

To finish off, I will show you how to share files for handoff.  We will look at how to

• Create a team library and 
• Have a look at the Figma inspect panel
• Learn how to export assets in different resolutions
• Set up a thumbnail
• Share your files with your design and development team 

In under two hours, you will find out everything about Figma that you need to tackle any project.  Let's start!

 

Take full course

Already a member? Click here