Course Overview
I’m excited to invite you to the course “Web Design in Figma — Advanced Level” — an in-depth, practical program dedicated to modern web design, visual style, and the principles professionals use to create websites.
Here we don’t talk about Figma buttons — we focus on modern design rules.
On how to make your work visually strong, logically structured, and truly contemporary.
A complete deep dive into web-design principles
You will explore dozens of rules and approaches used by professional web designers, including:
typography and text hierarchy
grids and guides
composition and modularity
working with color, contrast, and accents
spacing, rhythm, and visual order in a layout
shadows, rounding, effects, and consistency
and much more
You will learn to understand why a layout looks good or bad and explain logically what needs to be improved.
Modern techniques and visual thinking
In the course, we explore:
how to develop visual taste
how to work with references
how to create original website concepts
how to translate an idea into a visual structure
how to avoid clichés and create genuinely creative solutions
Beyond design rules, you will also learn:
how to apply Midjourney and Adobe Firefly in web design
how to use AI to generate styles, ideas, and visual solutions
where neural networks help and where they can do harm
We talk about AI honestly — without hype — understanding where it really helps and where it doesn’t.
The course includes:
100+ video lessons covering concrete design rules
an interactive 300+ slide workbook with rules, examples, and diagrams
a student workbook with practical exercises
exercises, demonstrations, and full breakdowns
Every topic is reinforced through practice — you don’t just watch lessons, you gain experience by solving real design tasks.
Together we will create 2 major portfolio projects:
A creative website for a real client, built in a modern visual style
A redesign of an existing website where you apply all the rules you’ve learned
You will create the projects independently, using the principles and logic mastered throughout the course.
Throughout the course, I answer students’ questions daily on the platform.
See you in the lessons!
FAQ
FAQ area empty
Course curriculum
-
Consistency is the most important thing
176 Xem trước -
The very first UX/UI in the world
199 -
Proper text settings in web design
528 Xem trước -
Types of fonts
190 Xem trước -
How to choose a font for a project
530 -
How to format text creatively
485 -
How to format text in Figma
1297 -
Practice #1 — Format text beautifully
1449 -
What glyphs are
238 -
Summary of the section
216
-
Project task and description
417 -
Additional note — Where to get photos
138 -
Creating a modular grid
286 -
Creating the Hero Section, Part 1
971 -
Creating the Hero Section, Part 2
474 -
Creating the second section of the website
1281 -
Creating the third section of the website
548 -
Creating the first banner
445 -
Creating the fourth section of the website
479 -
Creating the second banner
217 -
Creating the fifth section
474 -
Creating the sixth section
388 -
Creating the website footer
337 -
Changing the font and creating the navigation menu
799 -
Finishing the website
588
-
What visual hierarchy is
212 -
Levels of visual hierarchy
117 -
Which element is more important
139 -
How to use the color gray
184 -
Do the opposite — Remove accents from unnecessary elements
88 -
Practice #3 — Set up visual hierarchy
103 -
Practice #3 — Completed, Part 1
681 -
Practice #3 — Completed, Part 2
1530
-
The problem with the 60:30:10 approach
237 -
How to create a color scale
269 -
Creating a color scale in practice
454 -
The 60:30:10 rule and the color scale
190 -
You don’t have to use only three colors
117 -
Use system colors
289 -
Use cool or warm gray
144 -
Color associations
315 -
How to use gradients in design
301 -
A couple of tips for working with color
197 -
AI and Color
151 -
Practice #4 — Apply color to the layout
110 -
Practice #4 — Completed, Part 1
778 -
Practice #4 — Completed, Part 2
583
-
About AI-generated images
384 -
AI features and pricing
290 -
Removing backgrounds with AI
430 -
Removing objects with AI
356 -
Expanding image boundaries with AI
236 -
Increasing image resolution with AI
333 -
Editing images with AI
248 -
Harmonizing images with AI
113 -
Generating images with AI
162 -
Additional AI capabilities
403
-
Overview and project goals
440 -
Preparation and reference search
650 -
Creating the Hero Section
747 -
Creating the navigation menu
1088 -
Creating decorative lines
396 -
Creating the second section of the website, Part 1
928 -
Creating the second section of the website, Part 2
462 -
Creating the third section of the website
447 -
Creating the fourth section of the website
596 -
Creating a form for the website
158 -
Creating the website footer
198 -
Finalizing the website
180
Requirment
-
Basic knowledge of Figma is required (understanding how to use Figma)
Outcomes
-
Learn to create modern and stylish website layouts
-
Study the ten rules of modern web design
-
Learn to apply web-design principles in practice on real tasks
-
Learn to build grids and guides for structuring layouts
-
Learn to set spacing, rhythm, and visual order in a layout
-
Study methods of working with typography
-
Study composition rules in web design
-
Learn to create clean and modular compositions
-
Study methods of working with color: palettes, contrast, accents
-
Learn to use shadows, rounding, and effects correctly and professionally
-
Study the rules of consistent design
-
Learn to analyze design logically and identify mistakes
-
Learn to develop visual taste and work with references
-
Learn to create original website concepts from scratch
-
Learn to use AI tools like Midjourney and Adobe Firefly in web design
-
Create 2 projects for your portfolio
0 Student
2 Courses
0 review