Styleseed Design Review

Bewertet UI-Code 0-100 über 7 Design-Achsen und gibt eine zeilenreferenzierte, priorisierte Fehlerliste zurück

von bitjaru · bitjaru/styleseed

Getestet · Funktioniert ★ 9.2/10

Styleseed Design Review — Bewertet UI-Code 0-100 über 7 Design-Achsen und gibt eine zeilenreferenzierte, priorisierte Fehlerliste zurück

Was es kann

Überprüft React/Tailwind/HTML UI-Code anhand einer siebengliedrigen Rubrik (Kohärenz, Farbe, Hierarchie, Layout, Zustände, UX-Writing, Bewegung), bewertet ihn 0-100 und gibt eine nach Punktgewinn geordnete Fehlerliste mit zitierten Zeilennummern zurück. Wird ausgelöst, wenn eine Schnittstelle generisch oder KI-generiert aussieht, wenn Sie eine Pre-Ship-Designbewertung wünschen oder wenn Sie gebeten werden, die UI polierter aussehen zu lassen. Die eigenständige Rubrik ist im SKILL-Body eingebettet; sie überprüft und empfiehlt, bearbeitet aber nicht automatisch.

Testbericht

SKILL.md über die GitHub API/raw abgerufen; Frontmatter wird mit Name+Beschreibung geparst, und drei referenzierte URLs (LICENSE, engine/RULESETS.md, plugin.json) gaben alle 200 zurück. Sauber in einem temporären HOME installiert (SKILL.md landete unter ~/.claude/skills/styleseed-design-review/SKILL.md); keine Skripte, keine Sicherheitsrisiken. Für die Ausgabe schrieb ich ein 32-zeiliges Dashboard.tsx, das mit AI-Tells versehen war, und erstellte zwei Reviews: Meine Baseline-Prosa kennzeichnete die meisten Tells, gab aber keine Punktzahl, keine Zeilennummern und keine Reihenfolge an und verpasste das 2:1-Problem mit Zahl/Einheit und die nicht-gekachelte Tabelle; die Skill-Rubrik-Review bewertete es mit 38/100 F mit kategorieweisen, zeilenreferenzierten Abzügen und einer nach Punktgewinn geordneten Fehlerliste (+17/+10/+9/+8).

Getestet am: 2026-07-21 · Claude Code 2.x (agent harness)

Installation

git clone --depth 1 https://github.com/bitjaru/styleseed.git /tmp/styleseed-design-review-src
mkdir -p ~/.claude/skills
cp -R /tmp/styleseed-design-review-src/skills/styleseed-design-review ~/.claude/skills/styleseed-design-review
# Self-contained: the full rubric lives in SKILL.md, no deps, no scripts, no API keys.
# Skill lives in a subdir of the repo; the full 74-rule reference and components stay in the cloned repo but are not required to run the review.

Befehle & Beispiel-Prompts

  • /styleseed-design-reviewBewertet UI-Code 0-100 über 7 Design-Achsen und gibt eine zeilenreferenzierte, priorisierte Fehlerliste zurück

Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):

  • Why does this React UI look AI-generated
  • Score this Tailwind page before I ship it
  • Make this interface look designed, not generated