Resonance Design Designer

UI-Design-Direktor nach ersten Prinzipien: OKLCH-Farbe, optische Handwerkskunst, Bewegungsphysik, vollständige Zustandsabdeckung.

von manusco · manusco/resonance

Funktioniert mit Setup ★ 8.4/10

Resonance Design Designer — UI-Design-Direktor nach ersten Prinzipien: OKLCH-Farbe, optische Handwerkskunst, Bewegungsphysik, vollständige Zustandsabdeckung.

Was es kann

Ein tiefgreifendes Design-Direktor-Verfahren, das perzeptuelle Farbe (OKLCH/APCA), typografische und räumliche Systeme, Bewegungsphysik, optische/unterbewusste Handwerksdetails und eine Anti-'AI-Slop'-Checkliste abdeckt, unterstützt durch 21 Referenzdokumente. Wird ausgelöst bei Design-System-Setup, UI-Spezifikation, 'this looks generic/AI-made'-Audits, Verfeinerungsdurchläufen und Multi-Canvas-/Zustandsabdeckungsarbeiten; verschiebt Implementierungscode und lange Marketingtexte explizit auf Geschwister-Skills.

Testbericht

Die eigenständige Referenzbibliothek (21 Dateien, alle vorhanden und wirklich detailliert: echte OKLCH-Werte, APCA über WCAG2, konzentrische Radien, Tabellenziffern, ein expliziter Slop-Katalog) überlebt eine wortgetreue Kopie und ist materiell besser als generische Design-Anleitungen – aber der 'Operating Standard'-Schritt des Skills liest AGENTS.md und sein Speicher-Schritt liest/schreibt .resonance/02_memory.md, die beide außerhalb des Skill-Ordners liegen und nach einem einfachen `cp` fehlen; die README des Repos besagt klar 'without the bridge the operating standard and memory never reach the model,' und der eigentliche Claude-Code-native Einstiegspunkt (.claude/skills/design/SKILL.md) ist ein 4-zeiliger Stub, der nur sagt 'go read .agents/skills/design/designer/SKILL.md' – kaputt, sobald er allein kopiert wird.

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

Installation

git clone https://github.com/manusco/resonance
cd resonance
mkdir -p ~/.claude/skills
cp -r .agents/skills/design/designer ~/.claude/skills/resonance-design-designer

Befehle & Beispiel-Prompts

  • /resonance-design-designerUI-Design-Direktor nach ersten Prinzipien: OKLCH-Farbe, optische Handwerkskunst, Bewegungsphysik, vollständige Zustandsabdeckung.

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

  • This UI looks generic and AI-made, give it a real design pass
  • Set up an OKLCH color system and full state coverage for this app
  • Audit my design system against an anti-slop checklist