contextual-help-design
Contextual Help Design
Design help that meets people where they are — on the screen they're stuck on, in language they understand, without requiring them to remember how they got there.
Core Principle
If a user gets stuck, they should be able to get help without leaving the screen they're on.
Design Patterns
Inline Help
- Tooltip or info icon next to fields that need explanation
- Examples shown next to input fields ("e.g., 15/03/2026")
- Help text visible by default for complex fields
- Inline definitions for specialist terms (underline + tooltip)
- "What's this?" links for uncommon concepts
More from owl-listener/inclusive-design-skills
plain-language-design
Write and review content for plain language accessibility. Use when writing interface copy, error messages, instructions, onboarding text, help content, legal or medical information, forms, or any user-facing text. Triggers on: plain language, reading level, simplify text, jargon, hard to understand, nobody reads this, unclear copy, rewrite, too complicated, ESL, literacy, readability.
13user-preference-respect
Design interfaces that detect and respond to system-level user preferences. Use when implementing dark mode, reduced motion, high contrast, text scaling, or any user preference that affects how the interface renders. Triggers on: user preference, system preference, prefers-reduced-motion, prefers-contrast, prefers-color-scheme, forced-colors, media query, user settings, system settings, accessibility settings, OS settings.
12situational-impairment-mapping
Map situational impairments that affect all users in specific contexts — not just people with permanent disabilities. Use when designing for mobile, outdoor, noisy, stressful, or multitasking contexts. Triggers on: situational, context of use, environment, one-handed, bright sunlight, noisy, driving, multitasking, gloves, temporary disability, context, edge case.
12multi-modal-input
Design interfaces that offer multiple input methods so users can choose what works for their abilities and context. Use when designing any interactive system where users provide input — forms, search, editors, creative tools, communication interfaces. Triggers on: multi-modal, input methods, alternative input, how people interact, mouse alternative, touch alternative, input flexibility, switch access, eye tracking, head pointer.
12keyboard-navigation
Design keyboard navigation and focus management for users who cannot or prefer not to use a mouse or touch screen. Use when designing any interactive interface — forms, menus, modals, tabs, carousels, drag-and-drop, data tables, or custom components. Triggers on: keyboard, focus, tab order, focus trap, skip link, arrow keys, keyboard shortcut, can't use mouse, motor disability, switch access, focus indicator, focus ring.
12voice-interaction
Design voice interactions and speech interfaces that work for people with diverse speech patterns, accents, and communication styles. Use when designing voice commands, voice search, dictation, voice assistants, or any interface that accepts speech input. Triggers on: voice, speech, dictation, voice command, voice search, speech recognition, accent, stutter, speech disability, non-verbal, AAC, voice assistant, talk to type.
12