Crafting design vision and design principles at BIKE24

Crafting design vision and design principles at BIKE24

Design Ops
logo BIKE24

This is my favourite workshop which we did at BIKE24 to create and align on common design vision and design principles which resulted in massively improved design quality.

Crafting design vision and design principles at BIKE24
Problem - consistency and design quality

What if I told you that if you put a single designer in each of your product teams and make them work with little to no sync among them you will ultimately end up with totally inconsistent UI and user experience. Picture buttons with rounded corners on one page and with sharp corners on another… - crazy.

Even though this was the reality within our design team in the beginning of 2021 I have seen this problem in many teams before. The first step to solving this problem is to align on a common design vision and extract common design principles to guide designers in their day to day work.

Below I would like to show you my favourite workshop that I’d like to do to align designers as well as other stakeholders on common design vision as well as extract design principles out of it.

This workshop I have organised and moderated at BIKE24 and we ended with a design vision and design principles which we used to massively improve the quality of our design work.

First, what makes this workshop so great?

We dive into the future! The whole workshop is focused on how design and experience looks like years from now. This captures the imagination of the participants and everyone is pumped up by the future vision that we come up with. So, here it is how it went.

1/5

Participants
We invited product and marketing designers as well as product managers and brand marketing managers.

When inviting I usually keep in mind the following: I need the right people first and foremost for the best input and second for buy-in and advocating. In other words very smart people who will contribute with amazing stuff as well as people with influence who can help with adoption and advocating. Overall we were around 7 people.

2/5

Preparation
Recap who is our customer and what is important for them

In order for us to imagine the proper design future for BIKE24 we had to look into the following areas - customers, competitors, business and market. For this reason the first step was to recap who our users are and what their main motivators and pain points are. Then we looked into our competitors and how they treat design and UX. Furthermore, we looked into our company strategy and where we want to develop and last but not least we looked at market trends.

With all this knowledge we were prepared now to brainstorm how the future design and UX of BIKE24 will look like!

3/5

Design Vision
5 years from now this is how our customers perceive our design and user experience!

Next step is to look into the future. At BIKE24 we wanted to clearly define 5 years from now how users should perceive us and equally important how users should not perceive us. Furthermore, we also wanted to define our future ways of work which will make sure we deliver the best experience for our customers as well as make money for the company. Therefore, we brainstormed in 2 directions:

❤️ We are …
❌ We are not …

design vision workshop - we are and we are not
We selected the 5 best qualities that describe our future design.

We discussed all the qualities that describe our future design and voted on the best ones for our customers and our brand. Then we selected the 5 that we were most happy with and those were the backbone of our design vision.

❤️ We are intuitive and easy to use
❤️ We always have solution to customers problems
❤️ We are contextual and relevant
❤️ We are inspiring and enthusiastic
❌ We are not outdated

4/5

Design principles
The top voted qualities become foundation for design principles.

In this stage however they were very vague. Our board looked a little like buzzword bingo where the meaning of most of them can be interpreted differently. Take ‘inspiring’ for example - it could mean we inspire users to go out and try a bike race or adventure OR it could mean we always inspire with the right products at the right time. Or both.

We needed to settle on proper meaning for each of the qualities so we can make sure everyone understands it. In order to clarify this a bit further we took every quality and described it for what it means for us using the template “ As a user I should be…” . We had lots of discussions around contradictory meanings but in the end we came up with a coherent meaning of each of the qualities. Now we just needed to format them!

Design principles meanings

5/5

Share and Adopt
Include in design system and make part of design feedback rounds.

We created some awesome cards which were easy to share. The best part is we also added a little checklist to each one of them that made it perfect to use in design critiques and feedback sessions.

Design principles
Main challenge - adoption

Of course our main challenge was adoption. The truth is we managed to adopt some principles way more than the others. We realised that not all principles are created equal so we chose 2 which are the most important for us in the beginning.

Design principles
Results

Making huge efforts to adopt those two eventually helped enormously in obsessing over customer value and switching our mindset to focus on outcomes rather than outputs which eventually led to improving important business and user metrics. Here are some of them:

Even though we did not manage to adopt properly all principles this result was way better than I had hoped for.

Kudos

Even though I organised and moderated the workshop I am really proud of our design team at BIKE24 for making serious efforts and partially succeeding to adopt and work with our principles and with this for transforming a company with no traditions and aspirations when it comes to design and UX to a company with design vision. Kudos to everyone from the designers, to our product managers and to our marketing team. You rock! And special special thanks for the support of our head of product Christian without whose support this would have never happen.