Qavashop.com - Transformation into The Delightful Experience
A complete redesign of the Qavashop web storefront, product detail page and other subpages for the largest online coffee equipment store in Saudi Arabia along with the switch from Prestashop to the custom headless CMS backoffice.
Visit qavashop.comClient
Qavashop
Markets
Saudi Arabia
Platform
Web (desktop and mobile)
My role
UX/UI Designer
The Challange
A growing online store with an outdated storefront, drifting on the great ocean of the Saudi coffee market.
How to transform it into a delightful experience?
Founded in 2018, Qavashop has grown into the region’s largest online store for home baristas and coffee enthusiasts in Saudi Arabia.
Mission
Make specialty coffee accessible and build a coffee community.
Catalogue
coffee from 50+ local Saudi roasteries and all kind of coffee accessories espresso machines, grinders and barista accessories from the biggest international brands.
My role
As UX/UI Designer I owned the redesign end to end.
Audit
Auditing the existing storefront for usability and visual flaws.
Information architecture
Restructuring navigation and the information architecture.
Homepage and PDP
New homepage sections and the product detail page template.
Visual language
Refreshed visual language and design system & responsive layouts
01
The Storefront
The homepage had to work as a shop window for a huge catalogue: help people find a category or a brand fast, compare products at a glance and trust the store enough to spend thousands of riyals.
Before
After
Accessible Category Tiles
Large, photographic tiles right under the hero give one-tap access to the most important departments.
Modern product card
Every card carries the brand badge, fulfilment label, colour variants, price with discount and free delivery, so products can be compared without opening them.
Posters Carousel
“Brands We Love” turns the biggest international brands into editorial posters that invite exploration by brand.
Featured Sections
Dedicated Sections with filters on top that switch between subcategories without leaving the homepage.
Reels
Short videos from the Qavashop team bring the coffee community onto the storefront and show the products in use.
02
The product Detail Page
Coffee equipment is a considered purchase. The PDP had to answer every question a home barista asks before spending thousands of riyals, without burying the buy box.
Optimised above the fold
Gallery, title, highlighted features, variants, price with buy-now-pay-later, add to cart, delivery dates and stock status are all visible on the first screen.
03
Extra sections
04
Refreshed branding
Most Qavashop customers shop on their phones, so every section was designed mobile-first and scaled up to desktop. Alongside the new layouts, the brand got a refresh: a single bilingual typeface, a warmer palette built around the signature burgundy, and a shared set of components and icons that work in English and Arabic.
See it live
Explore the redesigned storefront on qavashop.com.
Visit qavashop.com