0

I'm working on a product carousel for an e-commerce site.

I have a list of elements of one tile:

  • Price
  • Crossed price
  • Badge/ribbon
  • Image
  • Caption (Product’s name)
  • CTA (i.e. Show) as a button
  • Ratings/Reviews (stars, number of stars, grey if none)
  • Thumbnails (optional)
  • Availability in stock
  • Button, i.e. “More details”

Question: Let's say that we have a T-shirt available in 5 different colours. How can it be shown on product carousel on home page?

I thought about showing some colours block under the picture of a product. If doing so: How many of such colour blocks would be ok?

Second idea is to change the picture on a carousel randomly. It means: User goes on my page and sees blue T-shirt (maybe with colour blocks under the pic) among other products in product carousel. After reloading the page there will be a white T-shirt in carousel (maybe with colour blocks under the pic).

What would you recommend? What is the best way to show in product carousel that we have more colours on stock?

Improve this question
1
  • Do I understand your question correctly when you say you wish to display the availability of additional colors of items in your carousel (according to your example)?
    – geostocker
    Commented Oct 10, 2016 at 13:51

5 Answers 5

Reset to default
1

Randomly generally isn't better because of potential confusion ("is this the same tshirt or different to the one I just saw in blue?").

It would be better to show the same example each time round, and allow the view to cycle through the options (color, material, sleeve length, neck style, etc.) by hand, changing the image to reflect each choice cumulatively.

E.g. to look at the tee in a different color, stop the carousel at the tshirt, and then click on a color (or other) choice. The choices should be represented by blocks sufficiently large so that someone with shaky motor control can still click on their choice in one go. Thus the number of choice-icons per row and number of rows would be a function of the number of choices. If you have so many that you can't squeeze them in, you'd have to revisit your page layout, of course. :)

Improve this answer
1
  • 1
    Agree with MMacD on not randomizing the image when refreshing the page. The experience should be consistent. As for the thumbnails, you can list out the 4 most popular colors, and have a fifth with (5+).
    – Nicolas
    Commented Jan 9, 2017 at 20:01
0

If it is a single page for the t-shirt and the colors are options, the colors displayed on the home page could be an unnecessary detail. You could display a message on hover "Available in more colors". It is the color the most important detail that should appear in that section?

If there are separated pages for each color, then you should display the products as different items. Anyway, that details is not a good fit in the caroulsel, in my opinion.

Improve this answer
0

I think that you can add an element to the list like "choose color", but this CTA only leads you to the product page where you actually can visualize differents colors (by blocks or whatever).

Improve this answer
0

Showing the colour options for the user to choose from below the image should be a good idea. If there are too many colour choices, say going beyond 5, then I would suggest to show the top 3 or top 5 most sought after colours. All the available colours can be shown on the product page. Since this is all on a carousal, it would be confusing for the user if they are given an option to see a preview of different colour tshirts in the carousal. Just information of its availability should be good enough.

Improve this answer
0

It would be good if we show a simple text ex: "Available in 4 more colors" when user open the product by CTA then user can see all colors in blocks.

This will avoid clutter.

Improve this answer

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