Курси Web Design / UI/UX

Навчимося проєктувати зручні цифрові продукти, якими хочеться користуватися.

Програма курсу

Що таке UX

• Познайомимося з історією професії, починаючи з періоду до нашої ери
• Визначимо, що таке юзабіліті, UX та як останній перетинається з іншими дисциплінами
• Поговоримо, як та над чим працює UX дизайнер

Методи та процеси в UX

• Визначимо зони відповідальності UX дизайнера
• Розберемо інструменти в наборі UX дизайнера
• Познайомимося з людиноцентричним дизайн-процесом, його стадіями та активностями
• Дізнаємось, які бувають спеціалізації UX дизайнерів
• Розглянемо фреймворки та процеси в UX дизайні
• Навчимося підбирати різні методи під різні UX виклики

Робота із замовником

• Розберемо основні етапи, з яких потрібно починати UX проєкт
• Навчимося проводити інтерв’ю із замовником, щоб здобути необхідну інформацію
• Дізнаємось, як та про що запитувати, щоб чітко розуміти потреби замовника

Аналіз конкурентів

• Визначимо, що таке конкурентний аналіз та його приховані переваги
• Розглянемо види аналізу конкурентів, зрозуміємо, коли його проводити
• Навчимося проводити аналіз конкурентів та застосувати отриману інформацію в роботі
• Поговоримо про конкурентне середовище та непряму конкуренцію

Робота з користувачами

• Зануримося в користувацькі інтерв'ю - як і навіщо їх проводити
• Розглянемо види та атрибути вдалого користувацького інтерв'ю
• Розберемося, як планувати користувацьке інтерв'ю та написати скрипт розмови
• Зрозуміємо, як шукати та знаходити саме тих респондентів
• Навчимося налаштовувати себе та респондентів на продуктивну бесіду
• Дізнаємось, як правильно обробляти дані та перетворювати їх на дизайн-рішення

User personas

• Поговоримо, навіщо потрібні персони й чи можна їх просто вигадати
• Навчимося крок за кроком створювати юзер персони
• Розберемо Customer Journey Map (CJM) - що це таке, навіщо потрібне та як побудувати
• Поговоримо про важливість емпатії як складника human-centered design

Опитування

• Розглянемо, які цілі опитування закривають та їхні можливості в UX дизайні
• Проаналізуємо види опитувань та навчимося працювати з вибірками
• Поговоримо про гіпотези та знайдемо їхній зв'язок з опитуваннями
• Виявимо важливі моменти у проведенні опитувань
• Розберемо помилки в роботі з опитувальниками

User flow

• Познайомимося з user flow - що це таке та чому є важливим у дизайні
• Розберемо види user flow: блок-схема, масштаб user flow, wireflow, інтерактивний прототип
• Розрізнимо user flow від CJM
• Дізнаємось, як опрацьовувати сценарії взаємодії користувача з інтерфейсом і як це може допомогти
• Визначимо, на якому етапі потрібно будувати user flow
• Детально розглянемо правила побудови user flow

Інформаційна архітектура

• Розглянемо структуру інформаційної архітектури
• Поговоримо про дані, які потрібно підготувати, щоб побудувати інформаційну архітектуру
• Проаналізуємо принципи інформаційної архітектури на прикладах реальних сайтів
• Навчимося створювати інформаційну архітектуру та перевіряти її

Прототипування

• Дізнаємося, що таке прототип та навіщо його створювати
• Розберемо види прототипів та особливості кожного: low-fidelity, mid-fidelity, high-fidelity
• Розкладемо по поличках інструменти для створення прототипів
• Навчимося будувати прототип у Figma

Закони UX та юзабіліті евристики

• Навчимося перевіряти UX рішення крізь призму патернів людського сприйняття, пам’яті, уваги та загальних юзабіліті принципів
• Розберемо на прикладах основні закони UX та патерни: закон близькості, закон Фіттса, закон Хіка, закон Якоба, F-патерн, 10 евристик Якоба Нільсена
• Навчимося проводити евристичний аналіз

Тестування

• Навчимося проводити якісні та кількісні тестування дизайн-рішень
• Розберемо модеровані та немодеровані тестування з користувачами й інструменти, які для цього знадобляться
• Зрозуміємо, як правильно висувати та перевіряти гіпотези
• Навчимося опрацьовувати результати тестувань та формувати артефакти

Презентація

• Дізнаємось, як ефективно презентувати дизайн перед командою
• Навчимося оформлювати контент так, щоб зосередити та підтримувати увагу глядачів
• Розкриємо секрети мистецтва захищати свої дизайн-рішення

Soft Skills

• Визначимо чому софт скіли важливі для просунутого UX дизайнера
• Розберемо основні софт скіли, які допоможуть UX дизайнерам ефективно працювати в команді
• Зрозуміємо, як сприймати та давати фідбек

