From 1e357244e1f6ddd9a06b1c69c7a14db7d154169b Mon Sep 17 00:00:00 2001 From: "alexei.dolgolyov" Date: Sat, 25 Apr 2026 01:11:42 +0300 Subject: [PATCH] chore(design): add aurora redesign mockups + chooser Three full-fidelity dashboard mockups (Bridge/Console, Aurora/Glass, Bento/Modular) plus a chooser index and a tracker-detail page in the chosen Aurora language. Self-contained HTML, no build needed. --- design-mockups/README.md | 161 +++ design-mockups/aurora-tracker.html | 1459 ++++++++++++++++++++++++ design-mockups/dashboard-aurora.html | 1410 +++++++++++++++++++++++ design-mockups/dashboard-bento.html | 1160 +++++++++++++++++++ design-mockups/dashboard.html | 1555 ++++++++++++++++++++++++++ design-mockups/index.html | 565 ++++++++++ 6 files changed, 6310 insertions(+) create mode 100644 design-mockups/README.md create mode 100644 design-mockups/aurora-tracker.html create mode 100644 design-mockups/dashboard-aurora.html create mode 100644 design-mockups/dashboard-bento.html create mode 100644 design-mockups/dashboard.html create mode 100644 design-mockups/index.html diff --git a/design-mockups/README.md b/design-mockups/README.md new file mode 100644 index 0000000..fb1e3a1 --- /dev/null +++ b/design-mockups/README.md @@ -0,0 +1,161 @@ +# Notify Bridge — Redesign Mockups + +**Start here:** open [`index.html`](./index.html) for the chooser. Three full directions to pick between, plus a side-by-side comparison table. + +**Direction chosen: Aurora / Glass** (2026-04-25). Continuing to mock additional surfaces in this language; original three-way chooser kept for reference. + +| File | Option | Mood | +| --- | --- | --- | +| [`index.html`](./index.html) | **Chooser** | Compare all three side by side | +| [`dashboard.html`](./dashboard.html) | A · Bridge / Control Room | Editorial broadcast console — phosphor lime on deep ink, italic Fraunces, hairlines, scanlines | +| [`dashboard-aurora.html`](./dashboard-aurora.html) | **B · Aurora / Glass** ✓ | Frosted-glass panels over a vivid aurora gradient — visionOS / Stripe-modern | +| [`dashboard-bento.html`](./dashboard-bento.html) | C · Bento / Modular | Mixed-size colorful tiles in a tight grid — Apple Keynote / Linear blog energy | +| [`aurora-tracker.html`](./aurora-tracker.html) | **Aurora · Tracker detail** | Form + live preview + event log — stress-tests glass on form-heavy surfaces | + +All three are self-contained HTML — no build step. Each has its own theme toggle in the top-right. + +--- + +## Quick comparison + +| Trait | A · Bridge | B · Aurora | C · Bento | +| --- | --- | --- | --- | +| Mood | Editorial / operator | Premium / atmospheric | Playful / confident | +| Default theme | Dark (Console) | Dark (Aurora) | Light (Daylight) | +| Accent | Phosphor lime `#d4ff3a` | Lavender + orchid + mint | Violet · mint · coral · honey | +| Surface | Hairline-rule modules | Frosted-glass panels | Solid-color tiles | +| Display font | Fraunces (serif) | Newsreader (serif) | Manrope (sans) | +| Density | High · for power users | Medium · breathable | Medium · airy | +| Best for | Pro operators · self-hosters | Showroom · public-facing | Mainstream · cross-audience | +| Risk | Niche taste · heavy mood | Glass trend may date | Color discipline matters | + +--- + +## What all three share (the UX, not the paint) + +These additions are the same across every option — pick a *look*, not a different *product*: + +1. **Live ticker / "live" pill** — always-running awareness of the last events without forcing focus +2. **Stats with deltas + sparklines or trend chart** — numbers always have context +3. **Editorial hero** with current-state sentence + big throughput readout +4. **Signal stream with routing trail** — every event shows Tracker → Target → Template inline (today: 3 clicks to find this) +5. **Provider deck** — throughput, last-seen, pulse status, idle/warn/live indicators +6. **Pulse chart** (heatmap in A, area waves in B/C) — finally answers "when is this thing busiest?" +7. **Active wires panel** — Sankey-style Source → Channel routes with live counts +8. **Compose / new-tracker CTA** — single entry to a 4-step wizard (provider → tracker → template → target) +9. **Two-theme system** — committed light + dark per option, no lukewarm middle "system" + +--- + +## Implementation cost (rough) + +| Option | New deps | New components | Migration risk | +| --- | --- | --- | --- | +| A · Bridge | Fraunces + Instrument Sans + JetBrains Mono fonts | Ticker, sparklines, signal-stream-with-trail, heatmap, routes panel | Low — mostly token swap + the 5 new components | +| B · Aurora | Newsreader + Geist + Geist Mono fonts | Same as A + heavy backdrop-filter / glass system | Medium — `backdrop-filter` perf needs review on long lists; gradient bg can hurt low-end devices | +| C · Bento | Manrope + JetBrains Mono fonts | Same UX components, but tile-grid layout system + bold-color discipline (color governance matters more) | Low-Medium — tile spans need a discipline, and 8-color palette needs guardrails so devs don't pick colors freely | + +All three keep the existing Svelte 5 architecture, $state cache system, and route structure unchanged. **Migration is ~3 weeks** for any one of them to land dashboard + provider list + tracker detail. + +--- + +## What's NOT in any mockup yet + +If a direction lands, these surfaces still need design before implementation: + +- Tracker detail page (timeline + config editor + live preview) +- Template editor (Jinja2 sandbox + side-by-side preview) +- Provider list + provider detail +- Target detail (channel inbox + delivery history) +- Bot console (chat-style interaction log for Telegram/Matrix/Email) +- Setup wizard (first-run experience) +- Mobile pass — current mockups are desktop-first + +--- + +## Original design rationale (Option A) + +Below is the original "Bridge / Control Room" rationale, kept for reference. + +### Direction: "Bridge / Control Room" + +The product is literally a **signal operator's console** — it listens for events on one side (Immich, Gitea, RSS, GitHub, …) and dispatches them to channels on the other (Telegram, Matrix, Email, ntfy, …). The current UI hides that fact behind generic SaaS-dashboard chrome (teal accent, dot-grid bg, card-with-glow). The redesign leans hard into what the product *is*. + +References that were in the room while designing this: + +- **Bloomberg Terminal** — dense numerical clarity, monospace numerals, ticker bars +- **Linear / Vercel** — restraint, hairline rules, type-as-interface +- **Editorial print** (Bloomberg Businessweek, Fast Company) — italic display serif as a counterpoint to mono data +- **Broadcast control rooms** — pulsing live indicators, "ON AIR" markers, scanline atmosphere +- **Phosphor monitors** — the signature lime accent, not the third teal-purple SaaS template + +--- + +## Design language + +| Token | Choice | Why | +| --- | --- | --- | +| **Display** | Fraunces (variable, italic-capable serif) | Editorial gravitas; italic em-tags inside headlines feel printed, not pasted | +| **Body** | Instrument Sans | Modern, neutral, slightly geometric — pairs well with a serif without fighting it | +| **Data** | JetBrains Mono | Tabular numerals everywhere stats appear | +| **Primary accent** | `#d4ff3a` phosphor lime | Distinctive — far from the SaaS teal/purple gravity well; reads as "signal" | +| **Secondary signal** | warm coral, calm blue, amber warn, rose error | Used sparingly; one per event class | +| **Surfaces** | Deep ink `#07080b` → `#161a25` | High-contrast console feel; light theme inverts to "broadsheet" cream | +| **Hairlines** | 1px borders everywhere instead of shadows | Editorial precision; cards sit *in* the page, not floating over it | +| **Scanlines + vignette** | Faint overlay | Console atmosphere without crossing into kitsch | + +--- + +## What's actually new (UX, not just paint) + +The mockup isn't just a re-skin — these are concrete proposed additions: + +1. **"On Air" ticker bar** — a always-running marquee of the last 6–10 events at the very top. Pauses on hover. Keeps you peripherally aware of activity without forcing you to look at the dashboard. +2. **Stats with sparklines** — every counter shows a 24h trend inline. Numbers without context are useless. +3. **Editorial hero** — the title is a *sentence about the current state*, not a label. "Tonight, *everything* is flowing" with live numbers in the body. This is opinionated and might feel too much for some — easy to swap to a label-style header. +4. **Signal stream** — replaces the existing event timeline. Adds the **routing trail** for each event (Tracker → Target → Template) so you can see at a glance where a signal went, not just *that* it happened. This is the killer feature; right now you have to click through three pages to trace one event. +5. **"On watch" provider deck** — replaces the silent provider list with throughput-per-provider, last-seen, pulse status. Click-to-trace. +6. **7-day pulse heatmap** — finally answers "when is this thing busiest?". Useful for planning maintenance windows. +7. **Active wires panel** — Sankey-style "Source → Channel" route summary with throughput counts. Makes the *bridge* visible. +8. **Compose band** — bottom of dashboard. A single CTA to start a new tracker with a 4-step wizard (provider → tracker → template → target), or paste a webhook URL and let the system infer. +9. **Live clock + uptime** — pinned in the ticker. Operators know what time it is and how stable they've been. +10. **Two-theme system** — Console (dark, default for most operators) + Broadsheet (light, warm cream, deep ink). Skips the generic "system theme" three-way; commits to two beautiful options instead of three mediocre ones. + +--- + +## Things to push back on + +These are choices I'd specifically want feedback on before implementing: + +- **Phosphor lime as primary** — it's bold and very on-brand for "signal," but it's far from the current teal. Worth knowing if you have any brand attachment to teal. +- **Italic Fraunces inside headlines** — distinctive, but could feel "too magazine" for a self-hosted ops tool. Easy to swap for plain Fraunces or even drop the serif entirely and lean fully on Instrument Sans + JetBrains Mono. +- **Editorial sentence-style headers** vs. label-style headers — same trade-off as above. +- **Hairline borders instead of cards-on-cards** — current UI uses elevated cards with glow shadows. The redesign uses flat sectioned modules with 1px rules. Read denser, less "soft." +- **Sidebar grouping** — I collapsed the current 6-group nav into 3 sections (Overview / Routing / Operators). Some of your nested groups (notification-trackers vs command-trackers) merge into a single "Trackers" entry; click-through reveals tabs. Reduces vertical noise but loses one click of directness. +- **No emoji / no MDI icon backgrounds** — the current UI uses lots of `mdi*` icon chips. The redesign uses thin custom SVG strokes. Cohesive but more work to maintain (would suggest a curated icon set rather than the full MDI library). + +--- + +## What's NOT in this mockup yet + +If the direction lands, these are the next surfaces to design before any implementation: + +- **Tracker detail page** — single-tracker timeline + config editor + live preview +- **Template editor** — code-editor surface with the Jinja2 sandbox preview side-by-side +- **Provider list / detail** — currently a grid of cards; would become a tabular operator's list +- **Target detail** — channel inbox view with delivery history per target +- **Bot console** — Telegram/Matrix/Email bots get a chat-style interaction log +- **Setup wizard** — first-run experience matching the same aesthetic +- **Mobile** — current mockup is desktop-only; the design language needs a mobile-first pass before shipping + +--- + +## Implementation notes (if approved) + +- Migration is mostly a **CSS token swap** plus selective component refactors. The Svelte 5 architecture and `$state` cache system don't need to change. +- New fonts: add `@fontsource-variable/fraunces` and `@fontsource-variable/instrument-sans`. Drop `dm-sans`. +- Replace `app.css` `@theme` block with the new token set. +- The ticker, sparklines, heatmap, and routes panel are all net-new components — budget those separately. +- Custom SVG icon set: pick ~30 icons we actually use, ship them as a single sprite. Drop the runtime MDI lookup. + +Estimate to first-shippable: **2–3 focused weeks** (one designer-pair sprint) to land dashboard + provider list + tracker detail with the new language. Rest of pages can roll over the following month without breaking the old screens. diff --git a/design-mockups/aurora-tracker.html b/design-mockups/aurora-tracker.html new file mode 100644 index 0000000..87cdc21 --- /dev/null +++ b/design-mockups/aurora-tracker.html @@ -0,0 +1,1459 @@ + + + + + +Aurora — Tracker · family-photos + + + + + + +
+ +
+ + +
+ +
+ + + + + +
+ + +
+
+ Signal + / + Trackers + / + family-photos +
+ + +
+ + +
+
+
+
+ + Immich · photos.dolgolyov.dev +
+

