EventHub/EventHubSpec
3
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Archive CalenTIQ client Front design SoT under design/front. Refs EventHub/EventHubSpec#10

Browse Source
This commit is contained in:
Aleksey Sabilin
2026-07-26 22:35:08 +03:00
parent 6f88205675
commit 1f6bc3decc
27 changed files with 229 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
design/README.md
+8
View File
@@ -0,0 +1,8 @@
# Design artifacts
| Папка | Назначение |
|-------|------------|
| [`front/`](front/) | Клиентский EventHubFront / бренд CalenTIQ |
| [`admin/`](admin/) | EventHubFrontAdmin (позже) |
См. также [`BRANDING.md`](../BRANDING.md).
design/admin/README.md
+5
View File
@@ -0,0 +1,5 @@
# EventHubFrontAdmin — дизайн
Зарезервировано под утверждённые мокапы / борды админки.
Пока пусто: клиентский фронт — в [`../front/`](../front/).
design/front/README.md
+53
View File
@@ -0,0 +1,53 @@
# CalenTIQ / EventHubFront — дизайн (SoT)
Канонические артефакты клиентского фронта (EventHubFront). Публичный бренд: **CalenTIQ**.
Правила и решения: [`BRANDING.md`](../../BRANDING.md). Админские мокапы — отдельно в [`../admin/`](../admin/).
## Moods
| API key | UI-лейбл | Акцент |
|---------|----------|--------|
| `calm` | **FLOW** | sage `#ABC5B5` / primary `#2F7A68` |
| `energetic` | **MOMENTUM** | coral `#FF6A3D` на ink `#111820` |
| `business` | **CONTROL** | steel `#324A5F` |
Токены: [`tokens/colors.json`](tokens/colors.json), [`tokens/typography.json`](tokens/typography.json) (Syne / Manrope).
## IA (ограничения)
- Top nav (desktop) + bottom nav (mobile)
- **Без left sidebar**
- Без 4-го Creator mood
- Внутренние репо (`EventHub*`) не переименовываем
## Структура
### `boards/` — UI-борды
| Файл | Что это |
|------|---------|
| `calentiq-ui-board-final.png` | Утверждённый UI-борд направления CalenTIQ (Time Arc, moods) |
| `calentiq-icon-system-final.png` | Утверждённый борда иконок / app icons по moods |
| `eventhub-stage-ui-as-is.png` | As-is stage UI (референс текущего продукта) |
| `eventhub-discover-*.png` | As-is Discover по moods (flow / momentum / control) + as-is |
### `logo/` — Time Arc
- `mark.svg` (+ `mark-black.svg`, `mark-white.svg`) — master mark
- `lockup-horizontal.svg` (+ black/white) — wordmark lockup
- `mark-1024.png`, `lockup-horizontal.png` — растровые превью
### `mood-icons/`
- `appicon-{flow,momentum,control}.svg` — master mood icons
- `appicon-*-1024.png` — растры для сторов / превью
## Runtime-копии
В приложении те же векторы живут в `EventHubFront/public/brand/`.
Эта папка Spec — **дизайн SoT** для согласования; runtime Front может отставать или опережать до синка.
## Источник
Собрано из утверждённого local brand pack (`calentiq-brand-pack`) и Desktop as-is скринов.
ZIP-архивы и GPT-stub дубликаты в Spec не кладём.
design/front/boards/calentiq-icon-system-final.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

design/front/boards/calentiq-ui-board-final.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 MiB

design/front/boards/eventhub-discover-as-is.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 89 KiB

design/front/boards/eventhub-discover-control.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

design/front/boards/eventhub-discover-flow.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 89 KiB

design/front/boards/eventhub-discover-momentum.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 146 KiB

design/front/boards/eventhub-stage-ui-as-is.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 253 KiB

