Описание задачи

Необходимо создать самовоспроизводящуюся, поточной зацикленную 3D-анимация для верхней секции (hero) лендинга SaaS-продукта. Анимация должна быть премиум-класса, визуально напоминать статичные, высококонтрастные рендеры с deep black, и при этом быть плавной presentational loop.

Ключевые элементы анимации

• 3D-инфографика процесса: абстрактное, но узнаваемое отображение логики работы облачного или серверного продукта (поток входных данных - обработка - визуализация на UI).
• Постоянный поток «лучей данных»: движущиеся светящиеся частицы или линии (волны), проходящие по виртуальным «проводам/шинам» -- бесконечная, непрерывная передача данных.
• Центральный 3D-блок с лоадером: в фокусе должен быть полупрозрачный трёхмерный контейнер с текстом loading, над которым ползёт контурный прогресс-бар (заполнение по кругу или по ползунку).
• Заполняющиеся блоки и частицы: второстепенные элементы (плитки памяти, сферы данных) должны наполняться цветом/светом или подпрыгивать, иллюстрируя активность.
• Вертикальный «данные/лифт»: несколько потоков или один крупный столб данных, композиционно «всплывающий» с нижнего уровня в верхнюю плоскую зону ( переход от загрузки к результату).
• Верхний уровень (анимированные гистограммы): на полупрозрачной платформе (сегмент «обработанных данных») как минимум 3-5 столбцов или искрящихся колонн, меняющихся по высоте. Смена мрачных оттенков - красный -> неоновый зелёный, символизируя успешную готовность.
• Редкие мощные импульсы «от пользователя»: Им должен быть отведён отдельный сегмент (левый/нижний угол), от которого клешнями тяжелых волн расходятся ярко-белые или ультрамариные всплески (1 импульс за 3-5 секунд цикла), имитирующие активацию.

Стилистические требования

• Фирменный стиль: Неоновые акценты (electric blue индиго/грязный зеленый для заполнения, точовая белая плата), глубокие черные-серые пространства (космический чистый Dark UI). Максимальный контраст.
• Уровень проработки: Качество, сопоставимое с техно-дизайном высокого ценового сегмента: премиальные острые края, A-реалистичные отражения бликов, радиусные грани элементов (НЕ пиксельные/мыльный)
• Технические параметры видео: рабочее разрешение около 4К, очень малая глубина размытия по motion при движении объектов.

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

• Формат поставки: web-ready файл (mp4 + webm дуэт, медия-element-play), поддержка < code>autoplay< /code> + seamless-loop (без button старт).
• Оптимизация: объём составляющей в first-priority лендинга. надо найти баланс который уложиться ниже 5-6mb при 1120х 720-ish. в поле героя.

Преимущество

Следовать примерно антуражу популярного примера презентации live preview продукта - наполненная UI элементами трехмерная сцена на темном фоне с выдающимися световыми высокотехнологичными эффектами ПП