family-photoslive

+

+ Watches three albums («Семейный 2025», «Прага 24», «Лето на даче») for added or removed assets, + collection renames, and shared-link changes. Currently routing 1 942 events across the last 24 hours + into three targets. +

+
+
+
+
+ Armed +
+ + +
+
+ + +
+
+
+ +
+
Provider
+
Immich
+
8 trackers
+
+
+ +
+
+ +
+
Tracker
+
family-photos
+
5 events armed
+
+
+ +
+
+ +
+
Templates
+
5 Jinja2
+
en + ru
+
+
+ +
+
+ +
+
Targets
+
3 channels
+
tg · matrix · email
+
+
+
+ + +
+ + +
+
+ + + + +
+ +
+
+
+

Watch configuration

+
What this tracker listens for, and where to find it
+
+
+ +
+ + +
Used internally for routing and event logs.
+
+ +
+
+ + +
+
+ + +
+
+ +
+ +
+ + + + + Семейный 2025 + + + + + + + Прага 24 + + + + + + + Лето на даче + + + + + Add album + +
+
+ +
+ +
+ + + + + + + + + + + +
+
+ +
+
+ + +
Hold notifications until N items collected.
+
+
+ + +
Group events within this window into one message.
+
+
+
+ +
+
+ + Unsaved changes — 2 fields modified +
+
+ + +
+
+
+ + +
+ + +
+
+
+

