search-ux
Design search experiences that help users find what they need, recover from failure, and refine results.
npx skills add Owl-Listener/designer-skills --skill search-ux --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# 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",
- What You Do
- Search Entry
- The Search Input
- Autocomplete and Suggestions
- Search-as-Navigation
- Results
- Results Layout
- Result Items
- Ranking and Relevance
- Filtering and Refinement
- Zero-Results State
- Search Analytics
- Best Practices
What does the search-ux skill do?
Design search experiences that help users find what they need, recover from failure, and refine results.
How do I install it?
Run `npx skills add Owl-Listener/designer-skills --skill search-ux --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From Owl-Listener/designer-skills, a repository with 1,964 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.