🖌️ 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
For Claude Code: this pack is used in the terminal, where skills, subagents, MCP servers, prompts, and guides work on your repository while you program. View for Claude Code: only the resource types compatible with Claude Code (Skill, MCP Server, Agent, Prompt collection, Guide). The full pack has 6 resources.
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