Slides from a presentation I gave at Front-End Design Conference and ForgeConf in 2014. My first Design Pattern Craftsmanship talk in 2012 was presented at Etsy's Code as Craft series and I talked about MailChimp's original UI Pattern Library. Since then, we've redesigned and rebuilt our pattern library, so V2 of the talk covers the history, challenges, and benefits of our exploration of front-end patterns.
12. 1991-2003
The Wild Wild Web
2003-2012
Web Standards
2012-Now
Responsive Design
13. 1991-2003
The Wild Wild Web
2003-2012
Web Standards
2012-Now
“The traditional building paradRiegspmons iivse D etsoign
gather all the parts of a building on site
and then assemble them piece by piece.”
– Refabricating Architecture
22. Master Craftsman
We realized that by focusing on creating systems,
instead of always starting from scratch, we have
more time to focus on important details.
Illustration Source: André Jacob Roubo, L'Art du Menuisier Paris, 1769-74
30. A DESIGN PATTERN LIBRARY?
•Specific to a Project or Application*
•LEGO-Like Sets of Markup & Style
•For Elements Used 3 or More Times
•Should Be Adaptable & Extendable
•Serves as a Testbed & Style Guide
39. “We’re not designing pages.
We’re designing systems
of components.”
- Stephen Hay
Illustration Source: André Jacob Roubo, L'Art du Menuisier Paris, 1769-74
56. Illustration Source: Carpentry for Boys by J. S. Zerbe, 3/72007 - gutenberg.org/ebooks/20763
Love˝
+˝
Patterns˝
+˝
Tools˝
Jason Beaird
@jasongraphix