What are Design Systems and How Can They Help Your ROI?

With ever more sophisticated tools available to deliver tailored customer communications across multiple channels, it sometimes feels like the web CMS has not kept up in the race to provide marketers with powerful, flexible tools. CMS users are still looking for platforms that let them publish content on their schedule, rather than the technology’s.

If your business needs to run multiple web sites reflecting differing service lines, or linguistic and geographical territories, or if you run a division containing multiple brands, you can find yourself quickly spending very large enterprise CMS licensing fees to get the flexibility and power you need.

Acquia is in the business of countering this by using a best-in-class open platform, alongside enterprise cloud hosting, to provide a different approach. And with the recent integration of Cohesion into the Acquia customer experience stack and long-standing tools like Acquia Cloud Site Factory (ACSF) it now rivals the big proprietary software vendors’ ability to solve marketers’ multi-site headaches. 

As a web design agency focusing on design system approaches, this gives us at Coherence the ability to provide enterprise level solutions to our customers. We’ve worked with Cohesion, and its predecessors, for 4 years now, and it underpins everything that we do: delivering multi-market, multi-language and multi--brand design customer-facing web platforms.

So what is Cohesion, and how does it help us? Cohesion enables Drupal to run design systems. It’s as simple as that. Design systems, it turns out, are a pretty effective way of dealing with a number of problems that marketers have, and help drive revenue in some surprising ways. The proprietary CMS vendors charge big bucks to deliver and license platforms that run them. Brands often end up using them, because they solve problems and open opportunities.

First of all, what is a design system? 

Think of a design system as a flexible set of cards, patterns and widgets that live in the CMS as re-usable coded components. Some of these patterns display content in common ways: hero sections, two column layouts, pullout quote blocks. Others display media: video content, imagery. Others display more complex content in easily digestible interactive patterns: accordion blocks, tabbed behaviours. 

Design systems are branded.

This means they incorporate your typography, colour palette and are designed specifically with your content needs in mind. They help prevent an inconsistent brand experience.

Design systems are configurable.

Components can be configured to be used in different ways by the editor - image-left text-right, text-right image-left, padding-on, padding-off. They can have elements displayed and/or hidden depending on the content-need. They can be combined together in layout components to build more complex content displays.

Design systems are usable.

Design systems are built by designers and engineers to be used by marketing and content professionals who have no specific technical knowledge. They can be used by assembly agencies without specific technical understanding to rollout multi-market brand web estates at scale and speed. 

Design systems bake-in best practice.

Whether it’s responsive behaviour, branding, accessibility, user experience or content design, design systems incorporate best practice, so we don’t end up re-inventing the wheel (or worse - forgetting that we need the wheel or what wheel we built before!) each time we use them. And when we add a feature, all the users of the system get to use it.

Design systems are rules-based.

This means they perform in predictable ways. This doesn’t mean they are cookie-cutter (if they are, they’ve been designed wrongly). Your design system will render content in ways you - and your users - expect time-after-time, device-to-device. If your design system does not have rules, it cannot be executed from a single technology platform, and you have scalability and technical / design debt issues to deal with. And cost, lots of cost. It is possible that you need something more flexible than a rules based system - for example if you need to bring consistency across a series of websites already on _different_ technology platforms. For this you need a style guide, not a design system.

Design systems aren’t templates.

Your brand / visual design agency may roll their eyes if asked to work within a system. This is because many CMSs traditionally use templates to fix page layout. This restricts creativity, and creates a feedback loop between brand design and technology vendor, where one asks ‘What can we design that will work within your platform?’ and the technology vendor replies ‘Well, what do you want to design?’. Design systems allow both content elements and layouts to be configured in flexible and re-usable ways without further developer intervention. This allows creatives to be creative, and developers to develop.

You mentioned ROI, that’s why we’re here…

OK, let’s break down how design systems can help drive better ROI for your business. We believe it’s about three things: entry, knowledge and reach.

Entering your marketplace quickly means your technology investment starts to deliver you commercial opportunity sooner than a long rollout. This “time to value” is a critical metric for businesses looking to transform their digital experience. Design systems give you a head start because you can start small and then extend them progressively over time. Also, if you need to re-platform 170 brands - each with their own visual identity - covering 1,500 market/language level sites, your design system can be used to accelerate the rollout, and open it up to agency partners who are content populaters rather than engineers (we are partnering with Acquia to do this for a pharma client at the moment, by the way). In short, they can remove the bottle-neck and get you in front of your customer more quickly. 

When you are in your marketplace, most brands want self-activated methods of testing and improving their content proposition to their customer base. Design systems empower marketers to build their own pages, re-order message priorities, A/B test, create campaign pages, home page takeovers, product features and thought leadership outreach. Design systems help you do all this without going back to your agency and expending budget tweaking inflexible page templates. Design systems don’t give you customer knowledge, but they help you build that knowledge more quickly, and on your own schedule and resource.

Lastly, when you’ve secured your marketplace and discovered the idiosyncrasies of its inhabitants, design systems can help you extend reach to new audiences or new marketplaces. This might mean greater language/market coverage and tailoring of content strategy to market conditions. Maybe it means launching new products or service propositions with their own web identity driven by your design system. Perhaps you grow through acquisition or reach your customers through networks of affiliates. Perhaps you need to achieve better levels of accessibility to reach consumers previously excluded from your services. Or simply provide consistent and high-quality content and SEO optimisation approach, so that your entire estate is more visible through organic search. Design systems help you achieve all these things in a cost-effective method, especially when partnered with multi-site management technologies like Acquia Cloud Site Factory.

So, we think design systems are pretty nifty. They give marketers awesome power and flexibility and we love seeing our clients achieve success through them. We don’t use them because they’re geeky and cool (but yes they are). We use them because they get the most effective customer experience for your technology budget and help prepare you for challenges you could not possibly predict right now.

If you would like to know more, come and join us at Acquia’s Reimagine Drupal event. We’ll be showing the amazing work underway with Acquia’s Professional Services team on design system rollout for large web estates.