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
Documenting an Atomic Design System with Jekyll
Search
Todd Moy
July 24, 2015
Design
1
370
Documenting an Atomic Design System with Jekyll
A lightning talk presented at Explore UX / TriUPA.
Todd Moy
July 24, 2015
Tweet
Share
More Decks by Todd Moy
See All by Todd Moy
Wild Mushroom
toddmoy
1
110
Misdirection
toddmoy
0
140
Magic
toddmoy
0
230
The Secret Life of Usability (AIGA)
toddmoy
6
530
The Secret Life of Usability
toddmoy
11
600
Alternate Reality Games
toddmoy
1
200
Brain Bugs
toddmoy
3
210
Other Decks in Design
See All in Design
kintone_aroma
kintone
0
1.4k
“ことば”が苦手なデザイナーへの処方箋 「なんとなく」から「意図」へ、 デザインを動かす言葉の力
mixi_design
PRO
1
200
プロダクトデザイナーに学ぶ、『見る気が起きる』ダッシュボードの作り方 / Creating Engaging Dashboards: Lessons from Product Designers
yamamotoyuta
2
500
2026の目標「もっと定量的に事業、会社へ貢献する!」
yuri_ohashi
0
680
Storyboard Exercise: Chase Sequence
lynteo
1
200
Franks Myth
gfht1
1
410
decksh object reference
ajstarks
2
1.5k
Ralph Penel Portfolio
ralphpenel
PRO
0
260
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
1.9k
Emmy's Artwork
mcksmith
0
190
見過ごさない誠実さ_アクティブバイスタンダーとIntegrityが支えるアジャイル文化 / integrity-and-active-bystander
spring_aki
1
290
AI情報に溺れながら、それでも頑張って泳ぐための思考法
yoriss67
0
130
Featured
See All Featured
The #1 spot is gone: here's how to win anyway
tamaranovitovic
2
940
Navigating Team Friction
lara
192
16k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.3k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
86
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
160
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
We Are The Robots
honzajavorek
0
160
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
Ethics towards AI in product and experience design
skipperchong
2
190
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
96
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.7k
Technical Leadership for Architectural Decision Making
baasie
1
240
Transcript
Documenting an A T O M I C Design System
with Jekyll Presented by @toddmoy from @viget
BACKGROUND handoff to their tech team 3
AT0MIC DESIGN ATOMS MOLECULES ORGANISMS TEMPLATES PAGES 4
DOCUMENTATION ISSUES DesignSystem_20150120.pdf DesignSystem_20141218.pdf DesignSystem_20141205.pdf DesignSystem_20141120.pdf DesignSystem_20141101.pdf DesignSystem_20141031.pdf DesignSystem_20151010.pdf FORMAT
NAVIGATION & USABILITY VERSIONING 6
JEKYLL 8 A Static Site Generator
JEKYLL MARKDOWN CONTENT static web pages # Title Integer
posuere erat a ante venenatis dapibus posuere velit aliquet. * Lorem ipsum * Dolor site amet … HTML + CSS TEMPLATES <%= partial(‘header’) %> <body> <%= yield => </body> <%= partial(‘footer’) %> 9
BUILT JEKYLL WITH 22
How we used it PROCESS OMNIGRAFFLE INVISION basecamp JEKYLL 11
How we used it STRUCTURE 12
How we used it EDITING 13
How we used it Purpose & UsAGE SAMPLE SCREENS FUNCTIONAL
REQUIREMENTS EDITORIAL Requirements STYLISTIC GUIDELINES INCLUDED COMPONENTS & ELEMENTS CONTENT 15
How we used it COMMITS 16
How we used it PULL REQUESTS 17
How we used it HOSTING 18
FUTURE PLANS? 19
Thanks y’all! Presented by @toddmoy from @viget 21