Mobile

• Розберемо тонкощі UX рішень для мобільних девайсів
• Проаналізуємо актуальну ситуацію на ринку мобільних застосунків
• Дізнаємося про відмінності проєктування мобільних, десктопних пристроїв та планшетів
• Виявимо різницю між iOS, Android та розберемося, що таке кросплатформні застосунки

Впевнений UX дизайнер

• Поговоримо, як дизайнеру оцінювати власну роботу
• Дізнаємося, що індустрія, організація, команда та керівник очікують від UX дизайнера, та як ці очікування синхронізувати
• Розглянемо фреймворк "Цілі, сигнали, заміри" та застосуємо його
• Розберемо інструменти, які допомагають UX дизайнеру оцінити та покращити свою роботу

Емоційний дизайн

• Розглянемо на прикладах когнітивні упередження
• Навчимося застосовувати знання з психології, щоб створити якісний користувацький досвід

Портфоліо UX дизайнера

• Навчимося дивитися на портфоліо як продукт
• Розглянемо типи портфоліо та їхні особливості
• Поговоримо про різні платформи для онлайн портфоліо
• Навчимося будувати структуру сайту-портфоліо
• Дізнаємось, як будувати кейс-стаді та застосовувати сторітелінг у ньому
• Розберемо best practices для оформлення робіт у портфоліо

Матриця компетенцій UX дизайнера

• Дізнаємося, що таке матриця компетенцій та як вона стане в пригоді
• Заповнимо матрицю компетенцій UX дизайнера
• Розберемо софт та хард навички, які потрібні UX дизайнеру, щоб впевнено зростати

Особливості курсу

• Відеолекції щопонеділка та щочетверга, живі зідзвони з куратором щосереди о 19:00
• Real-life завдання
• Регулярний фідбек
• Сертифікат за справу
• Можна повернути кошти протягом 7 днів від початку курсу

Викладачі курсу

• Сергій Ревва - Lead Product Designer в airSlate
• Марина Подстрігіч - Co-founder, Head of Design at Craft Innovations Global
• Іста Чебан - Дизайнерка продукту в Kyivstar.Tech
• Ростислав Матюк - Product Designer at Uklon
• Євгенія Любчик - Product Designer at Soniq
• Вова Хижняк - UX Designer at EPAM
• Валентин Бродський - Co-founder і CEO в Axicube
• Олександра Плужнік - Lead UX Designer в Atupri
• Андрій Рижанков - UX/UI Designer в EPAM
• Аліна Коваль - UX/UI Designer в Riseapp
• Таня Кораб - Product Designer в Siemens
• Данило Приходько - Product Designer at KyivstarTech
• Олена Шевчук - UX Designer at EPAM
• Маргарита Кердікошвілі - UI/UX Designer at Uinno
• Євген Мошнянко - UI/UX Designer at EPAM
• Ян Гладченко - Product Designer at Raiffeisen Bank Ukraine
• Тетяна Кондратенко - UI/UX Designer at Axicube
• Данило Верба - Senior Product Designer at Raiffeisen Bank Ukraine
• Богдан Матвіїв - Артдиректор у dops.digital
• Маріанна Гончар - Senior UI/UX Designer at Awesomic

Опануй Figma, навчися працювати з ТЗ та брифом, проектуй вебінтерфейси та створюй сайти, які не хочеться закривати. Усьому цьому ми навчимо тебе на курсі UI/UX дизайну за 4 місяці.

Програма курсу

Модуль 1 - Вступ, знайомство з Figma

Заняття 1. Введення у дизайн

• Познайомимося, поговоримо про те, що таке дизайн UX/UI, UX vs UI: в чому різниця
• Хто такий UI/UX дизайнер і що він має вміти?
• Варіанти роботи UX/UI дизайнером та розвитку кар'єри: плюси та мінуси
• Обговоримо вдалі та невдалі приклади сайтів
• Зареєструємось на Behance та dribble

Заняття 2. Figma Start: Основи роботи з програмою

• Чому Figma? Переваги інструменту. Створимо команду для спільної роботи над дизайн-проєктом
• Базовий інструментарій, знайомство з інтерфейсом Figma
• Сплануємо по етапах роботу над підсумковими проєктами для портфоліо
• Проведемо дослідження джерел
• Розпочнемо роботу над першим проєктом для портфоліо дизайнера

Заняття 3. Figma Pro: разом малюємо лендінг

• Як дизайнер підходить до проєктування сайту?
• Основні блоки посадкової сторінки та правила їх розміщення: логотип, заголовки, категорії, іконки, зображення тощо
• Вивчимо та намалюємо елементи різного типу: покрокові інструкції
• За підтримки ментора створимо першу сторінку сайту

Модуль 2 - UI в деталях, практика візуалу

Заняття 4. Figma: разом малюємо лендінг

