4 Steps to Creating a Successful Design System
By Mary Lane
Imagine being tasked with a new project: improve the experience and design on 70+ existing brand sites. Simple. No sweat. You’re leaping for joy, right?
Let’s be honest. You’re probably not.
Now imagine each individual site is managed by different agencies, partners, marketing teams, and stakeholders across the company. Yet another few dozen hurdles to jump over when looking for sign-off and approvals. Again, no sweat, right?
You take a look at the sites, just to satisfy your curiosity. The damage? As many navigation styles as there are domains and about four times as many buttons patterns. Losing sleep yet?
You aren’t alone. After twenty years of guiding brands through digital transformation, meltmedia has seen even multi-billion-dollar giants struggle with creating good design systems.
Usually, there are three ways it goes down.
- Onward and upward! For every new product, site, and project, you create a brand-new design system that ignores what came before. The drawback? This adds even further inconsistency to the brand.
- Precedent, precedent, precedent! New ideas are crushed under the weight of “but we’ve always done it this way”-ness. Creativity is stifled. People, including your customers, are frustrated.
- Ahh, the third way. This is what I’ll explain in this post, and (spoiler alert!) it’s the most effective approach we’ve seen. It helps companies improve their bottom line, and avoid wasting hours upon hours reinventing the wheel.
Over our two decades working with companies to transform their brands, our team here at meltmedia has summarized our learnings below. In other words? We’ve done the dirty work, so you don’t have to.
1. Embrace the inevitable
As products and companies grow, different design patterns and UI elements (e.g. button styles, navigation patterns, etc.) come into existence. Similar to a company’s brand standards (e.g. logo usage, font styles, etc.), a brand’s digital pattern guide is a critical connection between designers, developers, and the brand itself.
There are important business benefits to standardizing design:
- A documented design system helps teams create consistency across sites and applications, work more efficiently together, and avoid duplicative efforts — sparing your bottom line.
- It improves the customer experience. When every brand interaction follows the same standards, it reduces cognitive load on the user and creates trust — which leads to increased engagement and customer value.
Naturally, companies develop over time. Products are added (or retired); market needs evolve; different teams of designers, developers, and agencies move in and out of the organization.
No wonder so many organizations default to creating new design systems every time there’s a change, or failing to update what’s already in place.
The resulting fragmented design patterns create an inconsistent brand experience. New and existing customers have to re-adjust to each new design experience, which lengthens the conversion cycle and degrades trust. Not to mention all the work involved in maintaining legacy or disconnected systems.
Investing in doing it the right way will save your sanity, delight customers, and protect the bottom line.
2. Develop a game plan
First, define your core mission, goals, and values for your customer’s experience. Each company and industry has its own distinct challenges and objectives, so taking the time to explore the opportunities and pain points for your team and customers will enable you to build the right system for your needs.
To start, ask yourself these questions:
- What am I looking to accomplish? Improved customer experience? Increased usability? Brand cohesion?
- What problems are being caused today because of a fractured approach to design? Over-budget projects? Duplicative work? Slow design and development cycles?
- What are the greatest impacts the new design system will provide for our company and customers? Streamlined workflows? Quicker design iterations? Faster time to market?
- What roadblocks will we face? Lengthy industry regulatory process? Multiple sign-off requirements? Resource constraints as we execute and implement?
Don’t hold back. Being clear about your goals and the issues you might face in the design process will help get you prepared and keep you focused.
3. Use a systematic design approach
Consumers are more critical than ever about the products and services they use. If customers have a poor or confusing experience, whether it is in person or online, they are more likely to look for alternatives.
Creating a design system that is cohesive and recognizable gives consumers a consistent experience with each of your brand properties: e-commerce portals, social channels, marketing sites, landing pages, etc.
Industry leaders like Google, Salesforce, Atlassian, and Mailchimp are doing just that. They’ve created detailed design frameworks that help their teams, partners, and other designers easily create products that fit within their brand and remain consistent with their design approach. This includes outlining their brands’ copywriting guidelines, UI patterns, style, layout, and usage specifications. All of which allow teams to create and iterate faster, while maintaining a cohesive customer experience.
Case Study: Spotify
In 2012, Spotify was growing quickly. Fragmentation and inconsistency across the product family created frustration for internal teams, and a wildly unpredictable in-product experience. As a result, the product family looked less like a family, and more like a mash-up of distant cousins. Besides its logo and trademark green, each design element is barely recognizable as the brand we know now.
Spotify turned things around by creating a global design language, titled GLUE (a global language for unified experience), which united a previously disparate suite of products to create a cohesive, consistent brand experience.
Originally published at www.meltmedia.com.