Complete AI Training
Sign inBecome a member

Your job's AI kit

Get your AI kit

Tell us who you are and what you do. We show you your kit right away and email you the link: skills, prompts, AI agents, MCP servers and courses for your job.

500+ jobs ready, and we make a kit for any other job. No payment needed to look.

Share

Skill · Design

Deterministic design

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.

Agentic Awesome SkillsLicense: MITAdded Sep 5, 2026
Use it in my AI

How to use it

  1. Start your plan and connect your AI once
  2. Add the skill to your AI, one time only: press Copy skill and paste it into your AI's instructions: a project in ChatGPT, Claude or Grok, a Gem in Gemini, an agent in Microsoft 365 Copilot, or a rule in Cursor. It stays there for every new chat. In Kimi, paste it at the start of a new chat.
  3. Ask for the task in your own words, or say it directly:
Use the Deterministic design skill to help me with this.
SKILL.md

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.