Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I'm working on a web app that allows users to quickly build a custom quote by searching/filtering our (large!) product database.

My problem is that we will often have multiple vendors offering exactly the same product. I'm not sure if I should design it so each vendor's offering gets its own row (resulting in lots of duplicate offerings in the main view), or if there's a good way to "de-dupe" the main list and nest vendor offerings within that master list item?

Amazon deals with this problem by displaying the vendor with the best price in the main list, but allowing you to click on the product and pick a different vendor if you so choose.

We're really trying to emphasize clarity and speed (in that order) in the way we deal with this. Are you aware of any design patterns that apply here, or notable solutions to this problem elsewhere on the web?

share|improve this question
add comment

4 Answers

up vote 1 down vote accepted

Another solution could be to show each product only once but the list of vendors inside the row. This way you can not only show vendor but other types of information where the products has many different kinds, such as color.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

This use more vertical space but gives a better visibility for the different vendors. By using hints such as text size and typeface you can give an hierarchy to the displayed information. So that it's clear that the products has many vendors/colors or other. While still only showing one product.

share|improve this answer
    
This approach facilitates vendor visibility fairly well. I'll see how it would perform against our scenarios. Thanks @Alvin! –  Ben Berkompas Oct 4 '12 at 0:19
    
We've decided to go with a variation on your approach, @Alvin. Actually, it's a synthesis of your solution and the others' ideas. In the interest of keeping users on the main list page (i.e. not directing them to a separate item details page), each list item will display a single default vendor offering. When the user goes to click "Add to Quote," it will disclose additional vendor offerings on hover. That way we don't interrupt his decision process, but we make sure he sees all his buying options. –  Ben Berkompas Oct 5 '12 at 17:26
add comment

Let's discuss two places, the item list (search result rows / category browse) and the item details (page seen after you click on one of the rows).

  1. Item List

    In my eyes, you should return one row per product, meaning if 5 vendors offer exactly the same product, you should have a single row for all 5. This consolidated row should appear almost identical to other single-vendor rows (IMHO Alvin's multiline approach is too cluttered, and Benny's combo-box as well). I think having several types of rows is confusing. Regarding the item price, you can either use the lowest price (used by Amazon and eBay) or give a range (ie. $500-$750). If you really want another indication that this is a multi-vendor row (although I think it isn't needed), I would recommend an icon (with a tooltip explaining it), or maybe a numerical icon (with the number of vendors in it).

  2. Item Details

    The multi-vendor product should have a slightly different item details page. Instead of the traditional price + "add to cart" button on the top, you should have a table on top showing the different vendors. Each vendor will have its own row (probably ordered by price). You can include a column for every details which is specific to this vendor: the vendor's price, the vendor name / logo, "add to cart" button for this vendor. Also consider other fields such as quantity, availability, thumbnail image which may be specific to a vendor. If and only if every vendor supplies his own item description and images, consider sending to a separate Item Details page (for each vendor) from this table.

Keep in mind that if this product appears anywhere else after the vendor choice has been made (ie. when the product is found in the buyer's cart waiting for payment), it's a good idea to show the vendor name (in a subtitle or something).

As you've said, the best examples of similar design patterns are Amazon (many multi-vendor products) and eBay (traditionally have a row per vendor but trying to change that, take a look at eBay categories like DVD's which are easier to split into defined products, see http://pages.ebay.com/sellerinformation/news/highlightingvalue.html#hi).

share|improve this answer
    
Excellent thoughts @talkol. Much appreciated. –  Ben Berkompas Oct 4 '12 at 0:10
add comment

The main ambition in the user is to search for products and see how cheep can I buy this..? The user will, at first, not be interested in how many vendors there are that offers the product, or even which vendor is the cheapest, that becomes interesting first when a user is set on making a purchase.

To cater for this goal I would suggest simply listing different products based on the search pattern. Eg. search for 'Sony' and the site lists all products from that brand with the cheapest price displayed.

Once the a user wants to investigate a certain product more thoroughly they can click that product and get a list of different vendors with their prices, product information, maybe a feature to compare with products in the same category, etc.

share|improve this answer
    
You're right, this is a good way to accommodate the user who's primary concern is price. We're in the process of validating two other user goals, though – delivery lead-time, and vendor preference. That's where some of the complexity comes in: how to satisfy the user who needs it soon and doesn't care about price, and the guy who will buy from vendor X, regardless of price. I suspect both of those goals will be secondary, and the primary use case will be, as you said, "how cheap can I buy this?" Some more user research is requisite, obviously. Thanks for your input! –  Ben Berkompas Oct 4 '12 at 0:02
add comment

IF different vendors have the exact same product at different pricing you could probably follow the Amazon way by showing different vendors order by price in ascending order, like the following mockup:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

If you show the combo-box dropdown arrow, the user would know that there's more vendors available. If there is only one vendor - use just simple text so the user knows there's no other vendor to choose from.

share|improve this answer
    
Thanks for the input @Benny! The trouble with a select-box for our application is that we would need to include at least three pieces of information in a highly scannable form – price, vendor, and lead-time. If you can style options to be aligned in columns, this could work rather well. –  Ben Berkompas Oct 4 '12 at 0:22
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.