Harrods is one of the world’s most iconic department stores — a brand synonymous with heritage, service, and luxury since the 1800s.
The goal of this project was to transition the existing website design stack — originally built and maintained in legacy tools such as Photoshop — into a modern, scalable design system. The previous workflow relied heavily on static PSD files, which limited collaboration, slowed iteration, and made consistency difficult to maintain.
The design library was first migrated into Sketch and later transitioned to Figma, enabling better cross-functional collaboration and a more efficient, component-driven workflow across product teams.
Alongside the tooling shift, I supported the adoption of improved processes and ways of working, ensuring the system could be implemented consistently across multiple teams and disciplines.
All UI elements were carefully audited, rationalised, and rebuilt from the ground up to establish visual and functional consistency across every digital touchpoint. Core experiences — including filtering and checkout — were refined, while new modules and component variations were developed to support evolving product requirements.
The Design System was built to:
- Ensure consistent quality at scale
- Simplify complexity so teams can focus on ideas and refinement
- Reduce friction by making design decisions reusable and systematic
- Increase efficiency, giving time back to product development and users
- Align managers, engineers, and designers around a shared visual language
Since its launch, the system has expanded beyond the core website to support internal applications and email platforms. It continues to evolve, informing new digital products and subsequent iterations of the Harrods online experience.
This represents the first version of the Harrods Design System — a foundational step toward a more scalable and cohesive digital ecosystem.
