Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Patternlab: Atomic Design & Living Styleguides (Refresh Hilo)

849 views

Published on

Introduction to using Patternlab to create user interfaces with atomic design.

Published in: Design
  • Login to see the comments

Patternlab: Atomic Design & Living Styleguides (Refresh Hilo)

  1. 1. pattern lab 1 pattern labcreate atomic design systems
  2. 2. pattern lab AboutJason Kalawe 2 Gemini Observatory Web Architect makeaweli @makeaweli
  3. 3. pattern lab 3 atomic design atoms molecules organisms templates pages
  4. 4. pattern lab 4 atoms basic design elements
  5. 5. pattern lab 5 molecules groups of elements that function as a group
  6. 6. pattern lab 6 organisms groups of molecules joined together to form a section of an interface
  7. 7. pattern lab 7 templates organisms combined to form page-level objects
  8. 8. pattern lab 8 templates focus on content structure rather than actual content
  9. 9. pattern lab 9 pages specific instances of templates
  10. 10. 0
  11. 11. pattern lab 11 pattern labcreate atomic design systems
  12. 12. pattern lab 12 pattern labcreate atomic design systems user interface
  13. 13. pattern lab 13 pattern labcreate atomic design systems create patterns
  14. 14. pattern lab 14 pattern labcreate atomic design systems mustache includes
  15. 15. pattern lab 15 pattern labcreate atomic design systems data
  16. 16. pattern lab 16 pattern labcreate atomic design systems data iteration
  17. 17. pattern lab 17 pattern labcreate atomic design systems pattern-specific data
  18. 18. pattern lab 18 pattern labcreate atomic design systems pseudo patterns
  19. 19. pattern lab 19 resources patternlab.io bradfrost.com daisy

×