Menu
#22: Do you use selectors for product variants instead of dropdown lists?
The better UX of your pages, the easier it will be for shoppers. The easier for shoppers, the higher will be conversion rate. If you can eliminate unnecessary actions, you should do that.
Let's say you have your product has different product variants - colors. You can have a dropdown list, where users should click to start choosing the color or you can have selectors with already variants, so users will need just to click on it to choose.

Bad example:

There are no selectors for color and size. As a result, at first users have to click on dropdown lists to see which colors and sizes are available. The second is they have to do more actions to choose desired product variants.
Good examples:
All colors, all product variants are already visible on the screen. It's easier to see what's available for a product, it's easier to choose desired variant.
Of course, ther are some cases when selectors don't fit. If you have a lot of prodcut variants and each product variant contains a lot of text, then if you decide to use selectors, it will take too much space on the page. But selectors will be good for the majority of cases and it will significantly improve UX, especially for Mobile users.

There is also a great article by Zoltan Kollin that provided a lot of good and bad examples about it - https://medium.com/@kollinz/dropdown-alternatives-for-better-mobile-forms-53e40d641b53


Useful information:
Guide for product variant selectors on Shopify - https://community.shopify.com/c/Shopify-Design/Product-pages-Add-color-swatches-to-products/m-p/616427
Made on
Tilda