design-style-picker
Batch-generate and compare visual design directions so a user can choose the style they actually want. Use when the user says they cannot describe an abstract visual style, asks for many style options, wants to choose from generated UI/design-system images, rejects outputs as too colorful/too dead/too generic, or needs an existing UI/design system evolved without discarding current assets.
1How It Works & Mechanism
Pure prompt-orchestration skill: No scripts, files, or dependencies. The entire mechanism consists of the workflow and prompt templates provided to the agent in SKILL.md and references/selection-playbook.md, executed via the host's existing image generation and file reading capabilities.
Use this skill to turn vague taste into concrete visual choices.
Core rule: When the user cannot clearly describe an abstract style, stop probing and instead generate a set of structured visual artifacts (a matrix) for the user to identify—trading 'visible choices' for 'descriptive vocabulary'.
Do not ask the user to describe an abstract style if they already said they cannot. Generate comparable visual evidence, let them pick, then implement from the selected references.
Dual-axis matrix design: Vertical ladder = large single-dimension step changes (e.g., color intensity 20/35/50/65/80); Horizontal axis = distinct organization strategies (data-driven color, brand spine, warm product imagery, scenario modules, governance-led layout). If two images look like siblings, one must be regenerated.
Vertical ladder: one dimension changes by large steps, such as color intensity 20/35/50/65/80.
Treat color as a system: 'Less colorful' does not mean desaturation, but reducing equal-weighted focal points—assigning colors to distinct roles (broad architectural zones / data visualization semantics / high-signal brand accents / neutral baseline components); create boundary samples to make 'too much' visible.
"Less colorful" does not mean black-and-white. It usually means fewer competing focal points.
Implementation extracts 'principles, not pixels' from selected images: Color roles, layout density, focal hierarchy, component treatments, imagery usage, and governance placements are explicitly decoupled and merged using file naming conventions ('Use H02 for color placement and V04 for palette intensity'), preserving existing UI scope.
Extract principles, not pixels: color roles, layout density, focal hierarchy, component treatment, image use, governance/data placement.
An 'evolutionary' stance that reuses existing assets: First collect existing UI, screenshots, tokens, CSS variables, component names, and brand cues as the baseline vocabulary; fabricating unrelated fresh concepts from scratch that overwrite the current state is forbidden; preserve everything unless the user explicitly asks to discard it.
Preserve any existing UI, assets, tokens, layout, brand cues, and domain context unless the user explicitly asks to discard them.
2Core Capabilities
4Recommended Governance & Evidence
- 网络端点: Declared external network access: None (the skill itself contains zero network code; image generation relies on host tools/APIs within the host capability surface, not packaged within this skill)
- 本地工作目录: File read/write and artifact output: None (only instructs the agent to read existing UI/screenshots and execute generation/implementation; defines no write paths)
5Second-Pass Verification
- [ok] 无脚本/可执行代码 — 目录仅 3 文件:SKILL.md、agents/openai.yaml、references/selection-playbook.md,无 scripts/。
- [ok] SKILL 与 playbook 一致性 — playbook Session Pattern 8 步与 SKILL Workflow 1-6 对应;色彩阶梯 20/35/50/65/80/Overload 与 SKILL 'color intensity 20/35/50/65/80' 一致。
- [ok] 无网络/凭证/写盘代码 — 三文件均为 markdown/yaml 文本,token 扫描零网络与密钥模式。
- [unlocatable] 图像生成实现位置 — SKILL 只说 'Generate comparable visual evidence' 与给 prompt pattern,不声明用哪个生成后端——实现落在宿主工具,源码内无法定位生成 API。
- [ok] 流程有效性(矩阵是否真能逼出口味边界) — 属方法论主张,无法代码验证;SKILL 内嵌 Lessons 与反例显示其基于真实迭代沉淀。
6Verdict & Scenarios
7a6d0b59f417923b…