Creating design components in Figma from scratch

Creating design components in Figma from scratch

Join this webinar to understand the fundamental concept behind creating Figma components and variants.

By Olga Flippence, a product designer

Date and time

Saturday, June 1 · 3 - 5:30am PDT

Location

Online

Refund Policy

Contact the organizer to request a refund.
Eventbrite's fee is nonrefundable.

Agenda

11:00 AM - 11:05 AM

Introductions and overview of the session

11:06 AM - 11:15 AM

Understanding the concept of atomic design

11:16 AM - 11:20 AM

Demo: create an atom component

A presenter will show how to create a component from scratch using the established framework to create variants.

11:21 AM - 11:30 AM

Practice: create an atom component of your choice

Now it's your turn. Pick a component out of the proposed list or suggest your own and create it in Figma.

11:31 AM - 11:40 AM

Present your component to the group

A few participants can volunteer to present their components to the group and explain the thinking behind creating a component.

11:41 AM - 11:50 AM

Demo: create a molecule component

A presenter will show how to create a molecule component.

11:51 AM - 12:05 PM

Practice: create a molecule component of your choice

Now it's your turn. Pick a component out of the proposed list or suggest your own and create it in Figma.

12:06 PM - 12:20 PM

Break

12:21 PM - 12:30 PM

Demo: create a complex component

A presenter will show how to create a complex component that consists of atoms and molecules.

12:31 PM - 12:50 PM

Practice: create a complex component of your choice

Now it's your turn. Pick a component out of the proposed list or suggest your own and create it in Figma.

12:51 PM - 1:05 PM

Present your component to the group

A few participants can volunteer to present their components to the group and explain the thinking behind creating a component.

1:06 PM - 1:10 PM

Demo: How to check accessibility of the created components

1:11 PM - 1:15 PM

Demo: How to publish your components

1:16 PM - 1:30 PM

QA and closing thoughts

About this event

  • 2 hours 30 minutes
  • Not sure how to create components and variants in Figma in an efficient way?
  • Still confused about the concept of the atomic design?


This collaborative and interactive session will demythify a lot of processes. You will also get to practice and present your work

Tags

Organized by

Olga Flippence, a product designer