🖌️ PackIA: UI/UX Design
Research, wireframes, and agile design systems
Direct answer: Research, wireframes, and agile design systems This pack brings together 6 resources for Claude, Claude Code.
From the user interview to the design system: journey maps, annotated wireframes, Nielsen heuristics applied, and accessible components generated directly in code.
Included in the Pro — $30
Plans are cumulative: the Pro Plan includes all Essential Plan packs, and the Complete Plan includes all packs (Essential + Pro). This pack unlocks with the Pro ($30).
Buy with the Pro ($30) Or build your custom plan
Use cases
- Complete research plan with user interview scripts
- Wireframes + annotations for a critical flow in minutes
- Design system with documented AA-accessible tokens
Master prompt: Product Designer
You are a senior product designer. Product: {product}, user: {user}, problem: {problem}. 1) Assumptions to validate and a script for 5 interviews, 2) current user journey with pain points and opportunities, 3) solution as a textual wireframe: screens, states, and decisions with justification, 4) heuristics and accessibility checklist for the design, 5) usability test plan with 5 tasks and success metrics.
Included resources (6)
- figma-context (MCP Server, GLips/Figma-Context-MCP, ★ 15.9k) — Framelink Figma MCP: give coding agents Figma layout and design information to implement faithful UI. GitHub
- frontend-design (Skill, anthropics/skills, ★ 176.6k · official) — Guide Claude to create web interfaces with distinctive, intentional design, avoiding generic AI aesthetics. GitHub
- web-artifacts-builder (Skill, anthropics/skills, ★ 176.6k · official) — Suite for building complex HTML artifacts with React, Tailwind, and shadcn/ui: multi-component apps with state. GitHub
- magic (21st.dev) (MCP Server, 21st-dev/magic-mcp, ★ 5.9k · official) — Generate modern UI components (React and Tailwind) and search among 10,000+ community components. GitHub
- awesome-claude-code-subagents (Agent, VoltAgent/awesome-claude-code-subagents, ★ 25.1k) — 161+ Claude Code subagents in 10 categories: frontend, backend, architecture, security, data, QA, and DevOps. GitHub
- webapp-testing (Skill, anthropics/skills, ★ 176.6k · official) — Toolkit for testing web apps with Playwright: verify the frontend, debug the UI, capture screenshots, and read browser logs. GitHub
Versions by tool
Related packs
Frequently asked questions
What is the UI/UX Design pack?
Research, wireframes, and agile design systems Includes 6 resources.
Who is it for?
For professionals and teams working in UI/UX Design who want proven resources for their AI assistant.
What does it include and how much does it cost?
Includes 6 resources (Agent (1), MCP Server (2), Skill (3)) and unlocks with the Pro Plan ($30). Plans are cumulative.