Agent skill

Error Handling UX

by Owl-Listener in Owl-Listener/designer-skills

Design error prevention, detection, and recovery across a product — message content, placement, and escape routes.

MITAuto-check passedDevelopment

Install Error Handling UX

skills CLI
$ npx skills add Owl-Listener/designer-skills --skill error-handling-ux -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install Owl-Listener/designer-skills error-handling-ux --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/Owl-Listener/designer-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/interaction-design/skills/error-handling-ux .claude/skills/error-handling-ux && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
error-handling-ux
GitHub stars
2.9k
Used in
1 other repo
Token cost
~487 tokens
SKILL.md length
228 words
Files
1
Skills in repo
107
Repo updated
First seen
Licence
MIT

At a glance

Design error prevention, detection, and recovery across a product — message content, placement, and escape routes.

  • Works in 4 steps: Prevention → Detection → Communication → …
  • Errors span multiple flows
  • SKILL.md covers What You Do, Error Handling Hierarchy, Error Message Format and Error States by Context, plus 1 more section
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Error Handling UX is an agent skill from Owl-Listener/designer-skills. Design error prevention, detection, and recovery across a product — message content, placement, and escape routes. Use when errors span multiple flows. For validation inside a single form, use form-design.

Its SKILL.md is about 490 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Error handling. The repository describes itself as: Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, interaction, and delivery. The licence is MIT.

When your agent uses it

  • Errors span multiple flows
  • Tasks that involve Error handling

Example prompts

  • “/error-handling-ux”

Workflow steps

4 steps, taken from the step headings in SKILL.md.

  1. Prevention
  2. Detection
  3. Communication
  4. Recovery

What it can do on your machine

Read from SKILL.md and the folder at commit 9a6930c. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Error Handling UX loads about 487 tokens when it runs. Until then it costs about 56 tokens; SKILL.md has 228 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~56
When it runs · the whole SKILL.md, loaded when a task matches
~487

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from Owl-Listener/designer-skills at commit 9a6930c, republished under its MIT licence (© Owl-Listener). 228 words, ~487 tokens.

