How to Design a Product Finder for a Complex Catalogue
A product finder helps customers answer a specific question: which product suits their vehicle, equipment or intended use?
The design starts with reliable product data and clear rules. Filters become useful once the system can explain which choices matter.
We built ROH Wheels' catalogue so customers could select a vehicle, explore wheel options and request a quote from a dealer. Here are the decisions to work through on a similar project.
Start with what customers know
A specialist may arrive with a product code. Someone buying for the first time may know only their vehicle model or the job they need to do.
Support both routes where needed: direct search and guided selection.
Decide what the finder can establish. It might confirm compatibility from approved data, suggest candidates or collect details for an expert to review. The wording should match that purpose.
Separate products, variants and compatibility
Store the product family separately from options such as size, finish and region. Keep compatibility rules in records the team can maintain.
ROH's catalogue includes more than 1,000 vehicle and wheel-size configurations. The rules combine diameter, width, stud count, PCD and offset, with statuses such as recommended, aggressive and not recommended. Model-specific exceptions, including track correction, also affect the guidance. A single “fits this vehicle” checkbox would lose those distinctions. ROH's internal team supplied the website design; we built the catalogue and fitment behaviour.
Work with the product specialist to agree:
- Which attributes determine a match.
- Which combinations are invalid or need review.
- Who supplies and approves the data.
- How exceptions are recorded.
- What happens when information is missing.
Build those decisions into the data model before laying out the filters.
Make sure the same variant matches
Consider this fictional product family:
| Variant | Finish | Size |
|---|---|---|
| A | Black | 18-inch |
| B | Silver | 20-inch |
The family has both a black finish and a 20-inch option, but it has no black 20-inch variant. A filter that checks those attributes independently across the family can return an impossible combination. Check the attributes on the same available variant before offering it for a quote or order.
For ordinary multi-select filters, customers usually expect “black or silver” within Finish, combined with “20-inch” across Size. Baymard's filtering research describes this OR-within, AND-between convention. Keep compatibility rules as an additional constraint.
Show the active selection
If a vehicle, application or region changes the results, keep that selection visible. Let customers change it without starting again.
Check what happens when someone returns with an old selection or follows a shared product link. Ask for missing information before showing a compatibility result.
When a choice changes, recheck dependent options:
| Customer action | Expected response |
|---|---|
| Select a vehicle or application | Show relevant products and the active selection |
| Choose a variant | Update guidance for that combination |
| Change the vehicle or application | Recheck the variant and explain any reset |
| Open a link without a selection | Ask for the details needed to assess suitability |
| Remove a filter | Restore results while keeping unrelated choices |
Test caching with these states too. A cached page must reflect the current selection.
Explain why there are no results
“No results” can mean several things: no compatible product, incomplete data, unavailable stock or a market restriction.
Give each case an appropriate explanation and next step. Customers may need to change a filter, check a detail or ask a specialist.
Keep unknown compatibility distinct from confirmed compatibility. If expert advice is needed, carry the details already entered into the enquiry.
Include the selected options in the quote
Avoid sending customers from a completed selection into an empty contact form.
On the ROH website, quote requests include the chosen wheel and vehicle and go to a dealer. The receiving team gets the details behind the enquiry.
Decide what to retain when products change later. Staff may need a record of the options submitted as well as the current catalogue entry.
Test updates as well as browsing
Ask the catalogue team to add a product, retire a variant, correct a rule and import an incomplete record. Check how errors are reported and changes are reviewed.
Use the product finder test matrix for valid, incompatible and unknown combinations. Include changed selections, shared links and the final quote or order.
Test mobile and keyboard use, then confirm that the receiving team gets the correct details.
Our website development team can help build the catalogue, finder and enquiry process.