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
410
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Case Study: Experimenting with Design Systems
Bermon Painter
April 04, 2018
More Decks by Bermon Painter
See All by Bermon Painter
Behavioural Science + Product Innovation = ❤️
bermonpainter
0
580
Haciendo una inmersión profunda con el JAMStack y Vue.js
bermonpainter
0
370
Pensamiento de Diesño: Desarrollar Ideas a la Implementación
bermonpainter
0
340
Design Thinking: Ideas to Implementation
bermonpainter
0
700
Product Development with Vue.js and a Headless CMS
bermonpainter
0
460
Successfully Hire, Mentor, Retain and Lead Teams
bermonpainter
2
410
Crafting Successful UX Strategies
bermonpainter
0
1.3k
The Fallacy of Digital Transformation
bermonpainter
0
530
Design Thinking: Ideas to Implementation
bermonpainter
3
1.6k
Other Decks in Design
See All in Design
PLATEAUで白い街を作る
aikautau
0
140
CULTURE DECK/Marketing Director
mhand01
0
1.5k
分散するデザイン組織をつなぐ デザインミートアップの取り組み/nikkei-tech-talk49
nikkei_engineer_recruiting
0
140
root COMPANY DECK / We are hiring!
root_recruit
3
30k
Rethinking IFUs: What Board Game Rulebooks Contribute to IFU Usability
deadlinepoet
0
350
I.A. como meio, não como fim. Como avaliar o valor entregue?
videlvequio
0
440
Design dependencies
teba_eleven
0
150
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
ayumidesign
0
160
体験負債を資産に変える組織的アプローチ
hikarutakase
0
1.6k
空間アプリ開発のフィードバックをCodexにするための抽象的なデザインツールの模索
karad
0
170
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
7
5.4k
怖くないアクセシビリティ -カウンターカルチャーとしてのアッカン東京-
securecat
1
230
Featured
See All Featured
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
660
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
530
KATA
mclloyd
PRO
35
15k
Amusing Abliteration
ianozsvald
1
250
Raft: Consensus for Rubyists
vanstee
141
7.6k
Chasing Engaging Ingredients in Design
codingconduct
0
270
My Coaching Mixtape
mlcsv
0
230
Game over? The fight for quality and originality in the time of robots
wayneb77
1
240
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
370
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
270
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
280
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.