designpowers

Use this agent to review any design output — code, mockups, specifications, or prototypes — for inclusive design compliance. Evaluates against WCAG, COGA, and inclusive design principles. Dispatch after design work and before handoff.

Use this agent for UX writing, interface copy, labels, error messages, empty states, onboarding text, help text, tooltips, alt text, link text, form instructions, and any words users read in the interface. Writes in plain language with cognitive accessibility built in. Dispatch when interface text needs to be written, reviewed, or improved. Use this instead of the built-in content-designer when working within a Designpowers workflow.

Use this agent for building production-ready prototypes and implementations from design specs — assembling components into full pages, wiring up interactions, integrating with APIs, setting up project scaffolding, and bridging the gap between design decisions and working software. Dispatch after the design-lead has made visual decisions and the motion-designer has defined animations. Use this instead of the built-in design-engineer when working within a Designpowers workflow.

Use this agent to review design work against the original plan, design brief, and design principles. Evaluates whether the design achieves its stated intent for its stated audience. Dispatch at review checkpoints or before handoff.

Use this agent for visual design execution — layouts, colour systems, typography, component design, responsive behaviour, interaction patterns, and design system work. Dispatch when the design plan is approved and implementation begins. Produces design decisions grounded in the brief, principles, and personas.

Use this agent for competitive UX analysis, design benchmarking, user insight synthesis, design pattern research, accessibility audits of competitors, trend analysis, and inclusion-aware research that informs design decisions. Dispatch before the team starts designing, or when design decisions need evidence. Use this instead of the built-in design-researcher when working within a Designpowers workflow.

Use this agent for upstream design thinking — user flows, information architecture, journey mapping, persona development, design principles, experience mapping, and setting design direction before visual work begins. Dispatch during discovery and strategy phases. Use this instead of the built-in ux-lead when working within a Designpowers workflow.

Use this agent to evaluate a design against established usability heuristics (Nielsen's 10) and conduct cognitive walkthroughs of key tasks. Dispatch after design-builder completes, alongside design-critic and accessibility-reviewer. Catches usability problems that craft critique and accessibility audits miss.

Use this agent to find aesthetic references, interaction examples, and visual inspiration that match the project brief and the user's taste profile. Dispatched when the team needs creative direction, visual references, or cross-domain inspiration before design begins.

Use this agent for animation and motion design — micro-interactions, page transitions, scroll-driven animation, loading states, spring physics, easing curves, and choreography. Ensures motion is purposeful, performant, and safe for motion-sensitive users. Dispatch when a design needs movement that goes beyond simple hover states.

Use when writing or structuring any user-facing content — interface copy, labels, error messages, help text, headings, alt text, link text, or form instructions — ensures content is readable, navigable, and meaningful for everyone

Use when designing for user preferences — motion sensitivity, contrast needs, colour schemes, text sizing, information density, or any interface behaviour that should adapt to individual needs

Use when evaluating mental load, wayfinding, focus management, memory demands, or decision complexity in any interface — ensures designs work for people with cognitive differences, under stress, or managing divided attention

Use when a design direction is uncertain, when the team could go multiple ways, or when the user wants to see competing approaches argued before committing — orchestrates structured debate between agents who advocate for different directions

Use when critique or review produces deferred findings, when checking accumulated design compromises, or when deciding what to address in the next iteration. Maintains a living register of design debt — the minor issues, future-iteration notes, and conscious compromises that accumulate across a project

You MUST use this before any creative or design work — building features, creating components, designing interfaces, modifying user-facing behaviour. Explores intent, constraints, users, and context before any design decisions are made

Use when design work is complete and needs to be communicated to engineering — creates specifications, documents rationale, accessibility requirements, and interaction details in a format engineers can implement directly

Use when starting a new project or when taste decisions are made — accumulates the user's aesthetic preferences, recurring patterns, and design instincts across projects so each new project starts with what the system already knows about their taste

Use after shipping or completing a design project — structured reflection on what worked, what didn't, what taste decisions landed, and what to carry forward. Feeds learnings back into design-memory so the next project is sharper

Use when any Designpowers agent starts work or completes work — maintains the shared design state file that all agents read from and write to. Invoke to initialise, read, or update the living design state document

Use when setting design direction — establishing principles, competitive positioning, experience mapping, or aligning stakeholders on what the design should achieve and why

Use when working with or building design systems — tokens, components, naming conventions, theming, or pattern libraries — ensures consistency, accessibility compliance, and systematic thinking

Use when calibrating aesthetic direction — capturing design references, quality benchmarks, and the subjective qualities that make a design feel elevated. Invoked between strategy and design to give agents a shared sense of what "good" looks and feels like for this project

Use when reviewing design work against a plan, design principles, or quality standards — provides structured critique covering design intent, accessibility, consistency, and user impact. This is the Designpowers critique skill — use this instead of the Superpowers design-critique when working within a Designpowers workflow

Use when defining who a design serves — creating personas, user stories, or scenarios — ensures the full ability spectrum and situational contexts are represented from the start, not retrofitted

Use when the team needs aesthetic references, interaction examples, or visual inspiration beyond competitive research — finds design patterns, UI references, and creative approaches that match the brief and taste profile

Use when designing states, transitions, animations, error handling, loading patterns, feedback, or any behaviour that responds to user action — ensures interactions are perceivable, operable, and inclusive

Use when designing animation sequences, page transitions, micro-interactions, loading states, or any motion that communicates meaning — ensures motion is purposeful, performant, and safe for motion-sensitive users

Use when user needs are unclear, assumptions need validation, or the design brief identifies gaps in understanding — plans what to learn, which methods to use, and from whom

Use when designing complex responsive layouts — breakpoint strategy, layout shifts, content reflow, responsive typography, container queries, and ensuring the experience works across the full device spectrum

Use after the fix round to validate the design by walking through key tasks as each persona — simulating how Jordan (low-vision), Priya (non-native speaker), Marcus (motor impairment), or any project persona would actually experience the interface. Catches the issues that code review misses because they only surface in the act of using

Use during the build phase to show the user intermediate visual output and ask for taste direction before the full build completes — enables mid-flight course correction so taste mismatches are caught early, not in review

Use when building or restructuring design token systems — global tokens, semantic tokens, component tokens, naming conventions, theming, and multi-platform token distribution

Use when building layouts, choosing colours, setting typography, establishing visual hierarchy, designing responsive behaviour, or making any visual design decision — ensures every visual choice serves both aesthetics and accessibility

Use when planning or conducting usability tests — writing test scripts, defining tasks, selecting participants, analysing findings, and turning observations into design actions

MUST run before any other Designpowers skill — shows welcome, checks taste profile, and routes to the correct first skill. Triggers on ANY design-related message. No other Designpowers skill may run until the welcome sequence has completed

Use before declaring any design work complete, fixed, or ready — requires running verification and confirming output before making any success claims. Evidence before assertions, always

Use when establishing or applying brand voice — defining voice attributes, tone adaptation across contexts, vocabulary lists, writing examples, and ensuring consistent personality across the interface

Use when you have a design brief or strategy and need to break implementation into reviewable chunks — creates step-by-step plans with verification criteria for each task

1 hook across 1 event