Search UXby Owl-Listener

Search UX Skill.

Design the full retrieval experience, including the searches that fail.

Interaction Design
Search

Source Review · Search UXSKILL.md

Task Interaction Design Produces • A search-entry and suggestion specification. • Result-card or result-row content and filter behavior. • Zero-results recovery and requirements for measuring search behavior. Before You Start Search services and query instrumentation are external to this guidance.

Editorial summary · source reviewed 2026-10-07 · not a generated example

01 What It Does

Design Search That Helps Users Recover

A complete search-interface guide including entry, suggestion, ranking presentation, refinement, and zero-result recovery.

Source-based workflowNot an execution benchmark

The Working Approach

Search UX covers the path from entering a query to deciding which result to open. It considers suggestions, keyboard access, result grouping, snippets, metadata, and refinement rather than treating search as an isolated input box. It also recognizes that people sometimes search for a destination such as settings instead of a content item.

The strongest emphasis is on recovery. A zero-results view should preserve the query, explain what was searched, and offer relevant corrections or alternative routes. These are interface requirements: implementing typo tolerance, relevance ranking, and personalization still depends on the actual search system.

Expected Deliverables

A search-entry and suggestion specification.
Result-card or result-row content and filter behavior.
Zero-results recovery and requirements for measuring search behavior.

See the Example Brief

From Brief to Review

01
Define Searchable Material
List content types and navigational destinations, then choose the information a result needs to support a click decision.
02
Specify Retrieval and Refinement
Design query persistence, suggestions, keyboard movement, result counts, and individually removable filters.
03
Handle Unsuccessful Queries
Provide corrections or broader routes where supported, and identify query and abandonment signals worth observing.

02 When to Use It

When to Use It

Search services and query instrumentation are external to this guidance.

A Good Fit

Large CatalogsUseful where users need to retrieve items by attributes rather than browse a small hierarchy.
Search RecoveryHelps teams improve an empty results screen that currently ends the task.

Limits to Check

Not a Search EngineThe source does not provide an indexing backend or implement ranking algorithms.
Not Browse ArchitectureA good search interface does not remove the need for understandable categories and navigation.

Bring These Inputs

Content TypesSupply searchable fields and the metadata users need to distinguish results.
Query EvidenceInclude common queries, zero-result examples, and navigational searches if available.
Backend CapabilitiesState available typo handling, filters, sorting, and personalization rather than assuming them.

03 Decisions That Matter

Decisions That Matter

Explain Why a Result Matches
A useful snippet or matched-field cue reduces guesswork before opening a result.
Filters Remain Reversible
Visible, individually removable filters help users understand and undo a narrow result set.

04 Try a Focused Brief

Try a Focused Brief

The example brief below has not been tested. Check the skill’s setup before using it.

Review the Setup

Use the repository's documented installation route and retain any referenced companion files. This entry describes a focused design method rather than an executable application.

Upstream Source File

https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/search-ux/SKILL.md

Search services and query instrumentation are external to this guidance.

Start With One Deliverable

Adapt the scope, source material and constraints in this brief before running the skill.

Example Brief

Use search-ux for a library containing design templates, authors, and tutorials. Design suggestions, grouped results, and removable filters. Include a misspelled zero-result query and a navigational query for account settings. Mark any behavior that requires search-backend work.

Inspect the Result

Check the actual output against these observable criteria.

The entered query survives refinement and empty results.
Applied filters are visible and removable.
Result metadata helps distinguish otherwise similar titles.

OpenDesign provides a local design workspace for coding agents. This listing does not mean the skill is bundled or that its external tools, credentials and software dependencies are included.

Download OpenDesign Read the Quickstart

05 Source and License

Source and License

This page describes the pinned source revision linked below. Upstream behavior and requirements can change.

Source Owner: Owl-Listener
Repository: Owl-Listener/designer-skills
Skill File: interaction-design/skills/search-ux/SKILL.md
License: MIT
Reviewed Snapshot: 2026-10-07 · 9a6930cf84a8

Editorial Source Summary

A complete search-interface guide including entry, suggestion, ranking presentation, refinement, and zero-result recovery.

Original summary by OpenDesign, based on the linked source. Repository stars are a dated popularity signal, not skill usage or a quality score.

06 Questions Before You Start

Questions Before You Start

Can it add typo tolerance?

It can specify the desired behavior. The search backend must support or implement that behavior.

Should results always use a grid?

No. The source distinguishes scanning-friendly lists from grids where visual thumbnails are the main selection signal.

Why include navigation destinations?

Some queries express a desire to reach a known part of the product rather than locate a document.

OpenDesign

Make Room for the Next Design Iteration.

Keep your brief, source material and design work together in a local workspace. Check the skill’s own setup before adding it to your workflow.

Download OpenDesign Browse Design Skills