A month ago we announced our redesign of Shopping.com ( Before and After). We also mentioned that there was more work to be done and more improvements would be launched soon. Well, one just launched today — the Grid View. The Grid View makes it easier to browse items visually, while the Row View provides a little more information about each product.
Even more coming soon. Stay tuned.
I love that you've shown how the 'compare' feature works. It's the first time I've seen the process clearly illustrated.
One critique. In the Grid view, there's perilously little differentiation given to the "Compare Products" button. I had problems finding it amid the sea of similarly shaped "Compare Prices" buttons. The contrasting shape used in the list view is tremendously valuable.
I think it looks pretty good. My only comment on it is that the "help" bar part way down is hard to follow. I think if the instructions came before the pictures/icons, it would be a lot more useful. Instead, I found myself struggling, trying to figure out what the darn compare products button was doing, hanging there in the middle. Just an observation. Otherwise it looks great.
Overall this is one of the cleanest shopping sites I've seen (Amazon could use some 37signals action).
I'm not sure that the differences between row and grid view add very much.
The "compare products" is a good feature, but there's a learning curve to it, probably because there is a visual disconnect between the checkboxes and the compare products button. I do like that once the user has made a comparison the "how to compare products" mini manual goes away.
Underemphasized features like the "Find by..." options and Epinions integration actually do the most to enhance usability and the shopping experience. I would punch these up a notch.
The only real flaw is that the purchasing process is obscured by the label "compare prices." I understand that shopping.com does not actually fill orders, but if users doesn't see "shopping cart" or "buy" they might think this is only a comparison site. Why obscure the site's bread and butter?
Nice work 37. Two quick bits of feedback:
1. It's not clear what mode you're in. I don't think underlining the link is enough.
2. Placing the "Want to compare products side-by-side?" box below the first three items might make some people think they can only check items below it/above it or they might just wonder why it's between two sets of items. Why can't it just be placed at the top of the item listing, right after the blue bar?
Nice work, for sure. I love the feeling of 'clarity' or 'lack of clutter'...
I agree with Joshua's first point, wrt the second I think moving that bar up top would put too much of the main content 'below the fold', so to speak.
Were the 'compare products' buttons supposed to work? I couldn't get them to work in either Moz 1.0.2 or win IE6, but maybe it's me!
One last point - in the 'view as a grid' setting, the two 'Compare' buttons are the same shape and color (tho' different lengths), and in both the second word starts with 'p' (albeit products is shorter than prices).
Now, I have been in front of two monitors all day, but I found it hard to differentiate between the two in this view.
Hmm.. To clarify -
The two buttons are in vastly different locations in the grid view, however the "Compare Products" button is outnumbered so much by the 'Compare Prices' button that I dismissed it initially as just some sort of instruction...
It's not clear what mode you're in. I don't think underlining the link is enough.
Well, when they layout looks like a grid you are in grid view. When it looks like one product per row you are in row view. I think that's sufficient. Does it really matter anyway? You're in the view that works for you best.
This site is so hideous that I can not get past the visuals to even try the new features. Sorry.
Well, when they layout looks like a grid you are in grid view. When it looks like one product per row you are in row view.
That is just right.
(off I go to get untangled from the details... always caught up in the details...)
The pages are heavy, 70-90K just for HTML. What's with the nested tables and spacer gifs? Was there a "must look the same in NS 4.x" requirement?
Nice to see a faceted navigation scheme in use, but why are some facets not visible until drilling down deeper?
For example, what if I want a camera that connects via USB ... I only get to see that choice *after* I select a brand (and resolution).
For a site that is putatively all about "comparison", forcing the user to select a brand-delimited subset is ironic.
Well, when they layout looks like a grid you are in grid view. When it looks like one product per row you are in row view. I think that's sufficient.
I disagree. They look different, but definitely not different enough to be self evident. Grids, rows, columns - who's to say which is which?
You're in the view that works for you best.
So the site automatically knows which view is best for the user and changes it based on that? I'd heard of intelligent interfaces, but mind reading interfaces? Wow. (Sorry, I couldn't resist.)
So the site automatically knows which view is best for the user and changes it based on that? I'd heard of intelligent interfaces, but mind reading interfaces? Wow. (Sorry, I couldn't resist.)
Uh... No. You pick the view you like best -- the name of the view itself isn't that important.
I have to agree with Joshua on this one. I think you guys are looking at it from the "experienced" web users perspective where we are knowledgable about everything. Even a simple "Switch to view rows" would work better I think. You decided t show us the work you are doing and I don't think there is anything wrong with someone saying that they think it would be better like this. I was kind of surprised to see the way you responded JF, because I hold your professionalism in very high regard.
1. It's not clear what mode you're in. I don't think underlining the link is enough.
This was the original point. I get what jf is saying this way:
The options are there, you go ahead and choose one, and stick with the one you like - perhaps the emphasis of what mode you are in isn't great enough, and maybe you do know if yer in 'row' mode or in 'grid' mode, but really who cares so long as you're happy.
On a side note, in terms of directing eyes somewhere, maybe making this area somehow more visible would detract from the 'clarity' of the page?
Are you guys also helping Bizrate?
This page (http://shop.bizrate.com/buy/browse__cat_id--499.html) looks very similar to what you did on Shopping.com's search result. :)
An interactive camera selection tool is available at Iokio. As it is all in Flash, I like your approach to make it work along a similar line in HTML. Well done!
This topic is one we will tackle later in this article, but it refers to making sure that your application and the dock aren't fighting it out for supremacy of the screen.
If an application is designed well, the reward for users is that they will learn it faster, accomplish their daily tasks more easily, and have fewer questions for the help desk. As a developer of a well-designed application, your returns on that investment are more upgrade revenue, reduced tech support, better reviews, less documentation, and higher customer satisfaction. The rewards of building a good-looking Aqua application are worth taking the extra time.