UI-анимация

Александр Груздев
15 мар — 29 апр
25 000
17 500
до 31 января

UI-анимация — важный коммуникационный и информационный слой в дизайне. Она помогает оживить макеты, улучшить пользовательские сценарии, создать обратную связь от интерфейса и проработать эмоциональный аспект взаимодействия с пользователем. Цель в рамках курса — научиться мыслить через призму анимации, понять ее фундаментальные принципы, начать создавать качественную анимацию и макроанимацию.

  • 9занятий
  • 3часа в неделю
  • 5недель

Кому подойдет курс:

  • цифровым дизайнерам с небольшим опытом, которые самостоятельно разрабатывают макеты, и хотят улучшить анимацию и взаимодействие.
  • всем, кто хочет научиться создавать хорошую анимацию и повысить эффективность работы в программах для создания анимации.
  • тем, кто хочет с помощью анимации эффектно презентовать дизайн-концепции.
  • дизайнерам анимации, которые хотят наладить диалог с разработчиками.

Чему вы научитесь:

  • формировать анимационный процесс: подготовка макета, составление сценария, анимация блоков, запись видео.
  • использовать инструменты создания анимации: тонкости Principle, возможности Origami, Figma (именно анимация)
  • разбираться в фундаментальных принципах UI-анимации.
  • создавать презентации для клиентов и шоты для портфолио.
  • корректно передавать параметры анимации в разработку.

Программа:

Урок 1.

  • смысл UI-анимации, связь с UX/UI-дизайном.
  • что является результатом, для кого он, разбор примеров.
  • поэтапный подход к разработке UI-анимации.
  • отличие продукта от промо-проекта в плоскости анимации.
  • где посмотреть готовые решения.
  • сравнение инструментария.
  • сценарии пользователя в анимации.
  • google material design.
  • функции UI-анимации.

Урок 2.

  • возможности Principle.
  • о 12 принципах анимации.
  • разбор 1−5 принципов: easing, offset, transform, parallax, fade.
  • что можно передать в разработку.

Урок 3

  • инструменты Principle: drivers, components, hover, page scrolling.
  • детальная работа с Parallax.

Урок 4.

  • разбор 6−10 принципов: parenting, masking, overlay, clone, zoom.
  • инструмент Principle drag.
  • детальный разбор маскирования.

Урок 5. Вебинар с разбором работ.

Урок 6. Завершение работы с Principle: разработка большого проекта на основе продуманного сценария. Пример создания проекта.

Урок 7.

  • возможности Origami, система нодов.
  • практика с инструментами: страницы, параллакс, интерактивный текст, работа с изображением, loop, particles.
  • 11−12 принципы анимации: размерность, привязка значений.
  • разбор большого проекта в Origami.

Урок 8.

  • анимационные возможности Figma.
  • в каких случаях нужен After Effects.
  • составление Keynote-презентации.
  • ключевые темы презентации.

Урок 9. Заключительный вебинар с разбором работ.

Необходимые материалы и инструменты:

  • macintosh.
  • платные/пробные Sketch, Principle.
  • бесплатный Origami, Figma.

Как проходит обучение

Обучение проходит в учебной группе в Facebook и включает в себя домашние задания и обратную связь от преподавателя. Курс предполагает свободный, но организованный график. Нужно смотреть лекции, задавать вопросы в Facebook — для студентов и преподавателя будет организована закрытая группа, выполнять домашние задания — их будет проверять преподаватель, комментировать и давать советы по улучшению работы. После прохождения курса вам выдается сертификат.

Что в итоге:

Практическое понимание, что UI-анимация — это необходимая часть диджитал-дизайна, плюс возможность ее качественной реализации и демонстрации.

Кто будет препода­вать

Александр Груздев — дизайнер, имеет более десяти лет опыта в рекламных агентствах и дизайн-студиях. Был digital-арт-директором в студии ONY. Главный интерес — продуктовые решения со смелой творческой реализацией. Клиенты: «Сбербанк», «Яндекс», IKEA, PepsiCo, Kia Мotors, Министерство культуры РФ, «Газпром Медиа», Philip Morris, Unilever и другие.

Примеры работ преподавателя

Мнения выпускников

Мария Бережная

Мне понравился курс. Удалось преодолеть страх перед анимацией и начать внедрять ее в свои проекты. Александр — отличный преподаватель. Он давал подробную обратную связь по домашним заданиям, его комментарии очень помогали в обучении. Больше всего внимания в программе было уделено Principle. Думаю, это правильно. Я разобралась с его возможностями и поняла, что все не так сложно. Также было интересно познакомиться и с другими инструментами создания анимации.

В Bang Bang Education учатся студенты из компаний

и многих других