![Blog post thumbnail](https://cdn.prod.website-files.com/6230cce907f5a55f9a4b0e6f/6230cce907f5a54f394b19c8_0573f4a1-a08f-4d6f-975a-df32b0d4d6f8.jpeg)
Grana's quick-shop buttons
Online fashion retailer Grana focuses on luxury-quality items at affordable prices. Their lean and elegant website offers a clean UX. Users can navigate and shop quickly and without fuss.
![](https://cdn.prod.website-files.com/6230cce907f5a55f9a4b0e6f/6230cce907f5a58c2f4b1392_Screenshot_2017-10-31_11_20_52%20(1).png)
![](https://cdn.prod.website-files.com/6230cce907f5a55f9a4b0e6f/6230cce907f5a51d5a4b1353_Screenshot_2017-10-31_11_21_02%20(1).png)
![](https://cdn.prod.website-files.com/6230cce907f5a55f9a4b0e6f/6230cce907f5a52cb14b112f_Screenshot_2017-10-31_11_21_13%20(1).png)
![](https://cdn.prod.website-files.com/6230cce907f5a55f9a4b0e6f/6230cce907f5a5e2054b11dd_Screenshot_2017-10-31_11_22_16%20(1).png)
Why this is really good UX:
- When users hover over an item, a quick-add button appears on the lower half of the image allowing for fast, seamless shopping.
- Hovering over the newly-appeared button layers on a clickable modal with the available sizes. The user doesn't have to enter the item's particular page to see these options.
- When an item gets added to the cart, a modal gives users a quick view to the total in their cart. This also lets them know how far they are from earning free shipping.
- The free-shipping note works as an upsell message, encouraging users to complete an order minimum each time they shop.