A mobile panel should allow several choices before replacing the results.
Mobile filters: apply and cancel
A separate mobile filter interface should let shoppers make several selections and apply them together with a clear, easily reachable button.
Research context: Baymard · Mobile interface controls ↗
Mobile uses a draft and Show products; desktop applies immediately. Both use the same data and controls.
Try the pattern
Task and expected result
- 01
At 390 px: open filters, choose two attributes and verify the list behind the drawer has not changed.
- 02
Cancel. Reopen: the draft should have been discarded.
- 03
Apply choices. Chips and URL should update; focus should return to the filter trigger.
- 04
Change filters and press Escape: discard draft, retain URL and return focus to the filter control.
- 05
Set minimum above maximum: Show products must keep the panel open with a specific error.
How to investigate value
Observe whether participants find an item meeting every need, not just how many cards they click. For measurement: relevant selections per eligible search/list visitor.
Watch for side effects
Zero results, false variant matches, lost list context and slow filters. More product-page visits are not necessarily better.
This is a proposed investigation, not a measured result. Choose one hypothesis and define the audience before testing.
Build a measurement plan for this concept ↗