• Як дизайнер підходить до проєктування сайту?
• Основні блоки посадкової сторінки та правила їх розміщення: логотип, заголовки, категорії, іконки, зображення тощо
• Вивчимо та намалюємо елементи різного типу: покрокові інструкції
• За підтримки ментора створимо першу сторінку сайту
• Зберемо moodboard для своїх проєктів

Заняття 5. Менторська сесія

• Перевіряємо копію сайту
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проєкти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проєктів

Заняття 6. Adobe Illustrator

• Ознайомче заняття з Adobe Illustrator
• Векторна та растрова графіка
• Взаємодія Illustrator із Figma

Заняття 7. Adobe Photoshop

• Робоча область. Перші кроки. Пензлі. Режими накладання
• Ретушування зображень. Вирізання
• Ретушування зображення (заплатка, клонувальний штамп)

Заняття 8. Менторська сесія

• Перевіряємо створений пак іконок та відредаговані фото для інтерфейсу
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Заняття 9. Тренди 2023

• Дизайн-тренди. Порівняємо скевоморфізм, FLAT, material, бруталізм, isometric, glass morphism
• Подивимося різні стилістичні прийоми: білий простір, нестандартна сітка, градієнт, упор на типографіку, 3D, grunge, реалізм тощо
• Як вибрати стиль для конкретного проекту?
• Як стежити за трендами дизайнеру-початківцю?
• Деталізація макету: від scetch-малюнку через wireframe до реалізації

Заняття 10. Дизайн-тренди

• Перевіряємо редизайн сайту та розпочаті вайрфрейми
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо подив, формуємо критерії успішних проектів

Заняття 11. Типографіка

• Принципи, основні поняття та терміни типографіки
• Види та класифікація шрифтів, допустимі розміри на сайтах та мобільних пристроях
• Трекінг, керлінг. інтерліньяж – приклади
• Практика: працюємо з типографікою, застосовуємо знання на практиці, щоб застилити статтю
• Як працювати з референсами (прикладами)

Заняття 12. Сітки та композиція

• Види сіток, структура сітки та її складові, для чого застосовується сітка у дизайні
• Правила композиції, принципи гештальт-сприйняття

Заняття 13. Кольори та зображення

• Теорія кольору, поєднання кольорів, холодні та теплі кольори
• Кольорові моделі: CMYK, HEХ, колірне коло
• Психологія сприйняття кольору
• Лайфхакі вибору правильної кольорової схеми: дізнаємося, як і коли потрібно додавати колір

Заняття 14. Менторська сесія

• Перевіряємо статтю та практику
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Модуль 3 - UX. Мобільний додаток. Анімація

Заняття 15. Дизайн патерни, кнопки, форми, навігація

• Дизайн патерни, кнопки, форми, навігація
• На занятті ми дізнаємось, як створювати інтерактивні елементи
• Вивчимо елементи управління та навігації: види та стани кнопок, проектування форм зворотного зв’язку, календарі, меню та навігація

Заняття 16. Адаптив: мобільна версія сайту

• Статистика, адаптивна верста, мобільна версія та програми
• Види адаптації
• Mobile first
• Основні правила та принципи
• Універсальні прийоми
• Адаптуємо сайт під мобільну версію

Заняття 17. Менторська сесія

• Мобільна версія+desktop
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо подив, формуємо критерії успішних проектів

Заняття 18. Кейси для Behance

• Як правильно складати та оформлювати кейс на Behance
• Базові прийоми Photoshop, які однозначно стануть у нагоді дизайнеру

Заняття 19. Менторська сесія

• Розглядаємо лендинг, мобільну версію та створений кейс на Behance
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо подив, формуємо критерії успішних проектів

Заняття 20. Проєктування мобільних додатків: старт проєкту

• Етапи роботи над мобільним додатком
• Розробка концепції, ресерч (дослідження)

Заняття 21. Основи дизайн-мислення. UX-стратегія

• Робота з брифом: mind mapping та інформаційна архітектура
• Визначення та особливості Цільової аудиторії
• Метод персон

Заняття 22. UX-дослідження: аналіз конкурентів, персони та карти емпатії. Customer journey map та User flow

• Сustomer Journey Map
• Юзер флоу (User Flow)

Заняття 23. Менторська сесія

• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Заняття 24. Прототипування: елементи сайту та скетчинг. Прототипування: wireframing

Прототипування: елементи сайту та скетчинг Прототипування: wireframing

Заняття 25. Менторська сесія

• Вайрфрейм екранів мобільного додатку, вайрфлоу та дослідження
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Заняття 26. Дизайн мобільного додатку

Проектування дизайну мобільних додатків зі застосуванням гайдлайнів під iOs/Android

Заняття 27. Менторська сесія

• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Заняття 28. Анімація та прототипування у Figma

• Практичне заняття
• Ефекти та налаштування анімації у програмі
• Як ними користуватися
• Створюємо кілька анімацій

