Pattern Definition and Documentation Process

The goal of this library is to increase design and development efficiency by eliminating redundant work, allowing designers and developers to use established patterns to create optimal solutions.

Below, we outline the general process that we use to create a pattern. Do you have a proposal? check out the change process below

 

Progress Tracker

  • 30Patterns currently documented in the Pattern Library
  • 11Patterns currently in the documentation phase
  • 3Patterns currently in the Validation Phase
  • 5Patterns currently in the research phase
  • 14Patterns currently in the discovery phase

 

 

DISCOVERY PHASE

It all starts with a question; one that might come from you, "do we have a pattern that does this?" or internally from us, "why do we do the same thing three different ways?"  These questions lead to an audit of all current experiences to discover if the pattern exists or to find the various ways we do it. (Link to an example audit)

 

RESEARCH  & DEFINITION PHASE

In creating a new pattern or optimizing an existing one, our team establishes a point of view based on existing UXR studies and competitive analysis. We also consider 3rd party research such as Baymard for their insights. Finally it is time to sketch out some proposals.

 

VALIDATION PHASE

The goal of the validation phase is to ensure any pattern we propose works to advance and improve a user's experience. We either gain insights from UXR studies or conduct our own tests or surveys with the help of that team to quickly gather the feedback we need to move forward. We validate with affected project teams as we move through this process. An accessibility analysis is always a part of this process to make sure a pattern can be used by everyone and follows ADA guidelines .

 

DOCUMENTATION PHASE

A pattern that has been vetted and researched thoroughly then gets moved to the documentation phase. Documentation includes a pattern name and definition, usage guidelines, rationale and standards for how and when to use that pattern, design specs, ADA guidelines and downloadable resources and templates for that pattern. 

 

RELEASE PHASE

If the Pattern exists in the Enterprise framework, the Pattern Detail Page is published directly to the library in the Elements and Patterns Section. Sometimes a pattern is documented fully before a FED is able to get its code in the Enterprise CSS. If this is the case, the documented pattern page is published into the Coming Soon section until it the code is in the CSS.

Once published, a communication blast is sent out to everyone to alert them of the new content.

 

UPDATES PHASE

Patterns should be viewed as dynamic, not static, building blocks. They will change for various reasons - freshness updates, brand changes, usability, or accessibility issues. Any patterns in flux will be flagged as such on this site, so that you know its status at any given time.

HOW CAN YOU GET A PATTERN UPDATED OR CREATED?

If there is an existing pattern that you’d like us to look into optimizing, eliminating, or updating - beautification is a valid reason - here is the process. Overall, we need your help with the discovery phase.

Checklist: What we'd need from you

  1. Provide your rationale for a change:  your use case, the problem you are trying to solve, and why the current pattern doesn't work.
  2. Document your proposal in some way including an explanation of why your approach is a good solution.
  3. Present to the Patterns team in one of two ways: set up a 1on1 or join our weekly open door meeting.  Reach out if you need to.

We will then handle the remaining steps in the process, which will start with an audit to complete the discovery phase.

 

 

If there is an new pattern (say, in-use at SHC but undocumented, or a new pattern you've seen in the market) that you think should be part of the system, here is the process. Overall, we need your help with discovery phase.

Checklist: What we'd need from you

  1. Provide your rationale for the new pattern:  your use case, the problem you are trying to solve and why this a good solution.
  2. Answer the question: "how does the pattern relate to the existing design system?"
  3. Document your proposal in some way.
  4. Present to the Patterns team in one of two ways: set up a 1on1 or join our weekly open door meeting.  Reach out if you need to.

We will then handle the remaining steps in the process, which will start with an audit to complete the discovery phase.

 

Why?...the proposal needs to come from you, so that the solution is as relevant to actual context of use as possible, and so that your team & stakeholders believe in it.