Live preview

+
Rendered with sample data — assets_added.ru
+
+ +
+ +
+
+
+
+ +
+
+
Notify Bridge
+
@notifybridge_bot · @family
+
+
02:14
+
+
+ 📸 14 новых фото в «Семейный 2025»
+ Прага · 13 апреля · добавил alexei
+ Смотреть в Immich → +
+
+
+
+
+
+
+
+
+ +
+
+
+ + +
+
+
+

Recent events

+
For this tracker only · last 24h
+
+
14events
+
+ +
+
+
+ +
+
+
Added 14 assets
+
to Семейный 2025
+
+
02:14just now
+
+ +
+
+ +
+
+
Added 3 assets
+
to Лето на даче
+
+
01:4826m ago
+
+ +
+
+ +
+
+
Shared link expired
+
for Прага 24
+
+
00:222h ago
+
+ +
+
+ +
+
+
Renamed «Прага 2024» → «Прага 24»
+
at photos.dolgolyov.dev
+
+
Apr 241d ago
+
+ +
+
+ +
+
+
Memory dispatched «Один год назад»
+
6 photos · Apr 24, 2025
+
+
Apr 241d ago
+
+
+
+ +
+
+
+
+ + + + diff --git a/design-mockups/dashboard-aurora.html b/design-mockups/dashboard-aurora.html new file mode 100644 index 0000000..a3789b9 --- /dev/null +++ b/design-mockups/dashboard-aurora.html @@ -0,0 +1,1410 @@ + + + + + +Notify Bridge — Aurora + + + + + + +
+ +
+ + +
+ +
+ + + + + +
+ + +
+ + + + +
+ + +
+
+
+
+ Control·Live +
+

