Glasses Direct website
UI/UX design
BACKGROUND
Glasses Direct is the leading online prescription glasses retailer in the UK with over one million customers. In 2016, Glasses Direct was acquired by Essilor, the world leader in ophthalmic optics.
In 2019, I was brought onboard as a senior UI consultant to work with a UX designer to complete the migration of a new Glasses Direct site to the Salesforce Commerce Cloud platform. Overtime my responsibilities were broadened to include UX design as a new site redesign was acquired after an identity rebrand.
Process
CONSISTENT DESIGN SYSTEM
I restructured the Glasses Direct design system from the ground up. A new system had been previously proposed by another UX designer in 2018 but the brand refresh in 2020 meant that this was now obsolete and a new system required. Working closely with the frontend development team, I standardised the use of fonts, colours and icons and introduced a new adaptive design approach to have more control over the UX.
Challenges
UNIQUE CONVERSION FLOW
Customers on an online prescription glasses retailer are faced with a unique conversion flow. Unlike on a standard online shopping experience, where a customer goes straight to the basket after selecting a product on a listing or detail page, customers on prescription eyewear sites must navigate a series of lens options before moving onto the checkout process.
UI design
CONTENT FIRST APPROACH
I tried as much as possible to use real content to define the layout and elements across the new website. By combining text and imagery from the current site with proto-content generated by the optimisation manager and myself, I was able to consider the implications and constraints of content on my designs.
