What is a UX design language system?

A UX design language system is an overarching set of design rules that maintains harmony across an ecosystem of digital products. It helps you deliver optimal product experiences on all platforms. It’s a way of making sense of entire digital ecosystems and mashes “brand languages”, “design principles”, “human interface guidelines”, “styleguides”  and “motion guides” together.

As we like to think of it, a UX design language system is different to a single design language because it is composed of multiple design languages. It supports multiple products across multiple platforms and devices. For example, the act of translating the way that “search” works on one product and device (e.g., Product X, desktop) to another product and device (e.g., Product Y, mobile) —is like translating from one language to another. When you have multiple languages that work together to form a whole, you have a system.

A UX design language system is driven by:

  • Brand: purpose, philosophical position, values, mission & positioning
  • Design principles: that communicate the objectives for the user experiences (these may vary across platforms and are driven by user research)
  • Product: personality and tone of voice (which may be different across products)
  • and elements of a design language including:
    • visual design (logo, color, typography, space, shapes, surfaces)
    • interaction design (page flows, critical paths, inputs like gestures, audio, mouse-clicks, and interaction modes)
    • UI components: behaviors and appearances (buttons, dialogues, image grids, lists, controls, menus, sliders, tabs, text fields, messaging, etc.)
    • layout systems for usage states (responsive or multi-platform/device)
    • content types (text, video, slideshows, images, etc.)
    • motion and animation (patterns, speed, meaning)
    • audio (interaction responses, alerts, etc.)

 

And here’s a graphical way of thinking about the different types of rules: Fixed, Variable, Unique and Contextual.

The branding and design principles that guide a UX design language system should be solid, but the enduring value of the UX design language system is that it is flexible enough to grow over time and alongside each product and its users.

The goal of the UX design language system is to provide a logical framework that helps designers and developers consider the full system during the design process, then gradually integrate changes that expand yet maintain the integrity of the system.

Now that we’ve got a good understanding of what a design system is, let’s take a look at why they can be beneficial.

 1. A UX design language system is good for your brand

Recognizability and ownership
People should be able to identify your brand by signature attributes. These can be exhibited visually, through a particular language style, a behavior or any number of factors. And because it’s a signature attribute it should be recognizable across all of your products. You can strengthen your brand by creating signature attributes that you can own, and by making them distinct and repeating, they’ll become associated with your brand. For example, the list making app “Clear” has a series of signature interactions including swiping to complete a task, pinching apart to create new item, and pinching together to change lists.

Consistency
Whether it’s an ecosystem, a suite of products or a single app, consistency is important because it defines the perception of your brand as a coherent whole. Presenting your brand consistently across multiple products creates a stronger and more memorable brand than a fragmented experiences  would. However, within a UX design language system, consistency doesn’t mean that everything should be identical across platforms or apps. The key is finding the right balance between consistency, logical variability and context-specific uniqueness.

Authenticity and context sensitivity
Brand languages can, and in most cases should, vary depending on the context, platform, and audience. However, it’s important is that these various languages are designed holistically so they have threads of consistency and recognizability across all your brand experiences. A UX design language system justifies variability based on use case, context, user needs, etc., and explains how to do it in a way that is authentic to your brand.

Relationships
A UX design language system sets the tone of a relationship between a user and a product. It also helps you understand how stories are built through multiple engagements. The UX design language system contains structures that manage those increasing levels of depth. Doesn’t everyone want to give people experiences that are deep and trustworthy? Learn how to manage these deepening relationships and help people forge strong relationships with your brand by mapping out the rules that guide them.

2. UX design language systems are good for users

Ease of use
A UX design language system considers the logic and consistency of the flows within the system to ensure ease of use. This means clear expectations are set; users’ skill and knowledge levels are accounted for; tasks are completed in a timely, successful manner; errors are remedied; disasters are averted; and people are satisfied. Ease of use is something people look for when they choose the products they use. A design language system helps keep the train on the tracks and allows the user to sit back and relax.

Enjoyment
You can plan moments of surprise, delight, reward, and satisfaction into your product experiences. However, it’s key to create an environment that people can continually enjoy, regardless of whether it’s the first time or the 100th time. A UX design language system helps to continually reward, surprise, delight and satisfy users. It can provide the patterns necessary to build enjoyment into every experience.

3. UX design language systems are good for your business

Efficiency
A UX design language system provides the assets and guidelines needed to quickly and realistically prototype new products, new versions of products, or new features without having to redefine foundational elements each time. It means that teams can work with greater certainty that their solution appropriately integrates with the holistic product ecosystem design system.

Stability
When driven by principles and clear guidelines, the UX design language system will provide inherent stability. New teams creating new products or features will be able to immerse themselves in the mindset of previous designers and more effectively create new experiences based on a stable foundation.

Flexibility
Once a system is built it’s easy to gradually improve upon it because the structure is in place. For example, a UX design language will most likely consider how gestural interactions could be used within the system, even if they’re designed and integrated at a later date.

Innovation
A UX design language system can help you evaluate the architectural relationships between your products or structural relationships within your products in order to identify where there are opportunities for product or feature innovation.

Cost
In the mid to long-term, a UX design language system will save you money. You will likely see cost benefits across design, development and, customer support.

Culture
A UX design language system can be a tool for culture building as much as it is for products. Defining and clearly exhibiting your brand and product experiences can create a sense of unity that is great for the culture of your company—something everyone can get behind and be inspired by.

Would you benefit from a UX design language system?

Ask yourself: 

  • Do you want to build upon an existing design foundation?
  • Do you need to ensure ease-of-use for all levels of user experience?
  • Are you interested in building a stronger and more recognizable brand by tying your experiences together?
  • Do you want to improve the expression of your brand personality, values and mission across your products?
  • Do you need a structure for dealing with different contexts, devices and platforms?
  • Do you need a structure to guide future design efforts and growth over time?
  • Does your user experience design language system give people the opportunity to build deep  relationships?
  • Could your culture and productivity be improved with a stronger product ecosystem vision and guidelines for implementation?
  • What can be added into your UX design language system to create enjoyable, positive and memorable experiences?

Resources:

http://www.google.com/design/

http://msdn.microsoft.com/en-us/windows/apps/hh779072.aspx

https://developer.apple.com/library/iOS/documentation/userexperience/conceptual/mobilehig/

https://developer.apple.com/library/mac/documentation/userexperience/conceptual/applehiguidelines/Intro/Intro.html

https://developer.apple.com/library/mac/documentation/userexperience/conceptual/applehiguidelines/HIPrinciples/HIPrinciples.html

http://www.bbc.co.uk/guidelines/futuremedia/desed/visual_language.shtml

Like this post1
Go top