spinner-it

UI Design

Старт навчання
Старт курсу запитуйте в адміністрації
48 год. по 2-3 рази на тиждень

Опис курсу

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

 

В процесі навчання ти дізнаєшся про секрети візуального дизайну, що “продає”, почнеш розуміти психофізіологію графічних інтерфейсів, вивчиш основні форми та елементи інтерфейсу, а також відкриєш для себе кращі тренди веб-дизайну.

Після курсу Ви зможете:

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

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

1. Вступ до курсу UI

  • Етапи розробки продукту
  • Поняття UX/UI/GUI

2. Технічні вимоги

  • Налаштування графічних редакторів для створення макетів для Web
  • Підготовка макетів для верстки
  • Підготовка графічних елементів

3. Дизайн мислення

  • Створення настрою проекту (Moodboard)
  • Скетчбук
  • Натхнення
  • Генерація креативних ідей

4. Композиція

  • Золотий перетин
  • Контраст і нюанс
  • Статика і динаміка
  • Акцент
  • Домінанта
  • Ієрархія об'єктів

5. Колір

  • Робота з колірним колом
  • Монохромні, компліментарні та близькі кольори
  • Підбираємо правильні кольори для сайту
  • Інструменти для підбору кольору

6. Шрифт

  • Web-типографіка
  • Візуальні елементи публікації
  • Підбір шрифтів та шрифтові пари
  • Інструменти підбору Web-шрифтів

7. Елементи інтерфейсу та їх стан

  • Елементи форми
  • Елементи навігації
  • Інформаційні елементи
  • Прелоадери
  • Та ін.

8. Іконки

  • Стилі іконок
  • Стилеутворюючі елементи
  • Формати та стандартні розміри іконок
  • Анімація іконок
  • Фавіконки та сервіси для створення фавіконок
  • Сервіси для підбору іконок

9. Фотографії та ілюстрації

  • Формати зображень для сайту
  • Розміри фотографій
  • Зберігання та оптимізація зображень

10. Закони та принципи побудови інтерфейсів

  • Візуальна ієрархія сайту
  • Закон близькості в гештальт-психології
  • Розстановка пріорітетів та акцентів на сторінках
  • F- и Z- патерни

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

  • 8pt сітка
  • Горизонтальний ритм
  • Вертикальний ритм
  • Модульная сітка Bootstrap
  • Нестандартні модульні сітки

12. Responsive and Adaptive design

  • Mobile first/Desktop first підходи
  • Мобільні версії сайту vs Адаптивний дизайн
  • Підготовка макету для adaptive/responsive сайтів
  • Правила підготовки макетів та зображень для Retina дисплеїв

13. Анімація інтерфейсу

  • Анімація інтерфейсу
  • Анімація ілюстрацій та іконок
  • Популярні інструменти та сервіси

14. Види та підходи до прототипування

  • Скетчінг
  • Варфреймінг
  • Інтерактивне прототипування

15. Тестування

  • Тестування дизайну в процесі створення продукту
  • Поліпшення дизайну на основі отриманих даних

16. Історія та тренди в вебдизайні

  • Скевоморфізм
  • Плоский дизайн (Flat)
  • Material design (Google)
  • Fluent Design (Microsoft)
  • IBM Design Language

17. Презентація робіт

  • Правила оформлення портфоліо
  • Завантаження робіт на Behance
  • Захист курсової роботи перед групою

Мінімальні вимоги:

  • Впевнене володіння ПК.
  • Наявність власного ноутбуку для занять в аудиторіях

* Примітка: зазначені знижки не сумуються з іншими діючими акціями та спеціальними пропозиціями. Знижка застосовується тільки до нових заявок та при умові повної оплати курсу. Якщо у Вас виникли питання, звертайтеся за консультацією до наших менеджерів!