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
Design Systems in Sketch
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
XaverLoeffelholz
February 19, 2018
Design
0
150
Design Systems in Sketch
XaverLoeffelholz
February 19, 2018
Tweet
Share
Other Decks in Design
See All in Design
「自分の仕事はどこまで?」と問い続けたら。デザイナーの「視座」を考える
mukai_takeru
0
300
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
root_recruit
0
380
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.3k
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
loglass2019
1
7.1k
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
3
1.4k
不確実性の時代にみんなで試したFigma × MCP × Cursor ハンズオン
techtekt
PRO
7
1.8k
企業にデザインが融けたとき、デザイナーにできること。事業会社12年間の探究と葛藤 / Designship2025
visional_engineering_and_design
0
1.4k
デザイナーがAIを使い倒して爆速プロダクト開発!社内ハッカソンでの取り組み紹介
abokadotyann
9
3k
Figmaレクチャー会Part1 基本のき編@千株式会社 社内勉強会
designer_no_pon
2
250
大きな変化の中で、わたしが向き合ったこと #もがく中堅デザイナー
bengo4com
1
1.4k
デザイナーとエンジニアで 同じ山に登ろう
moco1013
0
140
Figmaレクチャー会Part2 もっと使いこなす編@千株式会社 社内勉強会
designer_no_pon
1
260
Featured
See All Featured
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
79
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
140
How STYLIGHT went responsive
nonsquared
100
6k
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
83
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.3k
The browser strikes back
jonoalderson
0
390
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
120
Product Roadmaps are Hard
iamctodd
PRO
55
12k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
160
Designing Experiences People Love
moore
144
24k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
3.6k
Building Adaptive Systems
keathley
44
2.9k
Transcript
Design Systems in Sketch Xaver Loeffelholz & Jeroen van Dongen
None
With a design system... … there is less work for
designers and developers … user interface becomes more consistent … a more collaborative workflow is created
Atomic Design http://atomicdesign.bradfrost.com/
What is atomic design?
None
None
Sketch Libraries • Available since Sketch 47 (October 2017) •
Replacement for template files • Symbols are always up-to-date
Our implementation Sketch library screenshots, maybe a video?
Updates in the library
None
Nested symbols
None
Pages • Combined use of molecules and organisms • Highly
customizable • Still always up-to-date
None
Creating an Atomic design system • What is an Atom,
what is a Molecule? • Agree on wording • Create a clear structure • There will always be exceptions
Problems • Overrides do not work well with organisms •
Sketch slows down
Trade-offs Big Design system Hard to find object that is
needed Small Design system Probably missing some elements
Limitations • No resize of symbols based on text •
Plugins available, but problematic
Treat design system like a product
Questions? Thank you! … BTW. We are hiring! delightex.com