Design Systems From A Professional Services Perspective
(Contributed by our own Mobster Stephan Takken, Creative Consultant @Mobiquity. Original blog: here)
A professional services company runs entirely on the expertise of their people, offering clients what they don’t already have. Mobiquity is this kind of company, helping clients build digital products and services.
In 2013, we were still a small company. Our customers weren’t global conglomerates, or in high end industries like banking and healthcare. Fast forward 5 years, and we are where we want to be and beyond, working on world class products.
This new level comes with new challenges. We are expected to deliver the same quality products as the Airbnb’s and Uber’s of the world, with much nimbler teams and with ambitious timelines.
However, as times passes, many of the products we build for a client expand in complexity, and we start to build other related products. Inherently we need to scale up our teams to meet the demand. Not surprisingly, when we see our staff grow we also see that it gets more and more challenging to stay on the same page with the whole team. Every new hire or new team member needs to be onboarded, and each one brings with them new ideas and ways of working. With new people, increasing pressure to deliver and a certain amount of autonomy within teams, projects are met with increasing inconsistencies, and the team velocity decreases.
Design systems to the rescue
At least, that’s the theory. Basically, a design system is like a complex Lego set: a wide variety of standardized pieces that work together to form something much bigger than themselves. It usually consists of:
A) Code snippets
B) Design elements
C) Documentation.
Designers usually use Atomic Design principles, and developers use modular development to facilitate design systems. You can see online that big companies like IBM and Salesforce have dedicated teams focused on building and maintaining beautiful design systems. And that’s the crux of it for a Professional Services company like ourselves: we have multiple clients, all with completely different products. Making these custom built, beautiful, and over-complete design systems is nearly impossible, and most of the time not even necessary. When we do need them, we cannot build custom tools to do the job needed for speed and effortlessness.
So what can we do?
There are a few tools out there that (partially) automate the creation of needed online documentation of the design system. We’ve gone through a few of them to see which ones would help us most. We needed a flexible system with easy WYSIWYG editors so our designers could maintain the documentation easily, preferably with Sketch integration. Here’s what we found so far:
In our case we’ve found that Zeroheight does one of the best jobs out there. With Zeroheight it’s easy to create a new system, and the program comes predefined with categories such as Overview, with introduction and principles, style with colors, typography, icons, and more. The limitation mainly lies in customizability, e.g. links automatically turn pink (Zeroheight’skey color) and styling content (text) is very limited. Also the sharing is a bit sub-optimal: you need to invite people (max 2 on the free version) via email so they can browse and inspect elements. Users don’t need to make an account, which is helpful, but the registration of email addresses still enforces that limit of 2 shares. Recently Zeroheight announced that their company plan features unlimited shares with a public link.
Nonetheless, if you need a tool that is pretty easy to use and offers good flexibility, I’d give Zeroheight a go. It’s out of beta now so you can register and try it out yourself.
We’re excited to move forward. If you have any questions, please feel free to contact me.
We hope you enjoyed reading this, and don’t forget to follow us if you’d like to read more interesting stories.
If you are looking for a design job opportunity in the IT industry, come to join us at Mobiquity:
