SuperAPI AI Directory

design-engineer-router

Design & creation

View repository

Updated 10-26 10:59

About this skill

Design engineer router

The user never has to name a skill. You pick the skills yourself, every time, and say in one line which ones you used.

Requirements

This skill only routes. It does not include the emil-* skills. Install them in your agent's skills folder first (for example ~/.cursor/skills/, ~/.claude/skills/, or .claude/skills/ in a project). If a named skill is not installed, skip it and say so in one line.

How to pick

  1. Name the phase and the material of the ask. When two skills look equal, read emil-ask-emil for the full routing table.
  2. Load the 1 to 3 most relevant emil skills for this ask. Not five: more skills dilute the craft bar. Read each skill's SKILL.md and its companion files, and follow its exact values.
  3. Run the proactive passes below on your own, without asking.
  4. In the reply, add one short line: which skills you used and why.

Map of the emil skills

  • Undecided / options: emil-prototype (3-5 versions behind a picker). Stuck on a vibe: emil-get-creative.
  • Foundation of any screen: emil-design-foundations (hierarchy, spacing, states, microcopy), emil-typography, emil-color (OKLCH, contrast).
  • Building pieces: components emil-component-design; forms, inputs, buttons emil-forms-and-inputs; cards, shadows, borders, gradients, dark mode emil-surfaces; landing, blog, docs, changelog emil-marketing-pages; motion emil-animations + emil-design-eng; animation inspector questions emil-ask-lapse.
  • Refining: feels unfinished emil-ui-polish; phone feel emil-mobile-native; touch, keyboard, screen reader emil-touch-and-accessibility; slow or janky emil-performance.
  • Checking: code review emil-ui-review; before launch emil-prep-for-prod.
  • De-slop: visuals emil-unslop-design; code emil-unslop-code; any text a person reads emil-unslop-writing.
  • Words: design term lookup emil-design-vocabulary; frontend term lookup emil-engineering-vocabulary.
  • Product: should this exist, what to build first emil-product-thinking; suggest the right tool for a goal emil-build-a-tool.
  • Docs and skills: design system docs for AI (DESIGN.md, AGENTS.md) emil-design-system-docs; writing a skill file emil-writing-skills; turning someone's public work into a skill emil-borrow-a-brain.

Proactive passes (always, unasked)

  • After you build or change any UI: run emil-ui-review on your own output, then emil-unslop-design. Fix what they find before you deliver.
  • If the UI has forms or inputs: also check against emil-forms-and-inputs.
  • If it runs on mobile or touch: also check emil-touch-and-accessibility (44px targets, 16px inputs, focus).
  • If you add motion: check emil-animations (duration, easing, reduced motion).
  • If you write UI copy, README, or docs: run emil-unslop-writing.
  • If you write code: run emil-unslop-code before you hand it over.
  • If the user says ship, launch, deploy, or go live: run emil-prep-for-prod.
  • If you notice an issue outside the ask (contrast fail, tiny tap target, layout shift): fix it if it is small and safe, or list it in one line and offer the fix.

Second opinion

If you have Jakub Krehel's design skills installed, use them as a second opinion, or when no emil skill covers the ask.

When delegating

Name the chosen skills in the brief for the subagent, plus the proactive passes that apply.

Role models: Emil Kowalski (https://emilkowal.ski/), Jakub Krehel (https://jakub.kr/).