Update project 2nd iteration

docs/design/UI-spec.md

@@ -0,0 +1,110 @@
+# Спецификация интерфейсов системы бронирования билетов (Fight & Sports)
+
+**Общий стиль:** Modern SaaS, Dark Theme.
+**Цветовая палитра:** Фон #121212, Акцентный красный #E32636 (кнопки, активные состояния), Золотой/Желтый (лояльность).
+**Шрифты:** Без засечек (San Francisco / Inter / Roboto), четкая иерархия заголовков.
+
+---
+
+## I. Клиентское мобильное приложение (Client App)
+
+### 01-login.png — Вход в систему
+* **Назначение:** Авторизация и регистрация.
+* **Логика:** Переключатель (Segmented Control) между E-mail и Телефоном. Поля с валидацией. Социальный вход (Apple, Google, VK) в нижней части экрана.
+* **Кнопки:** "Войти" (Primary), "Создать аккаунт" (Secondary/Ghost).
+
+### 02-events.png — Главный экран (Каталог)
+* **Назначение:** Поиск и выбор спортивного события.
+* **Логика:** Горизонтальные табы-фильтры («Все», «Ближайшие», «Популярные»). Список карточек с вертикальным скроллом.
+* **Контент карточки:** Миниатюра афиши, название (напр. "Турнир по ММА"), дата/время, площадка, цена "от 2500 ₽".
+
+### 03-event-details.png — Страница события
+* **Назначение:** Подробная информация об ивенте перед покупкой.
+* **Логика:** Большая афиша (Hero Image) сверху. Блоки: «Ключевая информация» (возраст 18+, длительность), описание, правила возврата, что включено в билет.
+* **Действие:** Закрепленная внизу кнопка «Выбрать места».
+
+### 04-seat-selection.png — Выбор мест (Схема зала)
+* **Назначение:** Интерактивное бронирование мест.
+* **Логика:** Карта арены с секторами. Цветовая индикация: VIP (фиолетовый), Стандарт (синий). Интерактивные точки (кресла).
+* **Панель итогов:** Выбранное место (Ряд/Место), количество и общая стоимость с кнопкой перехода к оплате.
+
+### 05-checkout.png — Оформление заказа
+* **Назначение:** Финализация покупки и выбор метода оплаты.
+* **Логика:** Проверка данных заказа. Ввод промокода, тумблер использования бонусных баллов. Выбор Apple Pay или Карты.
+* **Безопасность:** Текст «Все платежи защищены».
+
+### 06-my-tickets.png — Список билетов
+* **Назначение:** Хранение купленных билетов пользователя.
+* **Логика:** Табы «Активные» и «История». Карточки с перфорацией (визуальный стиль билета), краткие данные места.
+* **Действие:** Кнопка «Открыть билет» для перехода к QR.
+
+### 07-ticket-qr.png — Электронный билет
+* **Назначение:** Контроль доступа на входе.
+* **Логика:** Крупный QR-код. Информация о секторе, ряде и месте продублирована крупным шрифтом для удобства стюардов.
+* **Действие:** Кнопки «Добавить в Wallet» и «Скачать».
+
+### 08-profile-loyalty.png — Профиль и лояльность
+* **Назначение:** Личный кабинет и геймификация.
+* **Логика:** Карточка уровня лояльности («Серебро»). Баланс бонусов в рублях. Прогресс-бар до следующего уровня (Золото).
+* **Навигация:** Меню настроек, заказов и реферальной программы.
+
+### 09-order-history.png — История заказов
+* **Назначение:** Просмотр прошлых транзакций.
+* **Логика:** Список заказов с датами. Цветовые статусы: Зеленый («Оплачен»), Синий («Завершен»), Красный («Отменен»).
+* **Детали:** Сумма заказа и ссылка на подробности.
+
+### 10-notifications.png — Настройки уведомлений
+* **Назначение:** Управление каналами коммуникации.
+* **Логика:** Список переключателей (Switch) для каждого канала: SMS, E-mail, Push, Telegram, WhatsApp.
+* **Группировка:** Отдельно системные уведомления и маркетинговые предложения.
+
+---
+
+## II. Админ-панель (Admin Interface)
+
+### admin-01-dashboard.png — Дашборд аналитики
+* **Назначение:** Оперативный мониторинг продаж.
+* **Виджеты:** KPI (Выручка, Билеты, Конверсия). Линейный график продаж. Круговая диаграмма источников трафика.
+* **Действия:** Быстрые кнопки «Создать событие» и «Рассылка».
+
+### admin-02-events.png — Управление событиями
+* **Назначение:** Список и модерация ивентов.
+* **Логика:** Табличное отображение мероприятий. Для каждого: статус (Черновик/Опубликовано), количество проданных мест в %, текущая выручка.
+* **Действия:** Редактировать, Статистика.
+
+### admin-03-create-event.png — Форма создания
+* **Назначение:** Добавление нового матча/боя в базу.
+* **Поля:** Название, дата (Datepicker), время, площадка (Dropdown), описание (Textarea), загрузка афиши.
+* **Логика:** Валидация обязательных полей перед публикацией.
+
+### admin-04-seat-map.png — Настройка схемы зала
+* **Назначение:** Привязка категорий к местам.
+* **Логика:** Область предпросмотра схемы (SVG). Панель конфигурации: выбор категории (VIP/Стандарт) и выделение соответствующих зон на карте.
+
+### admin-05-pricing.png — Управление ценами
+* **Назначение:** Настройка стоимости и динамического ценообразования.
+* **Логика:** Список категорий с полями ввода цены. Блок автоматизации: % наценки при высоком спросе или скидки при низком.
+
+### admin-06-segments.png — Сегментация аудитории
+* **Назначение:** Группировка пользователей для маркетинга.
+* **Фильтры:** По городу, LTV (сумме покупок), дате регистрации.
+* **Результат:** Сохраненные сегменты с количеством доступных контактов.
+
+### admin-07-campaign-create.png — Создание рассылки
+* **Назначение:** Запуск маркетинговых кампаний.
+* **Логика:** Выбор сегмента из списка. Редактор сообщения с превью (как это увидит пользователь). Выбор каналов доставки.
+* **Действие:** Кнопки «Отправить сейчас» или «Запланировать».
+
+### admin-08-campaign-stats.png — Аналитика рассылок
+* **Назначение:** Анализ эффективности маркетинга.
+* **Метрики:** Open Rate (открытия), Click Rate (клики), Conversion (покупки). Графики вовлеченности во времени.
+
+### admin-09-users.png — Список пользователей
+* **Назначение:** CRM система.
+* **Логика:** Список клиентов с быстрыми метриками: уровень лояльности, количество билетов, общая сумма трат (LTV).
+* **Поиск:** По имени, телефону или ID.
+
+### admin-10-user-profile.png — Карточка клиента (Админ)
+* **Назначение:** Детальная информация и ручное управление.
+* **Логика:** Просмотр всех заказов пользователя, редактирование бонусного баланса, история активности.
+* **Действия:** Кнопки связи и блокировки.