Harrods Design System
Harrods is the world’s most famous department store — an icon that needs no introduction. Since the 1800s, it has delivered one of London’s most exclusive shopping experiences, combining heritage, service, and luxury.
The aim of this project was to transition the existing website design stack, which was originally built in legacy software such as Photoshop, into a modern design system toolkit. The original assets — stored as static PSD files — desperately needed modernising to support collaboration and scalability. The design stack was first moved into Sketch, and later transitioned to Figma, allowing the team to work more efficiently and consistently across disciplines.
Alongside this transition, I helped the team adopt new processes and ways of working, ensuring the system could be used effectively across different product teams.
All design elements were audited, streamlined, and rebuilt from scratch to ensure visual and functional consistency across every touchpoint. Filters and checkout functionality were redesigned, and additional modules and their variations were developed to support evolving product needs.
This Design System aims to:
- help ensure consistent quality at scale
- simplify complexity so teams can focus on ideas and refinement
- reduce friction and enable designers to concentrate on the work, not the process
- increase efficiency, giving more time back to the product and users
- align managers, engineers, and designers around a shared visual language
Since its launch, the design system has been expanded and applied to other internal apps and email systems, and continues to evolve — informing new digital platforms and the next iteration of the Harrods website.
This was the first version of the Harrods Design System, and it has since evolved significantly. You can see the original project here:
0 Comments