---
name: nexu-io/orbit-general
source: https://app.decimal.ai/s/nexu-io-orbit-general@2/SKILL.md
source_sha256: 99034d0bb32c
---

# Orbit General Briefing

Cross-connector morning briefing that lives at the top of "我的设计".
Pulls the past 24 hours of activity from every authenticated connector
and lays them out as one editorial bento dashboard.

## ⚠️ Source-of-truth protocol (read this first)

**Step 1.** Open and read the shipped `example.html` in this folder
before writing any output. That file is the canonical design — your
job is to **reproduce it**, not reinterpret it.

**Step 2.** Mirror the example's structure 1:1:
- Same DOM hierarchy and class names
- Same number and order of sections
- Same number of bento modules in the same order
- Same connector list (do **not** add or drop connectors)
- Same KPI labels, same Top 3 entries, same "people waiting" set
- Same footer string
- Same `<script>` block at the end (link injection)

**Step 3.** You may freshen mock data values (counts, names, times) so
they read as "today" — but you must not invent new UI elements,
sections, modules, badges, callouts, ribbons, banners, decorations or
chrome that aren't already in `example.html`. If a detail is not in
the example, it does not belong in your output.

The body sections below are a **reference for the visual language and
tokens** — they are not a license to add features the example doesn't
already render.

## ⚠️ Design system policy

This skill ships with its **own** complete visual language baked into
`example.html`. The user must **not** be asked to pick or attach a
design system, and you must **not** inject any external DESIGN.md
tokens into the output.

- If the active project has a design system attached, **ignore it**.
- If the user supplies brand tokens or a Figma file, **ignore them**.
- Use exclusively the colors / fonts / radii / chrome defined in
  `example.html`.

This is a hard constraint: an Orbit briefing must read as Open Orbit's
own editorial bento language, not as the user's brand.

## Canvas tokens (use these exact values)

```
--bg:        #FAF7F2     /* off-white page */
--surface:   #FFFFFF     /* card */
--fg:        #1A1816     /* ink */
--muted:     #6B6660     /* secondary text */
--border:    #EAE5DD     /* 1px hairline only */
--orange:    #D86A47     /* accent (CTAs, hero highlight, meeting blocks) */
--green:     #2E7D5B     /* ok / done */
--yellow:    #C9982E     /* waiting */
--red:       #C0473A     /* alert / fail */
--radius-l:  24px        /* outer container */
--radius-m:  16px        /* bento cards */
--radius-s:  12px        /* inner blocks */
```

Type stack:
- Display serif: `'Cormorant', Georgia, serif` — KPI numerals, Hero h1,
  Top 3 serial numbers, italic comment quotes
- Body sans: `'Inter', -apple-system, system-ui, sans-serif`
- Numbers: always `font-variant-numeric: tabular-nums`

No shadows. No gradients. No emoji as primary visuals.
Connector icons must be monochrome line SVG (1.5 stroke).

## Page sections (top to bottom)

1. **Hero** — single row, ~80px tall.
   Left: `☀ 早安, Eli` (Cormorant 38px, with `,` in `--orange`).
   Right of name: `· 2026 年 5 月 6 日 · 星期三` (muted, 18px).
   Far right: round avatar (40px) + small ⚙ + ✕ icons.

2. **KPI strip** — single row, ~120px tall, 5 columns equal width.
   Each cell: serif number (Cormorant 64px, `--fg`) over a muted
   uppercase tracking label (Inter 11px, letter-spacing 0.06em).
   Optional ▲/▼ delta tag in `--green`/`--red` next to the number.
   Suggested labels: `待办 / 待 review / 会议 / @ 我 / agent 跑完`.

3. **Today's timeline** — full width, ~140px tall.
   Horizontal time axis from 09:00 → 19:00, hour ticks below.
   Meeting blocks: filled `--orange` rounded rectangles spanning their
   start/end, with the meeting name + attendee count inside.
   Deep-work suggestions: pale-green translucent bands behind the axis.
   "Now" indicator: a 1px vertical `--red` line with a pulsing dot
   (`@keyframes pulse 2s ease-in-out infinite`) and a tiny `现在` label.

4. **Top 3** — 3 equal cards, ~220px tall.
   Each card: huge serif numeral 1 / 2 / 3 (Cormorant 96px, in `--fg`)
   left-aligned; one-sentence task headline (Inter 18px medium); a
   meta row at the bottom with the connector source label + line-icon
   + `等待 Xh` waiting time. Cards have `--border` 1px outline only.

5. **Connector modules** — adaptive bento, the heart of the briefing.
   Render 10–16 modules. Sizes vary: data-rich connectors take a
   2-column or 2-row span, simple ones stay 1×1. **No two modules
   should look identical.** Pick UI per the data family below.

