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
AtomicDesignの運用方法
Search
takanori sugawara
December 18, 2017
Design
200
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
AtomicDesignの運用方法
AtomicDesignを運用する上気にしていることなどをまとめてみました
takanori sugawara
December 18, 2017
More Decks by takanori sugawara
See All by takanori sugawara
人によっては_明日から使えるFigmaテクニック
ts020
1
920
VueFes.pdf
ts020
5
10k
Other Decks in Design
See All in Design
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
3.6k
全員がアウトプットを出せる時代、 誰を採用する?
nishame
0
640
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ~継承と挑戦を両立するデザイン手法~
cygames
PRO
3
5k
ボタンUIの冪等性の話をしたらVimmerに刺さっちゃった
ottatto
3
1.8k
Claudeもくもく会、はじめませんか?
yusukeiyoda
0
180
分散するデザイン組織をつなぐ デザインミートアップの取り組み/nikkei-tech-talk49
nikkei_engineer_recruiting
0
170
体験負債を資産に変える組織的アプローチ
hikarutakase
0
1.6k
「バイブコーディングって何?」から始まった、 AIとの一年間と、その先のこと
seto
0
1.1k
AVI 2026 Keynote "Vision-Driven Design"
ishii_mit
0
120
Figma MCPを活用するためのデザインハンドブック
vivion
8
20k
kintone開発におけるライターの役割の変化〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
keroyama
0
180
Signull 団体説明資料
signull
0
780
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
225
10k
Rebuilding a faster, lazier Slack
samanthasiow
85
9.6k
Fireside Chat
paigeccino
42
4k
For a Future-Friendly Web
brad_frost
183
10k
[SF Ruby Conf 2025] Rails X
palkan
2
1.3k
How to Ace a Technical Interview
jacobian
281
24k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
67k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
3k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.1k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
360
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Transcript
Farmnote, Inc How to use Atomic design Atomic design ͷӡ༻ํ๏
גࣜձࣾ ϑΝʔϜϊʔτ σβΠφʔΔϓϩάϥϚ ੁݪ ଇ ϑϨʔϜϫʔΫΛઃܭ͢Δͷͱ ΠϯλϥΫγϣϯͷ࣮͕ಘҙͰ͢ɻ σβΠϯͦΕͳΓʹΓ·͢
ڇʹηϯαʔΛ͚ͭͯεϚϗʹൃΛ௨ͨ͠Γ ཧɾੳΛ͢ΔͨΊͷαʔϏεΛ࡞ͬͯΔձࣾͰ͢ɻ
զ͕ࣾʹઐۀͷσβΠφʔ͕͓Βͣɺ ݱࡏ͕݉ۀσβΠφʔΛ͓ͯ͠Γ·͢
ڇͷࣄશવΘ͔ΒΜ
ίʔυॻ͔ͶͳΒΜ
͕࣌ؒͨΓΜ
्ҩͱϓϩάϥϚʹ σβΠϯͤ͞Ε͍͍ ͦ͏ͩʂʂʂ
Atomic Design
None
ͲΜͳײ͡Ͱ࡞͍ͬͯ Δͷ͔
͜ͷลΓΛσβΠφʔ ͕࡞ΓࠐΉ
͜ͷลΓͷୟ͖Λ ्ҩʹ࡞ͬͯΒ͏
σβΠφʔ্͕͛ Δ
࣮ࡍʹίʔυʹམͱͤΔͷʁ
ϓϩάϥϚͱσβΠφͰ ཻઃܭͷண؟͕ҧ ͏ͷͰٞ ཻΛௐ͢Δ
࣮ࡍʹ࡞Δͱཻ͕ͣΕͨΓ͢ ΔͷͰɺ୭Ͱ͍͍ͷͰɺඞͣ σβΠϯʹมߋΛөͤ͞Δ ҙʂ
࣮ࡍΔͱɺσβΠϯσʔλͷ ΓͱΓେม͡Όͳ͍ͷʁ
FigmaΛ͍·͢
Figma GoogleDriveͱSketchΛࠞͥͨΑ͏ͳπʔϧ
ͱΓ͋͑ͣ͜ΕͰσβΠϯʹ ใΛΕΔ͚ͩΓଓ͚Δ
ΈΜͳ͕ར༻Ͱ͖ͯ దʹϨΠΞτͯ ࣮͕αΫοͱऴΘΔ σβΠϯγεςϜ͕ग़དྷ্͕Δ ݁Ռ