Tonight, everything
is flowing.

+

+ Four providers are listening, twelve trackers are armed, and the bridge has dispatched + 2 814 messages across nineteen targets in the last 24 hours. + Nothing is queued. Nothing is failing. +

+
+
+
throughput · 24h
+
2 814msgs
+
+ 99.7% delivered + 148ms p50 +
+
+
+
+ + +
+
+
+
+ +
+ +1 wk +
+
04
+
Providers · Immich, Gitea, GitHub, RSS
+
+ +
+
+
+ +
+ +3 24h +
+
12/14
+
Trackers armed · 2 paused awaiting credentials
+
+ +
+
+
+ +
+ +2 wk +
+
19
+
Targets · 5 channels · TG, Matrix, Mail, ntfy, Discord
+
+ +
+
+
+ +
+ −4 wk +
+
02
+
Failures · auto-recovered on Fastmail SMTP
+
+
+ + +
+ + +
+
+

Signal stream

+
+
+ + + + +
+
+
+ +
+
+
+ +
+
+
Immich added 14 assets to «Семейный 2025»
+
+ family-photos + @family · telegram + assets_added.ru +
+
+
02:14just now
+
+ +
+
+ +
+
+
Gitea pushed 3 commits to notify-bridge/main
+
+ repo-changes + #dev-room · matrix +
+
+
02:1317s ago
+
+ +
+
+ +
+
+
Telegram bot received /recent from @alex
+
+ @notifybridge_bot + resolved 5 · 142ms +
+
+
02:1336s ago
+
+ +
+
+ +
+
+
Immich shared link expired on «Прага 24»
+
+ link-watch + photos@dolgolyov.dev · email +
+
+
02:121m ago
+
+ +
+
+ +
+
+
Email · SMTP retry on smtp.fastmail.com
+
+ backoff 2.4s + delivered on attempt 2/3 +
+
+
02:113m ago
+
+ +
+
+ +
+
+
Action memory_dispatch ran for «Один год назад»
+
+ 6 recipients + 2 telegram · 3 matrix · 1 ntfy +
+
+
02:094m ago
+
+
+
+ + +
+
+

