From e925c3df3c78c072c4c7e5163c76f14ac8206834 Mon Sep 17 00:00:00 2001 From: Lily Shen <115414357+lilyshen0722@users.noreply.github.com> Date: Sun, 1 Nov 2026 02:38:16 -0800 Subject: [PATCH] docs(design): d215 empty and error states on drawn pages (TASK-757) Empty pod list, empty board, board load error, agent with no memory, agent not found, and a drawn 404 (live silently redirects to /v2). 1440 and 390, light and dark; targets 56 -> 68. Co-Authored-By: Claude Sonnet 5.5 Co-authored-by: ux-lead Agent-Model: claude/claude-opus-5-5/high --- .../artboards/d215/cap/measure_after.js | 2 +- .../artboards/d215/cap/measure_after.test.js | 4 +- docs/design/artboards/d215/index.html | 70 ++++++++++++++++++- docs/design/artboards/d215/targets.json | 48 +++++++++++++ 4 files changed, 120 insertions(+), 4 deletions(-) diff --git a/docs/design/artboards/d215/cap/measure_after.js b/docs/design/artboards/d215/cap/measure_after.js index 5adaf4e76e..925d523487 100644 --- a/docs/design/artboards/d215/cap/measure_after.js +++ b/docs/design/artboards/d215/cap/measure_after.js @@ -18,7 +18,7 @@ const fs = require('fs'); const HERE = __dirname; const TARGETS = path.join(HERE, '..', 'targets.json'); -const SURFACES = ['settings', 'agent-settings', 'agent-memory', 'board', 'connectors', 'chat', 'sidebar', 'byo', 'byo-handoff', 'firstrun-welcome', 'firstrun-waiting', 'firstrun-connected', 'firstrun-error', 'activity-queue', 'activity-empty', 'activity-error', 'profile-person', 'profile-empty', 'profile-error', 'taskrecord-log', 'taskrecord-empty', 'taskrecord-error', 'runtrace-done', 'runtrace-live', 'runtrace-error', 'artifacts-list', 'artifacts-empty', 'artifacts-error']; +const SURFACES = ['settings', 'agent-settings', 'agent-memory', 'board', 'connectors', 'chat', 'sidebar', 'byo', 'byo-handoff', 'firstrun-welcome', 'firstrun-waiting', 'firstrun-connected', 'firstrun-error', 'activity-queue', 'activity-empty', 'activity-error', 'profile-person', 'profile-empty', 'profile-error', 'taskrecord-log', 'taskrecord-empty', 'taskrecord-error', 'runtrace-done', 'runtrace-live', 'runtrace-error', 'artifacts-list', 'artifacts-empty', 'artifacts-error', 'empty-pods', 'empty-board', 'board-error', 'empty-memory', 'agent-notfound', 'page-notfound']; // byo-handoff is drawn but can't be captured on prod: reaching it issues a real key. The first-run // dialog is a latch-gated overlay, and the Scout welcome only exists in a brand-new pod, so neither is measured on prod. const PROD_SURFACES = SURFACES.filter(s => s !== 'byo-handoff' && !s.startsWith('firstrun-')); diff --git a/docs/design/artboards/d215/cap/measure_after.test.js b/docs/design/artboards/d215/cap/measure_after.test.js index 98c37f259a..f6e6db49f9 100644 --- a/docs/design/artboards/d215/cap/measure_after.test.js +++ b/docs/design/artboards/d215/cap/measure_after.test.js @@ -29,7 +29,7 @@ test('--only with an unknown surface throws', () => { test('the committed targets.json passes its own validation', () => { const t = JSON.parse(fs.readFileSync(path.join(__dirname, '..', 'targets.json'), 'utf8')); - assert.strictEqual(Object.keys(t).length, 56); + assert.strictEqual(Object.keys(t).length, 68); validateTargets(t); }); @@ -39,7 +39,7 @@ test('an empty or partial measurement is refused', () => { const partial = { ...t }; delete partial['board-390']; assert.throws(() => validateTargets(partial), /missing board-390/); assert.throws(() => validateTargets({ ...t, 'chat-1440': { helperWords: NaN, innerRatio: 2 } }), /invalid chat-1440/); - assert.strictEqual(EXPECTED.length, 56); + assert.strictEqual(EXPECTED.length, 68); }); // A page whose SPA shell answers 200 and then redirects to `landsOn`. Its metrics would score diff --git a/docs/design/artboards/d215/index.html b/docs/design/artboards/d215/index.html index 9d3179cb4a..6b450b9855 100644 --- a/docs/design/artboards/d215/index.html +++ b/docs/design/artboards/d215/index.html @@ -714,6 +714,32 @@ .app.m .v2-artifacts__error { flex-direction: column; align-items: stretch; } .app.m .v2-artifacts__error .b { height: 44px; } .app.m .v2-artifacts__more { min-height: 44px; } +/* empty: empty and error states on drawn pages. One line, one way forward; ink only on the act that gets you out. */ +.col-empty { padding: 10px 8px; font-size: 13px; line-height: 18px; color: var(--mu); } +.col-empty--m { padding: 14px 4px; } +.focus .mu { font-size: 13px; color: var(--mu); } +.empty-side { display: grid; gap: 12px; justify-items: start; padding: 14px 10px; } +.empty-side p { margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--se); } +.app.m .empty-side { padding: 18px 4px; width: 100%; } +.app.m .empty-side .b { height: 44px; width: 100%; } +.empty-c { display: grid; gap: 10px; justify-items: start; max-width: 460px; padding: 28px 28px; margin: 0 auto; } +.empty-c h1, .empty-c h2 { margin: 0; font: 700 22px/1.2 var(--f-display); letter-spacing: -0.02em; color: var(--ink); } +.empty-c p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--se); } +.empty-c--page { margin-top: 72px; } +.empty-acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; } +.app.m .empty-c { padding: 28px 16px; max-width: none; width: 100%; } +.app.m .empty-c--page { margin-top: 24px; } +.app.m .empty-c .b, .app.m .empty-acts .b { height: 44px; } +.app.m .empty-acts { width: 100%; flex-direction: column; } +.app.m .mbody2 > .search { flex: none; height: 44px; } +.mem-state { margin: 6px 4px; font-size: 13.5px; line-height: 1.5; color: var(--se); } +.pub { display: flex; flex-direction: column; height: 100%; background: var(--p); } +.pub-bar { display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 28px; border-bottom: 1px solid var(--d); } +.pub-brand { display: inline-flex; align-items: center; gap: 10px; font: 700 16px/1 var(--f-display); color: var(--ink); } +.pub-brand .logo { width: 28px; height: 28px; margin: 0; } +.pub-bar nav { display: flex; align-items: center; gap: 18px; font-size: 13px; font-weight: 600; color: var(--se); } +.app.m .pub-bar { height: 52px; padding: 0 12px; } +.app.m .pub-bar nav a:first-child { display: none; }

