establishing processes, standards, and procedures

When consulting with the team and discussing the pain points that the group was experiencing, a few recurring questions needed to be solved.

  • How do we intake new components?

  • How can we align on the usage and sharing of components?

  • What are we doing best locally that can be applied globally?

  • How can we share ideas and not work in silos?

  • What is the process for linking with Product and Dev?

  • How do we build safeguards to keep things in alignment?

  • How to best communicate updates to the team?

  • How do we govern and maintain the system?

  • How do we keep track of progress?

When looking at all of these questions, it became very apparent that we needed processes, standards, and procedures to streamline our workflows and keep things moving in a consistent flow internally and externally to other departments. Let’s start with the standardization of components with build specs.

 

Component builds specs

Creating a standard for our components was the cornerstone of the team’s streamlining. It solved many problems up front for multiple departments.

  • Any new component would be thoroughly thought through and documented for any designer to reference and consistently use.

  • Using the atomic design method, we could ensure that everything created aligned with the new look and feel of the brand.

  • This standard would ensure that all components received the same treatment over time, ensuring libraries build up in a cohesive and consistent structure.

  • The build spec contains notes from the team on what they need to consider while creating components, teaching them about interaction design.

  • This build spec would be the standard that Product Owners would reference, streamlining the PBI creation process.

    • This worked so well that POs began directly copying the information in the build spec as the acceptance criteria for developers.

  • Many of these sections were created from conversations with developers and the information they constantly had to ask designers for. With all the information provided up front, developers can code confidently with fewer gaps to fill and a reduced churn between departments.

  • An ADA section ensured we remained compliant and considered all types of users from the ground up.

  • A tracker section lets other designers know if a component is ready for use or still in a conceptual design phase.

 

Component Creation Process

In conjunction with the new spec sheets, we revisited our workflow to optimize and build communication points for the team to share ideas and align on usage. We also tightened up the review process between us and development for UI to ensure components were pixel-perfect and in alignment with the 2.0 look and feel.