Заняття 29. Заняття з розробником

• Як дизайн перетворюється на код?
• Готуємо макет для передачі розробнику
• Що верстальнику потрібно для комфортної роботи
• Підтримка відносин із клієнтами

Заняття 30. Менторська сесія

• Відслідковуємо прогрес проектів, оцінюємо кейс на Behance
• Отримуємо фідбек за своїми домашніми завданнями
• Аналізуємо проекти одногрупників під керівництвом викладача
• Тренуємо надивленність, формуємо критерії успішних проектів

Заняття 31. Резюме дизайнера

• Приклади вдалих резюме дизайнера
• Що треба писати, чого уникати
• Як складати резюме новачкові і куди подаватися
• Починаємо працювати над дизайном резюме

Заняття 32. Розмова із кар'єрним менеджером

• Як і де шукати роботу для початківця та які інструменти при цьому використовувати
• Як правильно зробити резюме та яка інформація в ньому надважлива, а що буде зайвим
• Як створити профіль на Linkedin, щоб його могли побачити потенційні роботодавці
• 7 порад, які допоможуть пройти онлайн співбесіду набагато успішніше
• Q&A

Дипломна робота

Етап 1 Задача дипломного проєкту

Дипломна робота включає в себе на задану вчителем тему створення власного дизайну інтернет магазину та додавання його на сторінку Behance у вигляді презентації. Завдання – створити магазин у desktop версії та зробити адаптиви (мобільна версія та планшет). У дипломній роботі має бути 8 обов'язкових сторінок магазину.

Етап 2 Захист дипломної роботи

• На захисті вам доведеться показувати свою найкращу роботу досвідченим дизайнерам, розробникам та рекрутерам
• Отримуємо зворотний зв'язок та визначаємо свій шлях дизайнера

Особливості курсу

• Безкоштовна IT англійська
• Додаткові матеріали
• Кар'єрний менеджер
• Діджитал диплом для Linkedin

Викладачі курсу

• Матвієнко Поліна - Middle UI/UX Designer
• Ольга Вихристюк - Senior UI/UX Designer
• Ангеліна Дехніч - Middle UI/UX Designer
• Сергій Головашкін - Senior UI/UX Designer
• Надія Перегінська - Senior UI/UX Designer
• Наталія Чередниченко - Product Designer | UI/UX Designer

В умовах реальних технічних обмежень і жорстких дедлайнів студенти вирішуватимуть проблеми українських продуктових компаній та стартапів.

Програма курсу

Інтро до продуктового дизайну

• Яка відмінність у роботі продуктового й непродуктового дизайнера
• Як дизайнер впливає на бізнес, і як збільшити цей вплив
• Необхідні знання і навички, щоб стати крутим продуктовим дизайнером

Метрики бізнесу і гроші

• Основні бізнесові метрики для різних типів продуктів
• Що таке юніт економіка
• Як продукт, який ми дизайнимо, впливає на метрики бізнесу

Продуктові метрики. Частина 1: вступ, маркетинг та залучення

• Ключові метрики:
  • acquisition
  • activation
  • retention
  • engagement
  • revenue
  • referral
• Звідки користувачі приходять у продукт. канали залучення
• Як побудувати залучення через самих користувачів. Product-led acquisition

Продуктові метрики. Частина 2: product & growth

• Розбираємо шлях користувача від реєстрації до оплати: задачі дизайнера на кожному етапі
• setup, aha і habit моменти
• Що таке North Star metric і як її вимірювати

Як вирішувати дизайн-задачі: розбір case-studies

• Як влаштований процес роботи в продуктах
• Кроки створення дизайну: від розпаковки задачі до оцінки релізу
• Розбір реальних робочих кейсів кураторів і інших дизайнерів світових компаній

Розпаковка продуктових задач

• Які питання треба задати перед тим як сідати за дизайн
• Як визначати яких даних не вистачає, і як хз швидко збирати для якісного вирішення задачі
• 5W1H метод підходу до продуктових задач
• Формалізація задачі та складення product-alignment document

Discovery. Частина 1: планування досліджень і рекрутинг респондентів

• Як визначити, коли не варто проводити дослідження
• Складання плану дослідження
• Як бути певним, що релевантні респонденти знайдуться
• Рекрутинг: де шукати респондентів. а коли немає бюджету?

Discovery. Частина 2: проведення досліджень

• Методи досліджень і як їх обирати в залежності від задачі
• Проведення глибинних інтерв'ю
• Створення опитувальників

Discovery. Частина 3: аналіз результатів і застосування

• Як швидко організовувати й опрацьовувати зібрану інформацію
• Поширені фреймворки організації результатів досліджень
• Пріоритeзація зібраної інформації
• Як застосовувати зібрані інсайти в дизайні

Продуктові гіпотези і пріоритезація

