Paul Smith - The digital experience of a flagship store

• Headquarters: Nottingham, United Kingdom
• Technology Stack: Centra, Storyblok, Vue.js, Laravel, Cloudinary, Klevu, AWS

Established in 1970, Paul Smith (opens in a new window) has emerged as a globally renowned symbol of fashion, celebrated for its unique craftsmanship. After 50 successful years, operating in over 60 countries, they applied their progressive and creative thinking to change the way they approach and communicate with their customers, re-establish their brand, and rebuild their website to emulate the unique customer experience one would receive in one of their physical flagship stores. In partnership with Limesharp and a series of tech partners, they created the new Paul Smith website, reaching a 50% increase in page performance post-launch, a 0.8 s First Contentful Paint, and a 92 SEO Lighthouse score.

Challenges leading to migrating to headless

Previously, Paul Smith had their own CMS platform, custom built, which had its drawbacks. It was not offering them the right support in reaching their goal of recreating the experience from their physical stores and all that it entailed.

• Performance issues: Monolithic CMS setups, custom built or off-the-shelf, often face performance challenges due to their tightly coupled nature and inability to support a Jamstack architecture. In the previous architecture, the content management system and the presentation layer were interconnected, resulting in slower page load times and performance bottlenecks. 
• Lack of composable architecture: Unlike a headless CMS, the monolithic CMS lacks a composable architecture. The predefined templates and structures limit the flexibility to customize or adapt to changing business requirements. The tightly coupled nature of the architecture hinders the ability to easily add or replace components, integrate new technologies, or leverage specialized services. This lack of composability brought on restrictions in scalability and using best-of-breed technologies.
• Limited integrations: The limited support for APIs made it hard to connect the CMS with third-party applications, marketing automation tools, e-commerce platforms, or analytics solutions. The lack of flexible integration capabilities hampered the ability to create seamless, connected experiences across different channels and touchpoints.
• Inflexibility and Customization Constraints: Content creators and developers were bound by predefined templates, structures, and technologies dictated by the CMS. This rigid framework restricted the ability to tailor the content management process and the frontend experiences according to the specific organizational needs. Any modifications or customizations required significant effort.

Storyblok solutions

A lengthy process took place when Paul Smith decided to switch to a headless CMS. They thoroughly analyzed market leaders, like Contentful, Prismic, Hygraph (GraphCMS), trying to find the right mix of composable architecture, easy integrations, ease of use, and flexibility. They came to the conclusion that Storyblok was the most established one and here is why:

• Good developer support: Storyblok offers extensive documentation, tutorials, and a developer community to assist users in leveraging the platform effectively. This ensures that developers have the necessary resources and guidance to create and manage content seamlessly.
• Visual editor: With the visual editor, content creators can see changes in real-time, preview content across various devices, and ensure the consistency and quality of their digital experiences without relying on complex coding processes.
• Scheduling capabilities: With the ability to set specific dates and times for content to go live or expire, users can effortlessly manage time-sensitive campaigns or time-bound content releases. This feature enhances workflow efficiency and ensures a seamless user experience by automating content updates according to predetermined schedules.
• Bulk updates: Through its API and import/export functionalities, users can easily perform bulk operations, such as updating multiple pieces of content simultaneously. This saves significant time and effort, especially when managing large amounts of content or making global changes across the website.
• Set-up for improved performance: By leveraging a headless architecture, the platform decouples content from the presentation layer, allowing for greater flexibility and scalability. Developers can optimize performance by delivering content via APIs, which reduces page load times and provides a faster, more responsive user experience.

Browsing Paul Smith’s website feels like a unique experience. It keeps the users in a familiar environment with standard UX and UI, but at the same time it enhances their customer journey with significant elements, replicating the experience a client has in one of their physical flagship stores. The live chat function, the design that echoes Paul Smith’s brand voice of artful independence, the quirky Golden Rabbit emblem, the list of varied services, and the out-of-the-box shopping categories create an immersive journey, reflective of Paul Smith’s legacy. Behind it is a powerful tech stack, an external agency and, of course, the Paul Smith team. Keep reading for the full story behind this incredible collaboration.