On watch

+
04providers
+
+
+
+
+ +
+
+
Immich
+
photos.dolgolyov.dev · 8 trackers
+
+
+
1 942
+
+
+
+ +
+
+ +
+
+
Gitea
+
git.dolgolyov-family.by · 2 trackers
+
+
+
368
+
+
+
+ +
+
+ +
+
+
GitHub
+
anthropics/claude-code · 1 tracker
+
+
+
88
+
+
+
+ +
+
+ +
+
+
RSS · 7 feeds
+
last seen 14m ago · idle
+
+
+
416
+
+
+
+ +
+
+ +
+
+
Add provider
+
9 integrations available
+
+
+
+
+
+ + +
+
+
+

Pulse · last seven days

+
+
+ + + +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + Sun 21:00 · 312/h + +
+ Assets · 1 942 + Commands · 488 + Sharing · 312 +
+
+
+ +
+
+

Active wires

+
09routes
+
+
+
+
+ +
+
Immich · family
+
family-photos
+
+
+
1 942
+
+
+
@family
+
telegram · group
+
+ +
+
+ +
+
+ +
+
Gitea · main
+
repo-changes
+
+
+
368
+
+
+
#dev-room
+
matrix
+
+ +
+
+ +
+
+ +
+
Immich · share-watch
+
link-watch
+
+
+
312
+
+
+
photos@dolgolyov.dev
+
email
+
+ +
+
+ +
+
+ +
+
RSS · Hacker News
+
daily-digest
+
+
+
88
+
+
+
notify · ntfy.sh
+
personal
+
+ +
+
+
+
+
+ + +
+
+

Pick a source. Choose a channel. Compose the wire.

+

+ The composer walks you from provider → tracker → template → target in four steps, + with live preview at every stage. Or paste a webhook URL and we'll infer the rest. +

+
+
+ + +
+
+ +
Notify Bridge · v0.5.2 · build 770c198
+
+
+ + + + diff --git a/design-mockups/dashboard-bento.html b/design-mockups/dashboard-bento.html new file mode 100644 index 0000000..4728348 --- /dev/null +++ b/design-mockups/dashboard-bento.html @@ -0,0 +1,1160 @@ + + + + + +Notify Bridge — Bento + + + + + + + +
+ + +
+ +
+ + + + + +
+ + +
+
Control · Signal overview
+
+ + + +
+ + +
+
+
+
Live · all systems nominal
+

Tonight, everything
is flowing.

+

+ Four providers are listening, twelve trackers are armed, and the bridge has dispatched + 2 814 messages across nineteen targets in the last 24 hours. +

