Опануй затребувану професію
Web Design: з нуля до першого портфоліо
Що ви освоїте
Figma, друкарка, сітки, колір, UX‑логіка, адаптивність, підготовка до верстки, презентація макетів, прискорення роботи з нейромережами.
Програма курсу
16 модулів - від базових принципів до готового макета
Кожен модуль – практичне заняття: коротка теорія, розбір прикладів та робота над своїм проектом.
- 01
Урок 1. Хто такий веб-дизайнер сьогодні
На першому занятті ми розберемо, чим займається сучасний веб-дизайнер, які завдання він вирішує і чому його важлива робота в цифровому світі. Учасники познайомляться з поняттями UI та UX, навчаться відрізняти гарний дизайн від поганого та зрозуміють, як влаштовано візуальне сприйняття сайту. Обговоримо, які бувають формати інтерфейсів: сайт, лендинг, веб-додаток, мобільний додаток.
- 02
Урок 2. Базова композиція та візуальний баланс
На цьому уроці ми вивчимо базові засади композиції: модульні сітки, візуальний баланс, ієрархію елементів та закономірності сприйняття. Розберемо, як люди читають екрани і як звертати їх увагу за допомогою дизайну.
- 03
Урок 3. Колористика: робота з кольором та увагою
Учасники дізнаються, як працює колірне коло, що таке контраст, температура кольору та як колір впливає на емоції користувача. Поговоримо про психологію кольору, навчимося збирати палітри кольорів і застосовувати їх у макетах.
- 04
Урок 4. Шрифти та типографіка
На цьому занятті вивчимо анатомію шрифту, різницю між гарнітурами та принципи підбору шрифтових пар. Розберемо, як правильно вибудовувати ієрархію тексту, вибирати шрифти під проект та використовувати їх для посилення візуального посилу.
- 05
Урок 5. Нагляд і візуальні референси
Урок присвячений розвитку дизайнерського смаку. Ми навчимося збирати мудборди та референси, розберемося, як аналізувати чужі роботи та використовувати візуальні добірки для пошуку стилістики та натхнення.
- 06
Урок 6. Введення у Figma
Учасники ознайомляться з інтерфейсом Figma, навчаться працювати з фреймами, компонентами, автолейаутами та стилями. Ми створимо перший простий макет та освоїмо базові інструменти, необхідні для роботи.
- 07
Урок 7. Адаптивний дизайн та Mobile First
Розберемо, що таке адаптивний дизайн, чому важливо починати з мобільної версії та як грамотно перебудовувати інтерфейс під різні пристрої. Попрактикуємося у використанні responsive-сітки та constraints у Figma.
- 08
Урок 8. Основи UX та сценарії користувача
На цьому занятті ми зосередимося на логіці взаємодії користувача з інтерфейсом. Вивчимо поняття користувальницького шляху, user flow, CJM та проектування сценаріїв поведінки на сайті.
- 09
Урок 9. Прототипування та клікабельні макети
Поговоримо про різницю між прототипом та фінальним макетом. Навчимося створювати клікабельні прототипи у Figma та правильно презентувати ідею клієнту до стадії візуального оформлення.
- 10
Урок 10. Нейросети у веб-дизайні
Учасники познайомляться з актуальними нейромережами, які допомагають дизайнерам: Midjourney, Leonardo AI, Ideogram, ChatGPT та іншими. Ми розберемося, як за допомогою їх можна генерувати зображення, іконки та ідеї, а також як використовувати AI як прискорювач процесу, не втрачаючи авторський стиль.
- 11
Урок 11. Робота з текстами та мікроінтеракціями
На цьому уроці ми розглянемо, як писати UX-тексти, формулювати кнопки, підписи та повідомлення для інтерфейсу. Також торкнемося основи мікроанімації та мікровзаємодій у дизайні.
- 12
Урок 12. Підготовка макета до передачі розробнику
Учасники дізнаються, що таке дизайн-система, як правильно організувати проект Figma для передачі на верстку, що таке Dev Mode і як оформити інструкції для верстальника. Практика здачі проекту у продакшн.
- 13
Урок 13. Робота з брифом та завданнями клієнта
Розберемося, як читати та аналізувати бриф, ставити правильні питання, виявляти цілі бізнесу та цільову аудиторію. Поговоримо про трансформацію клієнтських побажань у візуальні рішення.
- 14
Урок 14. Як заробляти дизайнеру
Урок присвячений фрілансу та старту кар'єри. Вивчимо, де шукати клієнтів, як вести листування, як оформити портфоліо та створити перший кейс. Розберемо поведінку на співбесідах та поради для впевненого старту.
- 15
Урок 15. Робота над дипломним проектом
Кожен учасник готує повноцінний проект: лендинг чи інтерфейс програми. Ми проводимо консультації, розбираємо помилки, доопрацьовуємо адаптиви та інтерактив, готуємо презентацію.
- 16
Урок 16. Захист диплому та кар'єрні рекомендації
Фінальне заняття: учасники презентують свій проект, отримують зворотний зв'язок та сертифікат. Також ми розбираємо кар'єрні траєкторії, перспективи, спеціалізації та складаємо індивідуальні рекомендації щодо розвитку.
За підсумками – готовий макет у портфоліо та сертифікат про закінчення.
Як проходить навчання
Структура занять і підтримка
-
90 хвилин щосуботи
Міні-група, живі розбори і відповіді на запитання щодо вашого проєкту.
-
Домашні завдання з фідбеком
Покрокові чек-листи, коментарі в Figma і рекомендації щодо поліпшення.
-
Матеріали та шаблони
Бібліотеки компонентів, палітри, приклади макетів та референси.
Full-Stack Developer
15+ років у комерційній розробці.
Ціна і набір
Старт - 20 вересня 2025 року
Оплата помісячно або єдиним платежем. Місця в групі обмежені.
- Доступ до всіх матеріалів
- Фідбек до завдань
- Сертифікат і допомога з портфоліо
- Гнучкий графік оплат
- Ті самі умови участі
Залишити заявку
Ми зв'яжемося і відповімо на запитання.
Запитання та відповіді
Те, що запитують найчастіше
Чи підійде курс без досвіду?
Так. Програма розрахована на початківців: стартуємо з основ та поступово ускладнюємо завдання.
Чи потрібний платний софт?
Достатньо безкоштовної версії Figma. Інструменти ІІ – за бажанням, покажемо альтернативи.
Чи буде диплом/сертифікат?
Так, видаємо сертифікат про закінчення та допомагаємо оформити кейс у портфоліо.
Відгуки
"Через місяць після курсу - оффер у продуктову компанію. Зрозуміла, як збирати сторінки швидко та акуратно"
- Ольга М.
"Багато практики та справжні процеси: хенд-офф, Dev Mode, токени. Дуже прикладно"
- Андрій К.
Готові почати? Зробіть перший крок уже сьогодні
Залиште заявку - допоможемо підібрати формат і відповімо на запитання.
