Building a unified Shopify platform for Coffee King.

Coffee King is a UK-born coffee retailer selling to both consumers and businesses across the UK and Europe. They were running at least four separate Shopify stores, with no meaningful separation between their wholesale and direct-to-consumer experiences. The brand had ambition and energy, but no design system and a platform that couldn't support where they wanted to go.

Our shared goal was building one store built on Shopify for two audiences and multiple markets, with a brand that looked the part.

Why building with Liquid changed the way we worked.

Coffee King chose Liquid for a practical reason: they wanted independence to manage their store without relying on us for every change. Working without Shopify Plus kept costs down, but reduced our flexibility.

Even though Liquid gave us a solid base to build from, it also meant that third-party apps carried more weight than usual, each with its own UI and constraints. What we could design depended, in part, on what those apps allowed.

In this project, the collaboration between designers and developers had to be even closer than usual. The team was researching and testing apps while working on layouts simultaneously, and both sides were informing each other's decisions in real time. It wasn't the tidiest process, but it was the right one for this project.

The designer’s eye

Our front-end developers build with a design mindset.

Learn more

B2B and B2C on one store.

The most technically ambitious decision we made was combining both audiences on a single Shopify store using SparkLayer, a tool that layers wholesale functionality onto a standard Shopify setup.

This entailed one source of truth for products, pricing, and analytics, and significantly lower running costs than parallel stores or a Shopify Plus upgrade. We also consolidated Coffee King's previous multi-store setup into a single backend using Shopify Markets, with dedicated configurations for the UK and EU.

A custom solution.

This configuration hadn't been done before in this way. SparkLayer's own team described it as “unusually complex.” The biggest challenge was user routing: customers with B2B access would get automatically redirected to the wholesale experience even when browsing the consumer store. It took weeks of persistence and creative problem-solving from our developer to resolve.

In the end, the combined store works and the client is happy with it. But we'd weigh the trade-offs more carefully next time, because sometimes two simpler setups serve the business better than one ambitious one.

Designing within constraints.

The brand identity was built by the founding team and carried deep personal significance, so it couldn’t change radically. Instead, we built a visual system around what already existed by refining typography, designing custom iconography, adding a warmer colour palette, and implementing a subtle colour shift to purple for the B2B experience to distinguish it from the consumer store.

Coffee King didn't come to us as a design-driven client. Simply put, they wanted a store that worked. So our role went beyond layout and visuals as we guided them through decisions about information architecture, product page structure, and visual hierarchy.

Some decisions, particularly around typography and colour, took longer to align on. But working through those conversations together meant that by the time the platform launched, everyone could see how those choices strengthened the final result.

Handover as a deliverable.

With a store this technically layered, thorough documentation was essential. We built a comprehensive Notion guide covering every integration, configuration, and third-party app, so that Coffee King's team could manage the platform confidently on their own.

That documentation also became a reusable asset for us, and the structure we developed for Coffee King now informs how we approach similar projects.

Coffee King reinforced something we keep learning in different ways: the most valuable thing we bring to a project isn't always the design or the code. It's our ability to read the situation, adapt, and find the best version of what's possible within real constraints.

One large case study on the way!

From product pages to add-ons and slight nuances for B2B and B2C, there’s more to Coffee King than meets the eye.

Discover the Case Study