Does this site use a good UI for shopping cart? How do you drop something in the cart? Is it intuitive enough to be used?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
Not really, I think.
The main irritating thing is that you can't drag an item from the front page (the link you gave). If you try to drag the image or the name of the set there, it doesn't work. And, that is a bit strange as the shopping cart is visible, and explaining you to drag items into it. It remains unclear what 'an item' is.
You have to get to the icon set page (which is a bit hard as you only get there via the small link, not via the image or the collection header) to get to something they mean with 'an item'. Second, when dragged, the item doesn't directly show that your drag was successful. When you hit the cart the display remains the same as if you were somewhere else on the page or not even dragging at all*. It takes a while before a wait-icon is visible and it becomes clear that you have dragged successful.
These two things should be improved I would say.
(* Apparently you don't even have to drag items in the cart, just start to drag them and it works..)
First, I noticed the "shopping cart" area on the right and the advice: "Drag item here to shop".
I tried dragging one of the large, inviting images from the home page right into the cart, but that didn't work.
I then noticed that each image actually represented different sets coming at different prices. I tried dragging the set link on the bar. However, that also didn't work.
I afterwards tried dragging the description, again the image, the whitespace in each
product_item div... nothing.
I finally decided that I would open a set page, which featured a prominent "Add to cart" button and a "+" button over the image. This would let me purchase items traditionally, but made the dragging tip even more confusing: did I miss something on the homepage?
I skeptically tried dragging the large icon from the set page on the cart. That also didn--- oh wait, that's a throbber... and now it's there, unlabeled and scaled down.
Things you could consider: (to be taken with a grain of salt)
I don't see a huge problem with it. As well as drag-and-drop, the icon set pages (that can be reached by clicking on them) have add to cart buttons. I also like the fact that, unlike many other online stores, you don't have to visit another page to see the contents of your shopping cart.
It's like one of those fancy UIs we see in movies that we don't in real life, not because they're hard to implement, but because they're hard to use.
For someone with difficulty in motor skills, this can be quite hard to use. Dragging and dropping using a trackpad isn't often as responsive as doing it with a mouse. (Some trackpads just happen not to be very responsive.) What could be done with one click now needs a mousedown, a precisely targeted mousemove, and a mouseup. Basic knowledge of Fitts' law can tell you why this is a harder task than simply clicking a button.
There is a reason computer interfaces do not try to mimic real life interfaces (which is what this UI is trying to do, IMO.) That's why we don't walk through "aisles" of "3D stores" but instead have pages dedicated to products where we click the "add to cart" button. What is natural for a walk-and-pick-up UI is not natural for a WIMP (windows, icons, menu, and pointing device) UI.
I think I should stop now.
I think it is one of those cases where they let the coolness distract them from the core functionality. It is a bit hard to use, shows very little info about what is in it.
So I would say that it is OK, most users would be able to buy there yet I don't think I would use it in my site.
also like @simon said, it would be an issue if JS is turned off.
It took me a while to figure out why you added the drag-and-drop option because it wasn't obvious that it is possible to buy individual icons and not just sets.
I added a set and then tried to add individual icons but when I tried to add an icon that is a part of the set I already added - it just wasn't added. It's confusing and frustrating.
The cart is showing small arrows on the top and bottom for scrolling when there are many items in the cart. It's also confusing. Maybe just show these icons when the sixth icon is added or show a small part of the sixth icon so I would know there are more. Now I add additional icons and can't figure out where they went. Scrolling didn't work for me using Chrome 6.
It found it strange that you can't drag and drop by clicking the plus sign. BTW - the tooltip says "Remove".
Although this feature is cute, I prefer a single click on the add-to-cart button or plus sign than dragging items to the cart. It's more efficient.
I read somewhere an opinion that pagination is not really needed anymore, especially when it comes to pictures. The human eye is great at seeing many images and picking the ones you like. It may be easier for buyers if you just show all the icons on a single page - a much better shopping experience.
Site looks great and the icons are excellent.