Co-op Finder Alpha

Co-op-Finder-Alpha
Co-op Finder Alpha – list results view

We’ve made live our Co-op Finder Alpha. Have a look https://alpha.coop.co.uk/finder.

If you’ve ever used our old store locator, you’ll see there are lots of things that aren’t in the new one. There’s a reason for that. We don’t know whether it was useful or not, in fact there’s a lot we don’t know. 

We’ll use our Co-op Finder Alpha to learn more.

We do know a lot of people choose to come to our website to use our store locator to see whether we are open, usually around those times when opening hours in general are not obvious, like Sunday evenings and national holidays.

We also know that the next most common thing customers need, is to know where the nearest Co-op is to a specific location. 

We’ve kept a few obvious elements, like telephone numbers and links to get directions, but other than that we’ve removed anything that we don’t have an evidenced user need for.

There are two opportunities for users to provide feedback on the experience itself and whether the information is correct, through this and further user research we will understand better what needs to be there.

We’ve already learnt a lot and have some solid improvements in the pipeline that we’ll make live shortly.

Our show & tell is part of the coop.co.uk session every Wednesday, 10th Floor, 10.15-10.45 – all colleagues and Council members welcome.

Please let us know what you think.

Ben Rieveley
Product Manager

Finding our way with a Co-op design system

Last week I received a tweet from some lovely folk out there who had questions on how we design and build things at Co-op.

I realised that a huge proportion of my working year has been devoted to helping create a new design language for the Co-op and I had quite a lot to say on the subject. This therefore, will be the start of series of posts charting how we are tackling prototyping and (more widely) design at the Co-op.

Background

A while ago the focus in the design community shifted from designing pages to designing systems. Using modular, reusable components that together fit any shape or size while retaining usability and brand aesthetic. We weren’t selling paintings anymore. We were creating living systems that must fit a variety of user needs and contexts.

I became aware of this way of thinking from Nicole Sullivan’s much cited article about the ‘Media Object’. She noted that the same design pattern was built many times over using the same code. Repeated many times, by many different developers. The idea that a design pattern could save thousands of lines of code I found interesting. Most noticeably, it turned me into a pattern hunter. Constantly looking for ways to save time, code and create more and more consistency in my designs.

Cut to the present day, and many large companies have adopted (and many open sourced) their design systems. Experts within the design community have evangelised their usage at many industry events. Designers and developers have adopted these practices. And the benefits of this approach have filtered down to our stakeholders. In fact at Co-op, we were doing it a long time before the logo changed.

Reasons why designing this way is good:

  • Every project starts from the same well researched baseline
  • It promotes a few (researched ways) of doing things that are documented
  • All components are shared and can be improved by anyone
  • Designing and building services is faster, cheaper and more consistent for users. As the library of components grows so does our knowledge about their usage
  • It is agile. By being subject to constant testing and iteration (things can and will change over time)
  • Things are allowed to be just functional, in testing or even a bit wrong. As long as they serve a user well at that moment. Things don’t always have to be pretty straight away
  • Because of the above, it allows the flexibility to launch services when we need to and test them in the wild

Challenges we face as a large organisation at the beginning of this journey:

  • Creating an active community with an open dialogue
  • Engagement from graphic design through to (at least) front-end developers
  • Input and iteration based on user testing (and keeping that pipeline flowing)
  • It not feeling like extra work but part of everyone’s day
  • Everyone taking ownership
  • Not having opinion based discussions
  • Designing ‘marketing’ patterns where needs are less clear cut
  • Agreeing on naming conventions
  • Keeping track of everything that gets designed, built and ensuring it is of a high enough quality

Let me tell you where we are now (and answer those questions)

Firstly, we do prototype. We prototype a lot. Very early on we began to translate our colours, logo and typography into HTML and CSS. This was so we could build Co-op branded prototypes quickly and easily. This was the beginning of a Co-op design system. We’ve had a few goes at it, trying this and that. Building things, then rebuilding them in another way to find what worked for us.

Currently, we have a SASS framework. This is the basic code that creates a Co-op look and feel. It can be used as the base for all our projects. We also have a prototyping kit (that imports the above) built on Jekyll. It allows someone with a small amount of basic HTML knowledge to build a simple prototype. It also means we can keep our snippets of HTML and SCSS organised by design pattern. In the world of the web this is all very basic, but the simplicity lowers the bar for entry and will allow us to introduce more and more colleagues to code. Some of our teams will need to prototype by injecting real data, or perhaps build a native app. Whatever they do they can do it from something that is built on standard web technology that will work for everyone.

Screenshot of the current Co-op front end toolkit

The Co-op design system is still growing and maturing. Most recently starting to need to contain other wider guidance on content (writing for the web) and user research. We are starting to understand that as a team creates more and more good design this needs to be worked back in to our base system. When a team feels it is ready, it is up to them to set up a review where we can decide whether it’s time to include their new patterns and code. We’re looking for researched, best practice design patterns that work well for real people. I make the comparison in this article to the way we would code these patterns as it helps me understand the methodology, but really these patterns are about great design. We want to create a Co-op design library that promotes best practice usability throughout all our services.

Secondly, yes. We are on Github. For those who do not know, Git is a technology that allows us to store many versions of an application’s code safely and securely. We’ve been on it for a few years in fact. However, in the last few months I have never seen so many exciting new code repositories popping up. When our products owners are ready to talk about their service, you can bet they will. Right here.

We’ve started on our journey to creating a design system that we are proud of, will never stop changing and, in the future will be open source.

A style guide is an artefact of design process. A design system is a living, funded product with a roadmap & backlog, serving an ecosystem. Nathan Curtis

That’s the dream.

Questions, comments, help or jobs at CoopDigital –  I’m happy to say hello and have a brew.

Matt Tyas

What we mean when we say “digital”

At the AGM one of the things I talked about was how digital doesn’t just mean changing the logo on the website and making some apps. ‘Digital’ when done well, means fundamentally redesigning the services we deliver, it means changing the way we work.

Here at the Co-op, when we say ‘digital’ we mean:

“Applying the culture, practices, processes & technologies of the Internet-era to respond to people’s raised expectations.”

Graphic with the text - Applying the culture, practices, processes & technologies of the Internet era to respond to people's raised expectations

Becoming a digital organisation means redesigning your services and your organisation, embracing ways of working that have long been second-nature to the best internet-era businesses.

It’s that simple – and that hard.

Mike Bracken
Chief Digital Officer