error-prevention-recovery

Name: error-prevention-recovery
Author: Owl-Listener

82stars25forks

How to install error-prevention-recovery?

owl-listener/inclusive-design-skills/error-prevention-recovery

$npx -y skills add Owl-Listener/inclusive-design-skills --skill error-prevention-recovery

Installs into the current project.

Summary

Design error prevention, error messages, and recovery flows for cognitive accessibility. Use when designing forms, checkout flows, account creation, settings, data entry, or any flow where users can make mistakes. Triggers on: error handling, error messages, form errors, validati

Files · 1

View on GitHub

SKILL.md

1	# Error Prevention and Recovery
2
3	Design systems that prevent errors before they happen, and when errors
4	do occur, help people recover without shame, confusion, or lost work.
5
6	## Prevention Strategies
7
8	### Forgiving Input
9	- Accept multiple date formats ("15/03/2026", "15 March 2026", "March 15, 2026")
10	- Accept multiple phone formats ("(555) 123-4567", "555-123-4567", "5551234567")
11	- Auto-format as the user types
12	- Case-insensitive matching
13	- Trim whitespace automatically
14	- Show format examples next to fields ("e.g., 15/03/2026")
15
16	### Smart Defaults
17	- Pre-select the most common option
18	- Pre-fill known information (name from account, address from postcode)
19	- Show the recommended choice for complex decisions
20	- Default to the safest option for irreversible settings
21
22	### Progressive Validation
23	- Validate each field when the user moves to the next (on blur)
24	- Show success states for correctly completed fields
25	- Never validate while the user is still typing
26	- Never clear user input on error — always preserve their work
27
28	### Minimal Demands
29	- Only ask for information you strictly need
30	- Mark optional fields, not required ones (most fields should be required
31	by design — if they aren't needed, remove them)
32	- Break long forms into steps with clear progress
33
34	## Error Message Design
35
36	Every error message must answer three questions:
37	1. What happened? (specific, not generic)
38	2. Why? (in plain language)
39	3. What do I do now? (a clear, single action)
40
41	### Examples
42
43	Bad: "Invalid input"
44	Good: "Please enter a date in the format DD/MM/YYYY — for example, 15/03/2026"
45
46	Bad: "Error 403"
47	Good: "You don't have permission to view this page. Contact your team admin to request access."
48
49	Bad: "Password does not meet requirements"
50	Good: "Your password needs at least 8 characters and one number. You have 6 characters."
51
52	### Error Message Tone
53	- Never blame the user ("You entered an invalid email")
54	- State the situation neutrally ("We need a valid email to continue")
55	- Be specific about what needs to change
56	- Offer an alternative path when possible
57
58	## Recovery Design
59
60	- Undo available for at least 10 seconds after any action
61	- Confirmation before destructive actions with useful detail:
62	"Delete 'Project Alpha'? This removes all 23 files. This cannot be undone."
63	- Preview before submission for any consequential action
64	- Save progress automatically in long flows
65	- Alternative path when primary path fails:
66	"Can't upload a photo? You can describe what you see instead."

People who liked this also viewed

6 picks

Type

error-prevention-recovery

82stars25forks

View on GitHub

How to install error-prevention-recovery?

owl-listener/inclusive-design-skills/error-prevention-recovery

$npx -y skills add Owl-Listener/inclusive-design-skills --skill error-prevention-recovery

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Error Prevention and Recovery
2
3	Design systems that prevent errors before they happen, and when errors
4	do occur, help people recover without shame, confusion, or lost work.
5
6	## Prevention Strategies
7
8	### Forgiving Input
9	- Accept multiple date formats ("15/03/2026", "15 March 2026", "March 15, 2026")
10	- Accept multiple phone formats ("(555) 123-4567", "555-123-4567", "5551234567")
11	- Auto-format as the user types
12	- Case-insensitive matching
13	- Trim whitespace automatically
14	- Show format examples next to fields ("e.g., 15/03/2026")
15
16	### Smart Defaults
17	- Pre-select the most common option
18	- Pre-fill known information (name from account, address from postcode)
19	- Show the recommended choice for complex decisions
20	- Default to the safest option for irreversible settings
21
22	### Progressive Validation
23	- Validate each field when the user moves to the next (on blur)
24	- Show success states for correctly completed fields
25	- Never validate while the user is still typing
26	- Never clear user input on error — always preserve their work
27
28	### Minimal Demands
29	- Only ask for information you strictly need
30	- Mark optional fields, not required ones (most fields should be required
31	by design — if they aren't needed, remove them)
32	- Break long forms into steps with clear progress
33
34	## Error Message Design
35
36	Every error message must answer three questions:
37	1. What happened? (specific, not generic)
38	2. Why? (in plain language)
39	3. What do I do now? (a clear, single action)
40
41	### Examples
42
43	Bad: "Invalid input"
44	Good: "Please enter a date in the format DD/MM/YYYY — for example, 15/03/2026"
45
46	Bad: "Error 403"
47	Good: "You don't have permission to view this page. Contact your team admin to request access."
48
49	Bad: "Password does not meet requirements"
50	Good: "Your password needs at least 8 characters and one number. You have 6 characters."
51
52	### Error Message Tone
53	- Never blame the user ("You entered an invalid email")
54	- State the situation neutrally ("We need a valid email to continue")
55	- Be specific about what needs to change
56	- Offer an alternative path when possible
57
58	## Recovery Design
59
60	- Undo available for at least 10 seconds after any action
61	- Confirmation before destructive actions with useful detail:
62	"Delete 'Project Alpha'? This removes all 23 files. This cannot be undone."
63	- Preview before submission for any consequential action
64	- Save progress automatically in long flows
65	- Alternative path when primary path fails:
66	"Can't upload a photo? You can describe what you see instead."

People who liked this also viewed

6 picks

Type