Моушен-графика вживую
Три примера, собранные для этой работы. Кнопки внутри примеров работают.
Знаки на вертикальном экране
Шесть знаков подряд на экране 768×1280. У каждого свой выход, выдержка и подпись, фон движется под ними.
- Формат
- MP4 H.264, 768×1280
- Частота
- 60 к/с
- Длительность
- 21,6 с
- Вес
- 3,0 МБ
Персонаж в Lottie
Хрум в пяти состояниях. Каждое состояние это отдельный цикл Lottie, фон считает страница.
- Формат
- Lottie JSON
- Цикл бега
- 36 кадров, 30 к/с, 640×440
- Вес цикла
- 28 КБ в gzip
- Плеер
- lottie-web, canvas
Анимация одним файлом
Яйцо в гнезде: успех, неудача и возврат к началу. Скрипт рисует на canvas и не требует библиотек.
- Файл
- hatch.js
- Вес
- 7 КБ в gzip
- Подключение
- один script и один вызов
- Движение
- считается от времени, а не от кадров
Шоурил с музыкой
Товарные 3D-ролики, промо приложений, живые интерфейсы, игры, заставки брендов и вертикальные ролики в ритме одного трека: склейки идут по долям, переходы собраны движением. Интерфейсы записаны кадр за кадром с работающих страниц.
- Формат
- MP4 H.264, 1920×1080, 60 к/с
- Длительность
- 53,7 с
- Вес
- 27,3 МБ
- Звук
- Sunfade, Roa Music, CC BY 3.0
Промо товара
Колонка SONO: кинетическая типографика, размеры линиями, цифры считаются на глазах, цвет меняется вместе с фоном.
- Формат
- MP4 H.264, 1920×1080, 60 к/с
- Длительность
- 20,9 с
- Вес
- 15,5 МБ
- Звук
- Between Oceans and Summits, Alex-Productions, CC BY 3.0
Вертикальный ролик
Другой характер движения: упругие буквы, прыжки и конфетти. Персонаж Хрум, циклы Lottie.
- Формат
- MP4 H.264, 1080×1920, 60 к/с
- Длительность
- 26,7 с
- Вес
- 9,0 МБ
- Звук
- Little Adventures, Sokolovsky Music, CC BY 4.0