Техническое задание: Анимация логотипа для футера сайта

Цель проекта

Создать эффектную и техничную анимацию появления логотипа в нижней части сайта (футере). Анимация должна визуально напоминать процесс архитектурного или инженерного построения элементов, а не простое появление.

Визуальная концепция и референс

Необходимо реализовать эффект «сборки» или «построения» логотипа на своем месте. Буквы должны формироваться, а не плавно проявляться или выезжать из-за кадра.

Референс по стилю и механике: анимация в футере сайта kvarta.io.
Исходный материал: предоставлен векторный файл логотипа в формате SVG.

Технические требования

Визуальные параметры

Цвет логотипа: белый (#FFFFFF).
Фон: прозрачный.
Частота кадров (FPS): 60.
Длительность: 1.5 - 2.5 секунды (приоритет на качество восприятия).
Цикличность: одноразовое воспроизведение (Play Once) при попадании элемента в зону видимости (Viewport).

Требования к формату и сдаче

Исполнитель может выбрать наиболее удобный для него формат.

Вариант 1: Lottie (Adobe After Effects)

Анимация должна быть создана строго с использованием Shape Layers.
Запрещено использовать растровые изображения, эффекты, не поддерживаемые библиотекой Lottie, и, желательно, прекомпозы (Pre-compose).
Структура проекта в After Effects должна быть чистой и готовой к корректному экспорту.
Что сдать: файл в формате JSON (готовый для веба) + исходный файл проекта (.aep).

Вариант 2: Rive

Анимация должна быть настроена с использованием State Machine на одноразовый вход (Entry) без зацикливания (Loop).
Что сдать: файл .riv + ссылка на облачный проект в Rive Cloud.

Общее требование

Итоговый файл должен быть оптимизирован для использования на веб-сайтах.

код