The creation of Nordic Choice Hotel's first Design system
Case
2018-2019
Nordic Choices (now Strawberry) ambition is to create the best omni experience in the industry, offering guests the ability to have a seamless and hassle-free travel experience. To be able to deliver on that, I took the lead in developing the company's first Design System.
Design System
UI Design
When I initially joined the team, I discovered that their outdated brand guideline document only applied to print materials, resulting in inconsistent design across various channels, such as the web, app, and campaigns. To address this challenge, I spearheaded the development of a comprehensive Design System that provided clear and consistent guidelines for all aspects of the brand's visual identity.
To kick off our Design System project, we conducted a thorough UI inventory to assess the number of different components we were using, such as buttons, cards, and modals. Once we completed the inventory, we merged and eliminated redundant elements as much as possible, while also documenting the components we actually needed and when to use them. Next, we turned our attention to updating the brand's visual design language, including colors, fonts, icons, and images. To help with this task, we collaborated with a design agency, ANTI in Oslo. Once the new brand guidelines were in place, we could begin building our Design System. Throughout the process, I worked closely with our developers to create and design the components in Sketch. I also uploaded and wrote guidelines in Invision DSM (Design System Manager), while the developers used Storybook to build and share the UI components. To ensure consistency across the Design System, we used Design tokens for elements such as colors, spacing, and typography.
The Design System proved to be a game-changer, allowing us to build and design our products more quickly and, most importantly, in a consistent manner. This consistency ensures a streamlined user experience across all digital channels and touchpoints. Thanks to the Design System, our team was able to work more efficiently and collaboratively, resulting in a more cohesive and effective product offering.
.png)
.png)
.png)
.png)
Next case
You'll want to see this