[HTML Academy] SVG-анимации

​

На курсе вы научитесь работать с векторной графикой и применять JavaScript-библиотеки для её анимирования.

Улучшайте UI/UX вашего проекта с помощью анимаций, которые произведут впечатление на пользователя.

Необходимые знания: базовый JavaScript.

Гибкие сроки: начинайте прямо сейчас и двигайтесь в комфортном режиме.

Курс поможет вам получить востребованный навык и повысить свою ценность на рынке

Задача курса — раскрыть весь потенциал векторной графики и её гибкость. От простой CSS-анимации с transform до анимирования контуров, кривых, масок, графиков и обводки.
SVG-анимации на карте компетенций
фронтенд-разработчика

Согласно нашей карте компетенций, уверенная работа с SVG-анимациями — важный навык для разработчиков с опытом от 1-го до 3-х лет.

Типовые задачи, которые вы научитесь решать на курсе:

Подготовка SVG к подключению в страницу
Анимация частей SVG-иконки
Оптимизация анимации векторной графики
Создание бургер-меню
Создание прелоадеров
Морфинг форм
Анимация с применением SVG-масок
Создание анимированных диаграмм
Применение библиотек для создания анимаций

Спойлер: Программа курса

Раздел 1

Введение

Раздел 2

Анимирование SVG с помощью CSS

Раздел 3

Анимирование SVG с помощью SMIL

Раздел 4

Анимирование SVG с помощью JS

Раздел 5

Подготовка SVG к анимированию. Производительность анимации

Раздел 6

Дополнительные возможности SVG

Раздел 7

Заключение