Primarily, Pecan is an inventory of clean, modern UI components based on Atomic Design principles.
My team developed this tech-agnostic system to empower agile teams to create consistent and high-quality UI outcomes.
The system established a company wide visual language, accelerated delivery and ensured a brand look-and-feel.
Better products. More efficient teams.
EBSCO's commitment to SAFe Agile meant technology teams were producing faster than ever. Much of that work was focused on improving the presentation layer (UI).
We needed to scale our UX Design operation.
At first, we utilized style guides, symbols and shared libraries. This did help us produce "static" concepts more efficiently.
But, critical aspects of the design intent were not translating (example: responsive patterns, spacing, alignment, etc.). We saw inconsistent development quality. Design debt was pilling up.
I set out to unite the organization around building a Design System. Sharing what I had learned. Showing how others had applied system thinking to solve very similar challenges.
First, gaining approval from key stakeholders and then moving the discussion to a larger audiences.
I relied on current UI inconsistencies and huge demand from agile teams to convince leadership to invest in our system.
Presentations - Taking any opportunity to tell my story and share what I had learned. I aimed to educate others first.
Budget discussions - Hard conversations around money provided opportunities to inform how other organizations had benefited from the operational efficiencies that a design system might provide.
Capacity vs. Load - At the time, we were a team of 5 designers supporting over 35 development teams. A design system could scale design output, without adding significant headcount.
January 2020 marked Pecan's initial release.
Our system did not have much content. We still had our Sketch Libraries and style guide to fall back on. At first, Pecan Design System was a specialized tool that we used to communicate only our most complex and most critical UI patterns.
Living system = Improved process
Over time, our development partners came to see Pecan as a valued resource. Designers were doing more. Design intent was easier to translate into production quality code.
As design became more comfortable working in the browser, collaboration became much more natural and less obtrusive. This momentum allowed me to allocate more resources to maintenance and improvement of the system.
We started moving away from big, up-front design projects and created a leaner more immersive process that relied on the design system to produce and communicate more effectively.
We had made something impactful. The rest of the organization wanted to be a part of our movement.
System Architects wanted to built out a React-specific version of Pecan. Developers would benefit from reusable code snippets found in a component library.
Ideally development quality and speed could scale just like design.
We began the process to align these two aspects of our full system. This meant more overhead and coordination... but, done well, it could lead too much greater impact.