Matt Barbelli

Case study · Gregory Jewellers

Ecommerce website

I designed ecommerce screens for Gregory Jewellers across desktop and mobile. The scope covered the home page, category listings, product details, colour selection, adding to bag, the cart and account sign in, plus the journal landing and article pages.

Client
Gregory Jewellers
Deliverables
Desktop UI design
Mobile UI design
Category listing and product detail screens
Journal landing and article screens
Product and cart states
Account sign in screens
Credits
Matt Barbelli

The brief covered browsing jewellery and watches through to selecting a product and reviewing a bag. The design needed to accommodate product imagery, prices, colour options and availability, with layouts for desktop and mobile.

I designed the home page around campaign imagery and links to discover or shop. Category listings combine product cards with editorial features. Product cards pair imagery with names, prices and availability labels. Mobile browsing includes sorting and brand filters.

On product details, colour swatches sit alongside price and stock information. I designed the added to bag panel with item quantities and an order summary, plus a mobile cart layout. Account sign in appears as a panel on desktop and a separate view on mobile, with links to create an account or reset a password.

I also designed the journal landing and article pages for desktop and mobile. The landing presents image led story cards in a desktop grid and a single column on mobile. Article layouts bring together headings, body copy and imagery.

Gregory Jewellers desktop home page
Mobile home, category and journal screens
Mobile home page
Mobile watches category
Mobile journal landing
Watches category listing
Product detail page
Added to bag panel
Mobile bag
New from Gregory product strip
Product colour variations
A Legacy Begins editorial module
Watch brand cards
Journal landing page
Journal article page