Links to help you navigate Figma and catered to various topics related to our workshops and assignments

1. Basic Tools + Features → Workshop 3

• Frames

  Frames in Figma Design

• Shapes

  • polygons (+ keyboard shortcuts)

    Basic shape tools in Figma design

  • vector shapes (+ curving)

    Vector networks

• Text + Typography

  Browse and apply fonts

  Font Types: Different Types of Font & Typeface | Figma

  • adding custom fonts

    Add a font to Figma design

• Color + gradients

  Paints in Figma

  Figma Tutorial: Gradients (Linear, Radial, Angular, Diamond)

• Styles

  Create color, text, effect, and layout grid styles

• Scaling

  Resize layers with the scale tool

• Groups

  Boolean operations

  Masks

  When to use groups versus frames in Figma

  The difference between frames and groups

2. Components → Workshops 3 & 4

• Creating and using components

  Create components to reuse in designs

• Variants

  Create and use variants

• Instances and Overrides

  Swap components and instances

  Apply overrides to instances

• Component Properties

  Explore component properties

• Creating Icons + Icon Libraries

  Figma for Edu: Icon basics in Figma.

  How to Build a Figma Icon Library (3 different ways!)

3. Prototyping → Workshop 7

• Creating a Prototype

  Guide to prototyping in Figma

  Create and manage prototype flows

• Prototype Actions, Triggers, and Animations

  Prototype actions

  Prototype triggers

  Prototype animations

• Overlays

  Create overlays in your prototypes

• Scrolling

  Prototype scroll and overflow behavior