• З чого складається продуктові гіпотези і як їх формулювати
• Чому навичка пріоритезації важлива для дизайнерів
• Найпоширеніші критерії і фреймворки пріоритезації продуктових фіч

Проєктування

• Як переходити від стікерів до дизайну
• Врахування інсайтів з досліджень і обмежень в рішенні
• Складення user flow і першої ітерації, оптимізація та робота над рішенням

Visual UI

• Чому одні інтерфейси здаються гарними, а інші - ні
• Компоненти створення гарного інтерфейсу: над чим працювати
• Як вдосконалювати свої візуальні навички

Interaction design

• Чому дизайн інтерфейсів не закінчується на створенні статичних екранів
• Поширені патерни взаємодії. як "оживити" інтерфейс
• Доступні інструменти створення взаємодії на десктопі й у мобільних застосунках
• Анімація: принципи, інструменти й реалізація у коді
• Передача дизайну взаємодії розробникам

UX writing

• Як писати ефективні інтерфейсні тексти для переконання, пояснення і помилок
• Принципи і техніки гарного копі, приклади поширених місць застосування в продукті
• Інструменти написання текстів для інтерфейсу
• tone of voice і як консистентно комунікувати з користувачем у всьому продукті - створення емоційного відгуку за допомогою копі

Тестування рішень. Частина 1: класичне

• Розбір методів тестування:
  • usability vs concept testing
  • moderated vs unmoderated
• Підготовка: складення плану, сценаріїв і задач для тестування
• Поради для проведення тестування й інструменти

Тестування рішень. Частина 2: альтернативне

• Збір і опрацювання фідбеку, внутрішнє тестування з суміжними ролями в компанії
• Як працювати з інструментами аналізу поведінки: хітмапи, записи сесій
• Створення ком'юніті користувачів для швидкого зворотнього зв'язку
• Засоби швидкої валідації продуктових ідей

Аналітика і А/В тести

• Як працює продуктова аналітика, розбір поширених інструментів: Amplitude і Google Analytics
• Як дизайнеру працювати й застосовувати кількісні дані в дизайні
• Дизайн A/B тестів і підвищення шансів на їх успіх

Технічна реалізація

• Як влаштований веб: HTTP запити, API, ендпоінти тощо
• Як дизайнеру працювати з даними, де вони зберігаються та в якому вигляді
• Реалізація дизайну з Figma в коді: чим насправді є auto-layout, компоненти, variables тощо

Презентації

• Створення кейс стаді дизайн-рішень
• Як створити сторітелінг у презентації
• Як презентувати впевнено й переконливо

Комунікація з іншими ролями

• Як дизайн вписується в загальну картину продуктової компанії
• Як співпрацювати з продакт менеджерами, інженерами, аналітиками, маркетологами, сейзлами й підтримкою
• Запрошені гості розповідають про свій досвід роботи з дизайнерами і як співпрацювати ефективніше

Кар'єрна зустріч і працевлаштування

• Як потрапити в першу продуктову компанію
• Розбір флоу працевлаштування: від CV до оферу
• Які навички шукають у дизайнерах різні типи продуктів
• На що звертають увагу різні учасники процесу: від рекрутерів до засновників компанії

Особливості курсу

• Відеолекції та вебінари
• Робота в командах та курсові проєкти
• Регулярний фідбек
• Сертифікат за здобутки
• Можна повернути кошти протягом 7 днів від початку курсу

Викладачі курсу

• Борис Бакланов - Senior Product Designer at Klarna
• Арсен Колиба - Product Designer в Wix
• Юрій Опаренко - Staff Product Designer at Meta Inc.
• Станіслав Тихонько - Розвиває мілтек-продукт на основі АІ для розвідки Сил оборони
• Дмитро Грінкевич - Senior Product Designer at PDF Expert
• Катерина Масленкова - Ex-Senior UX Writing Manager at Qonto
• Єлизавета Нотаріус - Product Owner at Creatio

Поглибимо знання та відточимо навички, якими має володіти вебдизайнер — від створення іконок і проєктування складних сайтів до презентації рішень клієнту.

Програма курсу

Типографія

• Навчимося грати зі шрифтами й вигравати: як правильно їх обирати та застосовувати
• Проаналізуємо особливості використання різних видів шрифтів

Ведення проєктів у Figma

• Розглянемо функції редактора
• Вивчатимемо компоненти та стилі (текст, колір, тінь)
• Розберемось, як наводити лад у документі

Лендинг за формулою AIDA

• Розберемося, що це за формула й навіщо вона потрібна
• Розкладемо на деталі реальні приклади лендингів
• Дізнаємось, як дизайнери можуть використовувати інструменти ШІ
• Навчимося будувати структуру та дизайнити сайти, які привертають увагу та мотивують до дії

Модульні сітки

