Project
Information

Sector: Luxury Retail
Discipline: Design System
Location: London

Project
Information

Sector: Luxury Retail
Discipline: Design System
Location: London

Harrods is the world's most famous department store that needs no introduction.  Since the 1800s it delivers the most exclusive  shopping experience in London.
The aim of this project was to transition the existing website design stack (initially completed in legacy software) into a modern design system toolkit. And then   help transition the team to using it effectively. New processes were developed as part of this transition.
All design elements were audited, streamlined, and rebuild from scratch to insure consistency.
Filters and checkout functionality was also redesigned, additional modules and their variations developed.

 

Logo Positive
Logo Negative
1. Manual
1. Manual
Welcome@2x
Colour Pallete@2x
Type Pallete@2x
Harrods Online Store Design Systems
InVision Design System Manager@2x
2. Grid Systems
Grids@2x
3. Spacing Systems
Spacing Systems@2x
4. UI Kit
Colours@2x
Typography
Actions@2x
Form Elements@2x
Graphics@2x
Feedback indicators@2x
Tables & Accordions@2x
5. Modules
HEADERS, HEROS, BANNERS
CARDS
REGULAR
STYLE NOTES
STYLE NOTES2
6. Templates
Homepage@2×2
Category Page@2×2
Product Page@2×3
7. Product Filters
Desktop Filters
8. Checkout
Payment Guest Checkout Alternative Open@2x
Payment Quick Checkout Closed

This Design System aims to:

  • help ensure consistent quality at scale;
  • help remove some complexity so to allow to explore and refine ideas
  • help get focused on the work more, not the processes
  • help the team to be more efficient, thus devote more time to the product and users
  • help managers, engineers, and designers to be better aligned

Other Projects

TeamDesk UIProduct Design

RecognisedJewellery Store Brand Identity

Georgetown UniversityAcademic Editorial Design

Worbby BrandIdentity Design

Worbby AppProduct Design

Restless DevelopmentCharity Website Design

P3MOBrand & Product Design

svg-image
svg-image
svg-image

© 2007-2022 blueandyellow.design    /    🇬🇧 London    /    Contact    /    Terms & Conditions    /    Privacy Policy

© 2007-2022 blueandyellow.design   /    🇬🇧 London    /    Contact    /    Terms & Conditions    /    Privacy Policy

© 2007-2022 blueandyellow.design   /    🇬🇧 London    /    Contact    /    Terms & Conditions    /    Privacy Policy

© 2007-2022 blueandyellow.design

🇬🇧 London
Contact
Terms & Conditions
Privacy Policy

© 2007-2022 blueandyellow.design
🇬🇧 
London
Contact
Terms & Conditions
Privacy Policy