本文へ移動
cccskills
無料GitHub で公開

ui-bakeoff

Orchestrator that runs one UI brief through all four ui-* posture skills in parallel, then picks and merges a winner. Use when a screen matters enough to explore several directions, or the user says 'build it a few ways', 'design options', 'bake-off', 'show me variations', or 'compare approaches'.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md5.3 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

ui-bakeoff — design it four ways, then pick and merge

Running the same brief through four different design postures in parallel, then choosing the best and merging the rest, is the most reliable way to get a great UI here. This skill orchestrates that. You (the agent that triggered this skill) are the conductor — you interview, you spawn, you present, you merge. You do not design anything yourself.

The environment constraints — design around these

  • You can run subagents in parallel — issue all four Agent calls in a single message so they run concurrently.
  • Subagents cannot stop to ask the user questions — they run autonomously to completion. The interview therefore cannot happen inside them.
  • So you, the conductor, run the interview once, up front, and inject the answers into all four subagents. This is the whole reason the interview lives here and not in the children.

Step 1 — Merge the interviews, ask once, in prose

Read the "Interview first" section of all four posture skills:

  • .claude/skills/ui-sharp/SKILL.md
  • .claude/skills/ui-reimagine/SKILL.md
  • .claude/skills/ui-refine/SKILL.md
  • .claude/skills/ui-dense/SKILL.md

Take the union of their questions, dedupe the overlap (persona / primary job / reference recur across all four), and ask the user the combined short list — in plain numbered chat text, never a structured question picker (Arman ruled 2026-09-12). Always include the two universal ones:

  • Who is this for and what's the one job they came to do?
  • What in the current version already works and must NOT be regressed?

Keep it tight. If the user says "just go," proceed with your best inferences and tell them what you assumed.

Step 2 — Spawn four parallel subagents (one message, four Agent calls)

Each subagent gets identical instructions: the brief + the interview answers + an explicit "the interview is already done — do NOT ask the user anything; build with these answers." Tell each to read ground-rules.md + design-system-anchors.md (paths in .claude/ui-skills/shared/) and its one assigned posture skill, and name which posture it is. Assign:

  • subagent 1 → ui-sharp
  • subagent 2 → ui-reimagine
  • subagent 3 → ui-refine
  • subagent 4 → ui-dense

Keep each subagent prompt minimal — this is the most important rule here. Tell it only: which surface(s) to redesign and where they currently live, to read its assigned posture skill + the shared floor, where to build, and to build it real. Do NOT add design direction, component names, "reuse X", "rebuild only the presentation," or any verification choreography. Every such instruction you add silently overrides the skill and flattens the result back toward the existing UI — this is the documented way a bake-off loses all its creativity. The skill carries the design intelligence; your job is to get out of its way. The only exception: a posture the user gave specific guidance for — pass that guidance verbatim, and nothing more of your own.

Step 3 — REAL, not fake (hard rule, no exceptions for real work)

Every subagent builds a real, fully-wired implementation against the actual data, service, and stream — with real loading / empty / error / stalled-stream handling — not a mock demo. (This is ground-rules §1, the rule that matters most. A bake-off of fakes teaches you nothing about the unknowns that actually kill a page.)

To let four real implementations run in parallel without colliding, give each its own route (e.g. …/create-sharp, …/create-reimagine, …/create-refine, …/create-dense) — never a git worktree or branch (this repo is one shared checkout on main). If two variants would touch the same shared file, give each its own copy under its route instead. Confine each subagent to its own route/files. Each must verify it runs against real data — including an error and an empty path — before reporting.

Only stub if the user explicitly asks for a throwaway visual exploration (skill/design experimentation, not feature work) — and then say so loudly. Default is always real.

Step 4 — Present, recommend, then merge

Collect the four. For each, summarize: the posture, the reference product it chose, its standout features, and its weak spots. Recommend a winner with reasoning. Then offer the consolidation pass: spawn one more agent that takes the winner as the base and grafts the specific strengths the user liked from the others ("take reimagine's stream animation, refine's error state, dense's table") into a single real, canonical implementation on the true route — then delete the throwaway variant routes.

Notes

  • Real implementations on parallel routes so the user can view all four on one dev server; no worktrees.
  • The four postures are designed to diverge — converging outputs usually means the brief over-specified the design. If that happens, loosen the brief (say only what the surface is and must do) and let the postures express themselves.

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Admin debug system wiring for the floating AdminIndicator's live debug data and Copy Full Context. Use when adding debug visibility to a route or feature, wiring useDebugContext or the debug panel, capturing console errors, or enabling the copy-context workflow for a page.

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

Compact two-icon Copy / Copy-for-AI controls (components/agent-copy). Use when adding copy buttons to a row, card, list, or record; merging duplicate Copy/JSON/AI controls; continuing the copy rollout; or writing a Copy-for-AI payload. NOT for markdown content actions (use rich-document-actions).

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

Disclosing a surface's existing fixed AI jobs in the shell's top Agents menu. Use when a page, panel, overlay, or window already runs a mandate behind a button, assist, automatic action, or mode; when the agent-disclosure guard names a file; or during a surface check.

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

The watch-fix-rerun method for making an existing platform agent or automated process efficient and correct: baseline its ledger, run one unit yourself, fix the class behind every wasted call, rerun, record. Use when asked to improve, optimize, watch, or 'make efficient' an agent, a sandbox session, a sync job, or any recurring automated process.

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

Redux state for agent execution and firing agent shortcuts. Use when editing features/agents/redux/, building agent UI, creating a conversation, touching assembleRequest or NDJSON stream state, wiring agent-state selectors, adding a per-conversation capability, or triggering a shortcut from a button, menu, or code (useShortcutTrigger, launchAgentExecution).

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

The provision for a call site: the exhaustive menu of values that place in the code can realistically produce. Use before creating or fixing a mandate or agent that reasons about more than its own input, when deciding whether an agent can answer at all with what it is sent, or when its output 'looks right' but nobody checked it could be. NOT for building the agent (use create-agent).

日本語の概要は準備中です。原文の説明を表示しています。

armanisadeghi/ai-matrx32026年10月13日 更新

armanisadeghi のスキルをすべて見る

このスキルの問題を報告する