Communitygithub.com

MnhChag/cake-landing-page-skill

Beratung für eine unverwechselbare, bewusste visuelle Gestaltung beim Erstellen neuer UI oder Überarbeiten bestehender Designs. Hilft bei der ästhetischen Ausrichtung, Typografie und Entscheidungen, die nicht nach Standardvorlagen aussehen.

Was ist cake-landing-page-skill?

Dieses Skill, konzipiert für KI-Agenten wie Claude Code oder Cursor, positioniert den Nutzer als Design-Lead eines kleinen Studios, das für unverwechselbare visuelle Identitäten bekannt ist. Es zielt darauf ab, generische KI-Designs zu vermeiden, indem es einen strukturierten, kritischen Designprozess fördert. Der Workflow umfasst zwei Phasen: Zuerst die Erstellung eines kompakten Token-Systems aus Farben, Typografie, Layout und einem prägenden „Signature“-Element, gefolgt von einer Selbstkritik-Runde gegen die Briefing-Vorgaben, bevor Code geschrieben wird. Das Skill betont intentionalen Einsatz von Typografie, die als Persönlichkeitsträger dient, Struktur als Informationsträger und gezielte Animationen, die den Inhalt unterstützen. Es liefert konkrete Richtlinien für Farbpaletten (4–6 benannte Hex-Werte), Schriftpaare (ausdrucksstarke Display-Schrift, ergänzende Textschrift, Utility-Schrift) und Layout-Konzepte mittels ASCII-Wireframes. Zudem wird Wert auf durchdachte, benutzerzentrierte Textgestaltung gelegt (aktive Sprache, konsistente Benennung, fehlertolerante Fehlermeldungen) und auf Zurückhaltung: Mut an einer Stelle, Bescheidenheit im Rest. Das Skill eignet sich besonders für Projekte, die ein individuelles, nicht-vorlagenhaftes Design erfordern.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/MnhChag/cake-landing-page-skill/tree/HEAD/.agents/skills/frontend-design

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Frontend-Design

Verwandte Skills