How to create a living style guide

7d86093feb64d21538561ea2c071a89e?s=47 Fiona Chan
March 28, 2013

How to create a living style guide

A short presentation around the steps to take to create a living style guide.

This was presented at Web Directions What Do You Know 2013.

7d86093feb64d21538561ea2c071a89e?s=128

Fiona Chan

March 28, 2013
Tweet

Transcript

  1. 5.

    Why a style guide? • Consistency in design and code

    • Reference for the whole team • Speed up development time
  2. 7.
  3. 9.

    Common components • Typography • Links • Lists • Boxes

    and background colours • Buttons • Forms
  4. 14.
  5. 16.
  6. 17.

    Extra resources • Front-end style guides http://24ways.org/2011/front-end-style-guides/ • Front-end style

    guide collection https://gimmebar.com/collection/4ecd439c2f0aaad734000022/front-end-styleguides • Making Front-end Development a Team Sport http://cognition.happycog.com/article/making-front-end-development-a-team-sport
  7. 18.