Курсы IT: Программирование Frontend Анимация для фронтендеров

Анимация для фронтендеров «HTML Academy»

HTML Academy онлайн

Форма обучения: Online, Вебинар

Категория: «Frontend»

Отзывы: 1 / 0 / 0

Оставьте отзыв

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

Требуемый стартовый уровень владения предметом: Средний , пройти курс «JavaScript. Профессиональная разработка веб-интерфейсов» или эквивалентная подготовка

О курсе Отзывы

Cвободная дата (начало по мере набора)

Учебных часов: 120

Стоимость/час: 23900 руб (199 руб/час)

Индивидуальный

Необходимые стартовые навыки

Подразумевается, что вы уже имеете навыки программирования на JavaScript.

Возможные профессии после курса

Web-программист

Frontend-разработчик

Дизайнер компьютерных программ

Анонс

Раздел 1. Основы анимации. Рассмотрим историю появления анимации. Как создать иллюзию движения, основные отличия классической и компьютерной анимации. Какие есть абстракции для построения компьютерной анимации. Чем отличается линейная анимация от покадровой.
Раздел 2. Анимация в CSS. Рассмотрим инструменты для отладки и улучшения производительности анимации в браузере. Узнаем, как перенести часть отрисовки CSS на видеоускоритель. Познакомимся с принципами Material design. Подробно рассмотрим принципы выразительной анимации: расчёт времени, фазованное движение, доводка и захлёст движения.
Раздел 3. SVG Анимация. Изучим спецификацию SMIL, которая описывает анимацию внутри спецификации SVG: рассмотрим, в каких случаях лучше использовать SMIL, а в каких от неё стоит отказаться. Научимся описывать анимацию движения объекта по кривой, запускать анимацию по событиям.
Раздел 4. Покадровая анимация. JavaScript и Canvas. Изучим, что такое FPS и стандартные значения FPS. Рассмотрим примеры покадровой анимации. Компьютерная мультипликация, моушн-дизайн. Игры с отслеживанием действий игрока в реальном времени. Продолжим углубленно изучать принципы выразительной анимации: сценичность, привлекательность, профессиональный рисунок — внимание разработчика к деталям, качество финальной картинки.
Раздел 5. WebGL. Шейдеры. В этой главе мы продолжим работать с покадровой анимацией. Изучим, что такое WebGL и OpenGL. Рассмотрим отличие работы в контексте 2d и webgl. Исследуем, какие бывают растровые эффекты.
Раздел 6. Three.js. Часть 1. 3D в браузере. Поговорим о системах координат, точках и векторах. Изучим матрицы трансформаций 3D, кватернионы и углы Эйлера, перемножение матриц. Рассмотрим варианты создания моделей с интерфейсом управления пользователем.
Раздел 7. Three.js. Часть 2. Работа с камерой. Рассмотрим, что такое камера в WebGL. Увидим, какие бывают виды камер в Three.JS. Изучим подходы к анимации камеры. Разберёмся с реакцией на действия пользователя — плавное изменение ракурса. Управление с помощью рига: цикл рендера рига камеры. Создание анимации пролёта.
Раздел 8. Будущее анимации в браузере. Рассмотрим API, которые ещё не готовы для использования в продакшен, но их уже сейчас стоит начать изучать, чтобы в будущем повысить эффективность своей работы. Увидим, чем отличается Web Animation API от обычной CSS анимации. Изучим основы Houdini API. Поговорим о библиотеках, которые помогут упростить работу с анимациями. Рассмотрим, какие инструменты можно использовать для построения кроссплатформенного ПО с 3D. Поговорим о том, как можно дальше развиваться в создании анимации.