Capture an OBS-based screen demo for a GitHub issue — orchestrates obs-cli to record, optionally trim/thumbnail, then upload and post a `## Demo Recording` comment. Requires OBS Studio + obs-cli installed and OBS WebSocket server running. Use when the user wants to record a live screen demo (as opposed to generating a composited video from JSON — that is the `demo-video` skill in this plugin).
Assess and score a design system's maturity for AI-driven frontend development using a 5-ring, 6-tier maturity model. Produces a scored report with a prioritized action plan tailored to the user's framework, team size, and goals. Use this skill whenever someone asks about design system readiness, AI readiness for frontend, design-to-code maturity, Figma-to-code pipeline health, component library quality, or wants to know "how ready is my design system for AI." Also trigger when users mention design tokens, Code Connect, Figma MCP, component registries, want to accelerate frontend development with Claude Code, or are migrating between frameworks (e.g., React to Angular) and want to set up their design system right. Trigger proactively if a user describes building a design system, setting up tokens, or connecting Figma to code — even if they don't say "audit." Covers React, Angular, Vue, Svelte, and framework-agnostic setups.
Evaluate a live website against current (2026) UX/UI design trends using playwright-cli. Scores the site across 8 trend categories with a detailed rubric, captures evidence screenshots, and produces a research note with actionable recommendations. Use this skill whenever someone asks about UX modernness, design trends compliance, whether a site feels "current" or "dated", wants a UX review or audit focused on visual and interaction trends, asks how their site compares to modern design standards, mentions bento grids, dopamine design, spatial UI, agentic UX, or multimodal interfaces in a review context, or wants to know what UX improvements would have the most impact. Also trigger when someone asks to "audit the UX" or "review the design" of a running site — even if they don't mention specific trends.
Use when producing multi-option design comparisons, research synthesis docs, status/incident reports, implementation plans, PR reviews & writeups, module maps, design-system references, component-variant sheets, SVG figures & flowcharts, interaction/animation prototypes, or slide decks — anything that would otherwise be a long Markdown document. Reach for this skill whenever the user asks to "compare", "explore options", "research", "summarize findings", "write up", "synthesize", "explain how X works", "plan", "review this PR", "map this package", "show our design tokens", "draw/diagram", "flowchart", "prototype", "tune the easing", or "make a deck/slides" — and especially when the output will exceed ~100 lines, contain side-by-side options, be visual or interactive, or be shared with another person. HTML beats Markdown for these by a wide margin (visual hierarchy, tables, SVG diagrams, navigability, live interaction); default to invoking this skill even if the user doesn't explicitly ask for HTML.
Run all user story YAML files in playwright-stories/ using the execute → reflect → act pipeline via playwright-cli. Aggregates pass/fail results with screenshots and signals. Optionally filter by type or tags.
Storybook-component-level visual regression via Chromatic (default, free tier) or Applitools Eyes (AI-based). Pairs with the in-loop semantic visual diff (`reflect --baseline`) which catches journey-level changes. Use after visual changes to verify intentional vs unintentional component drift.
Analyze a journey trace and its screenshots to produce a signal report. Use when you have a journey trace from a previous execute run and want to analyze it separately. Reads screenshots and accessibility snapshots to identify anomalies, regressions, a11y violations, and UX issues.
Daily inner-loop verification of Storybook stories. Dispatches explorer-agent against a story-id, glob, or git-diff-derived story set; produces a sub-minute report with screenshots, console errors, a11y snapshot, and drift vs. local cached baseline. Use after every component change as the fast feedback loop before pushing.