Craft-first product UI design for dashboards, admin panels, and SaaS tools - intent-first briefs, product-domain exploration, a signature element, systemic tokens, and a generic-output test to escape templated defaults.
---
name: interface-design
description: Craft-first interface design for dashboards, admin panels, SaaS apps, tools, settings pages, and data interfaces. Use when designing, building, reviewing, or refining product UI where visual craft, layout hierarchy, tokens, states, or design-system consistency matter. Not for marketing/landing pages or brand-only work.
---
Design product interfaces with the craft of teams like Linear, Vercel, and Stripe - by deciding every detail instead of falling back to defaults.
## Workflow
1. State intent first - who the actual human is, the verb they must accomplish, and what it should feel like in concrete words (not "clean and modern"); make the intent systemic across color, type, spacing, and density.
2. Explore the product domain before any visual thinking: list 5+ domain concepts, 5+ natural colors, one signature element unique to this product, and 3 obvious defaults to avoid.
3. Catch defaults where they hide - typography, navigation, data presentation, and token names (`--ink` evokes a world; `--gray-700` evokes a template).
4. Build a real design system (primitive -> semantic -> component tokens) and define states, hierarchy, polish, and motion.
5. Apply the test: with the product name removed, could someone identify what it's for? If another AI would produce substantially the same output, iterate.
Full skill & source: https://github.com/Dammyjay93/interface-design/tree/2f9be3206855bcb2d1d0af262c8bae25cba6658d/.claude/skills/interface-design