Distill

Hårdhänt UI-reduceringsomgång -- skär bort innehåll, CTA:er och dekoration som inte driver till handling.

av educlopez · educlopez/ui-craft

Testad · Fungerar ★ 8.8/10

Distill — Hårdhänt UI-reduceringsomgång -- skär bort innehåll, CTA:er och dekoration som inte driver till handling.

Vad den gör

En reduceringslins för UI-arbete: trimmar text, konkurrerande CTA:er, dekorativa visuella element och död kod mot ett enda test (svarar detta på en fråga eller driver det till en handling?), med en CRAFT_LEVEL-ratt för aggressivitet och ett obligatoriskt skyddsräcke för tillgänglighet. Aktiveras när ett UI känns rörigt, upptaget eller överbelastat med CTA:er, eller när användaren säger 'förenkla detta' eller 'distill' i samband med design/frontend-arbete.

Testrapport

Givet en rörig prissättningssektion (3 konkurrerande CTA:er, en 12-punkters funktionslista, gradient-blobbar, textväggar), producerade den en strukturerad tabell över vad som skurits bort och varför, plus en explicit regel att aldrig ta bort tillgänglighetsfunktioner -- ett konkret skyddsräcke som ett generiskt 'förenkla det bara'-grundsvar helt hoppade över.

Testad: 2026-07-14 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/educlopez/ui-craft
cd ui-craft
mkdir -p ~/.claude/skills
cp -r .agents/skills/distill ~/.claude/skills/distill
cp -r .agents/skills/ui-craft ~/.claude/skills/ui-craft

Kommandon och exempelprompter

  • /distillHårdhänt UI-reduceringsomgång -- skär bort innehåll, CTA:er och dekoration som inte driver till handling.

Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):

  • This screen feels cluttered, help me cut it down to what matters
  • Trim the competing CTAs on this page so one action stands out
  • Strip the decorative fluff off this UI without breaking accessibility