Puppet

About

As a senior engineer and front-end, design system consultant, I was brought in to help Puppet's marketing team rebuild their marketing and documentation websites on a new platform.

The project involved a complete rebuild of the marketing and documentation websites, including a new design system and new tech-stack (migration from PHP Drupal to a JAM-stack with React). To that end, a large part of my role involved mentoring and upskilling their team on React and modern front-end development practices.

I led the team through a design audit of the new branding work, identified design tokens and common components, and assisted in building the UI component library. This included all the tooling, testing, and linting setup, as well as individual components and documentation in React Styleguidist.

Finally, I helped integrate the React component library into the WordPress content authoring workflow, as well as the Gatbsy build pipeline for the marketing site.

Deliverables

Audit and strategic breakdown of the new brand designs into an organized design language.
Custom-built React based component library to power the marketing and documentation websites.
Custom-built documentation and maintenance site for the component library using React Styleguidist.
Assistance with integration with backend services including WordPress for content authoring.
Integration of the component library with the Gatsby framework for the marketing site.
Improvements to build performance and CI/CD scripting.