Курс-професія з нуля про те, як стартувати та заробляти у вебдизайні
WEBDESIGN
ОЛЯ ВАРЧЕНКО
Це курс для тих, хто давно хоче опанувати професію вебдизайнера, але не знає, з чого почати.
За 4 місяці ти розберешся з функціоналом та інструментами у Figma. Зрозумієш, як працювати з брифом, дослідженнями, генерацією ідей. Навчишся підбирати шрифти, стилістику, проводити дизайн-сесії, створювати архітектуру та навігацію сайту.
Як результат — можеш стартувати в карʼєрі з двома кейсами у портфоліо: готовим багатосторінковим вебсайтом і landing page. А далі — дизайн-студія, IT-компанія або фриланс — обирати тобі.
ПРО ЛЕКТОРКУ
ОЛЯ ВАРЧЕНКО
7+ років у професіїДЛЯ KОГО
program
- Design та категорії digital design
- Вебдизайн у бізнесі
- Дизайн-процес для вебу та методологія Design Thinking
- Організація файлу
- Брифінг
- Дослідження бізнесу: ЦА, конкуренти, цілі та очікування
Підготувати додаткові запитання до бізнесу, зробити дослідження про поточний продукт.
- Види досліджень
- Види персон
- Будуємо proto-persona
- Бренд-модель
- Створюємо живий бренд
Сформувати proto-persona та бренд-модель за фреймворком.
- Аналіз категорії
- Аналіз конкурентів
- Аналіз бенчмарків
Провести аналіз категорії, конкурентів та best practices.
- Структура багатосторінкового сайту і головної сторінки
- Алгоритм створення структури
- Сайтмеп
- Копірайт із чатом GPT
- УТП: як знайти й сформувати
Розробити сайтмеп, підготувати копірайт і сформулювати УТП.
- Вайрфреймінг
- Прототипування і тестування
- Навігація
Розробити вайрфрейми всіх сторінок та залінкувати їх. Протестувати й підготувати звіт: що працює, а що — ні.
- Композиція: визначення, елементи та інструменти
- Сітка: теорія та алгоритм
Потренуватися над композиційними рішеннями.
- Класифікація та термінологія
- Де знайти та як обрати шрифт
- Як підібрати шрифтову пару
- Робота з текстом
Виконати вправи від лекторки на підбір шрифтів та роботу з текстом.
- Психологія, символізм і технічний бік кольору
- Колірні схеми та палітри
- Як підібрати колір
- Tips & tricks
- Accessibility
Підготувати кадри з фільмів під різні емоції та визначити палітру з кадру + вправа на accessibility.
- Як шукати та які є нюанси
- Тренди
- Дизайн-бібліотека
Наповнити дизайн-бібліотеку, знайти та проаналізувати референси за заданими параметрами.
- Види та стилі графіки
- Робота з іконками та логотипами
- Мокапи
- Консистентність стилів
- Тіні
Розробити постер.
- Пошук ідеї через майндмеп
- Як обрати спосіб виразити ідею
- Як візуалізувати ідею через референси/драфти
Фіналізувати домашку з воркшопу.
- Що таке design approach
- Як збирається
- Приклади
Фіналізувати домашку з воркшопу.
- Алгоритм збору концепту
- Запозичення vs плагіат: як зрозуміти, хто є хто
Фіналізувати домашку з воркшопу.
- Кроки після підготовки концепту
- Ключові принципи UI-дизайну
- Імплементація концепту в дизайн та розмноження його по сторінках
- Що містить та як зібрати UI Kit
- Адаптація під мобільну версію. Розбираємо на прикладах
- Підготовка файлу для передачі девелоперу
Зібрати UI Kit до головної сторінки. Імплементувати всі сторінки у стилі розробленого концепту. Адаптувати головну сторінку під мобайл.
- Найчастіші помилки початківців
- Процес розробки презентації
- Виступ
Підготувати презентацію проєкту.
- Презентувати 3 варіанти брифу
- Розробка прото-персони
- Аналіз ринку та конкурентів
- Збираємо бренд-модель
Фіналізувати домашку з воркшопу.
- Виявляємо проблему
- Генеруємо рішення
- Будуємо структуру ленду за методологією AIDA
- Створюємо копірайт
Фіналізувати домашку з воркшопу.
- Розробляємо вайр для landing page
Фіналізувати домашку з воркшопу.
- Шукаємо ідеї через майндмеп
- Обираємо спосіб виразити ідею
- Візуалізуємо ідею через референси/драфти
- Збираємо design approach
Фіналізувати домашку з воркшопу.
- Розробляємо концепт проєкту
Фіналізувати домашку з воркшопу. Оформити проєкт у презентацію.
- З чого почати
- Формат і кількість кейсів
- Обсяг та зміст кейса
- Найчастіші помилки
- Tips & tricks
- Стратегії спілкування з клієнтом