design/front/logo/lockup-horizontal-black.svg
+18
View File
@@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 420" fill="none">
<g transform="translate(20,8) scale(0.38)">
<g stroke="#14233A" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#14233A"/>
<circle cx="816.06" cy="207.94" r="18" fill="#14233A"/>
<circle cx="884.39" cy="297.00" r="18" fill="#14233A"/>
<circle cx="927.35" cy="400.71" r="18" fill="#14233A"/>
<circle cx="942.00" cy="512.00" r="18" fill="#14233A"/>
<circle cx="927.35" cy="623.29" r="18" fill="#14233A"/>
<circle cx="884.39" cy="727.00" r="18" fill="#14233A"/>
<circle cx="816.06" cy="816.06" r="18" fill="#14233A"/>
</g>
<text x="430" y="270" font-family="Syne, Montserrat, Arial Black, sans-serif" font-size="168" font-weight="800" fill="#14233A">Calen<tspan fill="#4C8E7A">TIQ</tspan></text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

design/front/logo/lockup-horizontal-white.svg
+18
View File
@@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 420" fill="none">
<g transform="translate(20,8) scale(0.38)">
<g stroke="#FFFFFF" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#FFFFFF"/>
<circle cx="816.06" cy="207.94" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="297.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="400.71" r="18" fill="#FFFFFF"/>
<circle cx="942.00" cy="512.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="623.29" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="727.00" r="18" fill="#FFFFFF"/>
<circle cx="816.06" cy="816.06" r="18" fill="#FFFFFF"/>
</g>
<text x="430" y="270" font-family="Syne, Montserrat, Arial Black, sans-serif" font-size="168" font-weight="800" fill="#FFFFFF">Calen<tspan fill="#ABC5B5">TIQ</tspan></text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

design/front/logo/lockup-horizontal.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB

design/front/logo/lockup-horizontal.svg
+18
View File
@@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 420" fill="none">
<g transform="translate(20,8) scale(0.38)">
<g stroke="#14233A" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#14233A"/>
<circle cx="816.06" cy="207.94" r="18" fill="#14233A"/>
<circle cx="884.39" cy="297.00" r="18" fill="#14233A"/>
<circle cx="927.35" cy="400.71" r="18" fill="#14233A"/>
<circle cx="942.00" cy="512.00" r="18" fill="#14233A"/>
<circle cx="927.35" cy="623.29" r="18" fill="#14233A"/>
<circle cx="884.39" cy="727.00" r="18" fill="#14233A"/>
<circle cx="816.06" cy="816.06" r="18" fill="#14233A"/>
</g>
<text x="430" y="270" font-family="Syne, Montserrat, Arial Black, sans-serif" font-size="168" font-weight="800" fill="#14233A">Calen<tspan fill="#4C8E7A">TIQ</tspan></text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

design/front/logo/mark-1024.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

design/front/logo/mark-black.svg
+15
View File
@@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="none">
<g stroke="#000000" stroke-width="48" stroke-linecap="round" stroke-linejoin="round">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#000000"/>
<circle cx="816.06" cy="207.94" r="18" fill="#000000"/>
<circle cx="884.39" cy="297.00" r="18" fill="#000000"/>
<circle cx="927.35" cy="400.71" r="18" fill="#000000"/>
<circle cx="942.00" cy="512.00" r="18" fill="#000000"/>
<circle cx="927.35" cy="623.29" r="18" fill="#000000"/>
<circle cx="884.39" cy="727.00" r="18" fill="#000000"/>
<circle cx="816.06" cy="816.06" r="18" fill="#000000"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 765 B

design/front/logo/mark-white.svg
+15
View File
@@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="none">
<g stroke="#FFFFFF" stroke-width="48" stroke-linecap="round" stroke-linejoin="round">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#FFFFFF"/>
<circle cx="816.06" cy="207.94" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="297.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="400.71" r="18" fill="#FFFFFF"/>
<circle cx="942.00" cy="512.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="623.29" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="727.00" r="18" fill="#FFFFFF"/>
<circle cx="816.06" cy="816.06" r="18" fill="#FFFFFF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 765 B

