Техническое задание
Веб-сайт с 3D-моделью накопителя энергии
1. Цель проекта
Создать презентационный веб-сайт для демонстрации накопителя энергии.
Основная задача — произвести эффект современного технологичного решения через сочетание интерактивной 3D-модели, краткого описания проекта и красивой вступительной заставки.
Заставка должна создавать ощущение премиального, инновационного продукта и плавно переходить в основную сцену с 3D-визуализацией.
2. Основной функционал
🔹 Вступительная заставка
Отображается при открытии сайта, до загрузки 3D-сцены.
Может содержать:
логотип компании или проекта;
короткий слоган (например: “Energy Storage for the Future”);
простую, но эффектную анимацию: появление линий, сияние, движение частиц, плавное раскрытие или движение камеры;
плавный переход к основной сцене (fade-in или zoom-эффект).
⏱ Длительность: 3–5 секунд (или до окончания загрузки модели).
После завершения заставки автоматически открывается главная страница с 3D-моделью.
🔹 3D-модель
Воссоздаётся по предоставленному видео.
Используются реалистичные материалы: металл, пластик, окраска, вентиляционные решётки и элементы корпуса.
Возможности пользователя:
вращать, приближать и отдалять модель;
сбрасывать камеру в исходное положение;
получать подсветку или всплывающую подсказку при наведении на ключевые узлы (модули, шкафы, контроллеры).
✨ Дополнительно:
по возможности добавить лёгкие анимации — вращение вентиляторов, подсветку, индикацию потоков энергии и т.п.
3. Структура страницы
Одностраничный интерфейс (Desktop only).
| Область | Содержание |
|---|
| Верхняя часть | Логотип компании, название проекта / установки |
| Центральная область | 3D-модель (примерно 70% ширины экрана) |
| Правая панель | - Название установки- Краткое описание (3–5 предложений)- Ключевые характеристики (мощность, ёмкость, напряжение и т.д.) |
| Фон | Однотонный, градиентный или с лёгкой фоновый анимацией (например, движущиеся частицы, мягкие световые эффекты) |
4. Результат
Готовая веб-страница, включающая:
🎬 красивую анимированную вступительную заставку;
🧩 интерактивную 3D-модель накопителя энергии;
📋 описание и основные характеристики установки.
В комплект входят:
исходные файлы проекта (модель, текстуры, сайт, исходники кода);
инструкция по запуску (локально и на сервере).
5. Критерии приёмки
✅ Заставка выглядит профессионально и плавно переходит к основной сцене.
✅ 3D-модель визуально соответствует предоставленному видео.
✅ Навигация по модели работает корректно, без лагов.
✅ Время загрузки страницы — до 5 секунд.
✅ Сайт корректно открывается во всех целевых браузерах (Chrome, Edge, Firefox, Safari).
🎥 Референс для стиля и атмосферы:
YouTube — пример реализации
