Error Handling Ux
This walks you through the full error handling hierarchy from prevention to recovery, which is the right mental model. It pushes you toward inline validation, smart defaults, and constraint-based inputs before errors even happen, then covers detection patterns like real-time validation and network error handling. The communication guidelines are solid: human language, explain what happened and why, tell users what to do next. What I like is the practical breakdown by context (forms get inline plus summary, network errors get toasts with retry, permissions get explanations). It won't magically fix your error messages, but it gives you a checklist to avoid the worst mistakes like clearing forms on error or showing vague "something went wrong" messages.
- skills.sh installs
- 2.4K
- GitHub stars
- 3.3K
- last updated
- Aug 21, 2026
Install
$ npx -y skills add owl-listener/designer-skills --skill error-handling-ux --agent claude-codeInstalls into .claude/skills of the current project.
Files
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
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/owl-listener/designer-skills
- Categories
- Debugging, Design & UI/UX
- First seen
- Jun 3, 2026
More from owl-listener/designer-skills
All 68- Design Token2.4K
- Usability Test Plan2.4K
- Accessibility Audit2.4K
- Case Study2.4K
- Ux Writing2.4K
- Journey Map2.4K
- Component Spec2.4K
- Design Principles2.4K
- Theming System2.4K
- Competitive Analysis2.3K
- Feedback Patterns2.3K
- Design Brief2.3K
- Prototype Strategy2.3K
- User Persona2.3K
- Jobs To Be Done2.3K
- Gesture Patterns2.3K
- Handoff Spec2.3K
- Experience Map2.3K
- Naming Convention2.3K
- Empathy Map2.3K
- Documentation Template2.3K
- Pattern Library2.3K
- Affinity Diagram2.3K
- Interview Script2.3K
Recommended
More Debugging
omniverse-usd-performance-tuningnvidia/skillsTop-level workflow skill for USD performance diagnosis and optimization. Handles slow loading, high memory, low FPS, and broad scene-optimization requests; dele2.3Kskills.sh installs
rev-unicorn-debugp4nda0s/reverse-skillsDebug and emulate specific code fragments or functions using the Unicorn engine. Activate when the user wants to emulate a function with Unicorn, trace binary e1.9Kskills.sh installs
creating-oracle-to-postgres-migration-bug-reportgithub/awesome-copilotCreates structured bug reports for defects found during Oracle-to-PostgreSQL migration. Use when documenting behavioral differences between Oracle and PostgreSQ1.8Kskills.sh installs
ce-report-bugeveryinc/compound-engineering-pluginReport a bug in the compound-engineering plugin1.7Kskills.sh installs
react-performance-optimizationnickcrew/claude-ctx-pluginreact performance optimization1.7Kskills.sh installs