界面已本地化;技能介绍与说明文档按所选语言由 AI 自动翻译,代码、命令、路径和专业术语保留原文,以原作者文档为准。
探索技能
设计与创意 · SKILL.md

deterministic-design

deterministic-design

呈现 UI 并证明其平衡且可用:一个确定性布局审计(通过显式数学 + 带注释的截图进行质心 / 光学中心 / 像素神谕平衡)加上由另一位全新视角的评审进行的基于视觉判断的 Nielsen 可用性审计。测量层不具备仅品味的设计技能。

AI 翻译

独立 GitHub 快照 · 自动分类 · 以原作者文档为准

技能说明

GitHub

name: deterministic-design description: "Render the UI and prove it's balanced + usable: a deterministic layout audit (centroid / optical-center / pixel-oracle balance via explicit math + annotated screenshot) plus a vision-judged Nielsen usability audit by a separate fresh-eyes judge. The measurement layer taste-only design skills lack." risk: safe source: community source_type: community source_repo: connerkward/deterministic-design-skill date_added: "2026-06-16" author: Conner K Ward license: MIT tags:

  • design
  • layout
  • usability
  • audit
  • verification
  • vision tools:
  • claude-code
  • antigravity
  • cursor
  • gemini-cli
  • codex-cli

When to Use

Use to catch AI-generated UI that "looks off", is misaligned or centered-mush, or fails usability — when you need to PROVE a layout is balanced and usable instead of trusting the model's eye. Compose it with any taste/token design skill before reporting design "done".

Source: connerkward/deterministic-design-skill (MIT).

deterministic-design

Thesis: determinism beats AI randomness. A model can't trust its own eye on layout — so don't. Render the UI and measure it.

Two sub-skills (load as needed):

  • design-spatial — deterministic layout audit: explicit grid
    • 8-pt spacing, and layout-audit.js computes centroid / optical-center / pixel-oracle balance and draws an annotated screenshot. Numbers, not vibes. Plus a render-then- critique vision loop.
  • design-ux — usability audit: scores the rendered UI against Nielsen's 10 + interaction heuristics via a SEPARATE fresh-eyes judge → prioritized fix list.

This improves existing design skills (including the default Anthropic one) by adding the layer they lack — it doesn't just advise on taste, it renders, measures, and judges the output. Composable with any design skill.

In central this lives as a subdir of ckw-design; it publishes separately as deterministic-design-skill (its own distribution) via publish-skill. One of the two flagship narratives — the determinism one; its sibling is human-in-the-loop (lookdev).

Example

User request:

Review this interface with @deterministic-design, identify the highest-impact design problems, and propose an implementation-ready improvement.

Limitations

  • Layout metrics and vision-judged audits catch many spatial and usability failures, but they are not a substitute for product judgment or user testing.
  • The workflow requires a rendered UI or screenshot; it cannot validate components that have not been built or captured.
  • Automated scoring can miss brand nuance, copy tone, accessibility needs, and domain-specific user expectations.
我的收藏