Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design Patterns & Systems

Avatar for Todd Zaki Warfel Todd Zaki Warfel
May 17, 2013
Design
3
520

Design Patterns & Systems

What makes a design pattern collection or design system?
Avatar for Todd Zaki Warfel

Todd Zaki Warfel

May 17, 2013
Tweet

More Decks by Todd Zaki Warfel

See All by Todd Zaki Warfel
Make Mentor Learn
Avatar for Todd Zaki Warfel zakiwarfel
1
290
Prototyping for Mobile
Avatar for Todd Zaki Warfel zakiwarfel
4
480
Paper Prototyping
Avatar for Todd Zaki Warfel zakiwarfel
1
410
GA Know Your Audience
Avatar for Todd Zaki Warfel zakiwarfel
0
260
GA UX Research Workshop
Avatar for Todd Zaki Warfel zakiwarfel
3
280
GA Hi-fi Design for Mobile Web
Avatar for Todd Zaki Warfel zakiwarfel
3
300
UXWeek Prototyping with HTML5
Avatar for Todd Zaki Warfel zakiwarfel
4
1.1k
Designing with HTML5, CSS3, and jQuery
Avatar for Todd Zaki Warfel zakiwarfel
8
770
Designing with Data
Avatar for Todd Zaki Warfel zakiwarfel
98
5.2k

Other Decks in Design

See All in Design
教育分野に強いUIデザイナー / 山口哲弘ポートフォリオ
Avatar for 山口哲弘 t2yamaguchi429
0
350
私とデザインの10年
Avatar for なつ iflection
0
120
The Golden Whitney
Avatar for OhTristanArt ohtristanart
PRO
0
410
【デザイン初め新年会2025｜01.08】事業貢献するデザイン組織の挑戦 - 2025年、課題解決をリードする。
Avatar for payatsun payatsusan213
0
11k
株式会社デイトラ様│コーポレートサイト│コンセプトシート
Avatar for Haruka_CAPEO haruka_capeo
0
1.8k
「描く」という衝動に立ち返る〜Figma Drawがひらく思考のかたち〜
Avatar for Miwa Kuramitsu transit_kix
1
660
CIRCULAR ECONOMY + SERVICES
Avatar for John Manoochehri jmanooch
0
110
freee + Product Design FY25Q4
Avatar for freee freee
4
14k
OLTA株式会社/デザイン紹介資料
Avatar for OLTA株式会社 taxy
0
290
デフォルトの16:9（960*540px）のケース / Google Slide Size Test
Avatar for Arthur arthur1
0
2.6k
クライアントワークにおける UXリサーチの実践
Avatar for Kozo Taira kozotaira
0
650
Les petites aventures de CSS, saison 2025
Avatar for Raphael Goetter goetter
3
4k

Featured

See All Featured
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.3k
KATA
Avatar for Megan Lloyd mclloyd
29
14k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
180
53k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
94
13k
A better future with KSS
Avatar for Kyle Neath kneath
239
17k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
How GitHub (no longer) Works
Avatar for Zach Holman holman
314
140k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.3k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.3k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
331
21k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
159
23k

Transcript

  1. PATTERNS & DESIGN SYSTEMS METHODS FOR MAKING SCALABLE DESIGN

  2. THEY’RE EVERYWHERE WE LOOK

  3. None
  4. None

  5. 0 1 1 2 3 5 8 13 21 34

    55 89 144
  6. None

  7. PREDICTABLE OUTCOMES IMPROVED USABILITY BETTER USER EXPERIENCE SCALABLE SYSTEMS

  8. DEFINING A DESIGN SYSTEM

  9. PATTERN COLLECTIONS DESIGN SYSTEMS

  10. PATTERN COLLECTIONS

  11. http://www.lukew.com/ff/entry.asp?1514

  12. http://www.flickr.com/photos/factoryjoe/collections/72157600001823120/

  13. http://inspired-ui.com

  14. http://pinterest.com/abhinavsharma/mobile-web-navigation-patterns/

  15. http://box.mepholio.com

  16. http://dribbble.com/404

  17. http://patterntap.com

  18. http://patterntap.com

  19. DESIGN SYSTEMS

  20. VISUAL EXAMPLE DESCRIPTION PROBLEM IT SOLVES WHEN TO USE HOW

    TO USE IT
  21. None
  22. None

  23. http://developer.yahoo.com/ypatterns/

  24. http://developer.yahoo.com/ypatterns/

  25. http://ui-patterns.com

  26. http://ui-patterns.com

  27. http://patternry.com

  28. http://patternry.com

  29. http://patternry.com