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
390
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
520
Haciendo una inmersión profunda con el JAMStack y Vue.js
bermonpainter
0
330
Pensamiento de Diesño: Desarrollar Ideas a la Implementación
bermonpainter
0
290
Design Thinking: Ideas to Implementation
bermonpainter
0
650
Product Development with Vue.js and a Headless CMS
bermonpainter
0
420
Successfully Hire, Mentor, Retain and Lead Teams
bermonpainter
2
380
Crafting Successful UX Strategies
bermonpainter
0
1.3k
The Fallacy of Digital Transformation
bermonpainter
0
480
Design Thinking: Ideas to Implementation
bermonpainter
3
1.5k
Other Decks in Design
See All in Design
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
loglass2019
1
6.8k
地理院地図をもっと楽しく!れきちず新機能のご紹介
hjmkth
1
410
2026年の勢い / Momentum for 2026
bebe
0
170
【MIXI MEETUP!ー TECH & DESIGN DAYー】新たなSNS「mixi2」の “0→1”開発の舞台裏:デザイナーが語るプロダクト誕生秘話
mixi_design
PRO
0
190
maki setoguchi
maki_setoguchi
0
650
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
1.1k
AI業務アプリケーションの体験デザイン
kazuhirokimura
0
250
ユーザー像を「みてね」らしく可視化する 家族アルバムみてねUXリサーチチームの取り組み
mixi_design
PRO
3
660
2026年、デザイナーはなにに賭ける?
0b1tk
0
450
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
mewmo
PRO
0
140
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
1.8k
SAMSUL KAMAR ABDUL RAHMAN
samsulrahman32
0
210
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
54
8k
The Cult of Friendly URLs
andyhume
79
6.8k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
Done Done
chrislema
186
16k
Darren the Foodie - Storyboard
khoart
PRO
2
2.2k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
Music & Morning Musume
bryan
46
7k
The Curious Case for Waylosing
cassininazir
0
220
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.5k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.2k
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.