Design systems are all the rage in product design, and for good reason: They can establish a consistent user experience by building a visual language that communicates across separate products, features, and teams. That’s all well and good, but when you are a startup planning for growth, where do you start? How do you know that the components you design will work together and meet your product’s needs? Above all, how do you maintain consistency when you are building incrementally?
The hardest part is to start
At Reaction, the way we began to unblock some of these questions and challenges was to establish a set of design principles. To be honest, it felt silly at first to set such high-minded goals at such an early stage and on a small team. But the truth is, the stage and size of our team did not change the complexity of our product, nor change the design problems we needed to solve. Once we realized that, it only made sense to start with design principles as inspiration, guideposts, and sometimes, guardrails.
Above all, how do you maintain consistency when you are building incrementally?
Maintaining system integrity
Like most product teams these days, we work incrementally and iteratively, and we are constantly shipping design and code. As part of that ethos and because of the size of our team, we’ve taken the same approach to our design system, which comes with some big upsides but also some challenges. The upside for us has been we have been able to make a lot of progress on a design system with a small team while also delivering on our product roadmap. If we had not taken an incremental approach, I doubt the project would have ever gotten off the ground.
However, it’s also been a big challenge to keep our design system from splintering into a Frankenstein mess when we are working on it piecemeal and in conjunction with our work on product features. A bunch of amazing components is great, but if they don’t fit together, your design system won’t have integrity.
A big answer for us is to use our guiding design principles as a check against our designs. This allows us to see if the smaller pieces we are designing will fit into the larger whole. In other words, ‘this thing I'm designing is cool and all, but is it driving towards our vision?’ Sometimes when we ask this question on our design team, it is. And sometimes, we’ll scrap something or change course. For example, while working on a new left navigation, I designed a way for it to collapse at full-screen widths. But when we asked the question, 'Will most users really need this?', the answer was no. It introduced unnecessary complexity. Done, scrapped. The mere repetition of asking, ‘Does this design, flow, or pattern match our principles?’ has helped bring integrity to the overall design system.
In addition, it makes it easier to present design choices and give meaningful feedback by lending our design process some objectivity. For example, we can look at a design from the perspective of our principle “Always be forward thinking,” and ask, will this scale? Or is it too rigid? Those questions have freed us to build incrementally because we can feel confident that each piece is aligning with the broader vision.
Reaction Commerce already had a strong set of core values that the entire company had rallied around, so the Design team started there. We intentionally developed design principles that would best reflect those values in the realm of design.
We also knew that a design system was necessary, and the sooner we could start working on it the better. The way we found to do that was to start with a design vision that would usually keep us from wandering too far afield, and let us know when we did occasionally stray too far from our cohesive product vision.
A design system is never finished and probably never should be. Ours definitely is not, but it’s broad and sturdy enough to keep us on track and give us a strong foundation for testing, learning, and iterating. And ultimately, it is a great feeling to know that we are already benefiting from what we’ve built. When you’re trying to build something new from scratch, you need to use every process at your disposal to keep everyone together on the same page. If that process, like our design principles, help preserve the team’s sanity at the same time, the product can only be stronger and better as a result.