Based on Code for America’s pattern library template, I created a one-page design system for Greenway’s upcoming patient portal product. I began by documenting the branding for the site.
The color scheme for the site was shown, along with the SCSS variable to use that color.
A large icon library was also included, and the markup to add an icon was also shown.
Company standards like how we should format phone numbers and address were often known by business analysts, but not readily available for designers and developers. I made sure to include these in the pattern library so the information was known to everyone.
The patterns started with small, individual elements like headings, text, and form elements.
Buttons were available in a variety of sizes and types.
From smaller elements, we derived larger components like alerts, modals, media lists, and more.
Originally created in 2014, this pattern library is still in use by Greenway in 2018.