Atelier Swarovski

Delivering a best-in-class online shopping experience for a designer jewellery retailer.

Visit project
E-commerce
B2C Website
UI/UX Design
Design System

Project Overview

Atelier Swarovski approached GPMD to help them re-platform their current online store and to help implement their new online strategy. Research they had commissioned indicated that the user experience on their product listing and detail pages could be improved, in order to aid discoverability and maximise shoppability. The research also highlighted that although users preferred to browse the site and find information using their mobile devices, they still preferred to make the final purchase on a desktop computer. Therefore, both platforms were to be given equal importance when considering the design and UX.

© Atelier Swarovski / Paige Novick

The Process

Using data from the report, plus various mockup designs provided by the branding agency, I consulted with the Atelier Swarovski team on how to implement a best-in-class full site design. I researched and presented design and typographic audits, developed a design system, and designed all aspects of the user journey, creating wireframes and prototypes for certain features with more complex UI and UX patterns. I also wrote user documentation for site editors on how to work with, and manage responsive images across the site.

Design exploration, typographic review, image guidelines and design system

Below are some of the key areas covered by the project.

1. The Customer Journey

Every detail of the customer journey was considered and designed in detail, including user interactions and animations. Attention to detail was paramount, with the utmost care taken to ensure the beautiful products were shown in the best possible light.

Multi-level cross-device menu system
Product listing page with filters open
Cart page
One page checkout

2. Designing the Store Finder Feature

One custom feature we were asked to design and implement was a store finder. I researched common UI/UX patterns, created a wireframe prototype, and then high-fidelity UI designs. The feature went through several rounds of feedback before arriving at its final form.

Wireframes and prototype
Store finder UI/UX designs (mobile)
Store finder UI/UX designs (desktop)

3. Creating a Premium Customer Account Section

Atelier Swarovski were keen to give their users a premium experience throughout, and this continued into the customer account section of the site, which featured full-screen background images with elegant overlays.

Account dashboard
Customer details
Address book
Wishlist
Orders

Summary

Working with the Atelier Swarovski team was a pleasure, and having such a strong brand and beautiful products to work with was a delight. The final designs and site were really strong and, I believe, delivered on the promise of best-in-class.