Ux Designer
Creates user-friendly website prototypes and UI elements based on provided briefs and design principles.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add daffy0208-ux-designer npx -- -y @trustedskills/daffy0208-ux-designer
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"daffy0208-ux-designer": {
"command": "npx",
"args": [
"-y",
"@trustedskills/daffy0208-ux-designer"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill enables AI agents to design user-friendly website prototypes and UI elements following a structured 5-phase UX design process. It focuses on creating intuitive and accessible experiences based on user research and usability testing, rather than personal preference. The process includes information architecture, user flow mapping, wireframing (low, mid, and high fidelity), prototyping & testing, and final UI design with handoff considerations.
When to use it
- Creating a new website or application from scratch.
- Redesigning an existing website or application for improved usability.
- Mapping out user flows for specific tasks within a digital product.
- Developing wireframes for core screens and functionalities.
- Generating interactive prototypes for usability testing with users.
Key capabilities
- Information Architecture: Card sorting, site mapping, navigation design, labeling.
- User Flow Mapping: Designing onboarding flows, core task flows, error states, and edge cases.
- Wireframing: Creating low-fidelity sketches to high-fidelity designs with attention to visual hierarchy, accessibility, and touch target sizes.
- Prototyping & Testing: Utilizing tools like Figma, Adobe XD, Framer, or InVision to create interactive prototypes and conducting usability testing (including task completion rate measurement).
- UI Design: Defining design system elements such as colors, typography, spacing, components, and icons.
Example prompts
- "Create a user flow for onboarding new users."
- "Generate wireframes for the homepage and core task screens of a website."
- "Design a prototype to test the checkout process with 5 users."
- “Map out the information architecture for an e-commerce site.”
Tips & gotchas
- The skill emphasizes user research and usability testing; providing relevant data or context will improve results.
- While Figma is recommended, the agent can use other prototyping tools like Adobe XD, Framer, or InVision.
- The design process follows a specific 5-phase structure; understanding this flow helps in guiding the AI agent effectively.
Tags
TrustedSkills Verification
Unlike other registries that point to live repositories, TrustedSkills pins every skill to a verified commit hash. This protects you from malicious updates — what you install today is exactly what was reviewed and verified.
Security Audits
| Gen Agent Trust Hub | Pass |
| Socket | Pass |
| Snyk | Pass |
🌐 Community
Passed automated security scans.