Feature Request: UI/UX Designer Agent > Design-Driven Development with Actionable Artifacts

[nnation]

Summary

Squad currently includes Redfoot (Graphic Designer) for brand assets like logos and icons, and Marquez (CLI UX Designer) for CLI interaction design. However, when a Squad team is building user-facing software, a web app, mobile app, or any product with a visual interface, there is no agent that fills the role of a UI/UX Designer: someone who thinks about information architecture, user flows, interaction patterns, and visual design before and during development.

I'd like to propose a new agent role: a UI/UX Designer Agent that produces actionable design artifacts to guide development.

What This Agent Would Do

• Wireframes and mockups: Generate low-fidelity wireframes and high-fidelity visual mockups (as SVG, HTML, or descriptive specs) that the frontend agent can reference directly when building components. These should be committed as artifacts alongside the code.
• Design tokens and style guides: Define and maintain a design system, color palettes, typography scales, spacing units, component variants, and states (hover, active, disabled, error) as structured files (JSON/YAML/CSS custom properties) that developers can consume programmatically.
• Coded prototypes: Produce working HTML/CSS prototypes for key screens or interactions, allowing the team to validate layout, responsiveness, and interaction feel before committing to full implementation. These prototypes serve as living references.
• User flow mapping: Diagram end-to-end user journeys and interaction flows (using Mermaid, SVG, or structured markdown) that inform both frontend routing and backend API design giving the Lead and other agents shared context on how users move through the system.
• Design review and feedback: Review frontend implementation against the design spec and flag deviations, mismatched spacing, wrong color values, missing states, accessibility gaps, as structured feedback that the frontend agent can act on.
• Tool-aware output: Adapt artifact format based on the project's stack and needs. For example, produce Tailwind utility classes for a Tailwind project, Material Design tokens for a Material UI project, or platform-specific guidelines for mobile (iOS HIG, Material Design 3).
  How It Differs from Existing Agents

Agent	Focus	Gap Addressed
Redfoot (Graphic Designer)	Logo, icons, brand assets, design system (visual identity)	Does not design screens, user flows, or interaction patterns for the built software
Marquez (CLI UX Designer)	CLI interaction design, copy, spacing, affordances	Scoped to terminal/CLI UX, not visual interfaces
Proposed UI/UX Designer	End-to-end UI/UX design for the software being built	Provides design intent, specs, and artifacts that directly inform frontend development

Routing Suggestion

{ pattern: 'ui-ux-design', agents: ['@<name>'], description: 'Wireframes, mockups, design tokens, style guides, user flows, coded prototypes, design review' }

Why This Matters

One of the most common failure modes in software development, even with strong engineering, is building the wrong thing or building it without design coherence. When developers code without a design reference, they make ad-hoc UI decisions that accumulate into inconsistency. A UI/UX Designer agent addresses this by producing the same artifacts a human designer would hand off: wireframes to align on layout before coding, a design system to enforce consistency, and coded prototypes to validate interaction feel.

In Squad's parallel execution model, this agent would work alongside the Lead and Frontend agent early in a feature cycle, producing design specs that the frontend agent then implements, and reviewing the output for fidelity. This mirrors the "designer → developer → review" workflow that high-functioning product teams use, but within Squad's AI-native orchestration.

I'd welcome feedback on whether this should be a built-in template role, how it should interact with the existing Redfoot and Marquez agents (potentially sharing a visual-identity skill or collaborating on a shared design system), and what artifact formats the community finds most useful.