web-designer

Design user interfaces and design systems for web and mobile experiences.

35|3|Updated Jun 24, 2025

Search Tags:#design #accessibility #UI/UX #prototyping #wireframes #design-systems

Ready to run

npx skills add https://github.com/intelligentcode-ai/intelligent-claude-code --skill web-designer-intelligentcode-ai

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: web-designer
Source: https://github.com/intelligentcode-ai/intelligent-claude-code/tree/main/src/skills/web-designer
Command: npx skills add https://github.com/intelligentcode-ai/intelligent-claude-code --skill web-designer-intelligentcode-ai

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams convert ideas into polished UI concepts, cohesive designs, and accessible interfaces, reducing design iteration time and misalignment.

Core Features & Use Cases

User Research & Personas: Translate user insights into compelling interface directions.
Visual Design & Systems: Create a consistent visual language, design tokens, and component libraries.
Accessibility & Responsiveness: Ensure WCAG-compliant, responsive designs across devices.
Use Case: When building a web app, outline IA, wireframes, and a draft style guide to align stakeholders.

Quick Start

Outline the target user, device constraints, and branding goals for your interface to start.

Frequently Asked Questions about web-designer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I design intuitive interfaces and create a cohesive design system for web apps?▼

You can design intuitive interfaces by translating user insights into wireframes, visual design specifications, and cohesive design systems. This process establishes a consistent visual language using design tokens and component libraries for web and mobile apps.

What is the best way to ensure my UI design is WCAG-compliant and responsive across devices?▼

The best way to ensure WCAG-compliant UI design is to integrate accessibility and responsiveness checks throughout the visual design phase. This ensures your interfaces meet accessibility standards across all web and mobile device constraints.

How do I convert user research and personas into a visual design direction?▼

You convert user research into visual design by translating user insights and personas into compelling interface directions. This involves defining the target user, device constraints, and branding goals to guide the visual language and component library.

Can I use this approach to generate design tokens and component libraries for mobile interfaces?▼

Yes, you can generate design tokens and component libraries for mobile interfaces using this approach. The process supports creating a consistent visual language tailored to specific device constraints across both web apps and mobile platforms.

Do I need prior UX research to start building wireframes and a style guide?▼

You do not need prior UX research to start, but providing target user details, device constraints, and branding goals is required. This initial input enables the process to draft information architecture, wireframes, and a style guide effectively.