Interface Polish
Una rubrica concreta, basata su checklist, per la rifinitura dell'interfaccia utente: raggio, ombre, aree di hit, tempistiche animazioni.
Promosso
Cosa fa
Una checklist di design-engineering per rendere le interfacce rifinite — raggio del bordo concentrico, allineamento ottico, ombre a strati sui bordi, animazioni di ingresso divise/sfalsate, numeri tabulari, aree di hit minime di 40x40px e regole di no-layout-shift — con un formato di output obbligatorio in tabella markdown prima/dopo. Utilizzare durante la costruzione di UI, la revisione di codice frontend o il lavoro su qualsiasi dettaglio visivo/animazione.
Rapporto di test
Ha trasformato una vaga recensione 'this button feels off' in quattro risultati misurabili (area di hit di 32px sotto il minimo di 40px, border-radius annidato non corrispondente, transition-all, missing tabular-nums), ciascuno mappato a un principio numerato e inserito nella tabella prima/dopo obbligatoria della skill.
Testato il: 2026-07-14 · Claude Code 2.x (agent harness)
Installazione
git clone https://github.com/wellwelwel/blue-spec cd blue-spec mkdir -p ~/.claude/skills cp -r .claude/skills/interface ~/.claude/skills/interface
Comandi e prompt di esempio
/interfaceUna rubrica concreta, basata su checklist, per la rifinitura dell'interfaccia utente: raggio, ombre, aree di hit, tempistiche animazioni.
Gli skill si attivano con richieste in linguaggio naturale, senza comandi da ricordare. Dopo l'installazione, prompt come questi lo attivano (in inglese):
This button feels off, can you polish the interaction?Review this component's CSS for spacing and animation issues.Add a nice enter animation to this modal component.