The agency and the relationship with Paul Smith

Limesharp (opens in a new window) is a fully remote agency with offices in the UK, New Zealand, and Auckland. In its 15 years of operation, it focused on eCommerce for fashion, luxury, and premium brands. Its strengths lie in crafting simple, refined customer experiences that reflect the customers’ brand DNA. As such, Limesharp has had a fruitful collaboration with Paul Smith for the last three years.

From Limesharp’s perspective, the Paul Smith team is the dream client — kind, creatively driven, in short, a lovely team with amazing products. Their collaboration is so close that Limesharp is essentially part of the Paul Smith team. That’s exactly what Paul Smith stands for as Britain’s leading independent design company. They champion positivity, curiosity, and creativity, and these qualities underpin their designs, shops, and collaborations.

The brief

Paul Smith has always been about looking forward. When celebrating their 50th anniversary in business, they asked themselves, “How do we stay relevant for the next fifty?”. As progressive and creative thinkers, the team sought Limesharp’s technical expertise and previous experience with the eCommerce brand to support Paul Smith’s development team.

The project timeline

From the very start Paul Smith was set on building their website on a headless CMS with composable architecture. After deciding on the tech stack, Limesharp, together with Paul Smith collaborated on a discovery phase, identifying the objectives in terms of customers and brand. The main objective, as mentioned, was to recreate the customer experience from the physical stores. Secondly, they set their targets on improving assets, adding more information through multimedia files, adding editorials and all the significant parts that make Paul Smith special.

The eight-month development process took place in a hybrid mode, where the back-end was developed by Paul Smith and Limesharp implemented the front-end. The go-live went according to the release planning and, currently, both teams are in the pixel-perfecting stage, adding new functionalities based on the existing structure.

The tech stack

Both teams did a deep dive into the world of composable stack and MACH Alliance, learning what worked best for the project.

The Limesharp team utilized Vue.js as their framework of choice, supported by Laravel for middleware, Centra for eCommerce, Cloudinary for digital asset management, Klevu for search and recommendations, and Storyblok as the CMS for content management.

AWS services like EC2, S3, and CloudFront played a crucial role in providing the secure, scalable infrastructure needed to power Paul Smith’s composable architecture. This approach enabled the brand to deliver innovative and immersive digital experiences, ensuring high performance and reliability across all platforms.

Klevu’s AI-powered Smart Search and Smart Recommendations optimized product discovery, helping Paul Smith create a personalized shopping experience and maximize conversion rates. Cloudinary streamlined asset management, automating image workflows and reducing time spent on handling imagery by 40%, while enabling the integration of more video content into the brand’s sales strategy. Together, this tech stack allowed Paul Smith to achieve a seamless and efficient digital transformation.

Results after migration

As part of the website rebuild, Limesharp created a suite of components, supported the content team and designers in using those components, and encouraged them out of their comfort zone. Currently, the content team is very familiar with Storyblok and its functionalities, coming up with ideas and feature requests. Overall, life has become easier for the content team, benefiting from more flexibility, being able to update designs and layouts by themselves, being able to schedule their content and having more freedom overall.

On top of that, developers love the out-of-the-box Cloudinary integration and they are happy with Storyblok’s support team, always quick to help when the developers are stuck on an issue.

In terms of measurable results, the hard work and good decisions paid off. Post-launch, Limesharp registered a page load time reduced by approximately 50%! Limesharp optimized the website by stripping out third parties and unused libraries, making the code leaner, and using pre-loading. The Limesharp team is still in the process of improving the largest contentful paint. Overall, this successful collaboration between Paul Smith and Limesharp resulted in higher conversion and revenue rates.

Key Takeaway

Such a beautiful story of collaboration, built on a powerful tech stack, can only have a happy end. The objectives were achieved, the new web presence was launched on time, and, as a regular user, we can attest it feels as close as possible to a signature Paul Smith store and everything they stand for.