Завжди мала потяг до творчості, але хотіла, щоб вона приносила стабільний дохід. Школу обрала через потужне портфоліо їхніх випускників, роботи на Behance говорять самі за себе. Потрапила на курс до Юлі Жуковської і це була любов з першого заняття. Юля ламає стереотипи про те, що дизайн це просто красиві картинки. Вона навчила мене аналізувати користувацький досвід, проводити дослідження та аргументувати кожну кнопку в макеті. Спілкування в групі було настільки ламповим, що ми досі підтримуємо зв'язок. Школі та Юлії величезне дякую
Курси Web Design / UI/UX
- Web & Mobile Design / UI/UX
Курс складається з двух блоків: hard skills (курс Вебдизайн - розвиток професійних навичок) та soft skills (заняття з управління собою та проєктами, розвиток персональних навичок). Навчаємо підлітків з нуля. Вступне тестування на рівні Beginner - на логіку та базове володіння комп'ютером. Модуль Працевлаштування - робота з реальними замовниками, симуляція проходження співбесід, оформлення професійного портфоліо та резюме тощо.
План курсу
Освітні результати
Hard skills (Рівень Beginner):
- Первинне портфоліо робіт з 4-ох проєктів на behance.com
- Формування базових навичок вебдизайнера
- Реалізація досліджень та робота з персонами (онлайн та офлайн)
- Практика роботи в Trello: система управління проєктами і їх ведення
- Індивідуальний проєкт: робота над сайтом
- Прототипування та пропрацювання сценаріїв у Figma
- Активна робота з реферальними рішеннями в Behance та Dribble
- Створення hi-fi прототипів
- Тестування: офлайн та онлайн
- Індивідуальна та командна робота над технічними завданнями від замовника в установленні часові рамки
Hard skills (Рівень Advanced):
- Основи прожект менеджменту, методам Agile, Waterfall, Kanban
- Метод управління проєктами, техніка Scrum
- Досвід роботи з реальним замовником
- Основи клієнтоорієнтованого підходу, аналіз потреби замовників
- Складання повноцінного резюме (CV), верифікація в HR менеджера/рекрутера
- Оформлення мотиваційного/супровідного листа до резюме
- Симуляція проходження співбесіди
- Оформлення профайлу на linkedin, дослідження job порталів
- Пошук замовників/компаній, особливості роботи на freelance
- Юридичні особливості трудових відносин в Україні
Soft skills:
- Емоційний інтелект
- Самоідентифікація
- Лідерство
- Цілепокладання
- Мотивація та дисципліна
- Тайм-менеджмент
- Самопрезентація
- Комунікація - конфліктологія - перемовини
- Мистецтво публічного виступу
- Робота в команді та з замовником
Результат навчання
IT сфера цінує знання та досвід. Підліток отримує:
- Профорієнтацію, підготовку до вступу у профільний університет, профорієнтацію
- Здатність працювати на рівні Junior дизайн спеціаліста після модуля Працевлаштування
- Стажування/працевлаштування в компаніях-партнерах Ampli
- Професійне портфоліо власних та командних робіт
- Міжнародний сертифікат в разі успішного проходження навчання
- Рекомендаційний лист від компанії, де студент проходив стажування для вступу до університету та подальшого працевлаштування
Перша робота:
- Рівень Beginer плюс Модуль Працевлаштування дають знання на рівні Junior спеціаліста та дозволяють отримати першу роботу
- Програма навчання складається із командних проєктів та їх захисту (пітчів) перед вебдизайнерами та HR менеджерами IT компаній
- Для наших випускників в Ampli працює кар'єрний сервіс з пошуку стажування та першої роботи
- Тож окрім першого досвіду випускники отримують рекомендаційні листи для вступу в університет та подальшого працевлаштування
Особливості курсу
- Тривалість навчання - 6 місяців (24 тижнів/занять)
- Групове онлайн навчання з тренером - дизайн-спеціалістом рівня Middle+, групою підлітків та супроводом стаді-менеджера
- Завдання для роботи серед тижня: відео-підручник (1-5 відео на тиждень), тести до нього, практичні завдання, додаткові матеріали (галузеві статті, ін.) Перевірка завдань тренером. Спілкування у чаті
- Групове онлайн заняття з тренером по hard skills вихідними, раз на тиждень (субота або неділя, 2 години, онлайн у zoom/google meets)
- Онлайн-практикуми з тренером по soft skills (надпрофесійні навички) раз на тиждень (1.5 години)
- Зворотний зв’язок для батьків:
- раз/місяць статус навчання по програмі від стаді-менеджера
- раз/три місяці - відгуки тренера
Автори програми
- Ольга Шевченко - Vintage
- Еліях Семьонов - PDF filter
- Христя Митсак - Global Tech Makers
- В'ячеслав Школьний - Cogniance
- Женя Скрябіна - Luxoft
- Олександр Валіус - Eleks
- Устим Гануляк - EPAM
- Олександра Лукавецька - WebIT.Agency
- Web & Mobile Design / UI/UX
Ви навчитеся правильно створювати, налаштовувати та найменувати компоненти. Завдяки цьому зможете ефективно масштабувати та змінювати елементи дизайну і опануєте професійний підхід до дизайну у Figma.
Програма курсу
Основна інформація про компоненти
Дізнаємося, що це таке та з чим його їдять професійні дизайнери.
Робота з основними функціями компонентів
Навчимося застосовувати компоненти у власних проєктах.
Властивості компонентів
Знайомство з властивостями, маленькими помічниками, що дають змогу втілювати з компонентами купу корисних задач.
Робота з властивостями компонентів
Навчимося використовувати різні властивості компонентів, а також їхні комбінації.
Робота з складеними властивостями
Знайомство зі складеними властивостями.
Додаткові функції компонентів
Навчимося використовувати додаткові функції компонентів.
Після проходження курсу ви зможете
- Заощадити час у Figma. Замість ручного копіювання елементів, ви навчитеся використовувати готові компоненти у Figma
- Легко оновлювати дизайн. Вміння працювати з компонентами значно спростить процеси редизайну або масштабування
- Брати в роботу великі проєкти. Компоненти є основою для розробки багаторазових дизайн-систем, що спрощують роботу над великими проєктами
- Ефективніше працювати у великих командах. Компоненти полегшують спільну роботу над проєктами, зменшуючи ризик помилок
- Підтримувати високий рівень дизайну. Завдяки компонентам усім елементи вашого дизайну залишатимуться узгодженими і послідовним
- Ефективніше розв'язувати дизайн-задачі. Компоненти дозволяють швидко адаптувати елементи під різні потреби, підтримувати єдиний стиль та масштабувати дизайн
Особливості курсу
- Допомога ментора
- Теорія + практика
- Підтримка від спільноти студентів
- Додаткові матеріали
- Служба підтримки CASES
- Перевірка домашніх робіт
- Сертифікат про проходження курсу
Викладачі курсу
Євген Ігнатюк - Провідний дизайнер CASES та Креативної Практики
Подати заявку- Web & Mobile Design / UI/UX
Комплексний практичний курс про створення інтерфейсів та вебпроєктів. Після його завершення ви станете майстром Figma, отримаєте від 2 проєктів в портфоліо та створите інтерактивний прототип мобільного застосунку.
Програма курсу
Місяць 1
Вступне заняття
- Вступне заняття курсу. В його межах обговоримо програму навчання та практичний бриф
- Розберемо базові поняття
- Познайомимося з процесом створення вебпроєкту
Анатомія інтерфейсу: основи
Урок, на якому ми знайомимо студентів з першими елементами та їхніми станами, а також з основами роботи з Figma для дизайнерів інтерфейсів.
Онбординг
- Урок, де ми познайомимось з основами онбордингу та слайдерів
- Дізнаємось, як генерувати зображення, працювати з модальними вікнами
Шоти та презентація робіт
- Урок, на якому будемо знайомитися з шотами та Dribble
- Навчимося створювати обкладинки та описи для проєктів
- Публікація робіт
Місяць 2
Інформаційна архітектура та навігація вебсайтів
Урок, де ми розберемо інформаційну структуру сайтів, шапку сайту, однорівневу та багаторівневу навігацію, хлібні крихти, бічну навігацію, футер та навігацію в футері.
Створення карти сайту та різних видів навігації
Урок з розробки карти сайту та представлення її у вигляді навігації.
Розбір напрацювань
Розбір робіт студентів, роз'яснення помилок, підказки, як перетворити напрацювання з навігації в готовий шот.
Навігація в мобільних застосунках
Урок, присвячений принципам перемикання між розділами в застосунку. В його межах розберемо принцип занурення, типи мобільної навігації, анатомію верхньої панелі та принципи роботи кнопки "Назад".
Створення мобільної навігації та робота з користувацькими сценаріями
Урок, на якому ми навчимося створювати типові зразки мобільної навігації: нижню панель, бургер-меню, а також - користувацький сценарій (Userflow).
Розбір напрацювань
Аналізуємо роботи студентів та типові помилки.
Головний екран посадкової сторінки
- Знайомство з Hero Section
- Анатомія сторінки
- Типові композиції
- Знайомимось з інструментами, що допомагають створити крутий ключовий образ
- Розробляємо шоти на основі головного екрану
Розбір робіт студентів
- Аналіз напрацювань по Hero Section
- Розбір робіт студентів
Місяць 3
Типові блоки посадкової сторінки
Урок, присвячений будові посадкових сторінок, їхній анатомії та типовим блокам.
Створення структури посадкової сторінки
- Знайомство з ChatGPT як інструментом для створення правдивого контенту
- Урок зі створення підказок (промтів)
- Робота з Language Tool для перевірки контенту
- Знайомство з Freepik для практики в створенні графічного контенту для сайту
Розбір напрацювань
- Розбір напрацювань студентів
- Рекомендації щодо покращень їхніх робіт
Мобільна версія сайту та адаптивний дизайн
- Адаптивний дизайн та його ключові принципи
- Робота з авторозмітками та іншими інструментами Figma
- Створення мобільної версії сайту
Розбір напрацювань
На цьому розборі викладач продивляється напрацювання студентів, дає зворотний зв'язок.
Створення дизайну сторінки: від пошуку візуального стилю до верстки
Урок, на якому викладач показує процес створення посадкової сторінки та версткою кожного блоку посадкової сторінки після Hero Section, включно з формою заявки.
Розбір напрацювань
Розбір робіт студентів по мобільній версії.
Фінальний розбір напрацювань, підготовка шотів до публікації
Додатковий, фінальний розбір напрацювань.
Особливості курсу
- Посібники та шаблони
- Допомога з наповненням портфоліо
- Знайомство з інструментами ШІ
- Доступ до закритого чату спільноти
- Добірки вакансій за напрямом
- Допомога ментора
- Сертифікат про проходження курсу
Викладачі курсу
- Юрій Галюк - Customer Experience Lead at ELEKS
- Антон Лукащук - Дизайнер цифрових інтерфейсів, Webflow-розробник
- Віталій Дячук - E-commerce Lead Designer at League Design Agency
- Вадим Гайдай - Провідний вебдизайнер в League Design Agency
- Web & Mobile Design / UI/UX
На курсі ви вивчатимете: основні інструменти графічних редакторів, ретуш та оброблення фотографій, створення різноманітних макетів, візиток, банерів, іконок, логотипів, підготовку до друку, створення дизайнерських макетів для веб-сайтів та мобільних версій сайтів.
Програма курсу
Теорія Веб-дизайну
- Інтернет, веб-сторінка
- Веб-дизайн
- Колір
- Композиція
- Шрифт
- Основні принципи комп'ютерного дизайну
- Стилі, тренди
- Спілкування із замовником
Практика по Adobe Photoshop
- Основне про Adobe Photoshop
- Панель інструментів
- Малювання фігур та об'єктів
- Робота зі слоями
- Робота з текстовими слоями
- Робота із зображеннями
- Дизайн логотипу
- Дизайн візитки
- Дизайн рекламного банеру
- Робота з готовим шаблоном
- Підготовка мобільної версії сайту
- Дизайн емейл розсилок
- Підготовка та передача макетів замовнику
Практика по Adobe Illustrator
- Основне про Adobe Illustrator
- Робота з вектором та растром
- Робота з контурами та об'єктами
- Робота з текстами
- Розробка іконок
- Магія інструменту Shaper
- Підготовка зображень для завантаження на Shuttershtock
Практика по Figma
- Інтерфейс, створення облікового запису
- Створення базових векторних фігур та ефекти, використання сітки
- Робота з текстом, глобальні стилі
- Авторозмітка (autolayout)
- Робота з плагінами, community
- Компоненти
- Створення мобільного додатку
- Прототипування та аніміції
Особливості курсу
- Курс в Хмельницькому
- Для дорослих та молоді від 14 років
- 2-чі на тиждень по 2 год. 18:30 - 20:30
- Дні навчання: середа, п'ятниця
- 4 місяці / 32 заняття
- Багато практики
- Індивідуальний підхід
- Актуальна програма навчання
- Web & Mobile Design / UI/UX
Навчимо створювати дизайни зручних інтерфейсів для сайтів та мобільних застосунків з нуля, створити портфоліо та заробити перші гроші.
Програма курсу
Hard Skills:
- Базові навички роботи у Figma
- Колористика. Комбінуємо кольори для сайту
- Використовуємо іконки сайтів
- Дизайн багатосторінкового сайту
- Адаптація дизайнів сайтів під мобільні пристрої
- Створення просунутих анімацій сайту
- Дизайн інтернет-магазину (картка товару, каталог, кошик тощо)
- Верстка інтернет-магазину на WIX з адаптацією під мобільні пристрої
- Робота над власним портфоліо. Упаковка кейсів для соцмереж
- Штучний інтелект у роботі веб-дизайнера
- Створення професійного СV
Soft Skills:
- Командоутворення. Командна гра
- Спілкування в Інтернеті та критичне мислення
- Емоційний розвиток
- Лідерство
- Креативне мислення
- Фінансова грамотність
- Планування та розклад
- Цілепокладання
- Презентація себе та проєктів
Бонуси для студентів
- Урок в подарунок - "Складання та оформлення сучасного CV"
- Список джерел по пошуку фріланс-замовлень та вакансій для дизайнерів
- PDF-файл з англійською термінологією для роботи
- Все про шрифти. Топ корисних ресурсів для завантаження шрифтів
- Гарячі клавіші у Figma
Окрім дизайну навчимо
- Працювати в команді
- Планувати час та ставити цілі
- Фінансовій грамотності
- Креативно мислити
- Презентувати себе та свої проєкти
- Складати CV та знаходити замовлення
Особливості курсу
- Сертифікат після проходження курсу
- Навчання на окремій онлайн-платформі
- Підтримка ментора
- Особистий кабінет
- Маленькі групи
- Конкурс та подарунки з найкращі фінальні проєкти
- Сервіс турботи
- Бонусні матеріали
- Web & Mobile Design / UI/UX
На наших курсах по веб дизайну ми вчимо студентів збирати та обробляти статистику, досліджувати шлях користувача в системі та складати сценарії використання продукту, створювати прототипи та мок-апи. Ми поговоримо про те, якими інструментами користуються сучасні дизайнери, і як планувати та просувати кар’єру за напрямом UI/UX. Після закінчення курсу у вас буде готовий проект у портфоліо, який можна буде показати майбутньому роботодавцю.
Програма курсу
UX Дослідження
UX Дослідження складається з двох частин: збір даних та їх узагальнення, таким чином допомагає нам визначити, підтвердити або спростувати наші припущення, знайти спільні риси в моделях поведінки користувачів, а також розпізнати їхні потреби та цілі.
Структура проєкту
Складання інформаційної архітектури, написання історій, сценаріїв і User Flow на основі користувальницького дослідження.
Прототипування
Скетчі, вайрфрейми, мокапи як способи комунікації у дизайні. Для перевірки чи спростування інформаційної архітектури та інших аспектів проєкту.
Принципи веб-дизайну
Візуальна вага, напрямок, акцентування, контраст, балансування, повторення, зручність сприйняття, чим більше уваги приділяти цим принципам, тим вдалішим в результаті вийде дизайн.
Компоненти
Кнопки, меню, перемикачі, форми - всі ті елементи, що допомагають користувачам взаємодіяти з сайтом або програмою. У кожного компонента може бути кілька станів, які допомагають користувачам зрозуміти інтерфейс. Також вчимося передавати дизайн спіки розробникам та взаємодіяти з ними.
Проєкт для портфоліо
Процес створення UX-портфоліо висвітлює ключові моменти вашого процесу проєктування та дозволяє показати іншим, хто ви як дизайнер, ваші навички та досягнення.
Попередні вимоги
- Знання та мінімальний досвід використання будь-якого графічного редактора (Sketch (MacOS), Figma (MacOS/Windows) або Adobe XD)
- Знання англійської мови на рівні читання технічної документації
Особливості курсу
- Швидкість проходження курсу залежить від вас. Швидше вчитесь - менше платите. Середній час проходження курсу 2-4 місяці
- 7 днів тестового періоду
- Менторинг
- Безкоштовна заморозка
Викладачі курсу
- Олександр Винокуров - Senior Product Designer at Autility AS
- Родко Хоржинський - Head of Product Design at Reviult
- Діана Сульдіна - UI/UX Designer
- Web & Mobile Design / UI/UX
Якщо ваша дитина демонструє неабиякі творчі здібності, любить малювати, колажувати, вигадувати та створювати контент для соціальних мереж, спробуйте мінікурс з дизайну — можливо, це саме той напрям, який припаде їй до душі.
Програма курсу
Урок 1. Знайомство з Figma. Створюємо шапку сайту
Реєструємося на платформі Figma, знайомимося з навчальними матеріалами та створюємо першу частину вебсайту - header.
Урок 2. Використання іконок в дизайні. Працюємо над секцією "Чому ми?"
Розроблюємо другу частину вебсайту, де використовуємо іконки та описуємо переваги нашої компанії.
Урок 3. Робота з текстом. Пишемо опис своєї компанії
Працюємо над дизайном третьої частини сайту "Хто ми?" - редагуємо текст, додаємо фото та робимо кнопку для заявки.
Урок 4. Обробка отографій. Розроблюємо секцію з командою
Вчимось оформлювати фотографії та додавати візуальні ефекти. Описуємо ролі членів команди.
Урок 5. Створення форми зворотнього зв'язку у Figma. Завершуємо проєкт
Працюємо над створенням форми в останньому блоці сайту та оформлюємо footer. Виносимо фінальні правки та публікуємо проєкт.
Особливості курсу
- Всі завдання в одному місці
- Доступ назавжди
- Спільнота найкращих
- 5 відеоуроків
- 5 практичних занять
- 1 готовий проєкт
- Web & Mobile Design / UI/UX
Це професійний курс дизайну сайтів, мобільних додатків та ігор від GoIT, адаптований для підлітків.
Програма курсу
Design Junior (10-12 років)
Семестр 1
- Знайомство з інструментами Canva
- Шаблони, фігури, кольори. Ієрархія кольорів в проєктах
- Робота з зображеннями, фотографіями, текстом та шрифтами
- Дизайн та анімація для соцмереж у Canva
- Оформлення презентації для навчання
- Створення візитівок, розробка логотипу. Мокапи
- Інтро-лого, брендові постери, мерч
- Знайомство з Photopia. Патерни
- Ребрендинг для обраного бренду
Семестр 2
- Інструменти Wix
- Знайомство з UI/UX
- Cайти та їх види. Хедер, футер, складові сайту
- Створення сайту на шаблоні про святкову подію
- Анімація елементів на сайті
Фінальні проєкти:
- Оформлення власних соціальних мереж
- Створення стікерпаків для Telegram
- Створення власного бренду
- Власний сайт портфоліо з роботами за весь курс
Graphic Design (12-16 років)
Семестр 1
- Знайомство з інструментами Adobe Photoshop
- Композиція в дизайні, робота з фігурами
- Колір, градієнти
- Робота з векторною графікою
- Виділення, маски та ефекти
- Коригуючі шари, пресети
- Обробка фотографій
- Типографіка і колажі
- 3D, Анімація
- Стікерпаки, банери, мокапи
- Дизайн Landing Page
Семестр 2
- Знайомство з інструментами Adobe illustrator
- Сітка, маски і трасування
- Пензлі, олівець
- Типографіка з ефектами
- Шучний інтелект в Illustrator
- Розробка власного бренду
- Логотип, візитна картка, буклети
- Іллюстрація та дизайн продукції
Фінальні проєкти:
- Створення постеру з героями фільмів, ігор
- Дизайн профілю у соцмережах
- Дизайн рекламних банерів для інтернет-магазину
- Створення ілюстрації для сторінки книги
- Створення брендбуку для власного бренду
Web Designer (13-16 років)
Семестр 1
- Знайомство з інструментами Figma
- Основні етапи розробки сайтів та лендінгів
- Стилі, типографіка і прототипи
- Растрова і векторна графіка
- UI-kit, адаптивний дизайн
- Дослідження у UX/UI design. Цільова аудиторія
- Наповнення сайту, форми зв'язку
- Анімація на сайті. Підготовка макету
Семестр 2
- Архітектура та дизайн веб-додатків
- Патерни поведінки користувача у додатку
- MVP (Minimum viable product)
- Дизайн мислення
- Робота з дашбордами
- А/Б тестування
- Анімація у веб-додатках
- Дизайн система
Фінальні проєкти:
- Розробка дизайну багатосторінкового сайту
- Розробка дизайну мобільного додатку
Motion Design (14-16 років)
Семестр 1
- Знайомство з інструментами MediaCoder, After Effects, Premiere Pro
- Композиція, базовий монтаж відео
- Текст, графічні шаблони, звук, субтитри
- Ефекти, експорт, рендерінг
- Motion-графіка, стилі, застосування
- Фігури, текст, маски, анімація
- Робота з ефектами, морфінг
- Штучний інтелект для дизайну та монтажу
- Світло, камера, 3D простір
- Брифи, технічне завдання, взаємодія з замовником
Семестр 2
- Анімація персонажа, логотипу
- Заставка для YouTube-каналу
- Chromakey
- 2D + 3D трекінг і Matchmoving
- Камери. Багатокрапкове відстеження
- Content Aware Fill
- Rotoscoping та Compositing
Фінальні проєкти:
- Монтаж Reels або TikTok
- Створення промо відео
- Створення шейпової анімації
- Розробка інфографіки
- Створення відео для YouTube-каналу
- Створення власного відео портфоліо
Особливості курсу
- Кабінет студента
- Онлайн заняття
- Ігровий формат занять
- Невеликі групи
- Зворотній зв'язок
Викладачі курсу
- Єлизавета - 2+ роки досвіду викладання Digital Design, Motion Design
- Олександра - 5+ років досвіду викладання дизайну та малювання
- Дар'я - UI/UX Designer
- Валерія - 7+ років досвіду у сфері дизайну
- Єлизавета - 2+ роки досвіду роботи з UI/UX
- Віктор - UI/UX дизайнер
- Віолетта - 3+ роки досвіду graphic design
- Сергій - 5+ років досвіду роботи у дизайні
- Web & Mobile Design / UI/UX
На курсі ви отримаєте теорію, практику, а також інструменти, які допоможуть реалізовувати проекти у веб-дизайні. Під час курсу ви попрацюєте з програмою Figma, а в процесі навчання виконаєте завдання, які можна буде сміливо додати у портфоліо.
Програма курсу
Введення в курс. Знайомство з професією веб-дизайнера
- Про професію
- Основні закони User Experience і як їх примінити на практиці
- Типи сайтів: класифікація і основні відмінності
- Робота в Figma, Adobe Photoshop і Adobe Illustrator
Потреби ринку і можливості для дизайнера новачка. Важливість правильного резюме
- Платформи і сайти, де дизайнер початківець може почати кар'єру
- Практика: резюме в Figma. Знайомство з програмою і вчимося складати резюме, яке відповідає потребам ринку
Методи захисту свого проекту/дизайну і успішної роботи з критикою замовника
- Як працювати з критикою замовника
- Методики захисту свого проекту
- Розбір домашніх завдань і аналіз помилок
Основи Visual design. Створення банера для сайту
- Правила роботи з композицією і відступами
- Підбір шрифтів
- Теорія кольору
- Практика: створюємо банер для веб-сайту. Застосовуємо вивчені знання на практиці і оприділяємо, чому банер грає ключову роль
Основи accessibility інтерфейсів
- Базові вимоги до доступності
- Підбираємо контрастність і шрифт для кращого сприйняття
- Аналізуємо домашні роботи і обговорюємо розповсюджені помилки
Основи респонсив дижайну, сітки і брейкпоінти. Створення лендінгу
- Дизайн під різні розширення екранів
- Самі популярні розширення
- Які бувають сітки і як їх застосовувати
- Практика: створюємо лендінг
Естимація і дедлайни
- Як оприділяти терміни на виконання задач
- Як не порушувати дедлайни
- Поради по комунікаціям з клієнтом
- Аналізуємо лендінги студентів і виявляємо найчастіші помилки
Основи UX, Design thinking. Створення брифу, аналіз конкурентів
- В чому важкість роботи UX-дизайнера
- Які практики варто використовувати
- Вимоги і обмеження, які треба взнати в клієнта перед початком роботи
- Порівняльний аналіз конкурентів
- Оприділяємо найважливіші функції майбутнього сайту
Аналіз існуючого дизайну, евристична оцінка юзабіліті. Редизайн сторінки в інтернеті
- Правила юзабіліті Нільсена і їх застосування в аналізі дизайну
- Практика: аналіз і покращення дизайну сторінок сайту
Розбір домашнього завдання "Редизайн сторінки в інтернеті"
- З кожним студентом розбираємо його ДЗ по редизайну
- В групі дивимось на те, які помилки в старому дизайні вдалося найти і які рішення можна запропонувати
Найкращі практики в e-commerce. Створення головної сторінки інтернет-магазину для десктопа і мобільного
- Практики і тренди по створенню інтернет-магазинів
- Елементи і блоки для головної сторінки інтернет-магазину
- Практика: малюємо головну сторінку в розширені 1440х900 (десктоп) і 812х375 (мобільний)
Розбір домашнього завдання "Головна сторінка інтернет-магазину"
Огляд попереднього домашнього завдання студентів
UIKit, Design System, Atomic design. Створення каталога, карточки товару для десктопа і мобільного
- Використання базових компонентів для великого сайту
- Різниця між UIKit і Design System
- Практика: продовжуємо роботу над інтернет-магазином - робимо каталог і карточки товарів
Розбір домашнього завдання "Каталог, карточка товару для десктопа і мобільного"
Аналізуємо роботи і розбираємо популярні помилки в попередньому домашньому завданні.
Створення корзини і процесу оформлення замовлення. Десктоп і мобільна версія
- Основні практики і найкращі рішення
- Практика: Працюємо з самою відповідальною і важливою для бізнесу частиною - дизайн корзини і процесу оформлення покупки
Розбір домашнього завдання "Корзина, процес оформлення замовлення для десктопа і мобільного"
- Аналізуємо роботи студентів
- Особливості реалізації функцій на мобільному пристрої
Інтерактивна презентація проекту в Figma
- Створення інтерактивних моделей сайту
- Як "продавати" дизайн клієнту
Захист курсового проекту
- Захищаєм курсовий проект
- Радуємось успішному проходженню курсу :)
Особливості курсу
- Все що в пакеті Lite
- Доступ до матеріалів та відео назавжди
- Сертифікат про проходження курсу
- Відеозаписи всіх живих лекцій в кабінеті
- Перевірка ДЗ з коментарями від тренера
- Фінальний проект - готовий кейс
- Відеозаписи блоку "IT Career"
Викладачі курсу
Олександр Чмира - Senior Experience Designer
Подати заявку- Web & Mobile Design / UI/UX
Програма курсу
Основи веб-дизайну
- Про веб-дизайн і про курс
- Типографія у веб-дизайні
- Кнопки, форми та анатомія UI-елементів
- Композиція у веб-дизайні
- Сітки у дизайні
- Колір та візуальна айдентика бренду
- Види контенту: фото, тексти, іконки, ілюстрації, анімації, 3D, відео та гіфки
Старт роботи у Figma
- Огляд інтерфейсу та знайомство з Figma
- SVG іконки, шейпи та ілюстрації у Figma
- Компоненти, Auto Layout та варіативні компоненти у Figma
- UI-kit - бібліотеки та стилі у Figma
- Корисні плагіни для Figma
- Анімації та інтерактивні прототипи у Figma
- Як готувати і передавати макети у Figma розробникам
- Куратор створює сайт
Підготовка і дизайн
- Етапи роботи над сайтом
- Перший контакт і брифінг клієнта
- Створення структури сайту
- Створення бюджету проєкту
- Створення прототипу проєкту
- Створення мудборду і пошук референсів
- Дизайн-концепція сайту
- Дизайн домашньої сторінки та внутрішніх секцій (блоків) сайту
- Адаптивний дизайн під мобільні та планшетні пристрої
- Техзавдання та підготовка до верстки
- Створення дизайну сайту рівня Awwwards
UX дизайн
- Знайомство з UX дизайном
- Аналіз та дослідження
- Використання знань UX в проєктах
Покрокове створення лендингу
- Розбір брифу від реального клієнта
- Пошук референсів та створення мудборду
- Створення прототипу та структури сайту
- Дизайн головної сторінки
- Дизайн інших сторінок
- Створюємо дизайн під мобільні пристрої та планшети
- Готуємо сайт до верстки
- Створюємо кейс на Behance
Створення анімації у Figma
- Введення в анімацію
- Анімація Ui-kit елементів
- Використання розумної анімації
Старт на фрілансі
- Міфи та реальність фрілансу
- Позиціювання фрілансера, портфоліо та побудова особистого бренду
- Де та як шукати клієнтів: Upwork чи Freelancehunt?
- Побудова довгострокових взаємовідносин з клієнтами на роки
- Організація фінансів та документів фрилансера
- Баланс роботи та відпочинку
- Як презентувати і продавати дизайн дорого
- Як розвиватися і не упертись у професійну стелю
- Пошук та розвиток партнерів по бізнесу
- Перехід від фрилансу до бізнесу
Дизайн PRO
- Типографіка у веб дизайні
- Ефекти
- Лайфхаки
- Натхнення
Робота в Webflow
- Знайомство з конструктором (можливості конструктора, структура сайту, як працює блочна система)
- Основні параметри (створення проєкту, його копіювання, налаштування, підключення домену та тарифи)
- Інтерфейс конструктора
- Підготовка макету до верстки
- Верстка макету
- Використання сторонього коду
- Анімація сайту
- Верстка блекпоінтів
- Перевірка макету та виправлення помилок
- Додаткові сервіси
- Робота з клієнтом (передача сайту клієнту і його робота з ним)
- CMS і Seo оптимізація
Особливості курсу
- Власна освітня програма
- Щира підтримка та допомога
- Професійні спікери
- Екосистема для результату
- Щотижневі прямі етери
- Реальні клієнти
- Додаткові матеріали
- Сертифікат
Викладачі курсу
- Ілля Кульбачний - Засновник Cosmos Studio
- Іван Вергун - UI/UX Designer
- Олена Коваленко - Експерт у UI/UX
- Павло Гижко - Понад 6 років досвіду в дизайні та рекламі
- Web & Mobile Design / UI/UX
Програма курсу
Модуль 1. Основи вебдизайну. Створення Landingpage
Інструментарій
Інтуїтивна робота на основному інструменті проєктування інтерфейсів - Figma.
- Робота з формами та шрифтами
- Гарячі клавіші
- Робота з вектором
- Плагіни та фічі програми
Арт навички дизайнера
Як влаштовано сприйняття користувача? Все про сітки, колонки, композиції та декомпозиції, побудову ієрархії та фундаментальні правила створення web просторів.
- Тренди та стиль у дизайні
- Графіка, картинки, іконки
- Колористика, колірні схеми
- Відступи, вирівнювання, внутрішнє та зовнішнє
- Плашки, тіні, форми, кнопки
- Як дістати інформацію з коду
Основи типографіки
Введення у типографіку. Гарнітури та шрифти, сумісні пари, мікродрукарки. Створимо сайт-візитку, використовуючи тільки інструментарій тексту.
- Як завантажувати нові шрифти
- Кегль, кернінг, інтерліньяж
- Основи швейцарської друкарні
- Різниця гарнітур у латиниці та кирилиці
UX аналіз Landing page
Модульний проєкт - Landing Page. Архітектура, із чого складається сторінка на прикладі односторінкового сайту. На які питання повинен відповідати дизайн, що працює.
- Методологія Design thinking
- Розуміння завдання продукту
- Аналіз дослідження. Прототип. Mood board
- Особливості навігації та змісту LP
- Від хедера до футера
Адаптивний дизайн
Адаптуємо Landing Page під смарт девайси. Понад 60% світового трафіку йде із мобільних гаджетів. Ера mobile first.
- Різниця responsive/adaptive web-design
- Мобільні версії знайомих сайтів
- Розміри елементів для доступності всіх груп користувачів
Створення портфоліо
Спільне створення продають презентації фінального дизайну, тонкощі розміщення та просування на Behance.
- Інструкція заповнення профілю на Behance
- Різниця подачі дизайну клієнту та в портфоліо
- Сценарій презентації
- Креативна подача екранів
- Параметри макета для розміщення
Модуль 2. Розробка E-commerce. Фріланс та компанії
Інтернет магазин
Модульний проєкт №2 - Інтернет-магазин. Архітектура та зміст обов'язкових сторінок. Інтернет маркетинг за допомогою UI/UX правил.
- Головна сторінка
- Каталог, Картка товару
- Кошик, Оформлення замовлення, 404
Робота з великими проєктами
Як оптимізувати роботу над великими функціональними командними проєктами.
- Створення user flow та product backlog
- Інтерактивний прототип інтернет-магазину Figma, щоб його можна було кликати
- Методологія Атомарного дизайну
- Компоненти та стани Figma, щоб масово змінювати однакові елементи дизайну та створювати сайт як із конструктора
Double diamond
Double diamond. Протягом останніх 15 років ця модель проектування є найбільш застосовуваною в організації дизайн-проєктів.
- Адаптація методології під себе
- Як складати та працювати з брифом клієнта
- Інтерв'ю із замовником та технічне завдання
- Які уточнюючі питання потрібно поставити
- Тестування дизайн-гіпотез
Креативні методології
Think outside the box - як розвинути в собі вміння креативно дивитися на поставлені завдання.
- Методології креативного мислення
- Як результативно проводити Brainstorm
- Чому важливо не лише знаходити ідеї, а й відсікати їх
Фріланс
Скільки коштує ваш дизайн: ціноутворення та рейт на годину; оцінка проєкту за обсягом, як підвищити свою вартість та ефективність, як спілкуватися з клієнтами. Огляд зарубіжних та вітчизняних фріланс бірж.
- Покрокова реєстрація
- Cover Letter, що писати клієнту
- РЗ чого правильно починати що таке спринти
- Платіжні системи для виведення грошей
- Як презентувати та продавати свою роботу
Компанії
Як знайти, не облажатись і потрапити в компанію своєї мрії.
- Що писати в резюме та супровідному аркуші
- Як виконувати тестове
- Що має бути в портфоліо
- Як не виглядати безглуздо на інтерв'ю
Особливості курсу
- Онлайн формат
- Індивідуальний темп
- Постійний доступ
- Економія часу
- Оперативні відповіді
Викладачі курсу
- Анна Дикань - 7 років досвіду у UI/UX дизайні
- Іван Шендріков - CEO школи Shendrikov Education
- Юлія Остапчук - Менеджер комунікації
- Марина Найдиш - Адміністратор
- Вікторія Федорова - Кураторка
- Олена Демченко - Кураторка
- Дар'я Шабалдіна - Кураторка
- Web & Mobile Design / UI/UX
Навчишся створювати та проєктувати інтуїтивно зрозумілі дизайни веб-сайтів, веб-додатків та дашбордів на базовому рівні використовуючи Figma, зможеш пройти стажування та отримати практичний досвід.
Програма курсу
Введення до курсу
- Привітання
- Огляд програми
Figma
- Комп'ютерна графіка
- Переваги та недоліки Figma
- Робочий інтерфейс
- Інструменти: Objects
- Інструменти: Mask
- Інструменти: Boolean Groups
- Інструменти: Images
- Стилі та їх використання
- Layer ефекти: Blend Modes
- Layer ефекти: Shadow та Blur
- Групування: Group
- Групування: Frame
- Групування: Section
- Групування: Auto Layout
- Групування: Components
- Layout Grid
- Variables
- Інтерактивні макети
- Бібліотеки компонентів
- Плагіни
- Експорт
Основи UI
- Ціль UI дизайну
- Композиція: Основи
- Композиція: Принципи
- Композиція: Сітка
- Типографіка
- Теорія кольорів
- Типи UI Components
- UI Components: База
- UI Components: Вибір елементів
- UI Components: Навігація
- UI Components: Статичні
- UI Components: Інше
- UI Kits
Основи UX
- Ціль UX дизайну
- Закони UX
- 10 евристик юзабіліті Якоба Нільсена
- Доступність та WGAG стандарти (рівні А, АА та ААА)
- Дизайн процес: Аналіз ТЗ
- Дизайн процес: Аналіз ідей
- Дизайн процес: Аналіз аудиторії
- Дизайн процес: Аналіз конкурентів
- Дизайн процес: User Flow
- Дизайн процес: Підбір референсів
- Дизайн процес: Прототипування
- Дизайн процес: Розробка дизайну
- Дизайн процес: Адаптиви
- Дизайн процес: Підготовка макетів для розробників
- UX та веб-додатки
Додаткові інструменти
- FigJam, Miro
- Notion
- Adobe Photoshop
- Adobe Lightroom
- Adobe Illustrator
- Blender
- Інші допоміжні ресурси для дизайну
Особливості курсу
- Допомога ментора
- Практика
- Сертифікат про проходження курсу
- Чат спільноти
- Вебінари та додаткові матеріали
- Заняття з англійської
- Стажування для найкращих студентів
- Web & Mobile Design / UI/UX
Завдяки практичним завданням, ви зможете застосовувати знання на практиці, а отримані навички відкриють перед вами безліч нових можливостей у сфері дизайну. На курсі ви пізнаєте всі складові успішного UI/UX дизайну та будете готові до високооплачуваних та перспективних проєктів.
Програма курсу
Модуль 1. Поглиблення в UX та покращення UI
- Життєвий цикл проєкту (процес розробки продукту та роль дизайнера в ньому):
- SDLC: Agile vs Waterfall
- SDLC: Scrum, Kanban, Lean
- Дизайн-процес
- Збір бізнес-вимог, менеджмент стекхолдерів. RACI-матриця
- Double Diamond
- SWOT - аналіз конкурентів
- Business Model Canvas
- Дослідження користувачів: глибинні інтерв’ю, опитування
- Персона. JTBD, або як замінити персону
- Роль дизайнера в адвокації потреб користувача
- Empathy mapping, Affinity mapping
- Гіпотези та їхня валідація
- Архітектура продукту
- User flow, user story
- OOUX (Object-Oriented UX)
- MVP, LTV
- Sketching
- Паттерни у дизайні
- Евристики Нільсона, їх практичне використання
- Wireframing
- Створення дизайн-системи та документації
- Wireframing
- Prototyping
- Usability testing
Модуль 2. Mobile app
- Introduction
- Human Interface Guidelines
- Material Design Guideline
- Продуктові метрики, Heart Framework
- Navigation
- Patterns
- Використання жестів у застосунках
- Візуальний стиль та розробка концепції
- Form design
- Wireframing, UI kit, prototype
- Підготування додатку до Apple store та Google play
- Створення UX Case Study, Behance та концепт для Dribble
- CV та консультування з HR
- Final review and graduation
Після закінчення курсу ти отримаєш:
- Розуміння процесів розробки продукту
- Аналітичні навички
- Вміння створювати дизайн-концепції
- Розуміння прототипування та навички зі створення дизайну інтерфейсу
- Вміння оцінювати та тестувати продукт
- Навички зі створення дизайну для мобільних пристроїв
- Вміння створювати та оптимізувати візуальний стиль та дизайн форм
- Підготовку до публікації та роботу над портфоліо
Особливості курсу
- Свідоцтво про закінчення курсу
- Проєкти в портфоліо
- Гнучкий графік занять
- Web & Mobile Design / UI/UX
Програма курсу
Модуль 1. Вступ до UI/UX Design
Хто такий UI/UX Designer
- User Experience
- User Interface
- Переваги та недоліки
- Важливість Англійської мови в професії UX/UI дизайнера
Планування та види дослідження
- Визначення дослідження
- Планування дослідження
- Визначте цілі дослідження
- Визначте досліджувану аудиторію
- Виберіть методи дослідження
- Розробіть план дослідження
- Підготуйте необхідні ресурси
- Заплануйте рекрутинг учасників
- Здійснюйте дослідження
- Аналізуйте та інтерпретуйте результати
- Документуйте та представляйте результати
Модуль 2. Основи UX Design
Що таке User Journey Map та User Flow
- User Journey Map
- User flow
Wireframe
- Wireframe це
- Структура інтерфейсу
- Візуальні елементи
- Відсутність деталей дизайну
- Простота
Модуль 3. Основи UX Design
Евристика
- Видимість статусу системи
- Відповідність до реального світу
- Свобода від помилок
- Консистентність та стандарти
- Універсальність та повторне використання
- Забезпечення користувальницького контролю
- Уніфікація та ефективність
- Забезпечення розуміння та навігації
- Забезпечення дизайну за замовчуванням
- Забезпечення діагностики та виправлення помилок
Закони UX
- Закон Фіттса (Fitts’s Law)
- Закон Гікса (Hick’s Law)
- Закон Проксемікі (Proximity)
- Закон Байєса (Bayes’ Theorem)
- Закон Вебера-Фенхера (Weber’s Law)
Модуль 4. Основи UI Design
Композиція
- Статична композиція
- Динамічна композиція
- Навіщо нам потрібні правила композиції
- Композиція допоможе
- Ієрархія об'єктів
- Колір
- Форма
Елементи типографіки
- Типографіка
- Шрифти
- Товщина шрифту
- Основний текст
- Заголовки
- Розмір і міжрядковий інтервал
Модуль 5. Колір та іконки
Теорія кольору
- Теорія
- RGB
- CMYK
- HEX code
- Колірна палітра
- Відтінок
- Градієнт
- Контраст
- Непрозорість
Дизайн іконок
- Основна мета іконки
- Сценарії використання іконок
- Правила використання
- Де використовувати
Особливості курсу
- Особистий кабінет та ком'юніті
- Прямі ефіри
- Практикуючі ментори
- Уроки з HR
- Практичний досвід на реальному проєкті
- Модуль із працевлаштування
- Підготовка до співбесіди
- Проєкт в портфоліо
- Сертифікат про проходження курсу
- 2 пакети навчання
Викладачі курсу
Роман Максимчук - Практикуючий UI/UX Designer
Подати заявку- Web & Mobile Design / UI/UX
Це міні-курс з 7 модулів, де ти зможеш вивчити основи дизайну адмін-панелей та попрацювати над створенням власної, додати її у портфоліо, попрактикуватися у візуалізації даних, створити декілька дешбордів, розібратися з роботою з даними в таблицях.
Програма курсу
Знайомство з адмінками
- Знайомство з Адмін-панелями: їх складові, необхідність створення
- Тест на самоперевірку
Порівняння різних систем
- Порівняння Admin vs CRM vs Dashboard
- CRM: Базове знайомство
- Практичне самостійне завдання: створюємо модуль запису клієнтів в CRM салону краси
Структура адмін-панелі
- Структура адмін-панелі
- Сітки та лейаут (рекомендації)
- Аргументація
- Практичні самостійні завдання: створюємо сторінки адмін-панелі (логін/реєстрація, бокова навігація, сторінка керування товарами, додавання товару)
- Додаткові самостійні завдання: створюємо сторінку блогу та створення посту
Таблиці в адмінках
- Ефективні таблиці
- Модуль в адмін-панелі та CRM "Керування замовленнями"
- Практичні самостійні завдання: створюємо сторінки адмін-панелі (сторінка керування юзерами та їх ролями, керування замовленням)
- Додаткові самостійні завдання: створюємо таблицю із задачами, а потім переоформлюємо її у формат карток
Візуалізація даних
- Візуалізація даних: Порівняльні діаграми. Частини цілого. Розподіл
- Практичні самостійні завдання: вчимось підбирати правильну діаграму під дані (17 завдань)
Ефективні діаграми. Колір
- Колір діаграм
- Як створити ефективні діаграми
- Практичні самостійні завдання: вчимось працювати з кольором діаграм (3 завдання)
Дашборди. Темна тема
- Dashboard
- Аналіз дешбордів
- Документація для користувача
- Темна тема
- Практичні самостійні завдання: створюємо дешборд з діаграмами для адмін панелі
- Додаткові самостійні завдання: створюємо 3 різні дешборди різних систем для відпрацювання
Особливості курсу
- Унікальний авторський курс
- 4 місяці доступу до матеріалів курсу
- 7 модулів з відео уроками в записі
- Доступ протягом 24 годин після оплати
- Завдання на самоперевірку
- Відповіді на завдання від автора курсу
- Без підтримки ментора
- Без сертифікату
Викладачі курсу
Олександра Федорченко - Lead Product Designer
Подати заявку- Web & Mobile Design / UI/UX
Це інтенсив з 6 модулів, в яких 40 відео уроків - справжня прокачка твоїх скілів. Кожен модуль - це глибоке занурення у процес створення портфоліо, від концепції до фінальної подачі. Ми крок за кроком вивчатимемо, як трансформувати ідеї у візуальні історії.
Програма курсу
Модуль 1. Основи крутого Case Study & Аналіз ефективних кейсів
- Що таке кейс стаді. Основні характеристики та проблеми
- Розбір головних складових кейс стаді та типові проблеми, яких слід уникати
- Приклади успішних та неуспішних кейсів. Аналіз реальних кейсів на Behance: що працює, а що - ні
- Аналоги портфоліо на Behance (Notion та власний сайт). Як структурувати кейс на інших платформах
- Чеклісти по створенню кейсів для тебе
Модуль 2. Підготовка та початок створення кейсу
- Підготовка до створення кейс стаді. Необхідні ресурси та матеріали. Конфіденційність
- Написання плану кейсу
- Створення вайрфрейму для побудови структури кейсу
- Створення текстів для кейс стаді. Як написати ефективні тексти для опису проєкту
- Що робити і як презентувати проєкт, якщо немає багато етапів чи досліджень
- Типографіка
Модуль 3. Візуальне оформлення кейсу
- Створення технічного мудборду та пошук референсів. На що звернути увагу у референсах
- Як підібрати кольори, шрифти та інші візуальні елементи
- Пошук стилю кейсу. Як варто оформлювати кейси у 2024-2025 році
- Типові помилки, яких слід уникати під час оформлення візуалу кейсу
Модуль 4. Дизайн секцій кейсу: оформлення UX частини проєкту
- "Hero section". Як створити привабливу першу секцію кейсу, щоб зацікавити з перших секунд
- Секція "Про проєкт: опис, задачі, виклики". Як правильно формулювати опис проєкту, визначати задачі та виклики
- Секція "ЦА (Цільова Аудиторія)" Аналіз і опис цільової аудиторії, для якої створювався проєкт
- Секція "Процес роботи дизайнера/методологія". Пояснення методології, яку ти використовував у роботі над проєктом. Як презентувати її ефективно
- Секції з результатами "БРЕЙНШТОРМІНГУ", "АНАЛІЗУ КОНКУРЕНТІВ", "ОПИТУВАЛЬНИКІВ", "ІНТЕРВ'Ю З ЮЗЕРАМИ"
- Секції "Personas", "CJM", "Sitemap" та "Userflow": оформлення та нюанси
- Як оформити і презентувати ВАЙРФРЕЙМИ проєкту для кейсу
- Секція "Юзабіліті тестування". Як правильно показати результати тестування макетів
Модуль 5. Дизайн секцій кейсу: оформлення UI частини проєкту
- Секція "Мудборд: стиль, кольори, шрифти"
- Секція "UI kit". Як створити візуально привабливу секцію з набором елементів інтерфейсу
- Секція "Візуал: результат". Презентація готового дизайну
- Секція "Адаптивний дизайн". Як показати адаптацію проєкту під різні пристрої у кейсі
- Секція "Висновки" Підсумки проєкту
- Завершальний екран кейсу. Як зробити завершення роботи естетичним і логічним
Модуль 6. Фінальні штрихи. Публікація кейсу та просування
- Фінальні корегування кейсу
- Відео, Анімація та Прототип у кейсі
- Дизайн прев'ю для кейсу. Декілька практичних прикладів
- Налаштування профілю: Behance для максимальної ефективності
- Публікація кейс стаді: Покрокова інструкція
- Просування проєкту: Як привернути увагу до свого кейс стаді на Behance
- Як правильно реагувати на фідбек та вдосконалювати свої кейси після отриманих відгуків
Бонуси
- ШАБЛОНИ крутих кейс стаді у FIGMA, які ми створили спеціально для курсу, і які ти можеш використовувати та комбінувати для своїх проєктів
- Чеклісти для твоїх найкращих кейсів
- Додаткові матеріали, статті та особисті поради лекторок
Особливості курсу
- 40 відео уроків в записі + додаткові матеріали
- Шаблони Figma + чеклісти
- Доступ протягом 24 годин після оплати
- Сертифікат про закінчення курсу
- Самостійне проходження
- 6 місяців доступу до матеріалів
Викладачі курсу
- Олександра Коваль - Lead Product Designer
- Катерина Калашнікова - Senior Product Designer at Intellias
- Web & Mobile Design / UI/UX
Цей курс створений для тих, хто хоче опанувати професію UX/UI та веб-дизайнера, пройти шлях від базових понять до створення повноцінного прототипу. Під час навчання ви навчитеся аналізувати користувачів, проєктувати інтерфейси, створювати прототипи, а також оволодієте основами візуального та веб-дизайну. Курс охоплює не тільки теоретичні знання, але й практичні навички роботи з інструментами, що дозволить вам упевнено реалізовувати власні проєкти.
Програма курсу
Основи UI/UX і веб-дизайну
Частина 1. Вступ до UI/UX та веб-дизайну
- Що таке UX, UI та вебдизайн?
- Відмінності між UX, UI та вебдизайном
- Чому потрібні UX/UI та вебдизайн?
Частина 2. Роль дизайнера у проєкті
- Основні завдання UX/UI та вебдизайнера
- Взаємодія з командою та клієнтами
- Огляд інструментів для роботи
Дослідження користувачів і аналіз
Частина 1. Збір даних та аналіз користувачів
- Методи дослідження користувачів (опитування, інтерв'ю)
- Сегментація цільової аудиторії
- Створення персони користувача
Частина 2. Аналіз даних та конкурентів
- Інтерпретація даних і визначення потреб користувачів
- Аналіз конкурентів у сфері UX/UI та вебдизайну
- Застосування результатів дослідження в проєкті
Інформаційна архітектура та контентна стратегія
Частина 1. Інформаційна архітектура та контентна стратегія
- Створення карти сайту
- Розробка користувацьких потоків
- Організація інформації на сторінці
Частина 2. Контентна стратегія та навігація
- Принципи ефективної контентної стратегії
- Навігація та логічна ієрархія
- Оптимізація користувацького досвіду
Ескізування, прототипування і макетування
Частина 1. Ескізи та прототипи
- Створення ескізів інтерфейсів
- Прототипування на рівні вайрфреймів
- Інструменти для ескізування та прототипування
Частина 2. Вебмакетування
- Розробка вебмакетів (Grid, Flexbox)
- Створення інтерактивних прототипів
- Підготовка макетів для розробки
Візуальний дизайн та веб-дизайн
Частина 1. Основи візуального дизайну
- Принципи композиції та дизайн-системи
- Підбір кольорової гами та шрифтів
- Робота з зображеннями та іконками
Частина 2. Веб-дизайн та адаптивність
- Адаптивний дизайн і його особливості
- Створення UI-компонентів для вебу
- Вебдизайн для різних пристроїв (десктоп, планшет, мобільний)
Тестування юзабіліті і оптимізація
Частина 1. Тестування юзабіліті
- Підготовка до тестування
- Методи та сценарії тестування
- Інструменти для тестування
Частина 2. Оптимізація дизайну
- Аналіз результатів тестування
- Внесення змін до дизайну
- Оптимізація швидкості та продуктивності сайту
Завершення проєкту і взаємодія з розробниками
Частина 1. Завершення дизайну і прототипу
- Підготовка дизайну для розробників
- Створення документації та специфікацій
- Спільна робота з розробниками: передача макетів
Частина 2. Презентація проєкту
- Підготовка ефективної презентації
- Презентація проєкту клієнтам або команді
- Як захистити свій проєкт перед аудиторією
Висновки та подальший розвиток
Частина 1. Підсумки курсу
- Огляд усіх етапів розробки проєкту
- Аналіз основних навичок, отриманих протягом курсу
- Підготовка до подальшого вдосконалення навичок
Частина 2. Розвиток кар'єри
- Поради щодо пошуку роботи або фриланс-проєктів
- Як скласти портфоліо UX/UI і вебдизайнера
- Планування подальшого розвитку: які навички розвивати далі
Особливості курсу
- Допомога ментора
- Практика
- Проєкт в портфоліо
- Сертифікат про проходження курсу
- Web & Mobile Design / UI/UX
Навчишся використовувати свій дизайнерський підхід у новій сфері. Скрупульозність у роботі з іконками, кнопками тут гідно оціниться. Зможеш подивитись розробку з позиції гравця. Навчишся створювати функціональні ігрові інтерфейси.
Програма курсу
Блок 1. Роль UI/UX дизайнера в геймдеві
Лекція 1. Знайомство - Тімбілдінг
- Відмінність UX/UI-дизайну додатків/сайтів та дизайну ігрових інтерфейсів
- Спеціальності та розгалуження в ігровому дизайні
- Навички, які необхідні для побудови кар'єри у цій галузі
- Розвиток UX/UI Designer у геймдеві - куди рости далі
- Компанії в геймдеві
- Інтерактив: Тімбілдінг - хто куди хоче розвиватися
Лекція 2. З ким працює UI/UX дизайнер
- З ким працює UX/UI-дизайнер і що таке UX та UI
- Що робить дизайнер під час розробки гри
- Пре-, продакшн та пост-: головні етапи розробки гри
Лекція 3. IPK ігор з погляду UX-патернів взаємодії з інтерфейсами
- Історія розвитку комп'ютерних ігор, UX патернів у іграх
- Умови та обмеження
- 1990-і, 2000-і, 2010-і і далі
- Навіщо це потрібно знати UX дизайнеру
Блок 2. Психологія в іграх (Когнітивна наука, usability, engaging)
Лекція 4. UX Research та User flow
- Основні складові та етапи Design Thinking: емпатія, визначення, ідея та прототипування, тестування та оцінка
- Порівнювати конкурентів, копіювати патерни, але не стиль
- Як правильно робити research на основі дизайну мислення
- Що таке користувач флоу
Лекція 5. Ігрові механіки. Когнітивістика та евристика
- Когнітивні знання в іграх: увага, сприйняття та пам'ять
- Евристики юзабіліті та їх застосування у відеоіграх
- Ігрові евристики: баланс, прогресія, керування грою та інші
- Що таке ігрові механіки, атомарні механіки, комплексні механіки
- Фідбек під час гри
- Методи дизайну ігрових механік
- Сприйняття механік через різні інструменти
Лекція 6. Психологія сприйняття інформації та мікроінтеракції
- Психофізичні особливості сприйняття інформації
- Види навантаження на мозок
- Ефект Кулешова, ефект "Естетики-юзабіліті", правило 3-х кліків
- Як впливати на сприйняття: композиція, колір, угруповання, контраст
- Різниця сприйняття інформації в HUD та Lobby
- Геометрична пам'ять, банерна сліпота
- Що таке мікроінтеракції
- Стан системи. Тригер-> Зворотній зв'язок -> Зміна стану системи
Воркшоп 1. Ігровий флоу
- Ігровий флоу. Декомпозиція патернів за допомогою копіювання флоу
- User-flow у форматі Grayboxes базових теймплейтів
- Створюємо флоу гравця на основі існуючої гри
Воркшоп 2. Підбір референсів
- Проведемо воркшоп, як знайти референси і згрупувати їх
- Де зберігати, і як правильно структурувати та оцінювати
Блок 3. UX в іграх
Лекція 7. GrayBox як спосіб швидкого нарису
- Схема Джессі Гаррета та її застосування для нашої індустрії
- Спіральна модель розробки ПЗ
- Чому важливо економити час та ітерувати швидко
- Що таке грейбокси, навіщо вони потрібні? Як вони допоможуть скоротити час ітерацій
- Шматки чужого інтерфейсу для швидкої ілюстрації
- Фреймворки у фігмі для створення вайрфреймів
- Приклад створення грейбоксу будь-якого простого інтерфейсу
Воркшоп 3. Створюємо прототип гри. Частина 1
- Проведемо воркшоп зі створення UX гри, яку обрала менторка
- Інтерактив: розбір ігор, і далі робимо свій wireframe
- Запитання та відповіді з дипломних завдань
Воркшоп 4. Створюємо прототип гри. Частина 2
- Проведемо воркшоп зі створення UX гри, яку обрала менторка
- Інтерактив: розбір ігор, і далі робимо свій wireframe
- Запитання та відповіді з дипломних завдань
Воркшоп 5. Фінал UX. Створюємо прототип гри. Частина 3
- Проведемо воркшоп зі створення UX гри, яку обрала менторка
- Перевірка стадії UX
Блок 4. UI в іграх
Лекція 8. Що таке сетинг гри та UI moodboard
- Поняття візуального сеттингу
- Які є складові візуального сеттингу: Колір, шрифт, UI, UX, 2D art, 3D
- Вплив нарративу на UI
- Розбір сеттингу різних ігор
Лекція 9. Композиція та типографіка, колір
- Що таке композиція
- Силові лінії та поля
- Домінантні відносини елементів
- Відносини "елемент-простір"
- Тимчасовий масштаб
- Міра активності засобів композиції
- Що таке типографіка та верстка
- Базові правила верстки текстових блоків
Лекція 10. Стилістики та стайлгайд
Розглянемо стилістики, які можуть бути в іграх і як їх обігрують.
Воркшоп 6. Підбір референсів для UI
Поговоримо про стайлгайд та як його робити.
Воркшоп 7. Створюємо UI трьох різних концепцій. Перший концепт
По вибраним стайлрефам створюємо концепції.
Воркшоп 8. Створюємо UI трьох різних концепцій. Другий та третій концепт
- За вибраним стайлгайдом створюємо концепції
- Визначаємося зі стилем
Воркшоп 9-10. Робимо UI екрани
По вибраним стайлрефам створюємо концепції.
Воркшоп 11. Фінал UI. Створення стайлгайду
- Поговоримо про стайлгайд та як його робити
- Перевірка стадії UI
Блок 5. Фінальний полішинг та аналіз проєктувального рішення
Лекція 11. Case study - основні поінти
- Як демонструвати всі етапи розробки дизайну
- PDF-файл, Figma або особистий сайт як портфоліо - що краще
Лекція 12. 7 цінних якостей UI/UX дизайнера
- Характер та особистість у психології
- Невід'ємні якості UX-ера
- Профіль дизайнера
- Пошук 7 якостей, без яких ніяк
- Перевірка робіт і фідбек від менторки
Воркшоп 12. Case study - на прикладі
- Менторка показує, як оформляти кейс на Behance
- Перевірка робіт і фідбек від менторки
Блок 6. Дипломний проєкт
Дороблюємо проєкт і презентуємо його.
Особливості курсу
- Лекції + воркшопи
- Фідбек про ДЗ
- Підтримка ментора
- Проєкт в портфоліо
- Сертифікат про проходження курсу
Викладачі курсу
Каріна Сокол - UI/UX designer at Meta
Подати заявку- Web & Mobile Design / UI/UX
Курс "Web design" для дітей та підлітків складається із вивчення принципів дизайну і взаємодії з користувачем, інструментів дизайну, та практичних проектів для навичок застосування цих знань у реальних задачах.
Програма курсу
Теми:
- Figma
- Векторна і растрова графіка
- Шрифти, композиція, колористика
- Модульні сітки
- Створення односторінкового сайту
- Типографіка
- UX design
- Аналіз конкурентів
- User Person
- CJM
- Компоненти та маски
- User flow
- Розбираємо всі аспекти UI
- Створення корпоративного сайту
- Анімація і презентація
- Illustrator, Photoshop
По закінченню курсу ви:
- Навчитесь створювати 3 види сайтів: Landing Page, E-Commerce, App ( для IOS та Android)
- Навчитесь розробляти лого та іконки у Figma
- Опануєте практичні інструменти роботи дизайнера
- Вивчите всі тонкощі правильного та логічного дизайну
- Створите портфоліо з трьох робіт
Особливості курсу
- Індивідуальний підхід
- Висококваліфіковані викладачі
- Сучасні технології навчання
- Мовне оточення для вивчення англійської
Викладачі курсу
Наталя Невмержицька - UX/UI дизайнер. Арт-директор в TheUpperCode 2 роки. 5+ років досвіду в сфері дизайну
Подати заявку- Web & Mobile Design / UI/UX
Впродовж курсу ви на практиці познайомитесь з процесом створення схематичних макетів різної деталізації та інтерактивних прототипів.
Програма курсу
Схематичні макети та інтерактивні прототипи
- Що таке схематичні макети
- Класифікація схематичних макетів
- Інформаційна архітектура
- Інструменти та ресурси
- Створення схематичних макетів
- Створення інтерактивних прототипів
- Підсумки та поради
Після проходження курсу ви зможете
- Розробляти схематичні макети
- Розробляти інтерактивні прототипи
- Швидко візуалізувати та тестувати різні ідеї
- Отримувати ранній зворотний зв'язок від зацікавлених сторін
- Покращити процес комунікації з колегами
- Створювати кращі продукти з погляду UX
Особливості курсу
- Повний доступ до цього курсу назавжди
- Рецензії домашніх робіт
- Доступ до всіх оновлень цього курсу
- Сертифікат про проходження курсу українською та англійською
- Служба підтримки
- Підтримка від спільноти студентів
- Додаткові матеріали
Викладачі курсу
Богдан Жук - UX/UI-дизайнер в агенції Goodface
Подати заявкуСторінки
Читайте нас в Telegram, щоб не пропустити анонси нових курсів.
Відгуки про курси
Довго не наважувався почати навчання в IT, але зрештою вирішив спробувати себе в UX/UI дизайні. Це були непрості пів року: багато нової інформації, практичних завдань і моментів, коли доводилося виходити із зони комфорту.
Загалом курсом я задоволений. Він дав мені хорошу базу, допоміг зрозуміти основні принципи UX/UI та показав, у якому напрямку рухатися далі. Окрема подяка лектору та ментору за зрозумілу подачу матеріалу, підтримку й готовність відповідати на всі запитання протягом навчання.

Навчання мені дуже сподобалося, бо я буквально з нуля дійшла до рівня побудови дизайнів сайтів та програм, і я вважаю, що знайшла свою справу
Єдиною для мене проблемою став час, його завжди було мені мало, коли йшлося про побудову вайрфреймів, наприклад. А ще, насправді, дуже велику роль грає викладач. Моя перша викладачка на курсах була дуже щирою, ставилася до всього з розумінням та максимально заряджала всіх мотивацією. А далі були інші викладачі, ті, що вже мають величезний досвід в роботі, але не ставляться до занять з такою великою трепетністю.
Разом з тим, я все одно дуже задоволена і з нетерпінням чекаю влаштування на роботу!
Щиро дякую❤️

Як мама, хочу подякувати команді за навчання та поділитися своїми враженнями
У першу чергу мене зацікавила сама програма навчання та компетентнісний підхід, на якому вона побудована. Уже в процесі виконання практичних завдань я була приємно вражена індивідуальним підходом до учасників: якісним і доброзичливим зворотним зв’язком від викладачів, а також можливістю доопрацьовувати та переробляти завдання для досягнення кращого результату.
Також для мене особливо цінним став момент, коли в певний період син дещо втратив мотивацію та «розслабився». Я дуже вдячна команді за те, що йому дали другий шанс і можливість продовжити навчання з іншою групою❤️ Це стало хорошим життєвим уроком відповідальності для нього...
Зі слів сина, йому дуже сподобалися зрозуміле пояснення матеріалу, цікаві заняття, доброзичливий зворотний зв’язок і велика кількість практики, яка не була нудною. Як невелике побажання врахувати, що іноді користуватися сайтом із телефону було не зовсім зручно.
Крім того, мені імпонує орієнтація вашої програми не лише на навчання, а й на подальшу підтримку випускників у питаннях працевлаштування.
Якби в школах усі предмети викладалися так само цікаво, практично та з таким рівнем підтримки, учні залишалися б в них ночувати

Якщо у Вас виникло відчуття, що курси відмінні, значить Вам нема з чим порівняти. Пишу цей відгук після проходження цього ж курсу в іншій школі і вже маючи досвід роботи в даній сфері.
Проходила курс з UX/UI дизайну влітку 2022. Вартість на той момент була 11 тис грн (300 $) за 3 місяці. Повна трата часу та грошей. Дуже слабке викладання, мало практики, дуже багато води, або все дуже швидко. Один урок можна було слухати розповідь про один з термінів, який використовують у роботі, все те ж, можна знайти в інтернеті абсолютно безкоштовно. На наступному занятті буде 100 термінів та 0 пояснень. Більше того, приготуйтеся, що після уроку у Вас буде ще більше питань, ніж до початку курсу. Тому що, на занятті о 2.5 годині викладач читатиме все з презентації (яку ви, вміючи читати, можете подужати самостійно). Практичні заняття все робилися самостійно, оскільки це було а-ля домашнє завдання. Ах так, ставлення до д.з. дуже недбале, все можна було здати на перевірку, практично, одним днем перед закінченням курсу))))) Більше того, на відгук від ментора/викладача щодо Ваших самостійно виконаних робіт (мається на увазі після заняття або до), можна не розраховувати, відповідь буде один і той же "приходьте на заняття там все подивимося".
Так як, все навчання проходить практично самостійно (а гроші були оплачені, мабуть тому що в той момент я їх вважала зайвими ....), спасибі, виробилася дисципліна і змінилося ставлення до непередбачених витрат.
Вже маючи роботу та досвід проходження співбесіди, ніхто ще не запитав, що означає цей термін чи той. Всіх цікавлять ваші знання на практиці, тому дуже старанно працюйте на портфоліо. А те, як Ви це називаєте, здебільшого потрібно лише Вам.
Підсумок: школу не рекомендую, є багато інших з відмінними викладачами та класною, а головне цікавою, системою навчання.... хіба що ви займаєтеся благодійністю і Вам нема куди подіти кошти.








