Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Thinking in patterns
Search
Tammie Lister
September 03, 2015
Design
2
470
Thinking in patterns
Talk for ThemeConf
Tammie Lister
September 03, 2015
Tweet
Share
More Decks by Tammie Lister
See All by Tammie Lister
Growing the WordPress design system
tammielis
1
1.1k
CSS in the editor
tammielis
0
310
Global styles the story so far
tammielis
1
790
Dropped stitches and tangled yarn - a call to simplify WordPress
tammielis
1
1.3k
Being Brave
tammielis
2
1.7k
Lessons from growing design in the open
tammielis
0
1.1k
Thinking in patterns
tammielis
0
43
Design matters in open source
tammielis
1
770
Opportunity of Open Source
tammielis
0
630
Other Decks in Design
See All in Design
Yumika Yamada Portfolio
yumii
0
1.8k
FigmaのFigmaファイルから学ぶTips & Tricks
hilokifigma
0
700
harutaka Vision Deck
zenkigenforrecruit
0
250
街・都市という眼差し。まちづくりにおける規範と実践
sakamon
0
150
アクセシビリティに取り組むメリット
magi1125
2
270
What makes a great Director?
_limex_
0
310
企画を動かすデザイナーの思考!「広げて絞る」アプローチ。
hikidakan
0
190
自分たちがターゲットになりにくい業務アプリケーションのユーザビリティを担保する取り組み / Initiatives to ensure the usability of business applications that are difficult for us to target
hiromitsuuuuu
1
700
【MIXI MEETUP!ー TECH & DESIGN DAYー】【工数98%削減】Xでモンストを話題にせよ!生成AIの活用で日本トレンド6位を獲得した企画の設計&デザイン術
mixi_design
PRO
0
130
文字コントラストを改めて考える / Reevaluating Text Contrast
lycorptech_jp
PRO
0
560
Yahoo!フリマ:生成AI利用機能ならではのインターフェース設計について / Yahoo! JAPAN Flea Market: Interface Design Specific to Generative AI Utilization Features
lycorptech_jp
PRO
0
500
CMS管理画面のアクセシビリティ
magi1125
8
2.5k
Featured
See All Featured
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Rails Girls Zürich Keynote
gr2m
95
14k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
The Invisible Side of Design
smashingmag
301
51k
Designing for Performance
lara
610
69k
The Straight Up "How To Draw Better" Workshop
denniskardys
237
140k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
54
3k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
For a Future-Friendly Web
brad_frost
180
9.9k
Become a Pro
speakerdeck
PRO
29
5.5k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Transcript
THINKING IN PATTERNS
Atomic Style Guide Component Pattern Library
None
None
None
None
school /s/-/k/-/oo/-/l/
A successful person isn't necessarily be er than her less
successful peers at solving problems; her pa ern-recognition facilities have just learned what problems are worth solving. - RAY KURZWEIL
DESIGN
To work our way towards a shared language once again,
we must first learn how to discover pa erns which are deep, and capable of generating life. - CHRISTOPHER ALEXANDER
PATTERNS
None
None
ui-pa erns.com/pa erns
None
PATTERN ANALYSIS
None
None
Everything should begin with research
None
None
None
None
None
None
None
PATTERN LIBRARY?
Speed
Iteration
Consistency
we define our design in a single location and use
a system to cascade it down to all platforms. We call it our Single Source of Truth. - LIVING DESIGN SYSTEMS @SALES FORCE
Understanding
THEME pa ern library
Pa ern library : WITHOUT DESIGN Style guide : WITH
DESIGN
None
not a design process. It’s manufacturing. It’s a cupcake machine
churning out identical cakes with different icing. But they all taste the same. - MARK BOULTON
None
= RJ : NYC Lego Street Art
Colville -Anderson
Colville -Anderson Eirik Newth
Nathan Sawaya
None
The Art of the Brick Expo
Without foundations, there can be no fashion. - CHRISTIAN DIOR
Always leave your library OPEN
None
None
James F Clay
None
None
None
??
??
Jeff Eaton
None
Tammie Lister @karmatosed THANKS, ANY QUESTIONS?
Resources http://patternlab.io/resources.html http://clearleft.com/thinks/165 http://ui-patterns.com/ http://styleguides.io https://medium.com/@bradhaynes/designing-products-that-scale- c8f3001f709b http://markboulton.co.uk/journal/design-abstraction-escalation