Технический запрос
Краткое объяснение:
Необходима целевая страница для агента по недвижимости. Центральной особенностью сайта является 3D голограмма, созданная с помощью фотограмметрии, связанная с интерфейсом ИИ (ChatGPT с пользовательской панелью) и интегрированная с CRM Zoho One.
Необходимая информация:
Сроки и необходимые средства не должны отклоняться более чем на 7% от предложенной оценки. Упор следует делать на качество, а не на скорость выполнения.
Технические спецификации:
1. Минималистичный, элегантный дизайн
• Чистая цветовая палитра (1 акцентный цвет + монохром) с контрастом WCAG AA.
• 12-колоночная CSS Grid с интервалами 4/8/16 пикселей.
• Типография: Inter для текста и Playfair Display для заголовков.
• Стратегическое использование пустого пространства, подчеркивающее 3D аватар.
• Микро-анимации с использованием CSS transform/GSAP (<150 КБ критического JS).
• Оптимизация загрузки: критический путь рендеринга < 5с на 4G (LTE) или 4.5с на 5G. LCP (Largest Contentful Paint) < 2.5с согласно Google Core Web Vitals является обязательным. Используйте HTTP/2, сжатие Brotli, ленивую загрузку тяжелых ресурсов (IntersectionObserver) и предварительное рендеринг с Next.js ISR.
• Core Web Vitals ≥ 90; бюджет JavaScript ≤ 250 КБ, CLS (Cumulative Layout Shift) < 0.1.
2. 3D голограмма с интеграцией GPT
• Персонаж основан на фотограмметрическом сканировании реального риэлтора, обработанном через Metahuman Retarget.
• Высокополигональная мастер-модель (100–150k трис) оптимизирована до LOD 0 (<30k трис) с компрессией DRACO-GLB < 3MB, чтобы предотвратить задержки в браузере.
• Отдельный высокополигональный слой/скелет экспортирован в .FBX для оффлайн-рендеринга рекламных видео, поддерживая постоянную топологию.
• Шейдер “Голограмма” (GLSL): эффект Френеля + линии сканирования + шумовое растворение, с триггером 0.5с.
• Синхронизация губ с использованием визем, совместимая с ElevenLabs-TTS для потоковой передачи в реальном времени; анимации бездействия, разговора, жестов.
• Стек диалогов: WebWidget → GPT-4o → ElevenLabs → D-ID/HeyGen Live.
• Предустановленные вопросы (несколько сценариев будут определены позже); GPT генерирует переменные ответы, CRM webhook → Zoho One.
• Кнопка “Связаться с агентом” или “Отправить запрос”, инициирующая отправку форм (подготовленные формы из Zoho) или чат/бронирование календаря SalesIQ.
3. Структура сайта и распределение контента
• Главная страница как основной воронка. 3D аватар занимает ≤55% области просмотра (CSS Grid: 7/12 колонок), оставляя место для УТП (Уникальное торговое предложение), CTA (Призыв к действию) и динамического блока списков, интегрированного с Zoho.
• Раздел 'Недвижимость': слайдер с 3 активными объявлениями (API Zoho CRM → обновление Next.js ISR каждые 60 секунд).
• Основная навигация и Next.js AppRouter для легкого расширения сайта без значительных переделок.
Потенциальные дополнения:
• Раздел 'Преимущества компании' – 3 иконки + краткие пункты.
• Раздел 'Отзывы' с лениво загружаемой галереей WebP.
• Подвал с политикой, контактами и ссылками на социальные сети.
• Дополнительные шаблонные страницы: /listings/[id] (детали недвижимости) и /privacy.