Bolt Digital Design System

I spearheaded the initiative to create a comprehensive Digital Design System, currently being rolled out across two of Pega's flagship websites. During my tenure at Pega, I served as Product Owner, and managed the Design System team.

What

The Bolt Digital Design System encompasses front-end build tools, Twig components and templates, our core visual language, and Sketch design files. v1.0, which was released in February 2018, is the result of almost a year of focused work by the core Design System team, which includes a visual designer, a UI developer, principal designer and chief front-end architect. This team is augmented by our team of Drupal developers, and the work of several development contractors.

I created front-facing documentation for designers to outline Bolt's principles and guidelines regarding color usage, typography and other visual elements.

Why

The Digital Team at Pegasystems oversees the design and development of 5 content-rich websites for a global audience of customers, prospects, developers and internal users. We also support a number of our internal applications which integrate with Pega's websites. With limited development and design resources and a huge volume of work, there was a significant level of design and code inconsistency across the different platforms, and an executive directive to fix it.

A design system, which contained design files, front-end code and guidelines for both was essential to both providing consistency across these disparate entities and in gaining velocity as a team.

How

The need for a Digital Design System became clear in my earliest days at Pega, and I spent a lot of time explaining what it was and laying the groundwork for it. Over the course of a year and a half, we tried a few different iterations of the design system, generally aligned to specific project work. Lacking dedicated resources, we kept hitting walls with adoption. Developers found the system complicated and hard to use, and the few people contributing to the system were frustrated that they didn't have time to put the care into it that was needed to ensure adoption.

In June, with the help of Principal UX Designer Adam Sadowski, we were able to convince executive leadership that the design system needed a dedicated team to be successful. Using the Pega.com re-brand and replatforming effort as our starting point, the team went to work on the next generation of the design system, which we called Bolt.

I worked with the design systems team to align and promote a vision for Bolt that we shared with executive leadership.

For the second half of 2017, we focused on creating the architectural foundation, defining Pega's visual language in the Digital space, and creating components to support key sections of pega.com. As the system moved towards v1.0 and we started incorporating it to more Digital properties, I worked with the team to align the Bolt roadmap to outcome-focused Hills that will help us scale thoughtfully, and continue promoting Bolt across the leadership organization. I also helped the Bolt and Drupal teams coordinate architectural governance sessions to ensure that Bolt meets the needs of the development teams incorporating it into our sites.

I created a UI inventory of existing components, templates and pages to support the creation of components in Bolt.

Key Contributions

Bolt in action on the Pega.com home page.