Интерактивный сайт недвижимости с 3D-анимацией
(с интеграцией IDX / MLS / CRMLS, SEO-first, Accessibility-compliant)
ВАЖНО! Мы рассматриваем исполнителей со всего мира, Белоруссия и Украина-welcome (у вас есть супер-классные спецы), Питер, Москва (цена должна быть адекватная, это не господряд). МЫ рассматриваем уже готовую команду, вариант "ща возьму заказ и найду кого-нибудь, не подходит". Мы заключаем договор. В случае нарушения сроков сдачи работ-санкции.
Референс по визуалу и анимации:
1. Цель проекта
Создать высокопроизводительный, визуально насыщенный сайт недвижимости, адаптируемый под рынок США (Калифорния), с возможностью интеграции данных из MLS / CRMLS через IDX, без ущерба для:
SEO
производительности
доступности (ADA / WCAG)
юридического соответствия требованиям штата Калифорния
2. Основные принципы проекта
SEO-first архитектура
Весь критический контент должен быть доступен:
в HTML
при отключённом JavaScript
индексируем поисковыми системами
Анимация и 3D — как прогрессивное улучшение (progressive enhancement)
3D, WebGL и motion-эффекты не являются источником основного контента.
Accessibility & Legal Compliance (California / ADA)
Сайт должен соответствовать требованиям доступности.
3. Архитектура и фреймворк
🧠 Фреймворк
Astro — рекомендованный и приоритетный фреймворк
Static Site Generation (SSG)
Отличная SEO-совместимость
Islands Architecture
Минимальный JavaScript по умолчанию
React допускается
ТОЛЬКО для интерактивных компонентов (islands)
Не должен:
заменять HTML-контент
ломать SSR / SSG
ухудшать SEO и Core Web Vitals
Использование SPA-подхода (полный client-side render) запрещено.
4. 🔧 Стек технологий (обновлённый)
Frontend
Astro (приоритет)
HTML5 (семантическая разметка)
CSS3
Tailwind CSS (или CSS Modules)
JavaScript / TypeScript
React (ограниченно НО ОБСУЖДАЕТСЯ, как UI-islands)
Three.js (3D)
WebGL
GSAP (анимации)
Intersection Observer API
prefers-reduced-motion support
Backend / API / Data Layer
Node.js (опционально)
Serverless Functions (Vercel / Netlify)
REST / GraphQL API для данных недвижимости
5. 🏘 IDX / MLS / CRMLS Интеграция (ОБЯЗАТЕЛЬНО)
Источники данных
IDX (Internet Data Exchange)
MLS
CRMLS (California Regional MLS)
Карты
Калькулятор ипотеки
Требования
Поддержка получения данных:
списки объектов (listings)
цены
статусы (active, pending, sold)
изображения
характеристики объектов
Архитектура:
Данные подгружаются:
на этапе build (SSG) или
через server-side API
НЕ client-only fetch для SEO-критичных страниц
SEO:
Каждая карточка объекта имеет:
отдельный URL
HTML-контент
мета-теги
Контент индексируется Google
Юридические требования IDX:
Attribution MLS (обязательно)
Display rules (логотипы MLS, дисклеймеры)
Обновление данных в рамках правил MLS
6. 🧱 Структура сайта
Обязательные страницы
Главная
SEO-контент (HTML)
3D / Canvas как overlay
Каталог недвижимости (IDX Listings)
Фильтры (цена, город, тип)
SSR / SSG
Доступен без JS
Страница объекта
Отдельный URL
Полное описание
Галерея
3D / анимации (lazy-load)
О компании
Контакты
Legal / Accessibility Statement
ПРОТОТИП ГЛАВНЫХ ЭКРАНОВ НАРИСОВАЛ, для более понятной навигации
7. 🎨 UI / UX и анимации
Scroll-based анимации
Parallax
Hover / micro-interactions
3D сцены в hero
Анимации карточек
Ограничения
Анимации:
не блокируют контент
не влияют на SEO
отключаются при prefers-reduced-motion
8. 🚀 Производительность
Lazy-load:
Three.js
Canvas
3D модели
Оптимизация изображений:
WebP / AVIF
CDN
Целевые метрики:
LCP < 2.5s
CLS < 0.1
INP < 200ms
9. ♿ Accessibility & Legal Compliance (California)
Обязательные требования (ADA / WCAG 2.1 AA)
Accessibility button / toggle:
увеличение шрифта
контраст
отключение анимаций
Навигация:
keyboard accessible
focus states
Контент:
alt-теги изображений
aria-labels
semantic HTML
Формы:
доступные label
screen-reader friendly
Юридические страницы:
Accessibility Statement
Fair Housing Disclaimer
10. 🧪 SEO
ЧПУ URL
Meta tags
OpenGraph
Twitter Cards
sitemap.xml
robots.txt
schema.org:
RealEstateAgent
Product
Offer
11. 🛠 Инструменты команды
Категория Инструменты
Фреймворк Astro (приоритет)
UI Islands React
3D Three.js / WebGL
Анимации GSAP
Дизайн Figma
Данные IDX / MLS / CRMLS
Хостинг Vercel / Netlify
Аналитика Google Analytics
Управление Jira / Trello
Аудит Lighthouse, axe
12. Итоговое требование к подрядчику
Команда должна иметь опыт:
Astro + SEO
WebGL / Three.js
IDX / MLS интеграций
ADA / WCAG compliance
Performance optimization
Оплата поэтапная:
Прототип
Дизайн
Верстка
Программируем
Тестим
Запускаем
Нужна гарантия 6 месяцев, что не будет багов и будет все работать корректно. НЕТ, нам не нужно обслуживание сайта.
Что на данный момент есть:
Лого
Название
Гайд по брендингу (фирменный цвета, шрифты, визуал)
Домен
Прошу присылать сообщения и откликаться только честных, добросовестных и реально быстро выполняющих работу людей. Если у вас нет опыта в сложных проектах, пожалуйста не пишите. Если вы можете затянуть проект хотя бы на 5 дней, не пишите.