메뉴
Take screenshots of HTML mockups from any version. Use when user wants to capture mockups as PNG images, regenerate screenshots, or mentions /screenshot command.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Review the latest work unit with fresh, unnarrowed eyes and surface any problem it contains as follow-ups. Use after a work-unit commit, or when the user runs /agent-review.
Continue working on a story or task by reading progress.md, executing the next work unit, and updating progress. Use when user wants to resume story/task work or mentions /continue command.
Run a Selenium test in visible (non-headless) mode with slowdown so the user can watch it. Use when user wants to demo or visually watch a Selenium test or mentions /demo command.
Preview the planned design for a scenario before writing tests. Shows domain model changes, usecase patterns, and key design choices. Use before red-usecase to get user approval on the implementation approach. If the user rejects the design, offers to discuss inline or escalate to /architecture for a full ADR.
Write a journey summary capturing noteworthy moments (predictions, decisions, surprises, mistakes, quirks). Runs automatically the moment the agent observes something worth noting during work, and manually before /clear or /compact as a final sweep. Idempotent — skips entries already recorded. Use when the agent observes a noteworthy moment, before clearing context, or when the user mentions /handoff.
Re-explain the last thing in plain words. Use ONLY when the user explicitly types /plain or asks to "explain that simply / in plain words / like I'm not an expert". Never invoke on your own initiative — this is a manual button the user presses when something was hard to follow.
| name | screenshot |
| description | Take screenshots of HTML mockups from any version. Use when user wants to capture mockups as PNG images, regenerate screenshots, or mentions /screenshot command. |
Automate taking screenshots of HTML mockups using Puppeteer from a centralized runner location.
/screenshot [folder/file]
Default location: ProductSpecification/stories/*/mockups/
Parse user input to determine target:
Folder/file filtering:
/screenshot — All mockups in default location/screenshot login.html — Single file/screenshot 01_auth — Files matching patternThe centralized Puppeteer runner is in .screenshots-temp/:
.screenshots-temp/node_modules exists:
cd .screenshots-temp && npm installExecute from the centralized location:
cd .screenshots-temp && node take-screenshots.js [target]
Examples:
# All mockups in default directory
cd .screenshots-temp && node take-screenshots.js
# Specific file (relative to repo root)
cd .screenshots-temp && node take-screenshots.js ../ProductSpecification/stories/01-create-task/mockups/desktop/create-task.html
# Directory with HTML files
cd .screenshots-temp && node take-screenshots.js ../ProductSpecification/stories/01-create-task/mockups/desktop/
# Filter by filename pattern
cd .screenshots-temp && node take-screenshots.js ../ProductSpecification/stories/01-create-task/mockups/ mobile
Report to user:
screenshots/ subfolder)/screenshot # All mockups
/screenshot login.html # Specific file
/screenshot mobile # Files containing "mobile"
mobile/ parent directory use mobile viewport (390x844).mockup-card element when present.mockup-card not foundscreenshots/ subfolder next to each HTML file (per-directory, not centralized)node_modules/, screenshots/, and screenshots-live/ directories.screenshots-temp/