English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 266 lectures (26h 16m) | 7.87 GB
Go from complete beginner to getting hired as a Designer in 2022! This is the only design bootcamp you need to learn and master web design, mobile design, Figma, UI & UX, and HTML + CSS.
We guarantee you that this is the best online design course and design bootcamp that you can find if you want to go from an absolute beginner with zero design knowledge to getting hired as a Web Designer making $100,000+.
WHAT YOU’LL LEARN
- Build beautifully designed web and mobile projects for your customers using modern tools used by top companies in 2022
- Immediate access to 100+ assets and premium design templates that you can keep and use to customize all your future projects
- Learn Figma from scratch for all types of design needs and then how to convert your designs into a live HTML and CSS website
- Master both Web design and Mobile design principles and how to go from sketching to fully-fledged high fidelity designs that will wow customers
- Learn design best practices and expert tips & tricks that would take you years to learn working full-time
- Learn UI/UX best practices using the latest trends in the industry
Table of Contents
Introduction
1 Course Outline French
2 Join Our Online Classroom French
3 Exercise Meet Your Classmates and Instructor
4 Meeting The Client French
5 The 2 Paths French
6 Exercise Building Your Logo French
7 Design Resources
8 Designer vs Developer French
9 Skills To Be A Top Designer French
10 Monthly Coding Challenges, Free Resources and Guides
GETTING STARTED – Sketching, Inspiration, User Flows
11 Getting Ready For This Section
Sketching
12 Introduction To Sketching French
13 The Sketching Process French
14 Sketching User Flows French
15 Sketching User Flows 2 French
16 Sketching User Flows 3 French
17 Sketching User Flows 4 French
18 Sketching Tips French
Inspiration
19 How To Stay Inspired French
20 How To Find Inspiration French
Introduction To Figma
21 Getting Started With Figma
22 Introducing Figma French
23 Figma Dashboard French
24 Figma Tools French
25 Layers & Pages French
26 The Top Bar French
27 Design Properties French
28 Prototyping With Figma French
29 Exercise Creating A Responsive Layout French
User Flows
30 What Are User Flows French
31 The Do’s And Don’ts French
32 Speed Up Workflow With Components French
33 Creating Our Own User Flows French
34 Creating Our Own User Flows 2 French
35 Creating Our Own User Flows 3 French
36 Endorsements On LinkedIN
Sitemaps
37 Introduction To Sitemaps French
38 Creating A Basic Sitemap French
39 Before You Start French
40 Creating A Sitemap French
41 Creating A Sitemap 2 French
42 Tips For Getting Started French
EXPLORE & ITERATE – Wireframes, Prototyping, and Feedback
43 Getting Ready For This Section
Wireframes
44 What Is A Wireframe French
45 How To Create A Wireframe French
46 Wireframes In FIgma French
47 Creating Our Home Page French
48 Creating A Product Page French
49 Creating A Checkout Page French
Prototyping
50 Prototyping Basics In Figma French
51 Prototyping Basics In Figma 2 French
52 Prototyping Basics In Figma 3 French
53 Prototyping Basics In Figma 4 French
54 Linking Together A Quick User Flow French
55 Working On Small Interactions French
56 Exercise Imposter Syndrome French
Feedback
57 Why Is Feedback Important French
58 Constructive Feedback French
VISUAL DESIGN – Design Theory + Accessibility
59 Getting Ready For This Section
Spacing And The Grid
60 What Is A Grid French
61 Grid Basics French
62 Responsive Grids And Breakpoints French
63 Making Our Grid In Figma French
64 Grid Guidelines French
Typography
65 Serifs French
66 Sans Serifs French
67 Display & Mono French
68 Picking Typefaces French
69 Choosing Typefaces For A Project French
70 Choosing Typefaces For A Project 2 French
71 Choosing Typefaces For A Project 3 French
72 Creating Our Own Type System French
Color
73 Color Schemes French
74 Important Questions To Ask French
75 Creating Color Palettes French
76 Creating A Monochromatic Color Palette French
77 Applying Our Color Palette French
78 Expanding A Strict Color Palette French
79 Creating Our Own Color Palette French
Forms + UI Elements
80 What Are Forms + UI Elements French
81 Best Practices For Forms French
82 Best Practices For Inputs French
83 Best Practices For Inputs 2 French
84 Best Practices For Inputs 3 French
85 Best Practices For Inputs 4 French
86 Best Practices For Buttons French
87 Creating Components In Figma French
88 Using Atomic Elements French
89 Using Instances In Figma French
90 Editing Instances French
91 Responsive Components French
92 Creating A Registration Form In Figma French
Visual Assets
93 Visual Assets Introduction French
94 Working With Photos In Figma French
95 Working With Photos In Figma 2 French
96 Working With Illustrations In Figma French
97 Figma Plugins And Icons French
98 Custom Icons French
Accessibility
99 Assistive Technologies French
100 Visual Patterns For Accessibility French
101 Tools To Make Your Design Accessible French
102 Visual Patterns For Accessibility Part 2 French
103 What Is Accessibility French
DESIGN EXPLORATION – Application Design + Design Systems
104 Getting Ready For This Section
Design Patterns
105 What Are Design Patterns French
106 Why Are Design Patterns Valuable French
107 How To Apply Design Patterns French
108 Analyzing Design Patterns French
109 Dissecting And Choosing Design Patterns French
Mobile Design
110 Mobile Design Best Practices French
111 Mobile Design Best Practices 2 French
Visual Style + Exploration
112 Design Fidelity French
113 Style Exploration French
114 Style Exploration 2 French
115 Style Exploration 3 French
116 Style Exploration 4 French
Motion
117 The Importance Of Motion French
118 The Purpose Of Motion French
119 Intro To Smart Animate French
120 The Power Of Smart Animate French
Microinteractions
121 What Is A Microinteraction French
122 Why Microinteractions Are Important French
123 Creating Our Own Microinteraction French
124 Creating Our Own Microinteraction 2 French
125 Using Figmotion French
126 Using Figmotion 2 French
PUTTING IT ALL TOGETHER – Design Systems and Final Compositions
127 Getting Ready For This Section
Design Systems
128 What Is A Design System French
129 Foundation French
130 Foundation French
131 Foundation French
132 Foundation French
133 Components French
134 Components French
135 Components French
136 Recipes French
137 Recipes French
138 Recipes French
Final Compositions
139 Using Our Design System French
140 Using Our Design System 2 French
141 Using Our Design System 3 French
142 Final Prototypes French
143 Final Prototypes 2 French
144 Final Prototypes 3 French
145 Final Prototypes 4 French
Working With A Client Revisited
146 Design Resources
147 The Product Alignment Canvas French
148 Project Goals French
149 Target Users French
150 User Journey Map French
151 Risky Assumptions French
152 What is a User Story Map French
153 Creating a User Story Map French
Where To Go From Here
154 Course Review
155 The Final Challenge
156 Is Bruno Happy French
157 Project Handoff French
158 Next Step Project Handoff
159 Thank You French
160 Learning Guideline
161 Become An Alumni
162 LinkedIn Endorsements
Web Portfolio
163 Design Resources
164 How To Export And Place Designs French
165 Content For Your Portfolio French
166 Where To Host Your Web Portfolio French
From Figma To Website Building Our Landing Page
167 Quick Note Upcoming Videos
168 Initial Setup French
169 Build UI French
170 Build UI French
Extra How The Internet Works
171 Quick Note Upcoming Videos
172 Browsing the Web French
173 Breaking Google French
174 Exercise Break Google Yourself
175 The Internet Backbone French
176 Traceroute French
177 Exercise Running traceroute
178 DEVELOPER FUNDAMENTALS I French
179 What Does A Developer Do French
180 Web Developer Monthly
Extra History Of The Web
181 WWW vs Internet French
182 HTML, CSS, Javascript French
183 DEVELOPER FUNDAMENTALS II French
184 Developer History French
185 Exercise Adding CSS and JavaScript to Tim’s website
186 Optional Resource More About the History of the Web
Extra HTML 5
187 Build Your First Website French
188 Resources Your Text Editor
189 DEVELOPER FUNDAMENTALS III French
190 Quick Note About w3schools
191 How To Ask Questions
192 HTML Tags French
193 HTML Tags 2 French
194 Self Closing HTML Tags French
195 Anchor Tag French
196 Q&A index.html French
197 Q&A Relative vs Absolute Path French
198 HTML Forms French
199 HTML Forms 2 French
200 Submitting A Form French
201 HTML Tags 3 French
202 HTML vs HTML 5 French
203 Copy A Website French
204 HTML Challenge French
205 HTML Lesson Files
206 Optional Exercise More HTML
Extra CSS 3
207 Exercise Files Code-Along
208 Your First CSS French
209 CSS Properties French
210 CSS Selectors French
211 Optional Exercise CSS Selectors
212 Text and Font French
213 Images In CSS French
214 Box Model French
215 px vs em vs rem French
216 Optional PX, EM, REM, %, VW, and VH
217 Critical Render Path French
218 Exercise File Code-Along Images
219 Flexbox French
220 Optional Exercise Flexbox Froggy
221 CSS 3 French
222 Optional Exercise Mastering Transitions and Transforms
223 Responsive UI French
224 Image Gallery Files
225 Exercise Robot Animation French
226 Exercise Robot Animation Starter Files
227 Solution Robot Animation
228 Optional Exercise CSS
Extra Bootstrap, Templates, And Building Your Startup Landing Page
229 Evolving Technology French
230 Bootstrap Introduction French
231 Bootstrap French
232 Bootstrap 5 Update French
233 Bootstrap Grid French
234 Free Resources For Our Project
235 Exercise Startup Landing Page French
236 Exercise Startup Landing Page 2 French
237 Exercise Startup Landing Page 3 French
238 Exercise Startup Landing Page 4 French
239 Exercise Startup Landing Page 5 French
240 Exercise Adding Email Subscribe Form With MailChimp French
241 Quick Note Upcoming Videos
242 Exercise Putting Your Website Online French
243 Exercise Putting Your Website Online 2 French
244 Quick Note Upcoming Video
245 DEVELOPER FUNDAMENTALS IV French
246 Using Templates French
247 Resources for FREE Templates
248 Startup Landing Pages by Students
Extra CSS Grid + CSS Layout
249 Section Overview French
250 CSS Grid vs Flexbox vs Bootstrap French
251 Quick Note Upcoming Video
252 CSS Grid 1 French
253 CSS Grid 2 French
254 CSS Grid 3 French
255 CSS Grid 4 French
256 CSS Grid 5 French
257 Optional Exercise CSS Grid
258 Exercise CSS Layout French
259 Solution Navigation Bar French
260 Solution Navigation Bar 2 French
261 Solution Cover French
262 Solution Project Grid + Footer French
263 Quick Note Upcoming Video
264 Solution Prettify French
265 The Truth About CSS French
BONUS SECTION
266 Bonus Lecture
Resolve the captcha to access the links!