+
+
+
throughput · 24h
+
2 814
+
+ 99.7% delivered + 148ms p50 +
+
+
+
+ + +
+ + +
+
+ Providers + +1 +
+
04
+
Immich · Gitea · GitHub · RSS
+
+ +
+
+ Trackers armed + +3 24h +
+
12/14
+
2 paused awaiting credentials
+
+ +
+
+ Targets + +2 wk +
+
19
+
5 channels · TG · Matrix · Mail · ntfy · Discord
+
+ +
+
+ Failures · 24h + −4 +
+
02
+
Auto-recovered · SMTP backoff
+
+ + + +
+
+

Signal stream 2 814 events / 24h

+
+ + + + +
+
+
+ +
+
+ +
+
+
Immich added 14 assets to «Семейный 2025»
+
family-photos@family · telegramassets_added.ru
+
+
02:14just now
+
+ +
+
+ +
+
+
Gitea pushed 3 commits to notify-bridge/main
+
repo-changes#dev-room · matrix
+
+
02:1317s ago
+
+ +
+
+ +
+
+
Telegram bot received /recent from @alex
+
@notifybridge_botresolved 5 · 142ms
+
+
02:1336s ago
+
+ +
+
+ +
+
+
Immich shared link expired on «Прага 24»
+
link-watchphotos@dolgolyov.dev · email
+
+
02:121m ago
+
+ +
+
+ +
+
+
Email · SMTP retry on smtp.fastmail.com
+
backoff 2.4sdelivered on attempt 2/3
+
+
02:113m ago
+
+ +
+
+ +
+
+
Action memory_dispatch ran for «Один год назад»
+
6 recipients2 telegram · 3 matrix · 1 ntfy
+
+
02:094m ago
+
+
+
+ + +
+
+ Top provider +
+ +
+
+
Immich
+
photos.dolgolyov.dev · 8 trackers
+
1 942events 24h
+
+ +
+
+ Provider +
+ +
+
+
Gitea
+
git.dolgolyov-family.by
+
36824h
+
+ +
+
+ RSS +
+
7 feeds
+
idle 14m
+
416
+
+ + + +
+
+ Pulse · 7 days +
+ + + +
+
+ + + + + + + + + + + + + + + + + + Sun 21:00 · 312/h + +
+ Assets · 1 942 + Commands · 488 + Sharing · 312 +
+
+ + +
+
+ Health +
+ +
+
+
+
Uptime14d 06h
+
Queue000
+
DBOK
+
SMTPOK
+
WebOK
+
+
+ + +
+
+ Channels live +
+ +
+
+
+
+ + Telegram 9 +
+
+ + Matrix 4 +
+
+ + Email 3 +
+
+ + ntfy 2 +
+
+ + Discord 1 +
+
+ + Add +
+
+
+ + +
+
+

Pick a source. Choose a channel. Compose the wire.

+

+ The composer walks you from provider → tracker → template → target in four steps, + with live preview at every stage. Or paste a webhook URL and we'll infer the rest. +

+
+
+ + +
+
+ +
+
+
+ + + + diff --git a/design-mockups/dashboard.html b/design-mockups/dashboard.html new file mode 100644 index 0000000..2e68aa9 --- /dev/null +++ b/design-mockups/dashboard.html @@ -0,0 +1,1555 @@ + + + + + +Notify Bridge — Control + + + + + + + + +
+ + +
+ +
+ + + + + +
+ + +
+
On Air
+
+
+ 02:14:08 Immich · «Семейный 2025» · 14 assets added → telegram @family + 02:13:51 Gitea · push to notify-bridge/main → matrix #dev-room + 02:13:32 Telegram · cmd /recent by @alex + 02:12:55 Immich · shared link expired on «Прага 24» + 02:11:09 Email · SMTP retry on smtp.fastmail.com + 02:09:44 Action · memory_dispatch · 6 recipients + + 02:14:08 Immich · «Семейный 2025» · 14 assets added → telegram @family + 02:13:51 Gitea · push to notify-bridge/main → matrix #dev-room + 02:13:32 Telegram · cmd /recent by @alex + 02:12:55 Immich · shared link expired on «Прага 24» + 02:11:09 Email · SMTP retry on smtp.fastmail.com + 02:09:44 Action · memory_dispatch · 6 recipients +
+
+
+ UTC --:--:-- + UPTIME 14d 06h +
+
+ + +
+ + +
+
+
+ System/Control/ + Live +
+

