Wool and Prince
Apparel / Sustainable
A reimagined experience for one of our longest-standing clients. With sales continuing to climb, we supported their growth to span multiple regions, and help consumers around the world move to better, longer-lasting apparel.
Wool&Prince first came to Pixelcabin back in 2014, looking to take their first steps away from an ‘off the shelf’ theme and build their second iteration of the site. Now in 2020, and with sales and a product selection that have grown exponentially since then, we were tasked with reimagining the UX for their ‘3.0’ site, to better serve the increased catalogue size, and further increase conversion, without losing the tight-knit relationship that their customers have with the brand during and after purchase.
Making the user journey as seamless as possible for a product that has many variations but one loyal following
Pixelcabin focussed on two key areas of the site to innovate the Customer Experience: the collection and product views. We knew customers needed to be able to navigate between categories of shirt quickly and easily, and get a simple overview of all of the variations that Wool&Prince has to offer. However, we also wanted the customer to be able to keep navigating between these variations right up to the point of adding to cart, in the most flexible way possible.
The solution was to bend the rules of Shopify, and merge many product types on to one product view. Using Shopify’s GraphQL APIs (built to enable modern, dynamic front-end experiences), we achieved no-page-reload changes between products so as to enable the incredible selection of colourways and - crucially - fabric types, to all be brought together in one place.
We also focused on the UX of the collection view - a highlight on mobile being how we reengineered the layout to lateral scrolling on mobile devices to enable maximum product discoverability, whilst ensuring the customer never felt lost in a long list of products.
The result has been overwhelmingly positive; after using HotJar to track the new experience as users actually interact with it, we have been able to clearly see how the improvements to UX and intuitiveness have led customers to quickly discover more variants of the product than they would have otherwise.
A showcase for Wool&Prince’s iconic lifestyle photography
A final aspect of the brief was to bring out the lifestyle photography that is regularly produced in-house, and continues to attract new followers to the brand. With all of the UX changes, we had front-of-mind that the homepage, collection views and product views should be able to accommodate (and show off!) photography that was shot to highlight a particular product or collection.
We also went beyond implementing typical ‘breakpoints’ when deciding which image size to serve to the user. Instead, we developed an in-house module to take advantage of the more modern ‘srcset’ property in conjunction with Shopify’s image serving capabilities. As a result this takes into consideration the user’s internet speed and screen resolution when deciding on the correct image size to serve, saving valuable data transfer where it is not required or will severely impact the speed and experience of the customer
10 out of 10.
"Couldn't recommend Pixelcabin enough! Not many DTC brands can say they've been with the same Shopify devs for 7+ years. We've had no reason to look for an alternative. Pixelcabin has been a key partner of ours and has continue to impress us with their execution."