Иллюстрация: для сайта. Количество: 1 шт. Разовая задача или временный проект. Техническое задание (ТЗ) Название проекта: Интерактивная 3D-схема “Технология в разрезе“ для сайта mosobltrotuar.ru 1. ?? Цель блока: • Наглядно показать весь спектр услуг компании (благоустройство “под ключ“) в одном интерактивном блоке. • Доказать экспертность, продемонстрировав “скрытые“ (подземные) работы: дренаж, ливневка, “пирог“ основания. • Увеличить конверсию, сократив путь пользователя от главной страницы до целевой услуги. 2. ?? Концепция: Создается статичная 3D-иллюстрация в изометрии (или с 3D-эффектом), изображающая участок загородного дома. Ключевая особенность — использование “разрезов“ земли и мощения, чтобы показать внутреннее устройство (технологию). 3. ?? Визуальный стиль: • Стиль: Современный, чистый, технологичный, презентационный (не “мультяшный“). • Цвета: Соответствие фирменному стилю сайта mosobltrotuar.ru (акценты на синий и оранжевый, основные цвета — серые, бежевые, зеленые). • Композиция: Дом, окруженный всеми элементами благоустройства. Часть участка (например, левый нижний угол) показана “в разрезе“. 4. ?? Обязательные элементы на схеме (интерактивные зоны): 1. Дом: Небольшой современный дом (как фон, не кликабельный). 2. Мощение: Дорожки и парковка из брусчатки. 3. Отмостка: Зона мощения/бетона, примыкающая к дому. 4. Газон: Зеленая зона. 5. “Пирог“ основания (в разрезе): Под частью мощения должны быть видны слои (геотекстиль, щебень, песок). 6. Дренаж (в разрезе): Под газоном должна быть видна дренажная труба. 7. Ливневка (в разрезе): Дождеприемник у отмостки и отводящая труба. 5. ??? Интерактивная механика (Поведение): № Зона / Элемент на схеме Действие при НАВЕДЕНИИ (Hover) Действие при КЛИКЕ (Click) 1 Мощение (брусчатка) Плавная подсветка всей зоны мощения + всплывающая подсказка: “Укладка тротуарной плитки“ Переход на страницу: /ukladka-bruschatki/ 2 Отмостка (вокруг дома) Подсветка зоны + подсказка: “Защитная отмостка“ Переход на страницу: /otmostka/ 3 Газон (зеленая трава) Подсветка зоны + подсказка: “Устройство рулонного газона“ Переход на страницу: /gazon/ 4 Ливневка (дождеприемник + труба в разрезе) Подсветка элементов + подсказка: “Ливневая канализация“ Переход на страницу: /livnevaya-kanalizaciya/ 5 Дренаж (труба под газоном в разрезе) Подсветка трубы + подсказка: “Дренаж участка“ Переход на страницу: /drenazhnye-raboty/ 6 Основание (слои “пирога“ в разрезе) Подсветка слоев + подсказка: “Надежное основание (Технология)“ Переход на /ukladka-bruschatki/ (на блок, где описывается важность основания) 6. ?? Адаптация (Мобильные устройства): Поскольку на мобильных нет “наведения“ (hover): • Блок должен корректно масштабироваться. • Поведение при касании (Tap): o Первое касание: Показывает всплывающую подсказку (аналог hover). Зона остается подсвеченной. o Второе касание (по той же зоне): Осуществляет переход по ссылке (аналог click). o Касание в другом месте: Снимает подсветку с предыдущей зоны. 7. ?? Требования к результату: • От Дизайнера: o Итоговая 3D-иллюстрация в высоком разрешении (для web, оптимизированная). o Все интерактивные зоны (слои подсветки) как отдельные PNG/SVG файлы с прозрачным фоном, идеально совпадающие с основной иллюстрацией. o Исходный файл (если потребуется для правок). • От Разработчика: o Готовый HTML/CSS/JS код блока. o Реализация всей интерактивной механики (hover/click/tap) согласно ТЗ. o Код должен быть “чистым“, быстрым и кросс-браузерным.