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
0
170
AtomicDesignの運用方法
AtomicDesignを運用する上気にしていることなどをまとめてみました
takanori sugawara
December 18, 2017
Tweet
Share
More Decks by takanori sugawara
See All by takanori sugawara
人によっては_明日から使えるFigmaテクニック
ts020
1
870
VueFes.pdf
ts020
5
9.8k
Other Decks in Design
See All in Design
A Platform Connecting Brand Philosophy and Assets: "LY Corporation Design Hub"
lycorptech_jp
PRO
0
300
企画を動かすデザイナーの思考!「広げて絞る」アプローチ。
hikidakan
0
130
PF_濵村ひろみ_202503
maru_design78
0
200
AI動画生成ガチャ紹介
piyo7
1
150
線で考える画面構成
natsuume
1
890
エンジニアでも捗る デザイナー的思考入門
tinykitten
PRO
1
1.1k
UXとUIの違いを自分の言葉で表現する: UX DAYS TOKYO
mizunashi_mana
0
210
How to get a Tiger to Tulsa
mcduckyart
0
110
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
trivia
0
510
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
nikkei_engineer_recruiting
5
710
【最新】マズロー安達の弟子実績(1期-4期の26人分)
maslow_akkun
0
730
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.9k
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1031
460k
What's in a price? How to price your products and services
michaelherold
246
12k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Site-Speed That Sticks
csswizardry
10
720
How STYLIGHT went responsive
nonsquared
100
5.6k
Music & Morning Musume
bryan
46
6.7k
Typedesign – Prime Four
hannesfritz
42
2.7k
The Pragmatic Product Professional
lauravandoore
35
6.8k
A designer walks into a library…
pauljervisheath
207
24k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
850
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Transcript
Farmnote, Inc How to use Atomic design Atomic design ͷӡ༻ํ๏
גࣜձࣾ ϑΝʔϜϊʔτ σβΠφʔΔϓϩάϥϚ ੁݪ ଇ ϑϨʔϜϫʔΫΛઃܭ͢Δͷͱ ΠϯλϥΫγϣϯͷ࣮͕ಘҙͰ͢ɻ σβΠϯͦΕͳΓʹΓ·͢
ڇʹηϯαʔΛ͚ͭͯεϚϗʹൃΛ௨ͨ͠Γ ཧɾੳΛ͢ΔͨΊͷαʔϏεΛ࡞ͬͯΔձࣾͰ͢ɻ
զ͕ࣾʹઐۀͷσβΠφʔ͕͓Βͣɺ ݱࡏ͕݉ۀσβΠφʔΛ͓ͯ͠Γ·͢
ڇͷࣄશવΘ͔ΒΜ
ίʔυॻ͔ͶͳΒΜ
͕࣌ؒͨΓΜ
्ҩͱϓϩάϥϚʹ σβΠϯͤ͞Ε͍͍ ͦ͏ͩʂʂʂ
Atomic Design
None
ͲΜͳײ͡Ͱ࡞͍ͬͯ Δͷ͔
͜ͷลΓΛσβΠφʔ ͕࡞ΓࠐΉ
͜ͷลΓͷୟ͖Λ ्ҩʹ࡞ͬͯΒ͏
σβΠφʔ্͕͛ Δ
࣮ࡍʹίʔυʹམͱͤΔͷʁ
ϓϩάϥϚͱσβΠφͰ ཻઃܭͷண؟͕ҧ ͏ͷͰٞ ཻΛௐ͢Δ
࣮ࡍʹ࡞Δͱཻ͕ͣΕͨΓ͢ ΔͷͰɺ୭Ͱ͍͍ͷͰɺඞͣ σβΠϯʹมߋΛөͤ͞Δ ҙʂ
࣮ࡍΔͱɺσβΠϯσʔλͷ ΓͱΓେม͡Όͳ͍ͷʁ
FigmaΛ͍·͢
Figma GoogleDriveͱSketchΛࠞͥͨΑ͏ͳπʔϧ
ͱΓ͋͑ͣ͜ΕͰσβΠϯʹ ใΛΕΔ͚ͩΓଓ͚Δ
ΈΜͳ͕ར༻Ͱ͖ͯ దʹϨΠΞτͯ ࣮͕αΫοͱऴΘΔ σβΠϯγεςϜ͕ग़དྷ্͕Δ ݁Ռ