Интерактивная веб-анимация

17 участников

О чём курс

Вам нужно оживить пользовательский интерфейс или создать незабываемый UX-дизайн — здесь вы освоите полный стек технологий для создания интерактивных веб-анимаций. Курс переводит от простых CSS-переходов к сложной программной анимации с использованием SVG и JavaScript.

Внутри разбираются три ключевых пласта работы: создание динамики через ключевые кадры CSS, манипуляция SVG-графикой через атрибуты времени и событий, а также глубокое управление анимацией с помощью JS API и функций конструкторов. Вы получите 20 готовых анимационных проектов, которые можно адаптировать под свои задачи.

Курс подходит веб-разработчикам и UI/UX-дизайнерам, желающим внедрить интерактивные элементы в проекты. Финальный результат — навыки создания анимации любой сложности, от базовых переходов до интерактивных SVG-объектов с 3D-позиционированием.

Программа обучения

    1. История веб-анимации
    1. CSS-анимация
    • Свойства анимации CSS
    • Правило ключевого кадра CSS
    • Переходы CSS
    1. SVG-анимация
    • Элементы анимации SVG
    • Атрибут для идентификации целевого элемента для анимации
    • Атрибуты для управления временем анимации
    • Атрибуты, определяющие значения анимации с течением времени
    • Атрибуты, управляющие добавлением анимации
    • Элементы, атрибуты и свойства SVG, которые можно анимировать
    • Событие времени интерфейса
    • Интерактивные функции в SVG
    1. Анимация JavaScript
    • Метод getElementById ()
    • Метод планирования звонков setinterval ()
    • Метод addEventListener ()
    • Методы getAttribute и setAttribute
    • Работа со сложными SVG-атрибутами через регулярные выражения
    • 3d positioning
    • Функции конструкторов
    • Создание примитивов SVG
    • Создание массивов объектов, управление их свойствами
    • Работа с масками и пути клипа
    • API веб-анимации
    • Сочетание анимационных приемов
Складчина создана 7 октября 2020 г. · описание обновлено 23 марта 2026 г.
258 ₽ 1 490 ₽