Style guide and pattern library
9
Style Guides & Pattern Libraries
-
Upload
brittany-mederos -
Category
Design
-
view
111 -
download
2
description
Transcript of Style guide and pattern library
![Page 1: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/1.jpg)
Style Guides &
Pattern Libraries
![Page 2: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/2.jpg)
Brittany Mederos Interaction Designer at Elementum
!
Twitter- @brim
![Page 3: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/3.jpg)
What is a style guide?
![Page 4: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/4.jpg)
What’s in a style guide?
![Page 5: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/5.jpg)
Some Examples
• Nike Style guide
• Adobe Style guide
• Skype Style guide
• Code for America Style guide
• Salesforce Style guide
![Page 6: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/6.jpg)
What is a pattern library?
![Page 7: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/7.jpg)
What’s in a pattern library?
![Page 8: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/8.jpg)
Some Examples
• Code for America Pattern library
• Salesforce Pattern library
• MailChimp Pattern library
• Atlassian Pattern library
![Page 9: Style guide and pattern library](https://reader033.fdocuments.in/reader033/viewer/2022051400/54c7178a4a7959381b8b458c/html5/thumbnails/9.jpg)
http://webdesign.tutsplus.com/articles/maintain-consistency-with-a-website-style-guide--webdesign-10795
http://designshack.net/articles/graphics/how-to-build-a-brand-bible-visual-style-guide/
Resources