Tonight, everything is flowing.

+

+ Four providers are listening, twelve trackers are armed, and the bridge has dispatched + 2 814 messages across nineteen targets in the last 24 hours. + Nothing is queued. Nothing is failing. +

+
+
+
throughput · 24h
+
2 814msgs
+
+ 99.7% delivered + 148ms p50 +
+
+
+ + +
+
+
Providers+1 wk
+
04
+
+
Immich, Gitea, GitHub, RSS — all connected.
+ + + + +
+
+
+
Trackers · armed+3 24h
+
12 / 14
+
+
Two paused awaiting credentials.
+ + + + +
+
+
+
Targets · channels+2 wk
+
19
+
+
Telegram, Matrix, Email, ntfy, Discord.
+ + + + +
+
+
+
Failures · 24h−4 wk
+
02
+
+
SMTP retry on Fastmail; auto-recovered.
+ + + + +
+
+
+ + +
+ + +
+
+

Signal stream

+
2 814events / 24h
+
+
+ + + + + +
+
+
+
02:14:08just now
+
+
+
+ Immich added 14 assets to «Семейный 2025» + live +
+
+ Tracker family-photos + Target @family · telegram + Template assets_added.ru +
+
+
14assets
+
+ +
+
02:13:5117s ago
+
+
+
+ Gitea pushed 3 commits to notify-bridge/main + push +
+
+ Tracker repo-changes + Target #dev-room · matrix +
+
+
03commits
+
+ +
+
02:13:3236s ago
+
+
+
+ Telegram bot received /recent from @alex + command +
+
+ Bot @notifybridge_bot + Resolved 5 recent · 142ms +
+
+
05items
+
+ +
+
02:12:551m ago
+
+
+
+ Immich shared link expired on «Прага 24» + sharing +
+
+ Tracker link-watch + Target photos@dolgolyov.dev · email +
+
+
01link
+
+ +
+
02:11:093m ago
+
+
+
+ Email · SMTP retry on smtp.fastmail.com + retry · resolved +
+
+ Backoff 2.4s + Delivered on attempt 2 of 3 +
+
+
2.4sretry
+
+ +
+
02:09:444m ago
+
+
+
+ Action memory_dispatch ran for «Один год назад» + scheduled +
+
+ 6 recipients reached · 2 telegram · 3 matrix · 1 ntfy +
+
+
06sent
+
+
+
+ + +
+
+

On watch

+
04providers
+
+
+
+
+ +
+
+
Immich
+
photos.dolgolyov.dev · 8 trackers
+
+
1942events 24h
+
+ +
+
+ +
+
+
Gitea
+
git.dolgolyov-family.by · 2 trackers
+
+
368events 24h
+
+ +
+
+ +
+
+
GitHub
+
anthropics/claude-code · 1 tracker
+
+
088events 24h
+
+ +
+
+ +
+
+
RSS · 7 feeds
+
last seen 14m ago · idle
+
+
416events 24h
+
+ +
+
+ +
+
+
Add provider…
+
9 integrations available
+
+
Webhook · API
+
+
+
+
+ + +
+ + +
+
+

Pulse · last seven days

+
UTC · grouped by hour
+
+
+
+ 00020406 + 08101214 + 16182022 +
+
+ Low + + + + + + + + + High · 312/h peak (Sun 21:00) +
+
+ + +
+
+

Active wires

+
09routes
+
+
+
+ +
Immich · familytracker · family-photos
+
+
→ 1 942
+
+
@familytelegram · group
+ +
+
+
+
+ +
Gitea · maintracker · repo-changes
+
+
→ 0 368
+
+
#dev-roommatrix · dev
+ +
+
+
+
+ +
Immich · share-watchtracker · link-watch
+
+
→ 0 312
+
+
photos@dolgolyov.devemail · transactional
+ +
+
+
+
+ +
RSS · Hacker Newstracker · daily-digest
+
+
→ 0 088
+
+
notify · ntfy.shpush · personal
+ +
+
+
+
+ + +
+
+
Bridge a new signal
+

