How are Design Systems & Design Tokens like Cats?

Pete Wilkinson
Alcumus Design
Published in
4 min readApr 24, 2023

A Design System is a collection of reusable UI components & patterns that designers and developers can combine to create a digital product, while Design Tokens are the sub-atomic parts of these components. They’re used to define colours, spacing, borders, typography, etc. and maintain consistency across the whole Design System.

Cats are four-legged feline creatures, typically found as pets or companions in the average suburban home. They’re agile, well-groomed, and adaptable to their surroundings.

Bit of a non-sequitur, right? Why am I suddenly talking about cats? Well, they have more in common with Design Systems and Design Tokens than you may think, and if you’re unfamiliar with those latter names, then this is a great place to begin.

Everybody (mostly) loves cats.

How can you not love these fluffy, cuddly creatures?

Consistency & Predictability

You may not realise it, but cats are predictable creatures.

They thrive on routine and like to keep a schedule, helping them to feel secure. One of my four rag dolls visits me at my desk between 3pm and 4pm every day. Other cats, those that venture outside and have territory, will follow regular routes checking for potential encroachment from neighbouring felines.

The same level of predictability can be applied to a good Design System.

Its components should follow recognised patterns so the consuming developers and designers know how it will behave in different use cases and scenarios.

Designs created with a Design System will provide consistency across devices and screen sizes, benefiting the user by allowing for seamless continuity while completing a task across their phone, tablet or laptop.

Both cats & Design Systems benefit from having a reliable structure in place, supported by regular and predictable behaviour.

Adaptability & Flexibility

Whether it’s being able to squeeze through an impossibly thin gap or adapting to a new environment¹, cats are fantastic at being flexible and adaptable.

Design Tokens can provide Design Systems with the same kind of attributes. They are small, reusable pieces of code that are single sources of truth & represent design attributes that can be adapted for different contexts.

Alcumus’s Design System — Arcturus — contains 100’s of Design Tokens, ranging from simple colour tokens to complex composition tokens that determine our component’s look and feel.

Without the flexibility they offer, it would be almost impossible to manage colours and other design attributes, but with them, we could change the colour of all the buttons in Alcumus products in under an hour.

Collaboration & Community

This will be a surprise to anyone who’s risked their hand trying to stroke a cat’s belly — but they’re social creatures. They’re often seen grooming each other, which helps increase their bond, or even sharing resources like food, water, and warmth; collaborating to ensure they all survive and thrive.

The key to an effective Design System is much the same — collaboration between designers, developers and other stakeholders is incredibly important for them to function correctly and effectively.

Community is important for both cats and Design Systems, whether it be survival for cats or making sure everyone gets a voice within a Design System.

Conclusion

As outlandish as it sounds, we’ve explored the similarities between cats and Design systems & Tokens. While these two things may seem like an unlikely pair, they share certain traits that can help us understand the value of consistency, adaptability, and collaboration in the design world.

Just as cats rely on a predictable routine to feel secure, Design Systems provide consistency and predictability in design across different products and platforms. This helps users develop a sense of familiarity with a brand or product, which can increase trust and loyalty.

Just as cats can adapt to different environments, Design Tokens allow for greater flexibility and efficiency in design by providing small, reusable pieces of code that can be adapted for different contexts.

Finally, cats exhibit collaborative behaviors like grooming and sharing resources; Design Systems require collaboration between designers, developers, and other stakeholders to function effectively. This community-based approach to problem-solving and innovation can lead to more effective and efficient design practices.

So, the next time you’re looking for inspiration or insight into your design work, consider turning to your furry feline friends. By recognizing the shared traits between cats and Design Systems & Tokens, we can find new ways to improve our design practices and create better user experiences.

[1] Did you know that cats are experts at regulating their own body temperatures? Really handy for those super hot summer days, or living in desert environments like their ancestors.

--

--