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
Case Study: Experimenting with Design Systems
Search
Bermon Painter
April 04, 2018
Design
1
220
Case Study: Experimenting with Design Systems
Bermon Painter
April 04, 2018
Tweet
Share
More Decks by Bermon Painter
See All by Bermon Painter
Behavioural Science + Product Innovation = ❤️
bermonpainter
0
280
Haciendo una inmersión profunda con el JAMStack y Vue.js
bermonpainter
0
180
Pensamiento de Diesño: Desarrollar Ideas a la Implementación
bermonpainter
0
170
Design Thinking: Ideas to Implementation
bermonpainter
0
460
Product Development with Vue.js and a Headless CMS
bermonpainter
0
280
Successfully Hire, Mentor, Retain and Lead Teams
bermonpainter
2
240
Crafting Successful UX Strategies
bermonpainter
0
890
The Fallacy of Digital Transformation
bermonpainter
0
280
Design Thinking: Ideas to Implementation
bermonpainter
3
1.2k
Other Decks in Design
See All in Design
The Fight
euralisw
0
120
ダークテーマとアクセシビリティ の融合したカラートークンの設計
degudegu2510
0
300
Wolf and the seven goatkids
_limex_
PRO
0
490
間違った「問い」を乗り越え ノベルティをプチバズりさせた話
takaikanako
0
1.3k
TrollsTopia: Funtography- Part 1
kenijam
1
220
1人歩きする営業資料作成
yutoshukuya
2
180
プロジェクトを成功に導く、デザイナーの仕事
akaneyoshikawa
0
140
Information Architects: The Missing Link in Design Systems
soysaucechin
0
130
プロダクトデザイン部 組織紹介(デザイナー向け)
chatwork_hr
1
290
デザインに関わる全ての人たちでエベレスト登頂を目指すために取り組んでいること
amishiratori
0
650
良いアプリケーションをデザインするための感覚の持ち方 / Cultivating a Sense for Designing Great Applications
usagimaru
23
8.2k
文化に寄りそうデザイン
recruitengineers
PRO
4
960
Featured
See All Featured
Being A Developer After 40
akosma
67
580k
Rails Girls Zürich Keynote
gr2m
91
13k
Teambox: Starting and Learning
jrom
128
8.4k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
81
44k
Designing with Data
zakiwarfel
96
4.8k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
34
6.1k
Why Our Code Smells
bkeepers
PRO
331
56k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
What's in a price? How to price your products and services
michaelherold
238
11k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
21
1.6k
Large-scale JavaScript Application Architecture
addyosmani
504
110k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
23
1.7k
Transcript
Case Study: Experimenting with Design Systems @bermonpainter | #cltdesign
Tonight’s Agenda Contrast style guide vs. pattern library vs. design
system Building your own Case study: Internal applications at Cardinal 1 2 3
Style Guides Defines abstract styles in the form static documentation
that describes how the design itself should be applied to a product or service.
Style Guides Color Palettes Iconography Imagery Typography Typographic Scale Grid
Definitions
None
None
None
None
None
None
None
Pattern Libraries A set of reusable components that are used
across single or multiple products or services.
Pattern Libraries Component Names Visual Representation Variations Use Cases Considerations
Code Samples Templates
None
None
None
Design System Forms the foundation of a shared design language
and allows the team to communicate shared rules and connections around how to build a product or service.
Design Systems Style Guide Pattern Library Tools & Utilities Principles
Rules
None
None
None
Design System Rules and Connections Style Guide Abstract Styles Pattern
Library Reusable Components
A style guide is an artifact of a design process.
A design system is a living, funded project with a roadmap & backlog, serving an ecosystem. “ “ – Nathan Curtis
PATTERN LIBRARY APP DESIGN SYSTEM
PATTERN LIBRARY APP DESIGN SYSTEM APP
PROSPECT METRE EVOKE DESIGN SYSTEM FULCRUM ENLIST
None
Fin.