We caught up with Framewürk's lead designer Archie Nock to understand why design systems have been such a powerful force for positive change in the digital space, and why every brand should have one.
What makes design systems every brand’s best friend?
Many product-focused companies find it challenging to convert design ideas into code. The process can often feel contrived and be time-consuming and error-prone. This tends to be because the company is missing a method that allows designers and engineers to collaborate effectively. Designs systems are just such a method.
So what exactly is a design system?
They are essentially the natural evolution of pattern libraries and modular software solutions that have been in use since the 1960s. What makes a modern design system different from its predecessors, and more importantly better, is that it isn’t just about having a collection of reusable elements and patterns. It is also about having a set of principles that are backed by rationale and thought. The first genuinely notable example was Google’s Material Design system which they launched in 2014. Since then, numerous companies, including Airbnb, IBM and Uber, have followed suit and created their own full-scale design systems to enhance their user experience and make designers and engineers lives easier.
What do you think are the golden rules when creating a design system? What is most important for you personally?
One thing that I think is particularly important to consider is that design systems are not just a series of designs. An actual system needs to be set up, which involves a number of things including categorising, sorting and naming principles. In my opinion, any team commencing a design system project should invest as much time as is necessary getting these aspects right before starting anything else. One could say that this preparatory phase is focussed on devising the "architectural plan" of the design system, and just as is the case if you are constructing a building, having a well thought-through plan in place before you start pouring concrete always helps!
Another key point to consider is usability. Leading on the development of the Framewürk platform design system reiterated to me the importance of creating a design system with the end-user in mind. Function over form as it were. It is somewhat backwards to focus all your energies on creating something cool, slick and trendy hoping it will win awards, if the designers and engineers who have to use it find it frustrating. A design system needs to be flexible enough to support rapid evolution but at the same time structured and organised such that any designer or engineer can use it without the need for instructions or a lengthy handover.
One particular golden rule that I always strive for is that every component should be fully editable making use of the design application’s full potential (e.g. Sketch). For example, if I was editing a tile component in a design and the text content didn’t fit, it should have been set up such that it would resize automatically. This approach mitigates for the need to rebuild the component, which wastes precious time and adds cost.
What will the future bring to the industry? What is the next key problem in this space that needs to be solved? Is there anything that you are particularly excited about?
We’ve been saying it for years, but now it really does seem like the (what I like to call) “homogenisation of UI design and code” is a fast-approaching reality. Tools like Anima and Webflow are spearheading the race to enable designers to produce a web-ready responsive website without the need to write any code. There are many challenges and teething issues still to overcome, but it seems that we really are now on the road to a world where engineers can focus on the big stuff, without us pesky designers bothering them with requirements for things we should be able to make ourselves!
Aside from the Framewürk platform itself, how do design systems add value in the context of the service we provide to our clients?
Quite simply, the design system is a critical part of our service. During the onboarding phase, we work with a client to translate their brand identity into a meticulously tailored design system which, when combined with our platform, empowers their marketing teams to rapidly devise and deliver customer experiences that seamlessly align with their brand, all without the need for support from either designers or engineers.
Photo by Daniel Seßler