Using Acquia Cohesion and Site Factory for Multisite Design Systems

How do you migrate 170 consumer health brands, covering 1,500 market websites in many languages, in a year, to a single CMS platform and give publishing control to marketers to tailor the content in each and every instance? How do you achieve this without an army of Drupal devs and themers?

This was the question posed by a consumer-health pharmaceutical customer to Acquia. Acquia had some answers to this question straight off the bat: a powerful enterprise cloud hosting platform, unparalleled Drupal architecture capabilities and kit like SiteFactory that gives command and control over multi-site web-estates.

The publishing control question, though, still needed an answer. This called for a component-driven design system that could power multiple brand identities and yet still keep best practice in markup, accessibility, user experience, SEO optimisation and content design all in one place: in other words, a Master Design System that the consumer health division could use to build site-after-site, brand-after-brand.

Enter, Cohesion

Cohesion is Acquia’s design system enabler and recent addition to the Acquia Customer Experience stack. Cohesion plugs into Drupal and activates component-based pattern design, with an easy to use drag-and-drop editing experience. This let’s design experts build the platform, and then hand-off to content experts (with no specific technical expertise) to assemble and populate the pages.

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. We use Cohesion to build design-pattern-driven web platforms, and then train our clients, their brand agencies, their assembly/content agencies to get the most from it.

Critically for the delivery programme, it broadens the development skillset from engineers and Drupal themers to digital designers and developers with core HTML skills but less Drupal theming understanding. The engineers can focus their skills where they are needed most: on robust Acquia Cloud Site Factory (ACSF) architectures, and value-add bespoke coding, rather than extensive theming, which still delivers limited flexibility. 

Building the Design Solution

Previously, our consumer health customer had developed a design guide; a guide for visual design agencies charting the key component blocks, behaviours and layouts for the web estate. Visual design had already been conducted for their leading consumer brands using the design guide - all by different agencies. However, when the designs came back and the technical teams started assessing how to implement them into Cohesion and Drupal, it became clear an additional step was needed:

Firstly, while the design guide carried strong best practice principles, it is a guide and not a rule set. To build a single technical platform and then propagate it to many brands, a rule-set is needed. Otherwise, each ACSF instance becomes its own standalone platform powering the unique features of a single brand. This fragmentation drives cost, technical debt, design debt, and lack of agility for improvement.

Secondly, with each design interpreting the designs differently, we have varying user experiences, and a lack of consistency across brands driven by slight variations in execution and constant re-invention of the wheel. Either way, all the benefits of scale, flexibility, speed to market and consistency offered by ACSF and Cohesion are not realised. 

Building Design Systems as a Service with Acquia Professional Services

Acquia asked Coherence to work with Professional Services as a design system partner with experience using Cohesion to build multi-identity web estates. Professional Services’ deep understanding of ACSF architecture ensured the web estate was architected with scalability in mind. 

We worked with Professional Services to create an unbranded design system, or Master Design System (MDS) that could be propagated through Site Factory to create each Brand Master, and their Market Instances. We’re in the process of rolling this out now across their lead brand, with a roster of Assembly Agencies in training to build out the brand and market sites based on the Master we are providing.

The process highlights some important considerations.

Understand the design commonalities

If multiple brand designs already exist, as they were in the consumer health estate - as produced by the design guide, it will be necessary to break (some) of these down to find a balance between commonalities and divergences. Some element of redesign at the brand level will be needed.

Make your design system usable 

Your platform must be usable for the business user as well as the end-user to be effective. The opportunity cost of publishing something, or testing something, must be reduced to the minimum so that the content publisher can move faster, and ultimately learn more. Nothing kills creativity and learning like the friction caused by poor publishing workflows.

Finding the balance between usability and feature richness in the MDS is key. It is tempting to make the MDS very feature-rich  to capture every requirement each brand might have and make it a “must-have.” This creates richness but makes your MDS bloated with single-use-case (and brand-specific) components. This reduces re-usability, builds-in design debt and makes it harder for your assembly agency/end user to use the system. The design system must remain usable.

It’s also tempting to build extensive configuration options into each component - making them capable of fulfilling multiple content tasks. Cohesion provides powerful tools to support this. Again, though, over-use will make each component difficult to use.

Fix your errors in the Master Design System

The Master ultimately will drive multiple Brand Masters, and propagate best practice in markup, user experience, accessibility and content design across an estate of very different brand propositions.

This makes getting the Master right critical. When we spot errors here, we get to fix them before they impact the child instances. Allocating time and resources here speeds acceptance and rollout.

Plan for success and enjoy the rewards

Cohesion helps design-focused agencies amplify their output. In combination with ACSF, we have the ability to create unbranded MDS clones and then apply branding at scale. Getting the fundamentals right is key to this success - both from the point of view of architecting ACSF correctly and the perspective of rolling out effective design. 

Once the planning and master build is complete however, we start to see how powerful this combination of technologies and design techniques can be in rolling out multi-site multi-brand web estates. Ultimately, we are able to provide a design system as a service - an on-demand capability to spin-up and style a market instance.

Cohesion provides a powerful tool for agencies with strong design capabilities. It opens Drupal to the design community in a way that previously only themers and developers have been able to access. It allows those agencies to focus on the high-value services (content design, user experience design, accessibility, etc) while providing brands with the ability to use rosters of assembly agencies - with great logistical capability but no specific Drupal or design competences - to assist with the page assembly, content population and rollout of the market instances. It also allows lean design-focused agencies like us to work with System Integrators at scale in collaborative projects that deliver huge customer value.

If you would like to know more, and see some of the technology in action, Acquia is hosting a Cohesion Hands-on Workshop on the 5th March 2020. We’d love to see you there.