Design Systems: Only Rock and Roll (but I like it)

"I like to define UX as your customers’ understanding of how your applications work. They don’t know or care about how you’ve built it, they only care about the experience they have while using it."

Before my career in software design, I spent years as a musician in touring rock bands. Bands on the road have many “systems:” a system for getting the gig, getting to the gig, setting up, tearing down, and then getting to the next show.

Most importantly, bands have a system for creating music. The instrumentation defines the sound (musicians are obsessed with gear), and band members play surprisingly rigid roles while writing and performing music.

In addition, good bands will have a system for collectively knowing when to speed up or slow down to fit the mood of the room, skip a tune in the set-list, and even flip singing parts on the fly if someone is likely to have trouble hitting a note. It's a bit like a sports team. Actually, it's exactly like a sports team: Coaches create a system of play, and players both play their role and riff spontaneously within the parameters of that system. Systems create consistency and the necessary cohesion needed for success.

Manufacturing systems design

Likewise, design systems are commonly used by manufacturers of hardware products, like cars or furniture, and for many of the same reasons: Design systems provide discipline in the design of products, consistency of assembly, and ease of maintenance across multiple products and business lines. Manufacturers use systems for the same reason that bands do: to build cohesiveness and quality that customers appreciate.

Takin' Care of Business: What is it we’re doing again?

The role of UX in the enterprise is to connect business goals to end-user actions. Whatever your business goals may be, only your end-users – your customers and/or your employees – can ultimately deliver value for you.

I like to define UX as your customers’ understanding of how your applications work. They don’t know or care about how you’ve built it, they only care about the experience they have while using it. Therefore, having a direct connection between the business and the end-user is critical.

UX professionals are exactly that: They are voices of end-users in the software creation and delivery process. While it’s accepted that high-quality designs will speed up development and reduce maintenance costs post-release, the primary value of UX design is to succeed in your application business goals by means of end-user success.

Where design can get bogged down

Unless Design has a very strong voice in your enterprise, the inevitable chaos created by competing stakeholders can quickly drown out the needs of the end-user. The result? A product stuffed with messy features, no longer based on any business goal, and ultimately never delivering much value.

Even if you’ve empowered UX Design in your enterprise, there’s also a substantial risk of multiple good but unrelated designs within the same set of applications. While a single design may solve a single problem, if unrelated to other designs in your application ecosystem, your customer may end up with an incomprehensible mess of competing interaction patterns, and you’re left with multiple concepts to maintain. A design which succeeds alone fails miserably in concert with the others. It’s a bit like a goth singer with a country-rock band. Probably won’t work.

Closing the gap

The Pega platform was created to reduce the gap between your business goals and your customers/employees, to maximize re-use, and to turn business intentions into actual software. These fundamental principles are the core of our software platform, put into practice via Pega's UX Design System.

I can see clearly now: Rules to the rescue!

A UX design system is actually a set of rules meant to ensure consistency, cohesion, and end-user success across multiple digital products. Design systems deliver optimal interfaces quickly while clarifying communication between business, design, and IT. Basically, they create a shared language regarding essential UX principles.

In business applications, a design system ensures that the essential elements of a user’s experience work together. For instance, Apple’s design system states that the top navigation bar in a mobile app “should contain no more than the view’s current title, a back button, and one control that manages the view’s contents”. With that rule in place, any argument about adding additional elements to the top navigation bar is moot.

UX design systems provide re-usable patterns of UI, layout, motion, and style in order to enforce rules regarding:

  • Consistency of navigation
  • How regions of the screen best fit together
  • When to use a link versus a button or modals versus pop-overs
  • Consistency of language throughout the application experience
  • Consistency of form elements, tables, headings
  • When a two-column layout should responsively switch a one-column layout
  • The speed of animated transitions
  • Interactions needed for users with disabilities
  • Standard consistency of visual elements like spacing, typography, and color.

What good design systems should have

Outstanding UX design systems go far beyond branding or style guidelines: They enforce the way users interact with applications. UX design systems will both speed delivery of new products or features and ensure better results. They clarify customers’ understanding of how your applications work.

Most operating system providers such as Google and Apple have strong design systems in place, and many platform providers have design systems as well. Some are more complete than others. And some, unfortunately, demand the identical pattern for every business function.

Pega's design system takes a step forward and focuses not only on general UX patterns but also on complete out-of-the-box experiences for entire business functions. We design for the core experiences of essential business processes. Take claim adjudication (sexy, I know.) Pega has a complete claim adjudication work-flow which can be configured to any industry, and which can be extended without losing its core UX value. (The core UX value is fast recognition of problems, fast and accurate comparison against policy, and then fast approval, rejection, or modification.)

We view each element in the “claims paradigm” as a pattern unto itself, meaning that every element on the screen – from top-level page constructs like navigation, to radio button arrays – is part of a single system. Everything is tested to work together, to be constructed quickly, and to be maintained and tweaked easily.

UX Pattern for Medical Insurance Claim in Pega 7

(Click to expand.)

Example above: Since the essential user actions for adjudicating a medical insurance claim are very similar to adjudicating a warranty claim, we can create a complete UX pattern for claim adjudication in general. Note the warranty claim in the foreground is stage-based, while the insurance claim in the background is, for the claims adjuster, a single step process. Otherwise, the interface is almost identical.

Rock bands to rockets

Whether it’s about rock bands, sports teams, vehicles, or the design and implementation of applications, having a solid system is essential. Your UX design system assures organized, cohesive designs of your applications and locks in proven rules for outstanding user experience.

Design systems shift your organization’s focus to the core UX paradigms needed to achieve the value you want, with no opinions or guessing. Great bands have a systemized approach and know what they’re doing well before they play the first note at the first venue. Indeed, well before the van is gassed up or the tour booked. It’s no different for any business. Just a wee bit quieter perhaps.

Learn more about how smart business starts with smart design at design.pega.com.