Download SKILL.mdSave it as .claude/skills/error-handling-ux/SKILL.md (or your agent's skills folder).
name
error-handling-ux
description
Design error prevention, detection, and recovery across a product — message content, placement, and escape routes. Use when errors span multiple flows. For validation inside a single form, use `form-design`.

Error Handling UX

You are an expert in designing error experiences that prevent, detect, and help users recover from errors.

What You Do

You design error handling that minimizes frustration and helps users succeed.

Error Handling Hierarchy

1. Prevention
  • Inline validation before submission
  • Smart defaults and suggestions
  • Confirmation dialogs for destructive actions
  • Constraint-based inputs (date pickers, dropdowns)
  • Auto-save to prevent data loss
2. Detection
  • Real-time field validation
  • Form-level validation on submit
  • Network error detection
  • Timeout handling
  • Permission and authentication checks
3. Communication
  • Clear, human language (not error codes)
  • Explain what happened and why
  • Tell the user what to do next
  • Place error messages near the source
  • Use appropriate severity (error, warning, info)
4. Recovery
  • Preserve user input (don't clear forms on error)
  • Offer retry for transient failures
  • Provide alternative paths
  • Auto-retry with backoff for network errors
  • Undo for accidental actions

Error Message Format

  • What happened: Brief, clear description
  • Why: Context if helpful
  • What to do: Specific action to resolve

Error States by Context

  • Forms: Inline per-field + summary at top
  • Pages: Full-page error with retry/back options
  • Network: Toast/banner with retry
  • Empty results: Helpful empty state with suggestions
  • Permissions: Explain what access is needed and how to get it

Best Practices

  • Never blame the user
  • Be specific (not just 'Something went wrong')
  • Maintain the user's context and data
  • Log errors for debugging
  • Test error paths as thoroughly as happy paths

© Owl-Listener, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in interaction-design/skills/error-handling-ux of Owl-Listener/designer-skills.

Open the folder on GitHubat commit 9a6930c

Used in 1 other repository

We found 2 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in Owl-Listener/designer-skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Error Handling UX next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Error Handling UX compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Error Handling UX this skillOwl-Listener/designer-skills2.9k1 repos~487Automated safety check: PassMIT
Mole Bug Patternstw93/Mole70k—~2kAutomated safety check: PassGPL-3.0
Native Data FetchingCherryHQ/cherry-studio-app4k6 repos~2.9kAutomated safety check: NotesMIT
Rust Best Practicesfarm-fe/farm5.6k3 repos~1.1kAutomated safety check: PassMIT
R Function Input Validationtidyverse/dplyr5.1k1 repos~2.3kAutomated safety check: PassCustom licence
Next Best Practicesvercel-labs/openreview1.7k18 repos~1kAutomated safety check: PassNone

Similar skills

  • A catalog of recurring bug shapes in the Mole Mac cleaner, used to review safety-sensitive diffs for deletion safety, unbounded commands, shell traps and weak tests.

    70k GitHub stars~2k tokensUpdated yesterday
    DevelopmentAuto-check passed
  • Native Data Fetching

    CherryHQ/cherry-studio-app

    A skill your agent uses when implementing or debugging ANY network request, API call, or data fetching.

    4k GitHub starsUsed in 6 repos~2.9k tokens
    DevelopmentAuto-check: notes
  • Guide for writing idiomatic Rust code based on Apollo GraphQL's best practices handbook.

    5.6k GitHub starsUsed in 3 repos~1.1k tokens
    DevelopmentAuto-check passed
  • Validates arguments of exported R functions with the standalone check_* type checkers from rlang, in tidyverse style with clear error messages.

    5.1k GitHub starsUsed in 1 repo~2.3k tokens
    DevelopmentAuto-check passed
  • Next Best Practices

    vercel-labs/openreview

    Official

    Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization, bundling

    1.7k GitHub starsUsed in 18 repos~1k tokens
    DevelopmentAuto-check passed
  • Error Handling

    microsoft/data-formulator

    Official

    统一错误处理系统。在添加 API 端点、修改错误处理、添加前端 API 调用、编写错误相关测试时使用. An agent skill from microsoft/data-formulator.

    18k GitHub stars~3.8k tokensUpdated 2 days ago
    DevelopmentAuto-check passed

More from Owl-Listener/designer-skills

All 107 skills in this repo
  • A B Test Design

    Owl-Listener/designer-skills

    Design an A/B experiment — hypothesis, variants, primary metric, and sample size.

    2.9k GitHub starsUsed in 1 repo~472 tokens
    Auto-check passed
  • Accessibility Test Plan

    Owl-Listener/designer-skills

    Plan accessibility testing — assistive technologies, participant criteria, WCAG coverage, and session protocol.

    2.9k GitHub starsUsed in 1 repo~478 tokens
    Auto-check passed
  • Aesthetic Usability

    Owl-Listener/designer-skills

    Apply the Aesthetic-Usability Effect — polished, consistent interfaces are perceived as more usable and forgive minor friction.

    2.9k GitHub starsUsed in 1 repo~678 tokens
    Auto-check passed
  • Affinity Diagram

    Owl-Listener/designer-skills

    Cluster many qualitative data points into themes and insight statements.

    2.9k GitHub starsUsed in 1 repo~520 tokens
    Auto-check passed
  • Animation Principles

    Owl-Listener/designer-skills

    Apply animation principles — easing, staging, follow-through — to one specific UI motion.

    2.9k GitHub starsUsed in 1 repo~492 tokens
    Auto-check passed
  • Business Design

    Owl-Listener/designer-skills

    Read financials, map competitive landscapes, and argue design decisions in the language of value.

    2.9k GitHub starsUsed in 1 repo~1.1k tokens
    Auto-check passed

Categories

Questions about Error Handling UX

What does Error Handling UX do?

Design error prevention, detection, and recovery across a product — message content, placement, and escape routes. Error Handling UX is an agent skill from Owl-Listener/designer-skills. Design error prevention, detection, and recovery across a product — message content, placement, and escape routes.

When should I use Error Handling UX?

Error Handling UX fits situations like: errors span multiple flows; tasks that involve Error handling.

How do I install Error Handling UX in Claude Code?

Run `npx skills add Owl-Listener/designer-skills --skill error-handling-ux -a claude-code`. Or copy the skill folder (interaction-design/skills/error-handling-ux in Owl-Listener/designer-skills) into .claude/skills/error-handling-ux in your project. Claude Code loads it when a task matches its description.

How do I install Error Handling UX in Codex?

Run `npx skills add Owl-Listener/designer-skills --skill error-handling-ux -a codex`. Or copy the skill folder (interaction-design/skills/error-handling-ux in Owl-Listener/designer-skills) into .agents/skills/error-handling-ux in your project. Codex loads it when a task matches its description.

Can I use Error Handling UX in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add Owl-Listener/designer-skills --skill error-handling-ux -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/error-handling-ux, .gemini/skills/error-handling-ux, .github/skills/error-handling-ux and .opencode/skills/error-handling-ux in your project.

What does Error Handling UX need to run?

SKILL.md names no scripts, command-line tools or credentials: Error Handling UX is instructions for the agent only.

Does Error Handling UX access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Error Handling UX safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Error Handling UX use?

Error Handling UX is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Error Handling UX use?

About 487 tokens (SKILL.md is roughly 1.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Error Handling UX?

Skills that share tags, products or a category with Error Handling UX: Mole Bug Patterns (tw93/Mole, 70k stars), Native Data Fetching (CherryHQ/cherry-studio-app, 4k stars), Rust Best Practices (farm-fe/farm, 5.6k stars) and R Function Input Validation (tidyverse/dplyr, 5.1k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Error Handling UX?

Owl-Listener (a GitHub user) maintains it in Owl-Listener/designer-skills, which has 2,862 GitHub stars. The repository holds 107 skills in this directory. The repository was last updated on September 5, 2026.

Source: Owl-Listener/designer-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.