Learn how to use Figma Variants to design a scalable mobile app. Variants can streamline your frontend design process by allowing you to group and organize similar components into a single container.
Tutorial file link: https://www.figma.com/file/FrLR3t9jZ9X8psPdmztdlh/Activista-Tutorial-Initial-Screens?node-id=0%3A1
Homework file link: https://www.figma.com/file/8js2feuv6LdhmvVtBXkC2L/Figma-Activista-Tutorial-Homework?node-id=0%3A1
(0:02:13) Accessing Tutorial and Homework Files
(0:04:24) Project Overview
(0:05:27) Recommending Personal and freeCodeCamp Channel
(0:06:25) Basics Overview
(0:08:22) Learning The Frame Functionality
(0:10:25) Learning The Autolayout Functionality
(0:14:39) Learning The Component Functionality
(0:18:55) Learning The Variant Functionality
(0:21:42) Creating The Type System
(0:28:41) Creating The Color Palette/System
(0:35:54) Creating The Icon Set
(0:41:34) Creating Input Variants
(0:52:23) Creating Large Button Variant
(1:00:47) Designing Sign Up and Login Screen
(1:18:46) Creating Status Bar Variant
(1:23:14) Creating The Filter Variant
(1:27:40) Creating Bottom Navigation Variant
(1:35:02) Creating Image Card Variant
(1:49:27) Updating Input Variant
(1:57:31) Designing The Discover Screens
(2:15:20) Creating Large Avatar Variant
(2:24:05) Creating Small Button Variant
(2:32:45) Creating The Benefit Card Variant
(2:46:45) Designing Details Screen
hee: i swear you guys read my mind, its CRAZY I remember trying to use figma and got so overwhelmed and started procrastinating. Couldnt find a good tutorial but this is amazing Date: 2022-04-07
