Scaffold and maintain a single-file HTML project console that replaces scattered markdown status docs with one browser-renderable control center for planning, progress tracking, artifacts, and human feedback.
Installation
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Scaffold and maintain a single-file HTML project console that replaces scattered markdown status docs with one browser-renderable control center for planning, progress tracking, artifacts, and human feedback.
pipeline-status
["new"]
html-project-console
Purpose
Use this skill when the user wants a browser-native project cockpit instead of
many markdown files. It creates a predictable project-console.html that the
agent can keep updating over time.
What this skill scaffolds
templates/project-console.html — a no-build, single-file SPA starter.
commands/bootstrap-project-console.md — reusable prompt to instantiate the
file into any target project path.
references/design-principles.md — shared UX and content model rules.
Workflow
Copy templates/project-console.html to the chosen project location as
project-console.html.
Fill the window.PROJECT_CONSOLE_DATA JSON object with:
vision
plan
todo
changelog
artifacts
feedback
Keep updates append-only where possible (changelog, decisions) for
traceability.
Regenerate only the data object unless user asks for layout changes.
Guardrails
Keep it dependency-free (plain HTML/CSS/JS only).
Keep all data local in the file by default.
Preserve section IDs for stable automation targets.
Prefer progressive enhancement over framework complexity.
Extension ideas
Add a <dialog>-based feedback form that writes JSON snippet for copy/paste.
Add side-by-side colored diffs for latest changed files.
