spinner-it

UI Design

Старт обучения
12.05.2021
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. История и тренды в Web-дизайне

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

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

  • Правила оформления портфолио
  • Загрузка работ на Behance
  • Защита курсовой работы перед группой

Минимальные требования:

  • Уверенное владение ПК
  • Наличие собственного ноутбука для занятий в аудиториях

 

Для освоения программы вам понадобится онлайн-сервис Figma. Он позволяет создавать интерфейсы и рисовать прототипы с возможностью совместной работы в режиме реального времени.

 

Лекторы:

1. Анна Бронфайн (Дизайнер интерфейсов. Фрилансер)

 

2. Мария Троцкая (UI/UX Designer)

 

* Примечание: указанные скидки не суммируются с другими действующими акциями и специальными предложениями. Скидка применяется только к новым заявкам и при условии полной оплаты. Если у Вас возникли вопросы, обращайтесь за консультацией к нашим менеджерам!