What problem does it solve? Front-end work is often declared done after it merely renders, leaving generic AI-generated layouts, accessibility theater, fake data, and untested behavior to ship unnoticed. This Skill enforces an empirical verification bar: every component or view must be checked in a real browser, in light and dark themes, against both automated gates and a designer-grade critique before it counts as done. ## Core Features & Use Cases - Automated regression gate: Runs Storybook stories as Vitest browser-mode tests with axe accessibility checks on every story, extended with mechanical anti-slop checks (token purity, no emoji in UI strings, no lorem/placeholder copy). - Exploratory scrutiny with Playwright MCP: Drives a running Storybook in light and dark themes, takes full-frame and component-cropped screenshots, and backs every behavioral claim with DOM assertions returning JSON verdicts. - Anti-slop and object-model fidelity audits: Hunts templated layouts, unmotivated gradients, emoji-as-UI, fake metrics, and marketing microcopy, plus OOUX checks that each domain object renders through one canonical component with consistent CTAs. - Use Case: After building a new settings view, ask the agent to scrutinize it in Storybook; it boots the dev server, screenshots both themes, runs the probe library from reference/probes.md, fixes the bounded set of findings, and reports a slop ledger with evidence. ## Quick Start Ask the agent to scrutinize the current UI in Storybook with Playwright and report any AI slop, accessibility, or behavioral findings before calling the front-end work done.
