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
540
3

Design Patterns & Systems

What makes a design pattern collection or design system?

Avatar for Todd Zaki Warfel

Todd Zaki Warfel

May 17, 2013

More Decks by Todd Zaki Warfel

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

Other Decks in Design

See All in Design
ClaudeCodeでマーケターの課題を解決する
Avatar for 太田賢一 kenichiota0711
11
13k
研修担当者が一番伸びた　熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
Avatar for @Garyuten garyuten
2
350
2026_01_07_３DプリントはじめましたLT.pdf
Avatar for HideakiTakechi hideakitakechi
0
160
デザイナーが主導権を握る、AI協業の本音と実践
Avatar for satosio satosio
7
3.2k
公開スライド）熊本市様-電子申請中級編
Avatar for @Garyuten garyuten
0
1.1k
AI時代に必要な アイデアの形
Avatar for ux-man uxman
0
150
改正JISを見据えた、企業のアクセシビリティ対応ロードマップ
Avatar for Yu Morita securecat
1
340
Treasure_Hunting
Avatar for Sol Metts solmetts
0
360
全員がアウトプットを出せる時代、 誰を採用する?
Avatar for NishaMe nishame
0
460
はじめての演奏会フライヤーデザイン
Avatar for Kaito Kikuchi chorkaichan
1
280
爆速開発でAIプロダクトが40万インプレッションになった話
Avatar for つぶら tsubura
0
230
Storyboard Exercise: Chase Sequence
Avatar for Mandalyn Teo lynteo
1
280

Featured

See All Featured
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.2k
A Soul's Torment
Avatar for Nat Ma seathinner
6
2.6k
[SF Ruby Conf 2025] Rails X
Avatar for Vladimir Dementyev palkan
2
940
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.1k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
790
Music & Morning Musume
Avatar for Bryan Veloso bryan
47
7.1k
The Language of Interfaces
Avatar for Des Traynor destraynor
162
26k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
25k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
510
Claude Code のすすめ
Avatar for schroneko schroneko
67
220k

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