Pick a source. Choose a channel. Compose the wire.

+

+ The composer walks you from provider → tracker → template → target in four steps, + with live preview at every stage. Or paste a webhook URL and we'll infer the rest. +

+
+
+ + +
+
+ + +
+ Notify Bridge · Operator console · v0.5.2 + build 770c198 · UTC --:-- +
+
+
+
+ + + + diff --git a/design-mockups/index.html b/design-mockups/index.html new file mode 100644 index 0000000..300fd9f --- /dev/null +++ b/design-mockups/index.html @@ -0,0 +1,565 @@ + + + + + +Notify Bridge — Redesign Options + + + + + + +
+ +
+
+ Notify Bridge + Redesign · 3 directions +
+
+ Drafted Apr 25, 2026
+ For review · pick one +
+
+ +
+

Three directions, one product.

+

+ Each option is a real, working dashboard you can open and click around. They share the same data, + the same product, and the same set of UX ideas — but commit to different aesthetic universes. + Open any, then come back here to compare. +

+

+ Decided · Aurora. + Ongoing surfaces in the chosen language: + Tracker detail → +

+
+ +
+ + +
+ ● ON AIR + 2 814 +
Tonight,
everything is flowing.
+
+
+ 02:14 · IMMICH · 14 ASSETS → @FAMILY +
+
+
+
Option A existing
+

Bridge · Control Room

+

+ Editorial broadcast-console. Phosphor-lime accents on deep ink, hairline rules, + monospace numerals, italic Fraunces serif against JetBrains Mono. Atmospheric scanlines, + live ticker bar. Built for operators who want density and signal-room energy. +

+
+ phosphor-lime + Fraunces + hairlines + dense +
+
+ Open mockup + +
+
+
+ + +
+
+ Live · all systems nominal +
Tonight,
everything flows.
+
+ 2 814 sent + 99.7% ok +
+
+
+
+
Option B new
+

Aurora · Glass

+

+ Vivid aurora gradient base, frosted-glass panels, soft pastel accents — lavender, orchid, + mint, coral. Newsreader serif headlines with gradient italics. Premium, modern, visionOS / + Stripe-modern. Rounded, breathable, animated. +

+
+ aurora gradient + frosted glass + Newsreader + premium +
+
+ Open mockup + +
+
+
+ + +
+
+ Top provider +
+
1942
+
Immich · 8 trackers
+
+
+
+ Trackers +
12/14
+
+
+ Targets +
19
+
+
+ Failures +
02
+
+
+ Live +
+
+
+
+
Option C new
+

Bento · Modular

+

+ Mixed-size colorful tiles in a tight grid. Each module commits to one role and one bold color + — violet, mint, coral, honey, cobalt. Manrope sans + JetBrains Mono. Apple Keynote / Linear + blog energy. Playful but disciplined. Ships with day + night. +

+
+ bento grid + bold color + Manrope + playful +
+
+ Open mockup + +
+
+
+ +
+ +
+

Side by side

+ + + + + + + + + + + + + + + + + + + + +
TraitA · BridgeB · AuroraC · Bento
MoodEditorial / operatorPremium / atmosphericPlayful / confident
Default themeDark (Console)Dark (Aurora)Light (Daylight)
AccentPhosphor lime #d4ff3aLavender + orchid + mintViolet · mint · coral · honey
SurfaceHairline-rule modulesFrosted-glass panelsSolid-color tiles
Display fontFraunces (variable serif)Newsreader (variable serif)Manrope (geometric sans)
Data fontJetBrains MonoGeist MonoJetBrains Mono
DensityHigh · for power usersMedium · breathableMedium · airy
RiskNiche taste · heavy moodTrendy glass may dateColor discipline matters
Best forPro operators · self-hostersShowroom · public-facingMainstream · cross-audience
+
+ +
Notify Bridge · v0.5.2 · drafted by Claude
+
+ +