Launch Plan v3 — Visual Appendix A: Admin Panel Concept

Проблема и подход

Текущий admin работает и покрывает 90% функционала, нужного студиям. Переделывать всё с нуля дорого и рискованно. Подход tech team: не заменяем classic view — добавляем два новых, каждый под свой use case.

Ключевой принцип

Admin = не один UI, а три режима на общем API. Classic view для детального редактирования (всё что уже есть). Power Editor для массовых изменений. Visual Editor для inline правок на публичной стороне.

Каждый режим — это отдельный workstream с независимым циклом разработки. Пилот идёт на classic, Power Editor появляется в Стадии 4, Visual Editor ещё позже.

Три view параллельно

View 1 · Сейчас

Classic View

Текущий admin. Левый sidebar с разделами, правая панель с формой редактирования. Подходит для детальной работы с одним entity: создать здание, настроить юнит, залить panorama с hotspots.

Продолжает улучшаться инкрементально — в Стадии 1 закрываем критичные баги из UX-аудита, дальше UX-improvements по фидбеку пилота.

Детальное редактирование entity
Заливка контента / panoramas
Настройка feature toggles
Branding / labels & terms

View 2 · Новый

Power Editor

Excel-подобный grid всех юнитов проекта. Inline edit, copy-paste из Excel, bulk actions, CSV import/export. Позволяет обновить 50 юнитов за 5 минут вместо 50 кликов.

Это также база для AI-mode: когда видно всё сразу, AI-агент может применить «обнови цены всех 2BR юнитов на +5%» с preview перед apply. Tech team уже ведёт работу над новой админкой с использованием AI — этот view ляжет в неё естественно.

Initial bulk setup нового проекта
Ежеквартальные price updates
Mass status sync (продажи)
CSV import от застройщика
AI-editing (будущее)

View 3 · Новый

Visual Editor

Inline-редактирование прямо на публичной странице проекта. Толкаешь «Edit Mode», кликаешь на заголовок или цену, правишь in-place. Light-touch — для быстрых правок после того как контент уже залит через Classic.

Запрос product team после демо на похожем продукте — редактирование прямо на публичной странице проекта. Scope — только labels, prices, descriptions. Не замена classic для complex ops.

Быстрая правка заголовка
Смена цены / статуса юнита
Замена описания
Light customisation (font, button radius)

Визуальный язык

Палитра v1.1 (brandbook confirmed)

Финальные токены — подтверждены Figma + live CSS. Полный brandbook →

Surface + Stone (основа)

#FAFAF8
surface-bg

#F2F0ED
surface-subtle

#C5C8CA
stone-400

#9A9594
stone-500

#7C7574
stone-700 ✓

Atmosphere background (gradient stops)

#BBC8D6
atmo-sky

#D4CBBF
atmo-plaster

#C8C1B6
atmo-stone ✓

#B8B0A8
atmo-deep

#A8A29C
atmo-anchor

Live gradient — as used in admin panel v7

Gold (акцент)

#B8955A
gold ✓

30% gold
gold-border

10% gold
gold-dim

Navy (sidebar / depth)

#1E2E3E
navy

#323840
text-900 ✓

#A09E9C
text-300

Numbered Wizard 1→10 в sidebar

Вторая идея из v4 — встроенный onboarding wizard прямо в sidebar, показывающий последовательность шагов настройки проекта. Студия всегда видит «где я сейчас» и «что дальше». Решает главный UX gap из аудита — отсутствие порядка действий.

Step 4 of 10

Add Buildings to your project

Загрузите exterior views для каждой стороны здания (East, West, North, South). Hotspots на фасаде ставятся в Step 10 — после того как units заведены. Пока что можно пропустить.

💡 Heads up: ожидаемые форматы — JPEG/PNG/WebP до 5 MB. Для panorama нужен spherical (2:1 aspect). PDF не поддерживается — конвертируйте в PNG (белый фон, ≤100 KB).

Admin panel — три визуальных направления

Все три варианта работают на одних токенах (brandbook v1.1) и одной HTML-структуре. Только фоновый слой и степень стекла отличаются.

