transparent-ui

SKILL.md

Build temporary debugging interfaces that make invisible system behavior visible. These are development-only routes/pages that reveal internal state, transitions, and data flow through interactive visualization.

Make the invisible visible. Show state that normally exists only in memory. Reveal transitions that happen too fast to observe. Surface the "why" behind system behavior.

Temporary by design. These are debugging tools, not production features. Keep changes isolated for easy removal. Use dev-only routes and environment checks.

Erstellen Sie eigenständige Debugging-Schnittstellen, die durch interaktive Visualisierung die interne Funktionsweise komplexer Systeme offenlegen. Verwenden Sie diese Funktion, wenn der Benutzer verstehen möchte, wie etwas funktioniert, den internen Zustand debuggen, den Datenfluss visualisieren, sehen möchte, was passiert, wenn er mit dem System interagiert, oder ein Debug-Panel für einen beliebigen komplexen Mechanismus erstellen möchte. Wird bei Anfragen wie „Ich verstehe nicht, wie das funktioniert“, „Zeige mir, was passiert“, „Visualisiere die Zustandsmaschine“, „Erstelle eine Debug-Ansicht dafür“, „Hilf mir, den Datenfluss zu sehen“, „Mache dies transparent“ oder jede Anfrage zum Verstehen, Debuggen oder Visualisieren des internen Systemverhaltens ausgelöst. Gilt für Zustandsmaschinen, Rendering-Systeme, Ereignisflüsse, Algorithmen, Animationen, Datenpipelines, CSS-Berechnungen, Datenbankabfragen oder jedes System mit nicht offensichtlichen internen Abläufen. Quelle: petekp/agent-skills.

Original anzeigen