• Дізнаємося, що таке сітки та які бувають їхні види
• Розглянемо параметри сіток і навчимося їх обирати під різні стилі та потреби дизайну

Адаптивний дизайн

• Проаналізуємо сутність адаптивного дизайну, різновиди і способи застосування
• Визначимо ключові параметри та нюанси адаптивного дизайну
• Попрацюємо з сітками, типографією й колонками в адаптивному макеті

Генерування ідей

• Навчимося створювати мудборди
• Поговоримо, як працювати з референсами, щоб розв'язати завдання проєкту
• Навчимося обирати, аналізувати й розуміти референси
• Дізнаємося різницю між натхненням і плагіатом

Робота з клієнтом

• Навчимося брифувати клієнта правильно та зрозуміло
• Зрозуміємо, як правильно сформувати бриф для проєкту
• Навчимося презентувати свою роботу

Mindmapping та прототипування

• Визначимо, що таке mindmapping, коли та як цей метод використовувати
• З'ясуємо різницю вайрфреймом та прототипом
• Спроєктуємо, створимо прототип своєї роботи і протестуємо її

Базова e-commerce структура

• Визначимо основні види e-commerce проєктів і принципи їхнього створення
• Розглянемо, як будувати e-commerce сайти на реальних прикладах
• Ознайомимося з темною та етичною стороною дизайну e-commerce, щоб ефективно розв’язувати завдання
• Попрацюємо з картками, сторінками товару, кошиком флоу оплати

Студія, продукт чи фріланс

• Розглянемо особливості кожного шляху та визначимо, як вибрати свій
• Поговоримо про стан ринку праці та як шукати роботу

Портфоліо

• Розберемо правила ідеальної співбесіди
• Дізнаємось, як оформлювати портфоліо, щоб показати свій потенціал на повну

Особливості курсу

• Відеолекції та живі зідзвони з куратором
• Real-life завдання
• Регулярний фідбек
• Сертифікат за здобутки
• Можна повернути кошти протягом 7 днів від початку курсу

Викладачі курсу

• Андрій Курочкін - Art Director в Hexagon Agency
• Аліса Головінська - UX/UI Designer в WIX
• Ірина Грицай - Art Director & Co-Founder в Dilecta Studio. Jury на Awwwards
• Анатолій Шовковий - Co-Founder Hot Buro
• Євгеній Педорич - Product Designer в Kyivstar.Tech. Designer в KOLO
• Іван Тараненко - Senior Designer в MacPaw
• Мар'яна Бучкович - Lead Designer в Obriy Design Buro
• Микола Мельник - Design Lead в UpTech
• Артем Усачов - Design Lead & Digital Experience Designer в Trinetix
• Оля Алтухова - Designer в airSlate
• Ігор Артюхов - Product Designer at NDA
• Дарина Литвиненко - Product Designer в Hexagon Agency
• Яна Білик - Product Designer в Finmap.online
• Ольга Удовіна - Product Designer at Kyivstar

Навчальна програма охоплює сучасні знання та практики у веб-дизайні. Протягом курсу студенти навчаться працювати з Photoshop, фоторетуші, створенні макетів сторінок та логотипів. Також освоять принципи дизайну, кольорокорекції, прототипування, дослідження шрифтів та моушн-дизайн.

Програма курсу

• Photoshop
• Figma: інтерфейс, базові елементи
• Figma: Group vs Frames, Обмеження
• Figma: Компоненти, Автоматична компоновка
• Персона, користувача інтерв’ю, для користувача сценарій
• Карта сайту, шлях користувачів
• Wireframes, Майстерня паперового прототипирования
• Візуальний дизайн. Компоненти для користувача інтерфейсу. UI Kit
• Moodboard. бібліотека шаблонів
• Типографіка і сітка.
• Колір і склад
• Основи анімації
• Огляд інтерфейсу мобільного додатка
• iOS проти Android
• Human Interface Guidlines
• Material Design Guidlines
• Адаптивний дизайн
• Гейміфікація
• Анімація взаємодії
• Портфоліо: Behance і Dribbble
• Брендинг. Логотипи. CX Design
• Soft skills

Презентація проєкта

Особливості курсу

• Для дітей віком від 12 до 15 років
• До 15 дітей в групі
• Система оцінки знань
• Багато практичних завдань
• Робота над власними проєктами
• Сертифікат про закінчення навчання

Практичний курс, який навчає, як визначати та проводити UX дослідження, розуміти реальні потреби юзерів, створювати справді зручний інтерфейс на основі власних знахідок та перевіряти ефективність своїх рішень.

Програма курсу

Знайомство з UX методами та методологіями

• Що таке UX дизайн і найпопулярніші ролі
• Види UX досліджень
• Кількісні та якісні дослідження
• Як обрати правильний UX метод (+вчимося протягом курсу)
• Популярні дизайн методології, їх схожість та відмінність

