I have 7 products. The site has a lot of content(text) pages. At the bottom of each content page I want to list my products as thumbnails.
Version A: Click on a thumbnail opens a modal with the product information
Version B: There is a product page that lists all products with its information above each other. Click on a thumbnail takes the user to the product page, where the page auto scrolls to the related product information.
Which version would be more usable and why?
Answer
Option C: Expand the card to reveal more info.
I favour this method over modals, as I find modals break the flow of the interaction - switching focus to potentially a different part of the page (not so much on mobile, but it's still breaking your context).
Expand the thumbnail itself - you know the user is already looking here so it all part of the same flow. The thumbnail itself can cover the other thumbnails, or they could all expand into a space below their container. Up to you.
The advantage of not going to a new page is that the user can peek at the content before choosing to switch page. Your expanded thumbnail can include a link to the product page, or not - depends on what you want them to be doing.
Hope that helps :)
No comments:
Post a Comment