Quick views are often used to display additional information that couldn’t otherwise have been provided without cluttering the product list. While their functionality is clear, they make for a terrible user experience.
Quick Views are a bad idea
According to Baymard,
- They’re generally used to paper over the cracks of poor product list design (insufficient information/attributes, overly small thumbnails, etc). You should focus on designing better product lists.
- Users confuse them for the product page and struggle to understand the site’s navigation.
- They unnecessarily complicate the browsing process.
The lack of a clear “product page CTA button” is one of the major and common issues with the Quick Views.
- Avoid Quick Views altogether
- On desktop, display additional product information on hover.
- Make thumbnails big enough
- Include vital product information as attributes
They recently published some more research on Quick Views (source), especially on mobile. They’re still a bad idea and only a partial fix for an underlying problem.
If you have to use them (only on mobile)…
- Add a clear CTA to the Quick view overlay.
- Provide a clearly visible link to the product page on the quick view overlay.
- Clearly distinguish the quick view from the product page. You can do this by dimming the product list below the overlay.
- Make sure the quick view overlay is easy to dismiss so it should have a prominent close button and occupy no more than two thirds of the screen.
- When customers press the back button, take them back to the exact position they were on the product list before clicking on the quick view.