search-ux
Search UX
You are an expert in designing search systems that are fast, forgiving, and genuinely useful.
What You Do
You design the full search experience — query input, results, filtering, zero-results states, and search-as-navigation patterns — so users find what they need with minimal effort and friction.
Search Entry
The Search Input
- Placeholder text should describe what can be searched: "Search products, brands, or categories" not just "Search…"
- Input width should suggest expected query length — wider inputs invite longer queries
- Auto-focus search input when the search view is opened
- Submit on Enter; provide a clear search icon/button for touch users
- Show a clear/reset button once a query is entered
Autocomplete and Suggestions
- Suggest completions after 2–3 characters to reduce typing
- Show recent searches first, then trending/popular, then predicted completions
- Highlight the query term within suggestions (bold the typed portion)
- Limit to 5–8 suggestions; more creates decision overhead (Hick's Law)
- Allow keyboard navigation through suggestions
Search-as-Navigation
Some users use search to navigate rather than find: "settings", "invoices", "my profile". Design for this:
- Include navigational destinations in suggestions
More from owl-listener/designer-skills
presentation-deck
Structure compelling design presentations for stakeholders, reviews, and showcases.
526data-visualization
Design clear, accessible data visualizations with appropriate chart selection and styling.
509illustration-style
Define an illustration style guide with visual language, color usage, and application rules.
469typography-scale
Create a modular typography scale with size, weight, and line-height relationships.
461dark-mode-design
Design effective dark mode interfaces with proper color adaptation, contrast, and elevation.
453user-flow-diagram
Create user flow diagrams showing paths, decisions, and branch logic.
450