Unlike digital projects of the past, design systems aren’t so much torn down and rebuilt so much as they’re gracefully evolved. In theory, everyone wins in this iterative scenario because everything within the system stays stylistically consistent throughout its lifetime.
But is that a realistic expectation?
The Messy Results of Adding to a Design System
Even with the best intentions, the blatant inconsistencies and inefficiencies we use design systems to absolve are susceptible to be substituted with more subtle misalignments. In spite of regular governance and pruning, we’ve seen misalignments like typographical hierarchy shifts and mixed conventions of text-over-photo vs. text-below-photo. If you subscribe to the notions of digital entropy and that websites aren’t a “set it and forget it” thing, you’ll love how design systems amplify this.
How do these misalignments come about? In our experience, stylistic compromises (think: not so much new colors but new shades, not so much new fonts but new type sizes or roles, etc.) aren’t always a product of a wayward contributor or a lack of design discipline. We’ve seen divergent styles borne from new content or initiatives that don’t quite fit existing options, or the desire to feel more emphasized or elevated above what’s available.
Adding something new to a system can work — or it can create a nexus event and branch timeline like Loki did.
As you can imagine, those subtle misalignments can add up across products — but they can also provide an opportunity to clarify what you’re committed to. We recently had such an opportunity with the team at Hormel Foods. Their corporate website is the primary product of their design system. Having launched it in early 2017, we’ve since introduced many new components and variations on original ones. Not only was it time to resolve a few disparate styles — it was time to evolve the design system without rebuilding it.