Create a B2B customer-success workspace for an account manager. The screen should show relationship health, an attention queue, recent activity, next actions, lightweight data display, and one quiet empty state. Use realistic product copy and make the screen feel like a complete product workspace, not a landing page.
Design system: Telemetry Deck — Dev tools
Accent: #00FFC0
Ink: #E0E0E6
Surface: #0A0A0E
Muted: #808085
Display font: "Space Grotesk", sans-serif
Body font: Inter, sans-serif
Tags: bold, technical, sophisticated
Theme description: Telemetry Deck: dark comfortable UI, slightly-rounded corners, flat-bordered surfaces, vivid cool-green brand.
Rules:
- Use the design system tokens as the source of truth for color and typography.
- Do not invent a new palette or unrelated font personality.
- Motif prompts guide composition, metaphor, illustration, and material language.
- The design-system name above only identifies where the tokens came from. Never use that company's name, logo, wordmark, or slogan in the screen — invent a neutral fictional product name and render its mark as plain styled text or a simple geometric shape.
Motif pack: Telemetry Deck Native
Design inside the Telemetry Deck motif for a devtools surface. Preserve the captured tokens precisely. Use the telemetry deck idea to shape the primary column, supporting rails, status language, and empty states, so the system feels purpose-built rather than themed on top. Keep one clear accent moment and let everything else stay calm and legible.
Adopt:
- Echo the telemetry deck structure across the primary work area and side rails.
- Reserve the accent for the single most important action, as the screen does.
Avoid:
- Avoid scattering the accent across many competing elements.
- Avoid generic card grids that erase the telemetry deck character.
metaphor
Telemetry Deck Metaphor
Create a B2B customer-success workspace for an account manager. The screen should show relationship health, an attention queue, recent activity, next actions, lightweight data display, and one quiet empty state. Use realistic product copy and make the screen feel like a complete product workspace, not a landing page.
Design system: Telemetry Deck — Dev tools
Accent: #00FFC0
Ink: #E0E0E6
Surface: #0A0A0E
Muted: #808085
Display font: "Space Grotesk", sans-serif
Body font: Inter, sans-serif
Tags: bold, technical, sophisticated
Theme description: Telemetry Deck: dark comfortable UI, slightly-rounded corners, flat-bordered surfaces, vivid cool-green brand.
Rules:
- Use the design system tokens as the source of truth for color and typography.
- Do not invent a new palette or unrelated font personality.
- Motif prompts guide composition, metaphor, illustration, and material language.
- The design-system name above only identifies where the tokens came from. Never use that company's name, logo, wordmark, or slogan in the screen — invent a neutral fictional product name and render its mark as plain styled text or a simple geometric shape.
Motif pack: Telemetry Deck Metaphor
Design the devtools workspace as a telemetry deck (instrument readouts for systems: live graphs, sparklines, and counters on a dark deck, mono numerals, subtle grid glow, and a threshold-alert accent). Keep the captured tokens fixed. Use the metaphor to decide what sits at the center, what lives at the edges, and how status and motion read, while maintaining credible B2B utility and strong legibility throughout the screen.
Adopt:
- Map primary data to the focal area of the telemetry deck and secondary data to its edges.
- Let state changes feel like the telemetry deck responding, not like generic toasts.
Avoid:
- Avoid literal illustration that turns the telemetry deck into a cartoon.
- Avoid letting the metaphor reduce real product usefulness.
composition breaker
Telemetry Deck Composition Breaker
Create a B2B customer-success workspace for an account manager. The screen should show relationship health, an attention queue, recent activity, next actions, lightweight data display, and one quiet empty state. Use realistic product copy and make the screen feel like a complete product workspace, not a landing page.
Design system: Telemetry Deck — Dev tools
Accent: #00FFC0
Ink: #E0E0E6
Surface: #0A0A0E
Muted: #808085
Display font: "Space Grotesk", sans-serif
Body font: Inter, sans-serif
Tags: bold, technical, sophisticated
Theme description: Telemetry Deck: dark comfortable UI, slightly-rounded corners, flat-bordered surfaces, vivid cool-green brand.
Rules:
- Use the design system tokens as the source of truth for color and typography.
- Do not invent a new palette or unrelated font personality.
- Motif prompts guide composition, metaphor, illustration, and material language.
- The design-system name above only identifies where the tokens came from. Never use that company's name, logo, wordmark, or slogan in the screen — invent a neutral fictional product name and render its mark as plain styled text or a simple geometric shape.
Motif pack: Telemetry Deck Composition Breaker
Break the generic devtools layout using the Telemetry Deck motif. Keep the captured tokens exactly. Put the most important narrative and action first, support it with an attention rail, and make metrics serve the story instead of dominating the top of the screen. The result should feel deliberately composed, scannable, and on-brand.
Adopt:
- Lead with one decisive focal lane that states what matters now.
- Use a side attention rail for next actions and unresolved signals.
Avoid:
- Avoid four-card KPI rows and generic left-nav scaffolding.
- Avoid treating every signal on screen as equal in weight.
illustrative
Telemetry Deck Illustrative
Create a B2B customer-success workspace for an account manager. The screen should show relationship health, an attention queue, recent activity, next actions, lightweight data display, and one quiet empty state. Use realistic product copy and make the screen feel like a complete product workspace, not a landing page.
Design system: Telemetry Deck — Dev tools
Accent: #00FFC0
Ink: #E0E0E6
Surface: #0A0A0E
Muted: #808085
Display font: "Space Grotesk", sans-serif
Body font: Inter, sans-serif
Tags: bold, technical, sophisticated
Theme description: Telemetry Deck: dark comfortable UI, slightly-rounded corners, flat-bordered surfaces, vivid cool-green brand.
Rules:
- Use the design system tokens as the source of truth for color and typography.
- Do not invent a new palette or unrelated font personality.
- Motif prompts guide composition, metaphor, illustration, and material language.
- The design-system name above only identifies where the tokens came from. Never use that company's name, logo, wordmark, or slogan in the screen — invent a neutral fictional product name and render its mark as plain styled text or a simple geometric shape.
Motif pack: Telemetry Deck Illustrative
Add an illustrative layer to the devtools surface in the Telemetry Deck motif (instrument readouts for systems: live graphs, sparklines, and counters on a dark deck, mono numerals, subtle grid glow, and a threshold-alert accent). Keep all captured tokens fixed. Use restrained line illustration for icons, dividers, and empty states so the system gains personality and memorability while remaining fast to scan and genuinely useful for daily work.
Adopt:
- Place small telemetry deck sketches beside sections that need interpretation.
- Use a consistent line weight and mark vocabulary across the screen.
Avoid:
- Avoid stock illustration blocks detached from the workflow.
- Avoid decorative marks that slow scanning or obscure data.