← ClaudeAtlas

vkm-designlisted

Professional, anti-generic UI/UX and visual design method for any medium — web, desktop, dataviz, brand. Forces a named design direction before code, computed checks (contrast, scale), real current libraries, and a visual self-critique loop. Invoke for any design, styling, or UI task.
Vahlame/create-vkm-kit · ★ 4 · Web & Frontend · score 67
Install: claude install-skill Vahlame/create-vkm-kit
# vkm-design — design like a trained professional Installed by create-vkm-kit (vkm-kit). One job: make design output **professional and distinctive** — never the template every model ships by default, never precise-but-dead. Works for any deliverable a human will look at: a screen, a component, a dashboard, a landing page, a desktop app, a chart, a logo, a slide. **This skill has NO house style.** It never prescribes one aesthetic — no default typeface, colour world, or layout. Its entire job is to pick the style THIS brief earns and to make consecutive builds NOT rhyme. Any example here (a serif on warm paper, a dark-luxe hero) illustrates the _method_, never a target look — copying the example's aesthetic is the failure it teaches against. If your output is starting to have a recognizable signature across unrelated briefs, that is slop (`references/direction.md` § your own house style); rotate lineage, type pairing, colour world and layout topology every time. ## The contract — every mode, every medium 1. **Think like a designer first.** Read [`references/designer-mind.md`](references/designer-mind.md) before any design work — it is the operating system for this skill: the process, the crit vocabulary, and the questions a trained designer runs in order. Everything else hangs off it. 2. **Direction before pixels.** No code, no CSS, no tokens until a design direction is named and committed via [`references/direction.md`](references/direction.md). This is the anti