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.

Créez des interfaces de débogage autonomes qui révèlent le fonctionnement interne de systèmes complexes grâce à une visualisation interactive. À utiliser lorsque l'utilisateur souhaite comprendre comment quelque chose fonctionne, déboguer l'état interne, visualiser le flux de données, voir ce qui se passe lorsqu'il interagit avec le système ou créer un panneau de débogage pour tout mécanisme complexe. Se déclenche sur des requêtes telles que « Je ne comprends pas comment cela fonctionne », « montre-moi ce qui se passe », « visualiser la machine d'état », « créer une vue de débogage pour cela », « aide-moi à voir le flux de données », « rendre cela transparent » ou toute demande visant à comprendre, déboguer ou visualiser le comportement interne du système. S'applique aux machines à états, aux systèmes de rendu, aux flux d'événements, aux algorithmes, aux animations, aux pipelines de données, aux calculs CSS, aux requêtes de base de données ou à tout système dont le fonctionnement interne n'est pas évident. Source : petekp/agent-skills.

Voir l'original