Брифінг клієнта. Цільова аудиторія. Опитування, як метод дослідження

• Як працювати в команді, поради та нюанси
• Розуміння бізнесу та брифінг клієнта
• Визначення цільової аудиторії та її вивчення
• Два основних види фідбеку від юзерів: активний та пасивний
• Опитування користувачів. Швидкий спосіб зрозуміти, хто наші користувачі, з якими ситуаціями вони зіштовхуються
• Аргументація своїх рішень

Глибинні інтерв'ю з користувачами, ментальні та концептуальні моделі

• Концептуальна та ментальні моделі. Чому вони важливі
• Глибинні інтерв'ю | In-depth interview
• Як правильно провести глибинне інтерв'ю, де шукати юзерів та що робити із данними
• Відкриті vs Закриті питання
• Поради, як підвищити ефективність інтерв'ю з користувачами

Value proposition Canvas (шукаємо цінність продукту), Personas

• Value Proposition Canvas та її переваги
• Створення Personas: які дослідження потрібні, на що звернути увагу та як їх оформити
• Коммунікація та презентація своїх рішень, як для клієнта, так і для команди

Методи UX Mapping, створення CJM, брейнштормінг, методи відбору ідей

• Порівняння методів UX Mapping
• Розбираємо Customer Journey Map
• Як правильно створити Customer Journey Map і що робити із нею далі
• Як правильно провести брейнштормінг
• Метод Crazy 8's
• Методи вибору кращих ідей після брейнштормінгу

Створення дизайн-рішення, формати та таблиці, фільтри, аргументація

• UX правила та психологічні прийоми в дизайні
• Розробляємо власне рішення на основі досліджень: ваєрфрейми та прототип (індивідуально)
• Як створити ефективні форми на сайті
• Як створити правильну таблицю
• Фільтри та сортування
• Як аргументувати свої ваєрфрейми перед клієнтом
• Основи MVP підходу (база)

Usability testing варфреймів та метрики. Частина 1

• Юзабіліті тестування: від А до Я
• Як правильно провести тестування і отримати релевантні дані
• Метрики: вимірювання успіху UX-дизайну
• Коридорне тестування

Usability testing варфреймів та метрики. Частина 2

• Де і як створити портфоліо: Notion та Behance
• Оформлення Case study з UX дизайну для портфоліо

Резюме та пошук роботи

• Як і де створити ефективне резюме
• Важливі Soft skills для UX дизайнера

7 зустрічей на курсі і 2 презентації

• Онлайн лекція: Навіщо бізнесу UX?
• Онлайн лекція: Модель КАНО
• Воркшоп: Аналіз конкурентів за методом КАНО
• Командна консультація з ментором
• Воркшоп: UX аудит за Евристиками Нільсена
• Онлайн лекція: Техніка воронки в юзабіліті тестуванні
• Q&A сесія

Особливості курсу

• 10 тижнів навчання
• 10 модулів з відео уроками в записі
• 18 студентів у групі
• 6 практичних онлайн занять
• 2 практики презентацій своїх рішень
• Командна та індивідуальна робота на курсі
• Підтримка ментора
• 85% практики та відео-розбір кожної домашки
• Закриті чати зі студентами
• Індивідуальний чат з ментором
• Додаткові матеріали, конспекти, тести
• Сертифікат про проходження курсу (за умови виконання всіх домашок)
• 6 місяців доступу після завершення курсу

Викладачі курсу

Олександра Коваль - Lead Product Designer

Ви опануєте основи роботи в Figma, навчитесь створювати власні проєкти та вдосконалювати їх з урахуванням потреб користувачів. Завдяки практичним завданням, Ви отримаєте необхідні навички для впевненого старту у світі UI/UX дизайну та влаштування на свою першу роботу.

Програма курсу

Модуль 1. Figma

• Урок-знайомство
• Знайомство з UX/UI дизайном та його роллю в розробці продуктів
• Основи Figma, FigmaJam:
  • Навчальний план, створення команди, коментарі, робота з Frames
  • Огляд інтерфейсу та основних панелей
  • FigmaJam
• Робота з векторами та об’єктами:
  • Fill, stroke, styles, local variables
  • Створення стилів для забезпечення консистентності дизайну
  • Створення локальних змінних та систематизація кольорів
• Відтворення ілюстрації, створення патернів:
  • Pen&Pensil
  • Boolean groups
• Робота з типографікою:
  • Правильне використання розміру, ваги та міжлітерного проміжку шрифтів
  • Робота зі стилями
  • Основи візуальної ієрархії
• Маски та ефекти, використання градієнтів
• Autolayout
• Components
• Component variants
• Local variables (color, text, string, boolean)
• Мікроінтеракції
• Figma workshop

Модуль 2. UX дизайн

