208 lines
6.1 KiB
Markdown
208 lines
6.1 KiB
Markdown
# Design System SFERA
|
||
|
||
## UI концепция
|
||
|
||
**SFERA — Enterprise AI Operating System**
|
||
|
||
Интерфейс должен ощущаться как:
|
||
- Linear
|
||
- Stripe Dashboard
|
||
- Notion
|
||
- Attio
|
||
- ClickUp 3.0
|
||
- Plane
|
||
- VS Code / JetBrains IDE для authoring-сценариев 1С
|
||
|
||
SFERA не CRM. Основной UI — это современная IDE/операционная среда для 1С: semantic workspace, редактор кода, дерево объектов, дизайнер форм/отчётов, инспектор свойств, diff/preview/apply и AI-помощник.
|
||
|
||
Классический 1С Конфигуратор используется как reference workflow, а не как visual style. Мы берём рабочие паттерны 1С-разработчика: дерево конфигурации, вкладки объектов, модуль/форма/свойства/события, правый инспектор, нижние панели диагностики и поиск. Визуально это должно быть современно, плотно, спокойно и удобно для долгой работы.
|
||
|
||
## Визуальный стиль
|
||
|
||
- чистый enterprise minimalism
|
||
- dark/light режим
|
||
- спокойные нейтральные цвета
|
||
- акцентный цвет для действий
|
||
- cards with soft shadows
|
||
- rounded-2xl
|
||
- минимальный glassmorphism только для важных overlay
|
||
- плотная, но не перегруженная информационная сетка
|
||
|
||
## Layout principles
|
||
|
||
### Главная структура
|
||
|
||
```txt
|
||
AppShell
|
||
├── Sidebar
|
||
├── Topbar
|
||
├── CommandPalette
|
||
├── Workspace
|
||
│ ├── PageHeader
|
||
│ ├── Toolbar
|
||
│ ├── ContentGrid
|
||
│ └── RightInspector
|
||
├── EditorWorkspace
|
||
│ ├── ObjectTree
|
||
│ ├── WorkspaceModeBar
|
||
│ ├── CodeEditor
|
||
│ ├── FormDesigner
|
||
│ ├── PropertiesInspector
|
||
│ ├── EventsInspector
|
||
│ ├── VersionsPanel
|
||
│ ├── DocumentationPanel
|
||
│ ├── KnowledgePanel
|
||
│ ├── LearningPanel
|
||
│ ├── ProblemsPanel
|
||
│ └── SemanticDiff
|
||
└── AI Copilot Panel
|
||
```
|
||
|
||
## Основные зоны
|
||
|
||
### Sidebar
|
||
|
||
- Dashboard
|
||
- Проекты 1С
|
||
- Объекты 1С
|
||
- Редактор BSL
|
||
- Дизайнер объектов
|
||
- Дизайнер форм
|
||
- Отчёты
|
||
- Семантический граф
|
||
- Impact analysis
|
||
- Review
|
||
- Знания
|
||
- AI
|
||
- Интеграции
|
||
- Регламентные задания
|
||
- Настройки
|
||
|
||
### Topbar
|
||
|
||
- поиск
|
||
- command palette
|
||
- быстрые действия
|
||
- уведомления
|
||
- профиль
|
||
- переключение проекта/организации
|
||
|
||
### Right Inspector
|
||
|
||
Контекстная панель для:
|
||
- объекта 1С
|
||
- процедуры или функции
|
||
- формы, команды или элемента формы
|
||
- реквизита или табличной части
|
||
- отчёта
|
||
- AI анализа
|
||
- истории изменений
|
||
- связанных сущностей
|
||
|
||
## Компонентные правила
|
||
|
||
### Карточки
|
||
|
||
- `rounded-2xl`
|
||
- `border`
|
||
- `bg-card`
|
||
- `shadow-sm`
|
||
- padding минимум `p-4`
|
||
|
||
### Таблицы
|
||
|
||
- sticky header
|
||
- фильтры
|
||
- saved views
|
||
- быстрый поиск
|
||
- column visibility
|
||
- bulk actions
|
||
- inline status badge
|
||
- row details через drawer/inspector
|
||
|
||
### Формы
|
||
|
||
- разделять на logical sections
|
||
- использовать progressive disclosure
|
||
- показывать validation inline
|
||
- сохранять drafts
|
||
- audit trail для важных изменений
|
||
|
||
## Цветовые токены
|
||
|
||
```txt
|
||
background
|
||
foreground
|
||
card
|
||
card-foreground
|
||
muted
|
||
muted-foreground
|
||
border
|
||
input
|
||
primary
|
||
primary-foreground
|
||
secondary
|
||
destructive
|
||
warning
|
||
success
|
||
info
|
||
```
|
||
|
||
## Статусы
|
||
|
||
### Задача
|
||
|
||
```txt
|
||
Новая
|
||
В работе
|
||
На проверке
|
||
Выполнена
|
||
Отменена
|
||
Просрочена
|
||
```
|
||
|
||
### Сделка
|
||
|
||
```txt
|
||
Активна
|
||
Неактивна
|
||
На бординге
|
||
Ожидает документов
|
||
Приостановлена
|
||
Закрыта
|
||
```
|
||
|
||
### Терминал
|
||
|
||
```txt
|
||
Подключен
|
||
Не подключен
|
||
Отключен банком
|
||
Ошибка настройки
|
||
```
|
||
|
||
## AI UX
|
||
|
||
AI должен быть не отдельной страницей, а частью workflow:
|
||
|
||
- AI Copilot справа
|
||
- подсказки в карточках
|
||
- inline completion в BSL editor
|
||
- context-aware suggestions по текущим переменным, реквизитам, табличным частям, форме и объекту 1С
|
||
- генерация кода, объектов, форм, команд и отчётов через preview/diff/apply
|
||
- объяснение текущего кода и структуры объекта
|
||
- генерация безопасных изменений 1С
|
||
- продолжение кода по текущему контексту
|
||
- объяснение изменений
|
||
- статистика токенов и лимитов
|
||
|
||
## Knowledge, Docs, Training UX
|
||
|
||
SFERA должна показывать знания рядом с местом работы, а не прятать их в отдельную wiki:
|
||
|
||
- документация объекта, формы, отчёта и бизнес-правила доступны из IDE-контекста;
|
||
- база знаний связывается с lineage объекта, процедурами, запросами и событиями формы;
|
||
- training/onboarding показывает рекомендации по текущему коду, стандартам команды и типовым ошибкам;
|
||
- AI отвечает только с учётом доступных знаний, прав и privacy policy;
|
||
- history/versions объясняют, почему объект менялся, какими задачами и решениями это было связано.
|