Complete Web Design: from Figma to Webflow to Freelancing
3 in 1 Course: Learn to design websites with Figma, build with Webflow, and make a living freelancing.
3 in 1 Course: Learn to design websites with Figma, build with Webflow, and make a living freelancing.
Web design is fun. It's creative.
It gives you huge self-satisfaction when you look at your work and say, "I made this.". I love that feeling after finishing something. When I lean back in my chair, look at the final result with a smile, and have this little spark joy moment.
It's especially satisfying when I know I just made $5,000.
Wouldn't you want to have that?
Be your own boss?
Be a professional with a skill that's in demand?
Working from home? Or Starbucks? Or a bathtub, if that’s your thing. Or maybe somewhere awesome, like Bahamas?
I do! That's why I got into this field. Not initially for the love of web design, though I do love it now. I got in for the lifestyle.
There are many ways one can achieve this lifestyle. This is my way. This is how I reached the life I dreamed about for years. And I’m going to teach you to do the same.
Often people think web design is complicated, that it needs creative talent or knack for computers. Sure, a lot of people make it complicated. People make the simplest things complicated, just like most subjects taught in universities.
But I don't like complicated. I like easy. I like life hacks. I like taking the shortest, simplest route to my goal. I didn’t go to art school or get a computer science degree. I’m an outsider who hacked my way into this field, and somehow, I ended up as a sought-after professional.
That’s how I’m going to teach you web design. So you’re not discouraged by needless complexity. So you enjoy the process because it's simple and fun. So you can become a freelance web designer in no time.
Enroll now and start whenever the time is right for you. I keep the course up to date, review every assignment, and answer every question in the Q&A.
FAQ area empty
Intro to Typography
97Typeface Comes With a Personality
111Typeface Categories
375Practice: Typeface Personality
415Typeface Personality & Categories
Typeface Personality Practice
Setting type
510Setting Type
Practice: Setting type
447Setting Type Practice
Two fonts only
167Where to Find Fonts
237Practice: Typeface Pairing
427Typeface Pairing Practice
Section Notes
Intro to Photos
23Image Overlays
117Practice: Image Overlays
318Image Overlays Practice
Photo Cropping Techniques - Extreme Crop
268Photo Cropping Techniques - Soft Crop
283Practice: Photo Cropping
549Photo Cropping Practice
Rule of Thirds
278Unbox it!
250Figma AI: Image Edit Features
1032Pick Photos Like a Pro
372Where to Find Photos
207Practice: Finding Photos
256Finding Photos Practice
Section Notes
Section, Container, Div Block
233Sandbox Version of Chat App
Size Settings
716Padding & Margins
777Section Notes
Web Typography
495Buttons and Links
337CSS Classes
358Images
406Display Property
331Flexbox
759Webflow vs Figma Sizes
574Flexbox Game
Webflow Documentation
Navbar (Chat App)
615Webflow Debugging Checklist
890Hover State
493Middle Section (Chat App)
265HTML Tags
661Combo Classes
521CTA Section (Chat App)
816Footer (Chat App)
766Good Design Process
483Project Brief
312Mood Board
284Why Wireframing?
455Figma Styles
185Figma Components
460Wireframe Kit
307Wireframes – Homepage Part 1
798Wireframes – Homepage Part 2
1043Wireframes – Post Page
588Wireframes – Blog
535Final Result – Team App Wireframes
Team App Homepage Design: Part 1
833Team App Homepage Design: Part 2
1423Team App Homepage Design: Part 3
918Team App Blog Post Design
479Team App Blog Grid Design
989Final Result – Team App Designs
Intro
62Background Styles
490Sandbox Version of Team App Website
Navbar (Team App)
582Hero Content (Team App)
674Forms
720Mockup Section – Part 1 (Team App)
645Mockup Section – Part 2 (Team App)
255Photo Sections (Team App)
249Slider Component
279Testimonial Slider (Team App)
747Positioning
518Slider Arrows
347Footer (Team App)
406Footer Form (Team App)
560CMS & Dynamic Content
93Webflow CMS
336CMS Items
226Collection Page
244Blog: Navbar & Headline
313Blog: Author & Date Block
244Reference Field
363Object Fit
127Blog: Main Image
167Rich Text
758Blog: Author Block Bottom
194Webflow Components
604Blog: Responsive Post Page
318Blog: Homepage
782Collection List
595Pagination
407Blog: Responsive Homepage
295Webflow: Custom Modal (Pop-Up)
1423Build With Claude AI in Webflow (Part 1)
738Build With Claude AI in Webflow (Part 2)
1171Build With Claude AI in Webflow (Part 3)
698AI Code Components
949Google Analytics
400Cookie Consent Installation
1311Code Embed + AI
1154CodePen + AI
1411More Webflow Videos
Webflow Plans, Accounts and How to Handover the Website to the Client
Upwork Overview
305Tips 1-3: Getting your profile approved
253Articles on Upwork’s Approval Process
Tips 4-9: Create a profile that attracts clients
406Tips 10-12: Get the "best match" badge
209Tips 13-14: Propose the right price
249Tips 15-16: Be the freelancer they can't resist
363Tips 17-22: Write damn good cover letters
418Tips 23-25: Don't get yourself suspended
325Tips 26-28: Don't get scammed
102You will need a computer with internet access.
You will create free accounts with Figma and Webflow.
You will learn design concepts like layout, typography, visual hierarchy, design tricks, and more.
You will learn how to design beautiful websites using Figma, an interface design tool used by designers at Uber, Airbnb and Microsoft.
You will learn how to take the designs and build them into websites using Webflow, a powerful site builder used by teams at Adobe, Dell, NASA and more.
You will learn freelancing strategies used by successful web designers and how they make good money freelancing online.