← All skill packs

UI Design & Frontend Skills

Skill pack
12 skills0 selected
varunk130Skills in this pack

WCAG 2.2 Level AA accessibility audit for AI product surfaces - color contrast, focus order, ARIA usage, keyboard navigation, motion/animation, reduced-motion respect, alt text, and form label association. Use when: accessibility audit, a11y review, WCAG audit, screen reader compliance, keyboard-only navigation, color contrast check, focus management, ARIA review, accessible AI UX.

English

Design user experiences for autonomous AI agents that act on behalf of users - control panels, consent flows, action previews, audit trails, and undo mechanisms. Use when: agentic AI, autonomous agents, AI autonomy controls, agent UX, AI actions, computer use, agent consent, agent audit trail.

English

Design conversational AI interfaces that feel natural, recover from failures gracefully, and build user trust through dialogue. Use when: chatbot UX, conversational UI, dialogue design, AI assistant interface, chat flow, turn-taking, AI persona voice, multi-turn context.

English

Design graceful failure experiences for AI products - hallucinations, uncertainty, wrong outputs, and edge cases. Use when: AI hallucination UX, error handling for AI, uncertainty design, graceful degradation, AI failure recovery, confidence thresholds, safe fallbacks.

English

Design feedback mechanisms that help AI systems learn from users - thumbs up/down, preference ranking, corrections, and human-in-the-loop escalation. Use when: RLHF UX, user feedback for AI, thumbs up down design, AI correction flow, human in the loop, feedback signal design, AI improvement loops.

English

Map human-AI interaction journeys - trust arcs, capability discovery paths, autonomy progression, and AI-specific touchpoints. Use when: AI user journey, human-AI interaction mapping, trust arc mapping, AI capability discovery, AI adoption journey, AI experience map.

English

Design onboarding experiences that help users build accurate mental models of AI capabilities, set expectations, and discover features progressively. Use when: AI onboarding, progressive disclosure for AI, capability communication, AI mental models, expectation setting, AI feature discovery, first-time AI user experience.

English

Design how AI presents results across text, code, images, charts, and mixed media - response formatting, output hierarchy, and cross-modal transitions. Use when: AI output design, response formatting, AI results display, multimodal output, AI-generated content presentation, code output UX, AI visualization.

English

Design AI-driven personalization that adapts interfaces to users while respecting privacy, avoiding filter bubbles, and maintaining user agency. Use when: adaptive UI, AI personalization, recommendation UX, filter bubble prevention, privacy personalization balance, algorithmic fairness UX, user preference learning.

English

Design the input experience for AI products - how users craft, structure, and refine their instructions to AI systems. Use when: prompt interface, AI input design, prompt templates, prompt suggestions, context window UX, instruction design, AI input affordances, prompt engineering UX.

English

Design safety experiences for AI products - content moderation UX, bias detection surfaces, harm prevention patterns, and responsible AI interfaces. Use when: AI safety UX, content moderation, responsible AI, AI bias UX, harm prevention, content filtering UX, AI refusal design, safety disclaimers.

English

Design explainability interfaces that help users understand AI decisions, build calibrated trust, and verify AI outputs. Use when: AI explainability, XAI UX, confidence indicators, citation design, source attribution, trust signals, AI transparency, why did AI do this.

English

Includes AI Accessibility Audit, AI Agent UX, AI Conversation Architect, and other workflows.

Install with
Claude CodeCodexCursorGitHub CopilotGemini CLI

Supported by the Atlas install prompt. Skill-specific requirements vary.

Pack stats

Skills12CategorygeneralStars0

What’s included

AI Accessibility Audit

WCAG 2.2 Level AA accessibility audit for AI product surfaces - color contrast, focus order, ARIA usage, keyboard navigation, motion/animation, reduced-motion respect, alt text, and form label association. Use when: accessibility audit, a11y review, WCAG audit, screen reader compliance, keyboard-only navigation, color contrast check, focus management, ARIA review, accessible AI UX.

AI Agent UX

Design user experiences for autonomous AI agents that act on behalf of users - control panels, consent flows, action previews, audit trails, and undo mechanisms. Use when: agentic AI, autonomous agents, AI autonomy controls, agent UX, AI actions, computer use, agent consent, agent audit trail.

AI Conversation Architect

Design conversational AI interfaces that feel natural, recover from failures gracefully, and build user trust through dialogue. Use when: chatbot UX, conversational UI, dialogue design, AI assistant interface, chat flow, turn-taking, AI persona voice, multi-turn context.

AI Error Resilience

Design graceful failure experiences for AI products - hallucinations, uncertainty, wrong outputs, and edge cases. Use when: AI hallucination UX, error handling for AI, uncertainty design, graceful degradation, AI failure recovery, confidence thresholds, safe fallbacks.

AI Feedback Loops

Design feedback mechanisms that help AI systems learn from users - thumbs up/down, preference ranking, corrections, and human-in-the-loop escalation. Use when: RLHF UX, user feedback for AI, thumbs up down design, AI correction flow, human in the loop, feedback signal design, AI improvement loops.

AI Journey Mapper

Map human-AI interaction journeys - trust arcs, capability discovery paths, autonomy progression, and AI-specific touchpoints. Use when: AI user journey, human-AI interaction mapping, trust arc mapping, AI capability discovery, AI adoption journey, AI experience map.

AI Onboarding & Calibration

Design onboarding experiences that help users build accurate mental models of AI capabilities, set expectations, and discover features progressively. Use when: AI onboarding, progressive disclosure for AI, capability communication, AI mental models, expectation setting, AI feature discovery, first-time AI user experience.

AI Output & Multimodal Design

Design how AI presents results across text, code, images, charts, and mixed media - response formatting, output hierarchy, and cross-modal transitions. Use when: AI output design, response formatting, AI results display, multimodal output, AI-generated content presentation, code output UX, AI visualization.

AI Personalization & Ethics

Design AI-driven personalization that adapts interfaces to users while respecting privacy, avoiding filter bubbles, and maintaining user agency. Use when: adaptive UI, AI personalization, recommendation UX, filter bubble prevention, privacy personalization balance, algorithmic fairness UX, user preference learning.

AI Prompt UX

Design the input experience for AI products - how users craft, structure, and refine their instructions to AI systems. Use when: prompt interface, AI input design, prompt templates, prompt suggestions, context window UX, instruction design, AI input affordances, prompt engineering UX.

AI Safety Guardrails

Design safety experiences for AI products - content moderation UX, bias detection surfaces, harm prevention patterns, and responsible AI interfaces. Use when: AI safety UX, content moderation, responsible AI, AI bias UX, harm prevention, content filtering UX, AI refusal design, safety disclaimers.

AI Trust & Transparency

Design explainability interfaces that help users understand AI decisions, build calibrated trust, and verify AI outputs. Use when: AI explainability, XAI UX, confidence indicators, citation design, source attribution, trust signals, AI transparency, why did AI do this.

Quick start

  1. Choose your skills. Select individual skills above, or choose the entire pack.
  2. Copy the install prompt. Use Copy install prompt above the list.
  3. Send it to your agent. Paste into your coding agent’s chat. Your agent reviews the source and guides the setup.

Try it with your agent

After installation, start with a request like:

Example request
Use the AI Accessibility Audit skill to help with my task.
Ask me for the context you need before getting started.

Requirements & license

  • A coding agent that can access your project files and install skills.
  • Your agent checks each skill’s instructions, dependencies, and permissions during setup.
  • Reported license for the skills shown: MIT. The author’s terms apply.
UI Design & Frontend Skills | Agent Skills Atlas