Same look. Less said.

  • One screen firstRepeated blocks become a table; rare settings collapse.
  • @@ -1229,6 +1255,48 @@

    Same look. Less said.

    +
    +

    Empty and error

    pods list · board · memory · agent profile · 404
    helper words, most – → 17scroll 390 – → 1.0×
    +
    +
    No pods yet · 1440new workspace
    +

    No pods yet. Create one to get started.

    +
    Empty board · 1440no tasks, no focus
    Northwind0 +
    MineP0Unclaimed
    focusNo focus set for this pod yet.
    Pending0
    Nothing pending
    In progress0
    Nothing in progress
    Blocked0
    All clear
    +
    +
    +
    Board failed to load · 1440load error
    Northwind0 +
    MineP0Unclaimed

    Couldn't load the board

    Check your connection and try again.

    +
    Agent with no memory · 1440nothing written yet

    Ivy

    connected · 4 pods

    No memory recorded yet.

    +
    +
    +
    Agent not found · 1440public profile, signed out
    Commonly

    Agent not found

    This agent may not exist. Explore what Commonly is, or start your own team.

    +
    Page not found · 1440new: live redirects to /v2

    Not found

    Page not found

    That link doesn't lead anywhere in Commonly. It may have moved, or the pod may be private.

    +
    +
      +
    • An empty state says what is missing and gives one way forward. The line is the live copy; the one act is the only ink key on the page. Where the live page offers no act, none is added except Retry on a load error.
    • +
    • The board keeps its shape. All three columns stay, each with its own line ("Nothing pending", "All clear"), so the page never looks broken. The focus strip says "No focus set for this pod yet."
    • +
    • Memory keeps its nav. Group counts read 0 and one status line sits where the notes would be; nothing explains the feature, because the page is private to the agent and you.
    • +
    • Page not found is new. Live, an unknown route silently redirects to /v2, so a mistyped link looks like the app forgot where you were. This frame is the replacement, with one ink act, Back to pods.
    • +

    Each state, one line

    + + + + + + +
    No pods yetThe list shows one line and New pod; the tabs stay with a 0 count. The right pane stays empty.
    Empty boardCounts read 0; each column carries its own line. New task stays in the head.
    Board failedHead stays; one title, one line, Retry. No columns render.
    No memory"No memory recorded yet." also shows when the page is denied, so it must not blame the person.
    Agent not foundPublic page, signed out: brand bar, title, line, Start your own team (ink) and What is Commonly? (ghost).
    Page not foundSigned in: rail stays, one line, Back to pods. Signed out falls through to sign-in as today.
    +
    +
    No pods yet · 390

    Pods

    No pods yet. Create one to get started.

    Pods
    3Needs you
    Team
    Settings
    +
    Empty board · 390
    Northwind board
    MineP0Unclaimed
    Nothing in progress
    Pods
    3Needs you
    Team
    Settings
    +
    Board failed to load · 390
    Northwind board

    Couldn't load the board

    Check your connection and try again.

    Pods
    3Needs you
    Team
    Settings
    +
    +
    +
    Agent with no memory · 390
    Ivy

    No memory recorded yet.

    Pods
    3Needs you
    Team
    Settings
    +
    Agent not found · 390
    Commonly

    Agent not found

    This agent may not exist. Explore what Commonly is, or start your own team.

    +
    Page not found · 390

    Not found

    Page not found

    That link doesn't lead anywhere in Commonly. It may have moved, or the pod may be private.

    Pods
    3Needs you
    Team
    Settings
    +
    +
    +

    Dark mode

    one dark value per token
    diff --git a/docs/design/artboards/d215/targets.json b/docs/design/artboards/d215/targets.json index a824139148..a269a3be69 100644 --- a/docs/design/artboards/d215/targets.json +++ b/docs/design/artboards/d215/targets.json @@ -222,5 +222,53 @@ "artifacts-error-390": { "helperWords": 3, "innerRatio": 1 + }, + "empty-pods-1440": { + "helperWords": 11, + "innerRatio": 1 + }, + "empty-board-1440": { + "helperWords": 17, + "innerRatio": 1 + }, + "board-error-1440": { + "helperWords": 8, + "innerRatio": 1 + }, + "empty-memory-1440": { + "helperWords": 6, + "innerRatio": 1 + }, + "agent-notfound-1440": { + "helperWords": 14, + "innerRatio": 1 + }, + "page-notfound-1440": { + "helperWords": 17, + "innerRatio": 1 + }, + "empty-pods-390": { + "helperWords": 8, + "innerRatio": 1 + }, + "empty-board-390": { + "helperWords": 5, + "innerRatio": 1 + }, + "board-error-390": { + "helperWords": 6, + "innerRatio": 1 + }, + "empty-memory-390": { + "helperWords": 6, + "innerRatio": 1 + }, + "agent-notfound-390": { + "helperWords": 14, + "innerRatio": 1 + }, + "page-notfound-390": { + "helperWords": 17, + "innerRatio": 1 } }