At iHerb, we are proud of offering over 30,000 brand name health products to consumers around the world. Meanwhile, choosing the right item among all similiar products has become a difficult task for our customers. We created a compare tool for users when browsing various selections.
Creating a tool that provides sufficent product information and helps users' decision making easier.
The design should be:
We have this feature available in all category and item detail page. So our users can save products and view differences during shopping.
Most feedbacks were positive except for minor UI adjustments when testing. All users were able to understand the concept and finish scenario tasks. The only concern was too many sticky elements on the screen. It may interrupt users' reading experience, especially for smaller screen phone users. After weighting tradeoffs against reading experience, we decided to give this design a try. Because only less than 5% of our users are still using 320 or smaller mobile devices; also, we provided hide and minimize options to reduct the inconvenience.
Few weeks after launch, we circled back to review the results. Unfortunately, it didn't work as good as we expected - the usage of this too is low.
We did not provide enough valuable information to users. Health products and electronics are not the same. Our customers are looking for products that effect their health directly. They want to make sure it's safe and perfectly fits their conditions. There is no one size for all compromise. They want to read the reviews from real users and experts' suggestions instead of just cold numbers and jargon that they don't understand.
We need to find a better way to display user generate contents and filter lengthy product information.
We allow comparing oranges to apples! Now, we make all products available for comparison. However, comparing products in different categories gives no value to our customers. In this case, a lot of users take the compare tool as a simplified wishlist/cart to store products temporarily, which is not the purpose of this tool.
We may combine compare with cart or shopping list since it fits users' mental model better. If we choose to keep this a stand alone feature, we should limited the scope to products in the same category only which makes the comparison more meaningful.
At beginning, I was very excited about creating all these interesting animations and thought this would be an easy and successful project but it wasn't. The main reason we failed was because We put too much focus on UI and micro interaction instead of thinking through users' intentions and find out what they really need.