v5 — Solid (плоские цвета, без стекла)

Default. Работает в любом браузере, подходит для embedded-контекстов.

docs/admin-panel-v5.html · фон #FAFAF8 · без backdrop-filter Открыть в новой вкладке ↗

v6 — Photo + Glass (фото здания как фон)

Включается после загрузки фотографии. Максимальное погружение.

docs/admin-panel-v6.html · фото здания · blur(20px) · overlay rgba(30,22,14,0.28) Открыть в новой вкладке ↗

v7 — Gradient + Glass (атмосферный градиент, без фото)

Премиальный вид без зависимости от загруженного фото. Лучший empty-state default.

docs/admin-panel-v7.html · атмосферный градиент #BBC8D6→#C8C1B6→#A8A29C · blur(20px) Открыть в новой вкладке ↗

Operator Panel (staff.offplan.online) — v1, обновлённый мокап

Внутренний инструмент для команды offplan.online (см. Фаза 1.9). Не build-from-scratch: tech team подтвердила, что Super Admin Panel уже существует и работает в продакшене (список проектов, переключатели feature-флагов, asset uploads, action log). Operator Panel = надстройка над этой панелью для multi-tenant управления клиентами-студиями (subscription / payment / audit log / client list с drawer'ом). Отдельный subdomain, отдельный auth, брендбук v1.1 (navy + gold + sand, без traffic-light светофоров).

Operator Panel v1 — multi-page mockup

5 страниц через JS-роутинг: Overview (KPI-row + recent signups + attention needed), Clients (фильтруемая таблица 8 студий-заглушек), Payments (revenue KPIs + transaction history + provider status badge), Audit Log (expandable row details + tenant filter), Settings (Payment Provider секция как Phase 1.5 placeholder). Slide-out drawer с 5 вкладками: Overview, Projects (с full project settings — feature flag toggles, Information, Assets), Subscription, Users, Payments.

docs/operator-panel-v1.html · navy sidebar #1E2E3E · gold accent · denser tables · "STAFF" persistent banner · 13 feature-флагов на проект Открыть в новой вкладке ↗

Что нового в v1 (по сравнению с предыдущим preview)

Multi-page структура — 5 страниц через JS-роутинг вместо single-page preview (Overview / Clients / Payments / Audit Log / Settings)
Project settings внутри drawer — расширяет существующую Super Admin Panel: переключатели feature-флагов на каждый проект (13+ флагов), Information section (домен, тема, менеджеры), Assets section (логотип, видео)
Settings → Payment Provider placeholder — карточки Stripe / Paddle / PayTabs / Telr (disabled, маркировка Phase 1.5) + текущий статус ("Manual entry · Active") + поля API keys / webhook URL (отображаются disabled до подключения провайдера)
Provider status badge на странице Payments — указатель "Provider: Manual entry · Change provider →" со ссылкой на Settings
Drawer компактнее — 5 вкладок вместо 7 (объединили Activity → Audit Log на основной странице, Notes → Overview как inline-блок)

Итерация 1 (включено в Фазу 1.9) vs отложено

Итерация 1 (Фаза 1.9)	Итерация 2 / Стадия 2 / Стадия 4
Clients list + detail drawer (5 вкладок)	Operator role hierarchy: sales / support / finance (Стадия 4)
User actions: reset password / change email / suspend	Глубокая аналитика выручки: MRR / churn / cohort retention (Стадия 4)
Payments page — manual entry adapter (provider-neutral schema)	Реальный provider plug-in: Stripe / Paddle / PayTabs / Telr (Фаза 1.5)
Audit log: базовое логирование + простой viewer	Full-text search, JSON diff display, real-time tail (Итерация 2)
Operator auth + поддомен (email + пароль + session)	2FA (TOTP) + IP allowlist (Итерация 2)
Settings stub: Payment Provider placeholder	Полноценный Settings: operator team management + email-шаблоны (Стадия 2)
Project settings в drawer (feature flags, info, assets)	Impersonation ("login as user") + mobile-responsive layout (Стадия 4)