neo
a23a5d7d02
Full single-page landing: - Hero + интерактивный ECharts дашборд (3 сегмента) - Numbers Strip с count-up анимацией - 3 боли, 3 решения, таймлайн 5 шагов - Bento-сетка для кого, сравнение ROI24 vs как сейчас - Кейс ФармМаркет, команда, калькулятор потерь - Тариф 100К с гарантией, FAQ 6 вопросов, CTA - Footer heavy (ИНН/ОГРН, 152-ФЗ, cookie, privacy modal) - GSAP + ECharts CDN, Inter + JetBrains Mono - Responsive (1024/768/480px), a11y (skip-link, focus-visible)
3.7 KiB
3.7 KiB
ROI24 Landing — STATUS.md (2026-06-21)
Текущий статус
- Файл:
index.html(1700+ строк, ~76KB) - Сервер:
http://localhost:8765/index.html - Гит:
master— в процессе push
Реализовано (14 секций)
- Header — sticky, glassmorphism blur, логотип, навигация, телефон, CTA
- Hero — «Вы теряете деньги, не зная почему» + дашборд-мокап (ECharts)
- Numbers Strip — 4 анимированных счётчика (count-up при скролле)
- Проблемы — 3 боли (бенто-карточки)
- Решение — 3 преимущества (⚡ живые данные, 👁 видно потери, 📱 с телефона)
- Как работает — 5 шагов таймлайн (бриф → запуск)
- Для кого — bento-grid (e-com, услуги, производство)
- Сравнение — ROI24 vs «как сейчас» таблица (8 параметров)
- Кейс — «ФармМаркет» 42 точки, экономия 840К/мес
- Команда — 3 человека (аватары, роли, опыт)
- Калькулятор потерь — 3 поля (сотрудники, часы, зарплата) → ₽/год
- Тариф — 100К под ключ, гарантия 30 дней, 6 trust badges
- FAQ — 6 вопросов-ответов (аккордеон)
- CTA — Telegram + телефон + мини-форма
- Footer — 4 колонки, ИНН/ОГРН, 152-ФЗ, cookie banner, privacy modal
Технические детали
- Шрифты: Inter + JetBrains Mono (fonts.cdnfonts.com, не Google)
- Графики: ECharts 5.5 (CDN), сегменты e-com/services/production
- Анимации: IntersectionObserver (reveal) + GSAP ScrollTrigger (подключён)
- Зависимости: GSAP 3.12.5 + ECharts 5.5.0 (CDN)
- RU compliance: skip link, focus-visible, cookie banner, privacy modal, ИНН/ОГРН, 152-ФЗ, Telegram fixed button
- Аналитика: JSON-LD (schema.org), Open Graph теги
- Responsive: 3 breakpoints (1024, 768, 480px)
Зависимости (CDN)
- GSAP 3.12.5:
https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js - ScrollTrigger:
https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js - ECharts 5.5.0:
https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js - Шрифты:
https://fonts.cdnfonts.com/css/inter+jetbrains-mono
Структура дашборда (ECharts)
DATA = {
ecom: { kpis[4], revenue{labels,data}, channels{labels,data} },
services: { ... },
production: { ... }
}
Тоглы: [Интернет-магазин] [Услуги] [Производство]
КPI: Выручка, Маржа, Касса, Дебиторка (e-com)
Графики: line (выручка), bar (каналы)
Команды
# Сервер
cd /home/nik/projects/wow-design/roi24 && python3 -m http.server 8765
# Коммит + пуш
cd /home/nik/projects/wow-design/roi24 && git add -A && git commit -m "msg" && git push origin master
Важные решения
- Single HTML file — нет зависимости от сборки
- CSS custom properties — все токены в :root
- ECharts pattern: clear() + setOption() — NEVER innerHTML on chart canvases
- cdnfonts вместо Google Fonts — не блокируется провайдерами
- IntersectionObserver вместо GSAP reveal — работает без GSAP
- Cookie banner через localStorage — запоминает выбор