Imagine two workshops

Imagine two workshops. In the first, equipped with the finest tools, gathered around a workbench crowded with a new plethora of ideas and iterations. Progress was undeniable and the product was taking shape, however with the wealth of work that moved us forward, was also setting us back. As the product grew, any inconsistencies had begun to compound.Now picture the second workshop. The tools are the same. But the atmosphere and understanding is entirely different.Order had taken hold. Every element labelled, indexed and organised into a clear category of pages. In this room we took a step back to unpack the full potential of the tools we had to hand.We shifted our focus, putting the spotlight on the problem we were solving—and who we were solving it for - which you can read more about here: The moment we realised we were the wrong user from our COO Tim Porter.

Starting again

In practice, that second room meant starting again. A fresh working environment in figma, with a steep learning curve ahead, installing MUI X component libraries and adding hex codes into automated sequential colour scales was just the beginning. We needed to step back briefly in order to move forward.

A completely blank canvas was now presented to us, but without the familiar intimidating white glare. This time, there was the reassuring glow of structure beneath it: a robust framework, ready to be unleashed on OBE (Onboarding by Elorn) product assembly floor.

A shared language

Building this system as the foundations fundamentally changed the way we work. Not just in product but also our brand system and our new in-house designed and developed website that you are reading this on.

Components were now created as reusable decisions rather than repeated objects, we raised the standard of the product dramatically. Now any changes we made to a single screen could effortlessly rolled out throughout the product with one click, updating the global component across all instances. Moving from eyeballed padding, to a globally saved sequential 4px scaling system, introduced rhythm, consistency and a more refined fit and finish. It gave us a shared logic and a clearer direction.

More than consistency

Good decisions became easier to repeat and effortless to scale. Legacy choices—those without variables, components or a system behind them—suddenly had nowhere to hide.

Our aim was now laser focused on growing a connected ecosystem—one that felt alive with our unique DNA intertwined.With a customised library at our helm, the product became calmer. More deliberate. Better equipped to handle the complex nature of onboarding, capable to evolve gracefully as needed.

Ready to scale

Today, Elorn products are ready for scale. The team is more connected, not just by process, but valuing the shared high bar set. We now build from a system that empowers us to bring elegant solutions to life—solutions that are a pleasure for us to build, and for people to use.

Perhaps the biggest lesson from this journey was realising that good design is not simply a principle you hold in mind as an end point. It is something you build into the way you work: into your tools, your systems and your practices.

Now, each morning when we enter the room we created for ourselves, there is an empowering sense of confidence. Opening Figma no longer feels like opening a file. It feels like stepping into a room, a tidy workshop: calm, organised, connected and ready.

There, illuminated by their familiar purple glow, sits a fleet of figma components, each one dependable, considered and prepared for deployment.

It’s a reminder of how far the product has come, and the team’s growth alongside it. Our tools are sharpened, our systems refined, and the foundations are firmly in place, ready for whatever comes next.