Мастер анимаций: SVG-анимации

Name: Мастер анимаций: SVG-анимации
Price: 998 RUB
Availability: InStock

О чём курс

Превратите статичные векторные иконки и графику в интерактивные элементы интерфейса, которые повышают вовлеченность пользователей. Курс фокусируется на практических методах оживления SVG-изображений через три основных подхода: использование CSS, языка SMIL и JavaScript-библиотек. Вы научитесь работать с синтаксисом SVG, создавать сложные спиннеры, реализовывать эффект обводки при наведении и настраивать морфинг фигур. Материал предназначен для фронтенд-разработчиков, желающих улучшить UI/UX своих проектов с помощью современной веб-анимации.

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

Раздел 1: Введение
- История и особенности векторной графики в вебе
- Интеграция SVG на страницу
- Синтаксис, атрибуты и стандарты
- Тренажеры и демо: настройка viewBox, заливка, обводка
Раздел 2: Анимирование SVG с помощью CSS
- Применение transition и @keyframes
- Использование stroke-dasharray и stroke-dashoffset
- Создание лоадеров и анимированных иконок
Раздел 3: Анимирование SVG с помощью SMIL
- Синтаксис и возможности языка SMIL
- Анимация простых фигур и морфинг
- Особенности запуска для инлайн-SVG
Раздел 4: Анимирование SVG с помощью JS
- Интерполяция атрибутов
- Использование requestAnimationFrame
- Основы работы с библиотеками (разбор продолжается)

Складчина создана 26 января 2023 г. · описание обновлено 26 марта 2026 г.

Другие материалы школы 12

HA HTML Academy Все материалы

Анимация для фронтендеров 4 755 ₽ 19 900 ₽ −76%

Адаптивные и резиновые сетки на гридах 125 ₽ 2 090 ₽ −94%

Доступность веб-интерфейсов 1 000 ₽ 14 000 ₽ −93%

Проект на JavaScript «Конструктор планировки квартиры» 80 ₽ 1 990 ₽ −96%

Навык «Работа с интерактивными элементами в JavaScript» 247 ₽ 2 690 ₽ −91%

Навык «Оптимизация и перфоманс в JavaScript» 84 ₽ 1 090 ₽ −92%

Создание семантической разметки по макету 544 ₽ 1 040 ₽ −48%

CSS-in-JS 262 ₽ 4 830 ₽ −95%

Профессия «Фронтенд-разработчик» 2021 9 881 ₽ 101 150 ₽ −90%

Продвинутый JavaScript 172 ₽ 18 000 ₽ −99%Г Годовая подписка на HTML Academy 304 ₽ 2 700 ₽ −89%

Пакет онлайн-курсов «Мастхэв для фронтендера» 3 071 ₽ 20 580 ₽ −85%

Отзывов пока нет. Будьте первым!

Почему полный курс стоит всего 998 ₽?

Влада Администратор сайта

Это не розничная цена — это ваш взнос в складчину. Мы собираем группу участников и делим между ними стоимость официального доступа: каждый платит только свою долю, а получает весь материал. Чем больше участников, тем меньше взнос. После того как сумма собрана, мы оформляем официальный доступ и раздаём материалы всем, кто участвовал.

Как получить курс?

Влада Администратор сайта

Нажмите кнопку «Получить доступ» на этой странице и следуйте инструкциям. Вас переведёт на форму оплаты — доступны все современные способы (карта, СБП, электронные кошельки). После оплаты на почту придёт письмо с доступом: материалы выдаются в разделе «Мои складчины» на нашем основном сайте skladchik.org. Учтите: в России skladchik.org открывается только через ускоритель интернета (VPN) — настроить его можно за пару минут по инструкции на skladchik-kak-voiti.online.

Можно ли скачать курс после покупки?

Влада Администратор сайта

Да, конечно. Все материалы — видео, PDF, дополнительные файлы — можно скачать к себе на компьютер и пользоваться ими сколько угодно, без ограничений по времени. Ссылки остаются активными в вашей библиотеке «Мои складчины».