1. How to Make a Style Guide Last Kimberly Blessing @obiwankimberly

4. Design style guides document information architecture practices, aspects of the user interface, such as grids and layouts, graphic design elements, such as color and typography, and branding.

5. Modern “front-end” style guides pair design specifications with code in order to give a complete picture of how the visual design language is implemented.

7. ROI of Front-End Style Guides EfficiencyReduces development and QA time, improving time to market for new features CollaborationBuilds cross-functional teamwork and knowledge, eliminates miscommunication ConsistencyCreates a consistent user experience, reduces need to reinvent the wheel ClarityMakes it easy to identify gaps or inconsistencies PrideIs the mark of a team focused on quality, which commits people to maintaining quality standards

8. Typical Complaints IrrelevanceThe style guide is out of date or isn’t followed consistently. Lack of DetailThe style guide isn’t thorough enough – or it’s too specific to be applied broadly. No AutonomyThe style guide prevents individuals from being creative problem-solvers. Poor Communication Lack of information about the style guide is causing confusion. Lack of Consensus [Group X] disagrees with and isn’t following the style guide.

12. The Circle of Standards Creation and Documentation Training and Communication Review and Approval Process

13. Creation and Documentation Start with the fundamentals Investigate the live site and work in progress Think ahead to future needs Review regularly Monitor projects for efforts that require standardization Creation and Documentation Training and Communication Review and Approval Process

14. Training and Communication Make training mandatory for everyone Offer training regularly Communicate on a regular basis Make information available in a convenient format Creation and Documentation Training and Communication Review and Approval Process

15. Project Review and Approval Process Make adherence to the style guide part of the project requirements and acceptance or launch criteria Formal design and technical/code reviews look for standards- related issues New work gets fed back into the Creation phase Creation and Documentation Training and Communication Review and Approval Process

16. The Standards Manager Champion for the style guide and standards May run a team dedicated to maintaining the style guide Must understand the related disciplines and work to be effective

18. Style Guide References A List Apart article by Anna Debenham http://alistapart.com/blog/post/getting-started- with-pattern-libraries http://alistapart.com/blog/post/getting-started- with-pattern-libraries Collection of public style guides https://gimmebar.com/collection/4ecd439c2f0a aad734000022/front-end-styleguides https://gimmebar.com/collection/4ecd439c2f0a aad734000022/front-end-styleguides

19. Good Luck Making Your Style Guide Last! Kimberly Blessing @obiwankimberly