Home/Skills/Skill Kits/Build, review and test a web interface Curated workflowsBuild, review and test a web interface
Move from a deliberate design direction to a performance review and a browser check of the real user journey.
How these skills work together
Begin with the product's primary task, content and accepted visual constraints. Use frontend-design to make a coherent layout, then apply the React reference only if the project uses that stack. Test the implemented interface through a representative browser journey. Finish by checking the final deployed state and reporting the evidence. Each skill serves a different stage; this is an editorial sequence, not a claim that the tools were runtime-tested together.
Validation and boundaries
Check desktop and mobile layouts, keyboard focus, long text, loading and failure states. Compare performance on the same representative journey before and after optimization. Inspect each skill's license, dependencies and permissions independently.
Design & UX86/100
anthropics/skills
A design-direction skill for giving a new interface a deliberate visual identity and reviewing whether the result fits its audience and task.
First-party sourceComplete terms in LICENSE.txtEditorial review
Development78/100
vercel-labs/agent-skills
A first-party React and Next.js performance reference for reviewing data loading, bundle cost, rendering and component behavior.
First-party sourceMITEditorial review
Testing & QA86/100
anthropics/skills
A browser-testing workflow with Playwright-oriented examples and server-lifecycle helpers for checking local web application behavior.
First-party sourceComplete terms in LICENSE.txtEditorial review2 matching source records
Testing & QA88/100
obra/superpowers
A completion-check workflow that ties a claim such as fixed, passing or deployed to fresh evidence from the relevant system.
Community sourceMITEditorial review