Fluxwing Component Creator

Verwandelt 'erstelle einen Button' in ein schema-valides .uxm + ASCII-Vorschau .md-Paar, aber der Ordner allein ist nicht das ganze Kit.

von trabian · trabian/fluxwing-skills

Funktioniert mit Setup ★ 8.4/10

Fluxwing Component Creator — Verwandelt 'erstelle einen Button' in ein schema-valides .uxm + ASCII-Vorschau .md-Paar, aber der Ordner allein ist nicht das ganze Kit.

Was es kann

Erstellt 'uxscii' UI-Komponenten (Buttons, Eingaben, Karten, Formulare, Modals, Nav etc.) als Dateipaar: ein JSON .uxm mit Zuständen/Props/Barrierefreiheitsmetadaten, validiert gegen ein gebündeltes JSON-Schema, und ein .md mit handgezeichneten ASCII-Art-Vorschauen pro Zustand. Löst bei Anfragen zur Erstellung/Erstellung/Gestaltung einer UI-Komponente oder wenn der Benutzer auf .uxm-Dateien oder den uxscii-Standard verweist, aus.

Testbericht

Folgte dem Fähigkeitskörper für echt und führte seine eigenen gebündelten Skripte/quick_validate.py gegen die Ausgabe aus: Erzeugte einen schema-validen submit-button.uxm (4 Zustände, vollständiger a11y-Block) plus eine ASCII-Vorschau .md – wirklich reichhaltiger als eine einfache englische Basislinie. Aber das SKILL.md verweist auf {SKILL_ROOT}/../shared/docs/copy-versioning.md und {SKILL_ROOT}/../fluxwing-validator/validate-component.js, beide außerhalb des eigenen Ordners der Fähigkeit, sodass eine einfache `cp -r` Installation der Fähigkeit (wie vom Katalog angewiesen) den Versionierungsfluss und den empfohlenen Node-Validator stillschweigend unterbricht – Sie müssen die Geschwisterordner `shared/` und `fluxwing-validator/` ebenfalls mitnehmen.

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

Installation

git clone https://github.com/trabian/fluxwing-skills
cd fluxwing-skills
mkdir -p ~/.claude/skills
cp -r skills/fluxwing-component-creator ~/.claude/skills/fluxwing-component-creator

Befehle & Beispiel-Prompts

  • /fluxwing-component-creatorVerwandelt 'erstelle einen Button' in ein schema-valides .uxm + ASCII-Vorschau .md-Paar, aber der Ordner allein ist nicht das ganze Kit.

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

  • Create a submit button component for my uxscii project.
  • I need to design a card UI component using .uxm files.
  • Make me a modal component in uxscii format, please.