Product search and zero results ↗
An empty search result should offer relevant ways forward. Shoppers need to revise their search without restarting their visit.
Find guidance for the task
you want to improve.
Search for a shopper problem, choose a task or explore articles referencing a storefront design. Each article explains data sources, boundaries and what to test.
9 of 87 articles
Search matches Norwegian and English text. A design reference does not mean every feature is implemented; read the example boundary.
Search, categories and product lists ↗
5Collection filters and variant matching ↗
Show applied filters and result counts. Allow multiple choices within a filter group so, for example, either of two colors can match.
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.
Breadcrumbs and return to product lists ↗
Separate category hierarchy from the previous results list. A return action should preserve query, filters and sort.
Product sorting with reliable data ↗
Sorting should fit the shopping task. Price, recency, popularity and ratings each need their own data.
Product selection, images and information ↗
1Product images, thumbnails and zoom ↗
Thumbnails show what additional images contain. Make them accessible on mobile too so shoppers can discover the other views.
Cart, checkout and payment ↗
3Cart quantities, removal and undo ↗
Plus/minus paired with a number field makes quantity changes easier. Update totals automatically and let shoppers undo a removed line.
Total cost and shipping before checkout ↗
Shipping cost affects product choice. Show a relevant estimate or explain clearly what remains to be calculated rather than hiding costs until the final step.
Checkout errors and recovery ↗
After an error, shoppers should retain their input and find what needs correction. Explain the problem at the field and make the next action clear.