• UX дизайн-процес: Empathize, Define, and Ideate
• Робота з брифом, Mind mapping
• Аналіз конкурентів - SWOT
• Persona, Proto-persona
• Опитування, сортування карток
• Інтерв’ю з користувачами
• Гіпотези та їхня валідація
• Інформаційна архітектура
• Customer journey map - карта досвіду користувача
• Артефакти: user flow, user story
• Генерація ідей, скетчинг
• Wireframing та prototyping
• Веб-аналітика та тестування
• UX workshop

Модуль 3. UI дизайн

• Макет та сітка, основи композиції
• Візуальна ієрархія
• Теорія кольору
• Шрифти та типографіка
• Варіативність дизайну: Adaptive, Responsive, Mobile first
• Базово про іконки у UI
• Доступність дизайну (Accessibility)
• Атомарний дизайн (Atomic design)
• UI-кіт
• Дизайн-система
• AIDA, структура лендінгу
• Інтерактивний прототип та завершення тестування
• Оформлення UI/UX case study
• UI workshop
• Final review and graduation

Після курсу ти будеш вміти:

• Використовувати сервіс Figma для створення інтерфейсів та прототипів
• Створювати користувацькі інтерфейси для веб-сайтів та додатків з урахуванням кращих практик UX/UI дизайну
• Аналізувати користувацькі потреби, створювати персонажі та карти досвіду користувача для покращення взаємодії з продуктом
• Впроваджувати варіативність дизайну: розуміти принципи адаптивного та мобільного дизайну, створювати продукти, що коректно відображаються на різних пристроях
• Використовувати візуальну ієрархію та композицію
• Створювати дизайн-систему та UI компоненти
• Створювати доступні та інтерактивні інтерфейси для покращення користувацького досвіду
• Ви будете мати власне портфоліо та зможете працювати на професійних проєктах

Особливості курсу

• Свідоцтво про закінчення курсу
• Портфоліо з проєктів
• Гнучкий графік занять

Опануй інструменти Adobe та Figma, навчись створювати логотипи, іконки та адаптивні веб-сайти. Вивчай композицію, типографіку, анімацію та багато іншого.

Програма курсу

Теми:

• Adobe Illustrator. Векторна графіка
• Adobe Illustrator. Обробка контуру
• Натхнення та карта асоціацій. Працюємо з FigJam
• Figma. Вивчення функціоналу
• Композиція. Сітки. Вертикальний ритм
• Типографіка
• Колористика
• Дизайн логотипу та логобуку
• Дизайн іконок та кнопок
• Стилі та компоненти
• Auto layout
• Адаптивний дизайн
• Брендинг та айдентика
• Wireframe
• Мудборд та дизайн система для свого проєкту
• Типи сайтів. Створення Landing Page
• Дослідження та бриф
• Дослідження бізнесу та цільової аудиторії
• Конкурентний аналіз
• User Flow. Site map
• User Stories. User scenario
• Об'єднання аналітики
• Анімація Figma
• Adobe Photoshop. Створення колажу
• Adobe Photoshop. Обробка фото

В кінці курсу виконується дипломний проєкт

Особливості курсу

• Невеликі групи
• Система особистих кабінетів
• Доступ до відеозаписів занять
• Викладачі практики
• Оперативна служба підтримки студентів
• Практичні заняття

Викладачі курсу

• Крістіна Стефанишина - Web Designer
• Ксенія Скипенко - Web Designer at TrueDesign
• Єлизавета Чепугова - Graphic Designer at Nasha Idea
• Вікторія Ільїна - Designer at DCoast Design studio
• Джастіна Нипорко - UI/UX Designer at Sednor Holdings Limited
• Таісія Квітка - UI/UX Designer at Trendo
• Анна Пудова - UI/UX Designer at Pudova Designer

Дізнайтеся, як проводити UX дослідження та використовувати отримані результати для створення клієнтоцентричних продуктів.

Програма курсу

Теми:

• UX дослідження та які задачі вони вирішують
• Процес UX дослідження. Планування, підготовка
• Дослідження та тести. Занурення
• Аналіз та синтез результатів
• Дослідницький звіт
• Етика дослідника, юридичні норми та стандарти

В результаті курсу ви опануєте:

• Desk research
• Інтерв'ю
• Модероване UX тестування
• Розробка дизайну дослідження
• Кікоф з замовником
• Розробка гайдів
• Оцінка за UX евристиками
• JTBD
• Аналіз та синтез зібраних даних
• Беклог задач
• Пріоритезація задач

Особливості курсу

• Заняття у зручний час
• Доступ до запису занять
• Домашні завдання
• Підтримка ментора
• Сертифікат про проходження курсу
• Можливе повернення коштів до 2-го уроку

Викладачі курсу

• Лєна Поліщук - Дизайнерка користувацького досвіду та методологиня досліджень
• Анфія Резнікова - UX-дослідниця та менеджерка дослідницьких проєктів