design/front/logo/mark.svg
+15
View File
@@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="none">
<g stroke="#000000" stroke-width="48" stroke-linecap="round" stroke-linejoin="round">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#000000"/>
<circle cx="816.06" cy="207.94" r="18" fill="#000000"/>
<circle cx="884.39" cy="297.00" r="18" fill="#000000"/>
<circle cx="927.35" cy="400.71" r="18" fill="#000000"/>
<circle cx="942.00" cy="512.00" r="18" fill="#000000"/>
<circle cx="927.35" cy="623.29" r="18" fill="#000000"/>
<circle cx="884.39" cy="727.00" r="18" fill="#000000"/>
<circle cx="816.06" cy="816.06" r="18" fill="#000000"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 765 B

design/front/mood-icons/appicon-control-1024.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

design/front/mood-icons/appicon-control.svg
+16
View File
@@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024" fill="none">
<rect width="1024" height="1024" rx="228" fill="#324A5F"/>
<g stroke="#FFFFFF" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#FFFFFF"/>
<circle cx="816.06" cy="207.94" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="297.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="400.71" r="18" fill="#FFFFFF"/>
<circle cx="942.00" cy="512.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="623.29" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="727.00" r="18" fill="#FFFFFF"/>
<circle cx="816.06" cy="816.06" r="18" fill="#FFFFFF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 865 B

design/front/mood-icons/appicon-flow-1024.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 37 KiB

design/front/mood-icons/appicon-flow.svg
+16
View File
@@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024" fill="none">
<rect width="1024" height="1024" rx="228" fill="#ABC5B5"/>
<g stroke="#FFFFFF" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#FFFFFF"/>
<circle cx="816.06" cy="207.94" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="297.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="400.71" r="18" fill="#FFFFFF"/>
<circle cx="942.00" cy="512.00" r="18" fill="#FFFFFF"/>
<circle cx="927.35" cy="623.29" r="18" fill="#FFFFFF"/>
<circle cx="884.39" cy="727.00" r="18" fill="#FFFFFF"/>
<circle cx="816.06" cy="816.06" r="18" fill="#FFFFFF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 865 B

design/front/mood-icons/appicon-momentum-1024.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

design/front/mood-icons/appicon-momentum.svg
+16
View File
@@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024" fill="none">
<rect width="1024" height="1024" rx="228" fill="#111820"/>
<g stroke="#FFFFFF" stroke-width="48" stroke-linecap="round" stroke-linejoin="round" fill="none">
<path d="M512 132 A380 380 0 1 0 512 892"/>
<path d="M512 512 L377.77 434.50"/>
<path d="M512 512 L698.20 404.50"/>
</g>
<circle cx="512" cy="512" r="24" fill="#FFFFFF"/>
<circle cx="816.06" cy="207.94" r="18" fill="#FF6A3D"/>
<circle cx="884.39" cy="297.00" r="18" fill="#FF6A3D"/>
<circle cx="927.35" cy="400.71" r="18" fill="#FF6A3D"/>
<circle cx="942.00" cy="512.00" r="18" fill="#FF6A3D"/>
<circle cx="927.35" cy="623.29" r="18" fill="#FF6A3D"/>
<circle cx="884.39" cy="727.00" r="18" fill="#FF6A3D"/>
<circle cx="816.06" cy="816.06" r="18" fill="#FF6A3D"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 865 B

design/front/tokens/colors.json
+5
View File
@@ -0,0 +1,5 @@
{
"FLOW": { "appIcon": "#ABC5B5", "primary": "#2F7A68", "accent": "#ABC5B5", "foreground": "#0F2A24" },
"MOMENTUM": { "appIcon": "#111820", "primary": "#FF6A3D", "accent": "#FF6A3D", "foreground": "#F5F1EA" },
"CONTROL": { "appIcon": "#324A5F", "primary": "#324A5F", "accent": "#4A6B82", "foreground": "#14233A" }
}
design/front/tokens/typography.json
+1
View File
@@ -0,0 +1 @@
{ "display": "Syne", "ui": "Manrope" }