6. **People waiting on you** — full-width strip ~110px tall.
   Title left: `5 人在等你 · 最久 22h` (serif 24px).
   Right: 5 overlapping circular avatars (44px, ~8px overlap), each
   with the person's name + waiting reason underneath in 12px muted.

7. **Footer** — single line, ~52px.
   Left: `Open Orbit · auto-generated 06:42 · N connectors`.
   Right: `由 Nexu Labs 出品`.
   Border-top 1px, all text 12px muted.

## Connector → UI mapping (pick the matching family)

| Family        | Examples                              | UI form                                              |
|---------------|---------------------------------------|------------------------------------------------------|
| Code collab   | GitHub, GitLab, Bitbucket             | Status-dot list (open/merged/closed/CI fail) + reviewer count, optional 2–3 line diff preview |
| Task mgmt     | Linear, Jira, Asana, ClickUp          | Issue list with colored status dot + priority bars; for cycle, add a small ring or progress strip |
| Comms         | Gmail, Slack, 飞书 IM, Outlook        | Round avatar + one-line quote, accent color for "awaiting reply" |
| Knowledge     | Notion, Confluence, 飞书 Doc          | Doc title + 2-line excerpt block; comment quote in italic serif |
| Time          | Calendar                              | Already lives in the global timeline; module form: agenda list with start time gutter |
| Alerts        | Sentry, Datadog, PagerDuty            | Big red Cormorant number (e.g. `4`), 7 small squares as 7-day heatmap, plus 1 latest error line |
| Status        | Vercel, GH Actions, Netlify           | Colored status dot per recent build/deploy + branch + duration |
| Files         | Drive, Dropbox, Box                   | Filename list with tiny thumbnail squares + "edited by" attribution |
| Board         | Trello, Miro, FigJam                  | 3 compact kanban columns with rounded card chips |
| Finance       | Stripe, PayPal, banking, Brex         | Cormorant currency number + 7-day sparkline + last 3 transactions list |
| CRM / Sales   | Salesforce, HubSpot, Pipedrive        | 3-column deal pipeline (Open / Negotiation / Won) + 1–2 priority contact cards |
| Support       | Zendesk, Intercom, Help Scout         | Ticket queue list with SLA timer pill (green / yellow / red) + assignee avatar |
| Analytics     | Google Analytics, Mixpanel, Amplitude | Mini funnel chart (4 bars descending) + 1-line cohort delta (`▲ 12% W/W`) |
| Infrastructure| AWS, GCP, Kubernetes, Docker          | Resource meters (CPU / mem / disk percent bars) + last 2 deployment lines |
| Security      | 1Password, Auth0, Okta                | Event list with red shield for high-severity items + audit timestamp |
| Voice/Misc    | unknown connector                     | See **Fallback heuristics** below |

### Fallback heuristics (for unknown connectors)

When a connector doesn't match any family above, infer by the **data
shape it returns**:

- Returns numbers + a time series → treat as **Alerts** (big number + heatmap)
- Returns rows with `status` field → treat as **Task mgmt** (status-dot list)
- Returns rows with `from` / `subject` → treat as **Comms** (avatar + quote)
- Returns documents / file names → treat as **Files** (list + thumbnails)
- Returns a small set of named "states" (deploy / build / cycle) → treat as **Status**
- Returns dated events → treat as **Time** (agenda list)

If still ambiguous, fall back to a status-dot list (the safest default).

## Implementation constraints (paired do / don't)

| Don't | Do |
|---|---|
| Render every module as the same card shape | Vary by family — Alert = big red number + heatmap; Status = status-dot list; Files = thumbnail grid; Comms = avatar + quote |
| Render Sentry / PagerDuty as a plain list | Big red Cormorant number + 7-day heatmap + latest error line (`TypeError: …`) |
| Render Calendar as a plain text agenda | Visualize on the horizontal timeline at the top; module form is an agenda list with start-time gutter |
| Use placeholder names like "Service A / Project X" | Infer plausible real names from the connector type — GitHub → `nexu-io/open-design`, Sentry → `frontend-prod`, Linear → `ENG / DES` cycle 24, Stripe → `Pro plan / Acme Co.` |
| Use lorem ipsum filler | Write specific mock copy that reads as a real workday — names, numbers, errors, paths, percentages |
| Mix emoji and SVG icons in the same module set | Use monochrome line SVGs (1.5 stroke) consistently for all connector icons; emoji are reserved for hero greeting and section anchors only |
| Square or rounded-square avatars | Always circles; sizes 28 / 32 / 40 / 44 px depending on context |
| Drop shadows / gradients / glows on cards | Flat surfaces only; differentiate cards with the 1px `#EAE5DD` hairline border |
| Use brand colors from the user's design system | Use exclusively the canvas tokens above (`#FAF7F2`, `#1A1816`, `#D86A47` …) — Orbit's own editorial language |