Course Overview
This course has been fully updated and redesigned
to match the Figma 2025 interface and all its latest features.
It’s the third and most refined version of this bestselling course.
“Web Design in Figma — From Scratch to Results. UX/UI Basics”
has become better, bigger, and more modern, now covering all the newest Figma capabilities.
New lessons have been added on working with external AI tools as well as the AI features built directly into Figma.
Perfect for Absolute Beginners
We’ll start from the very basics and go step by step — from installing Figma to designing stylish, modern, responsive layouts for websites on tablets, smartphones, and desktops.
Design with AI
You’ll learn how to use AI in design — both external tools and those built into Figma.
We’ll explore how to generate layouts, enhance images, spark creative ideas, and speed up your workflow significantly.
Layouts of Any Complexity
You’ll learn to design websites from scratch — of any complexity or theme.
From simple landing pages to multi-page sites with clear structure and full responsiveness.
Color Made Simple and Fun
You’ll master the skill of choosing colors, matching them with images, creating backgrounds and visual details like a true color expert — with confidence and ease.
Design Tricks That Wow
We’ll explore image techniques like extreme cropping, soft cropping, contrast tuning, and composition.
You’ll learn how to use white space effectively, apply contrast, layer elements, and select the perfect photos for your designs.
Typography Made Easy and Beautiful
You’ll learn everything you need to know: where to find the best fonts, how to install them, how to match them, and how to choose beautiful font pairs for your site.
UX/UI Without Fear
Although the course focuses on User Interface design, you’ll also get to know UX — the foundations of user experience, logic of interface structure, and interaction design.
Practice in Every Lesson
You’ll build two large and beautiful portfolio projects.
Each lesson is a step forward — clear and practical, with no unnecessary theory or fluff.
Responsive Design, Animation, Interactivity
You’ll learn how to adapt layouts for all devices, create animations, sliders, and counters — all directly in Figma, without writing a single line of code.
Working with Clients & Growing as a Designer
We’ll talk about how to communicate with clients, create briefs, find inspiration, generate ideas, and develop your own creative style.
Support
The course creator answers all your questions in the lesson comments — daily.
See you in class!
FAQ
FAQ area empty
Course curriculum
-
What are the dimensions of a website
242 Xem trước -
Creating a website frame
713 Xem trước -
What is a grid guide
703 Xem trước -
Stretch vs Center Grid Guide
331 Xem trước -
Basics of working with Shapes \ Images \ Layers
644 Xem trước -
Basics of working with text
872 -
A note on paid features
-
Grouping layers into frames
443 -
Presentation mode and a couple of hotkeys
448 -
How to save and share Figma files
655 -
The difference between UX and UI
468
-
The difference between raster and vector graphics
223 -
How to choose high-quality images
452 -
How to darken images
679 -
How to tone images
423 -
PRACTICE #3 – Tone the image
256 -
Extreme cropping technique
456 -
PRACTICE #4 – Extreme cropping
389 -
Soft cropping technique
206 -
PRACTICE #5 – Soft cropping
232 -
About icons
373 -
How to create your own icon
1070 -
How to work with strokes
493 -
AI features for images in Figma (paid version of Figma)
578 -
AI image features in Figma (paid version)
595
-
Creating the next section of the website
537 -
How GRID AutoLayout works
996 -
AutoLayout Pro version
776 -
Creating the next section of the website
719 -
Creating a blog page
398 -
Creating a blog card
611 -
How Min width / Max Width work
313 -
Creating blog card variants
360 -
PRACTICE #14 – Create a website design
76
-
Introduction to the section
-
Presentation mode
543 -
Advanced prototype settings
558 -
Basic animation in Figma
448 -
How Bézier curves work
479 -
Using open overlay & scroll to
445 -
How swap overlay works
423 -
How After Delay works
181 -
How Smart Animate works
441 -
Animating a website menu
330 -
Prototyping components
425 -
Reset Position & Component State
362 -
Conclusion of the prototyping section
136
Requirment
-
A working computer and internet access
Outcomes
-
You will learn to create modern website and app layouts in Figma
-
You will fully master all Figma tools for creating designs
-
You will learn how to use AI in design
-
You will explore Figma Jam for generating ideas in a team
-
You will explore Figma Make to generate websites using AI directly in Figma
-
You will explore Figma Site to create modern websites without code directly in Figma
-
You will explore Figma Presentation to design beautiful slides and presentations
-
You will learn how to speed up your workflow in Figma
-
You will learn how to prototype layouts and create clickable interfaces
-
You will master design systems and working with components to streamline your workflow
-
You will learn what responsive design is
-
You will learn how to adapt your layouts for any mobile device
-
You will learn how to choose the right colors for your websites
-
You will learn how to choose the right fonts for your websites
-
You will learn how to combine elements on web pages
-
You will learn how to work with images in Figma
-
You will learn how to create wireframes and turn them into full interfaces
-
You will understand what a UX/UI designer does and whether this career path is right for you
-
You will learn how to negotiate with your future clients
-
You will learn how to write a brief for a client as a freelancer
0 Student
2 Courses
0 review