34 lines
1.8 KiB
Plaintext
34 lines
1.8 KiB
Plaintext
---
|
||
description: UI/UX Pro Max — product demo page, not debug dashboard
|
||
alwaysApply: true
|
||
---
|
||
|
||
# UI/UX Pro Max Rules
|
||
|
||
Ты обязан проектировать интерфейс как demo product page, а не debug dashboard.
|
||
|
||
Обязательные принципы:
|
||
- Пользователь должен понять смысл проекта за 10 секунд.
|
||
- Первый экран должен объяснять:
|
||
1. Что это за система.
|
||
2. Что она делает.
|
||
3. Как запустить демо.
|
||
4. Какой результат будет показан.
|
||
- Главный интерфейс должен вести пользователя по цепочке:
|
||
Detection → Classification → Command → Routing.
|
||
- Не показывать все инженерные панели сразу.
|
||
- Инженерные детали должны быть ниже или в отдельном раскрываемом блоке.
|
||
- Не должно быть горизонтального скролла.
|
||
- Mobile-first адаптив обязателен.
|
||
- Основной текст не меньше 16px.
|
||
- Кнопки не меньше 44px по высоте.
|
||
- На mobile всё в одну колонку.
|
||
- На desktop допустима сетка 2 колонки.
|
||
- Визуальная иерархия:
|
||
Hero → Demo → Result → Scenarios → Criteria → Engineering Details.
|
||
- Запрещены мелкие debug-панели на первом экране.
|
||
- Запрещены узкие внутренние scroll-панели для сценариев.
|
||
- Запрещены fixed width больше viewport.
|
||
- Использовать min-width: 0 для grid/flex children.
|
||
- SVG/сцена должны масштабироваться через width: 100%, max-width: 100%.
|