R03Get them doing the thing
Pro

Search-first utility

Put the visitor's query fields above every explanation, then let results, filters and adjacent reassurance do the persuading.

Back to page recipes

Section sequence

6sections, in the order the visitor meets them. Bar height is the section's weight in the page.

  1. ActQuery fields
  2. NavigateCategory switcher
  3. DemonstrateResult set
  4. NavigateFilter rail
  5. ProveDecision-point reassurance
  6. ConvertContinue to the transaction

How the page argues

  1. 1

    Lead with the query fields, sized and labelled for the most common search.

  2. 2

    Offer category switching so a wrongly guessed intent is one tap from corrected.

  3. 3

    Return results carrying the two or three attributes that actually decide the choice.

  4. 4

    Put filters beside the results, not behind a modal, once the set outgrows a screen.

  5. 5

    Place reassurance at the decision point: rating, identity, availability, cancellation.

  6. 6

    Keep the account optional until the transaction genuinely needs it.

What each section has to be

ActQuery fields
The smallest input set that returns something useful, each field pre-filled with a sensible default.
NavigateCategory switcher
Visible alternatives to the default search type, inside the first screen rather than in the nav.
DemonstrateResult set
Real inventory with the deciding attributes on the card; placeholder cards destroy the recipe.
NavigateFilter rail
Filters that mirror how this domain actually narrows a choice, not every field in the database.
ProveDecision-point reassurance
Rating, identity and guarantee sit inside or beside the chosen result, never on a separate trust page.
ConvertContinue to the transaction
One clear action per result, plus a saved-search route for the visitor who is not ready.

Is this the right sequence?

Who it is for

Visitors who arrived with a specific need and an implicit query already formed in their head.

Products it suits

Marketplaces, inventory-rich services and on-demand transactions with enough supply that a first search returns something worth seeing.

Not for

A considered purchase with nothing to search, where an empty result set becomes the first impression.

Evidence strategy

Which proof modes carry the page, in the order they land.

  1. Primary: searchability — the visitor proves the inventory to themselves.
  2. Secondary: deciding attributes on the result card, which make the set comparable.
  3. Tertiary: reassurance adjacent to selection, which removes the last hesitation.

CTA plan

What the page asks for, what it offers instead, and where.

Primary
Search
Secondary
Switch category, or save this search
Placement
Search control in the first screen; a per-result action on every card; account creation only at the transaction.

Responsive behavior

What the sequence has to do when the viewport stops cooperating.

  • Query fields collapse into a single tappable summary that expands to the full form, preserving entered values.
  • The result grid becomes one column while keeping price and availability visible without a tap.
  • The filter rail becomes a bottom sheet that returns the visitor to the same scroll position on close.

Anti-patterns

The failure modes that make this sequence stop working.

  • A brand statement occupying the space above the search field.
  • Results that withhold price or availability until a detail page.
  • Filters or saved searches that require an account.
  • Running this recipe on thin inventory, where the first search teaches the visitor that the catalogue is empty.

Build spec

Pro

What an agent needs in order to build Search-first utility: what each section must contain, the copy rule that keeps it honest, the slots to resolve from your product, and the order to build in.

Checking access to the build spec

Agent tags

The vocabulary an agent matches this recipe on.

  • search-first
  • intent-fields
  • result-preview
  • filter-rail
  • marketplace-entry