English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 10h 11m | 2.07 GB
Learn motion design using Figma from a design industry pro. You’ll learn way more than just motion design principles and theory. This projects-based course will teach you how to use motion to take your designs (and portfolio) to the next level.
What you’ll learn
- Use Figma like a pro to do User Interface Design, User Experience Design (UX/UI), Web Design and Mobile App Design
- Learn the principles of Motion Design, the design process, best practices, and prototyping your projects for your customers and clients
- Learn to add Motion Graphics and Animations to your projects
- Learn Motion Design using Figma
- Learn to use Smart Animate in Figma
- Micro-interactions, animations, transitions, parallax,
- Create your own professional design portfolio by the end of the course (we provide everything for you to customize!)
- Learn Motion Design by actually building real-world projects alongside a design industry pro that you can add to make your design portfolio stand out
- Learn UI/UX best practices using the latest trends in the industry
Table of Contents
1 Motion Design with Figma Zero to Mastery
2 What We Are Going to Learn
3 Misconceptions of Motion Design
4 Motion Supports Usability
5 Narrative and Mental Models
6 What is a Microinteraction_
7 The Structure of a Microinteraction
8 Not Every Element is a Microinteraction!
9 How Microinteractions Impact User Experiences
10 Recap What Did We Learn_
11 Where To Next_ Your Choice..
12 Intro to Figma Education Plans and Signup
13 Intro to Figma Introduction
14 Intro to Figma Where to use Figma
15 Figma UI File Browser
16 Figma UI Files
17 Figma UI Toolbar
18 Figma UI Left Sidebar
19 Figma UI Right Sidebar
20 Shapes and Tools Working with Containers
21 Shapes and Tools Basic Shapes and Boolean Operations
22 Designing in Figma Images
23 Designing in Figma Getting Started with Text
24 Designing in Figma Constraints
25 Designing in Figma Using Auto Layout
26 Resources and Collaboration Community Files
27 Resources and Collaboration Community Plugins
28 Resources and Collaboration Sharing and Comments
29 What We Are Going to Learn
30 Exercise Create a Quick Logo Using Shapes
31 Exercise Autolayout Buttons
32 Exercise Responsive Navigation
33 Exercise Responsive Text
34 Exercise Imagery and Gradients
35 Exercise Layout and Responsiveness
36 Assignment Create Complex Interactive Components
37 What We Are Going to Learn
38 Smart Animate Properties
39 Smart Animate Basics
40 Exercise Parallax
41 Exercise New Message
42 Exercise Overlay
43 Check-in Interactive Components
44 Exercise Interactive Buttons
45 What We Are Going to Learn
46 Prototype Category Transitions
47 Interactive Components Icons
48 Prototype Simple Microinteractions
49 Prototype Screen Transitions
50 Prototype Simple Horizontal Scroll
51 Prototype Hijacked Horizontal Scroll
52 Assignment Photo Inspiration Mobile App
53 Easing
54 Offset and Delay
55 Parenting
56 Transformation
57 Value Change
58 Masking
59 Overlay
60 Cloning
61 Obscuration
62 Parallax
63 Dimensionality
64 Dolly and Zoom
65 What We Are Going to Learn
66 Navigation Building the Navigation
67 Navigation Prototyping with Simple Variants
68 Navigation Home Interactive Components
69 Navigation Heart Interactive Components
70 Navigation Cart Interactive Components
71 Navigation Settings Interactive Components
72 Navigation Animations with Your Navigation Component
73 Scrolling Landing Page Design
74 Scrolling Anchor Links
75 Scrolling Short Parallax
76 Scrolling Extended Parallax
77 Pagination Carousel Dots
78 Pagination Pagination Control
79 Dragging Listing Card
80 Dragging App Scrolling
81 Dragging Drag and Drop
82 Microinteractions Simple File Uploader
83 Microinteractions Uploader Success
84 Microinteractions Cancel Upload
85 Microinteractions Normal Like Button
86 Microinteractions Like Button Bounce
87 Delight Confetti
88 Delight Checklist
89 Delight Add to Cart
90 Step 1 Discovery and Research
91 Step 2 Design and Storyboard
92 Step 3 Prototype
93 Step 4 Testing
94 Check in Quick Tips!
95 Recap What Did We Learn_
96 What We Are Going to Learn
97 Interactive Component Carousel Section
98 Prototype Simple Carousel Transition
99 Prototype Complex Parallax and 3D Image Effect
100 Assignment Create a Full Page Carousel
101 Exercise Imposter Syndrome
102 What We Are Going to Learn
103 Interactive Component Toggle Card
104 Interactive Component Temperature Slider
105 Prototype Toggle Cards
106 Prototype Simple Temperature Control
107 Prototype Colour Temperature Control
108 Prototype Navigation Transition
109 Assignment Create Complex Interactive Components
110 Feedback Drives Better Design
111 Constructive Feedback
112 Recap What Did We Learn_
113 What We Are going to Learn
114 Interactive Component Website Buttons
115 Interactive Component General Room Card
116 Interactive Component Navigation and Links
117 Prototype Landing Page Parallax Intro
118 Prototype Full Image Parallax
119 Prototype Testimonial Carousel
120 Prototype Staggered Cards
121 Prototype Gallery Image Automated Scroll
122 Assignment Prototype Parallax Effects
123 What We Are Going to Learn
124 Interactive Component Form Buttons
125 Interactive Component Progress Bar
126 Interactive Component Arrow Icon Buttons
127 Interactive Component General Input
128 Interactive Component Select Input and Dropdown
129 Interactive Component Icon Toggle Card
130 Interactive Component Checkbox Item
131 Interactive Component Kitchen Card and Carousel Dots
132 Interactive Component Kitchen Carousel
133 Prototype Form Layout
134 Prototype Form Introduction
135 Prototype General Input and Dropdown Overlay
136 Prototype Toggle Cards and Checkbox
137 Prototype Carousel
138 Assignment Create Interactive Form Components
139 What We Are Going to Learn
140 Interactive Components Buttons
141 Interactive Components Icon Buttons
142 Interactive Components Category Card
143 Interactive Components Tab Navigation
144 Interactive Components Item Card
145 Interactive Components Promo Card
146 Interactive Components Cart Floating Action Button
147 Interactive Components Item Overlay
148 Interactive Components Order Progression Status Icons
149 Interactive Components Order Progression Overlay
150 Prototype Automatic Parallax Carousel
151 Prototype Tab List Transition
152 Prototype Masking and Overlay
153 Prototype Cart Overlay
154 Prototype Order Progress
155 Assignment Create and Design a Full Food Delivery App
156 What We Are Going to Learn
157 What is Kap_
158 Using Kap
159 What is Screencastify_
160 Using Screencastify
161 Thank You!
Resolve the captcha to access the links!