The One web team exists to create a platform of tools and resources that all Co-op teams can build efficient, coherent websites on. In September, we reorganised the One web team to help us achieve our vision:
Enable Co-op teams to deliver cost-efficient and coherent user experiences
And, as part of the reorganisation, we finally formed a dedicated team to own our design system (we’d been working on it in the background for 7 years before then).
Starting with research
Part of our work was to look harder at the design system itself. What and who is it really for? How well are we doing right now?
Interviews and a survey told us:
- there’s lots missing from the documentation
- designers struggle to know how and when to change something
- it’s not clear how to design ‘on top’ of the design system to create the right experience for the variety of products we have at Co-op
We’d already begun to address some of these problems by starting to create the documentation for production and process, and by adding new content to a prototype that we planned to iterate internally.
However, the other insights were more difficult to tackle, and linked to feedback we’ve had in the past describing the design system as ‘boring’. But in many ways being ‘boring’ is a good thing for a design system because “The job is not to invent, but to curate.”
We agree with this. Our One web vision is to enable product teams not design what we think is right for them – they know their users far better than we do.
That said, it still felt like:
- the design system did not inspire enough
- we were not articulating its purpose very well
- it did not reflect the values we hold as a design and product community
Exploring the problem with a brand sprint
The customer experience team recently presented a brand sprint they’d run that had begun to define the proposition and design direction for one of our businesses. It inspired me – it felt like a process that could help us solve some of the problems we’d identified.
The Google Ventures article on brand sprints says:
After doing the exercises, the team gets a common language to describe what their company is about — and all subsequent squishy decisions about visuals, voice, and identity become way easier.
The techniques in a brand sprint could help us define a common language we could use to help explain why and how:
- the design system is good for Co-op and its customers
- how we ‘do design’ – the values that are embedded in all of our work
- it is a base for innovation
- it is for everyone at Co-op – not just designers or engineers
- it is a community
Doing the brand sprint
We formed a team comprising of the core design system team (design, content, product and front-end), James Rice (who developed the process for us and helped keep us on track) and designers from outside the team to act as fresh eyes and bring specialist skills in visual design and illustration.
The process at a high level was:
- a 3-hour brand sprint kick off consisting of a custom set of the exercises in the Google Ventures article and using the findings of a survey we conducted upfront to get insight into the values we hold as a community of designers at Co-op
- a 2-week ‘divergence’ – where we split into 2 teams creating many different concept designs and content directions
- a series of critiques to identify what we felt was working and what was not
- a 2-week ‘convergence’ – where we made decisions and worked up final examples of webpages, posters and banners to give a sense of the final direction
Highlights from the 3-hour brand sprint kick off
Personality sliders exercise
The personality sliders exercise showed an apparent lack of consensus on the personality of the design system. What we discovered after group discussion was that we all wanted the design system to speak to people in a different tone depending on what they were trying to do.
The application of design and community content should be innovative and playful, but our documentation should be authoritative, clear, and in some ways conventional.
Defining audiences and sequence of targeting
We decided initially we would try to create design and content for 2 groups:
- our core users of designers and digital product teams
- senior leadership at Co-op
We want to create something that:
- designers, know how to use, helps them understand the values of the team and are motivated to contribute
- helps senior leadership quickly understand the value of having a design system
A culture survey to inform how we talk about culture
We want the design system to reflect our culture, so we sent out a survey to our Digital community to discover what people thought and felt about working on digital products at Co-op. Paraphrasing the results – people said things like:
- we have a strong culture of collaboration
- we aspire to be a renowned design team and it’s a conscious goal
- the design team is here to use design to make things better for Co-op
- working here is an opportunity to share skills and learn
Anna Pickard sums up what we were trying to achieve brilliantly in her talk: How to make brands sound human
The culture turned inward creates the product. The culture turned outward creates the brand.
Setting a brief for the team
I summarised the outputs into a brief for the next stage, giving closer direction on the audiences we wanted our design to speak to and the kind of outputs we should create. We would create design and content on:
- the principles of ‘how we design at Co-op’ – for example, how to customise a base design system component
- community ‘calls to action’ to contribute
- high-level benefits of why the design system is valuable to Co-op and its customers
Going wide with our design thinking
After the brief was set, we split into 2 teams and spent 2 weeks researching and experimenting with ideas. Here are some of the concepts we came up with, including crit notes from the wider design team.
Converging on a design direction
Finally we took the elements from the diverge stage we felt were working and decided on a set of artifacts that represented how we might apply design and content to different areas of the design system. We created a landing and documentation page, poster, and call-to-action banner.
Below are some snapshots of the work that will set the direction for the design system brand. It’s important to say that this is a direction – we still have work to do to refine exactly how we’ll apply this kind of design and content.
We’ve also been brainstorming names during the process. We feel the name ‘design system’ could alienate some people we could work with in the future at Co-op who don’t consider themselves to be designers. That name also doesn’t reflect the breadth of what will be included. Nothing is set yet, but on these examples you’ll see we’ve been using the name ‘Experience Library’ in its place.
With photography, we’re keen to reflect how we communicate right now while we’re all working from home, and we’ll also be diverse. We design with colleagues from all around Co-op with a wide range of skills and backgrounds. Our Experience library and the photography we use within it should reflect that.
What’s next?
We have a pretty well-formed roadmap for the next few months focusing on creating all the missing documentation and the processes that will support this in the future. During this time we will develop the visual language and also create a content strategy focussed on what we want to achieve and how we’ll achieve it, workflow and governance, our personality and tone, and how we’ll measure success.
We’ll be working this design direction back into the prototype and releasing it iteratively internally to our teams alongside the new documentation. Then we’ll be going back to speak to more of our users and getting even more feedback.
Was the brand sprint useful?
The brand sprint process was intense, and it derailed our work on content for a while. But not only has it helped us develop the design language of the experience library and focus even more intently on our users, it’s also given the team a greater understanding of the vision and goals we’re working toward.
We’re creating a place where Co-op colleagues can go to get help creating better, more inclusive customer experiences.
It’s not just for designers. It’s for anyone working on products, services and communications.
Principal (design foundations)
Sign-up to our updates to keep up to date with our progress.