Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AtomicDesignの運用方法

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for takanori sugawara takanori sugawara
December 18, 2017
Design
190
0

 AtomicDesignの運用方法

AtomicDesignを運用する上気にしていることなどをまとめてみました

Avatar for takanori sugawara

takanori sugawara

December 18, 2017

More Decks by takanori sugawara

See All by takanori sugawara
人によっては_明日から使えるFigmaテクニック
Avatar for takanori sugawara ts020
1
910
VueFes.pdf
Avatar for takanori sugawara ts020
5
9.9k

Other Decks in Design

See All in Design
デザインコンテキストのバトンをつなぐ—AI時代のプロダクトマネジメント
Avatar for kumano ayumi kumanoayumi
6
1.1k
TUNAG BOOK 2024
Avatar for 株式会社スタメン stmn
PRO
0
1.5k
「親切なオンボーディング」 が招く罠　ー　AI時代のUXデザイン
Avatar for 小神 godlingkogami
0
110
全員がアウトプットを出せる時代、 誰を採用する?
Avatar for NishaMe nishame
0
550
はじめての演奏会フライヤーデザイン
Avatar for Kaito Kikuchi chorkaichan
1
290
UI/UX & Web Design Portfolio 2025｜Madoka Kumagai
Avatar for Madoka madoka_portfolio
4
230
Storyboard Exercise: Chase Sequence
Avatar for Mandalyn Teo lynteo
1
300
改正JISを見据えた、企業のアクセシビリティ対応ロードマップ
Avatar for Yu Morita securecat
1
370
研修担当者が一番伸びた　熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
Avatar for @Garyuten garyuten
2
370
【pmconf2025】PdMの頭の中を見える化する体験構造図
Avatar for Shigeyuki Kameda kamechi7222222
1
2.3k
タイル紹介サイト「タイルだもんで」
Avatar for しま calpin
0
130
AI時代に必要な アイデアの形
Avatar for ux-man uxman
0
180

Featured

See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.4k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.8k
Scaling GitHub
Avatar for Zach Holman holman
464
140k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
Avatar for Sophie Logan marketingsoph
0
140
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
Avatar for MADOX madoxten
62
54k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
Avatar for Ines Montani inesmontani
PRO
3
2.2k
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.2k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.1k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
10k

Transcript

  1. Farmnote, Inc How to use Atomic design Atomic design ͷӡ༻ํ๏

  2. גࣜձࣾ ϑΝʔϜϊʔτ σβΠφʔ΋΍ΔϓϩάϥϚ ੁݪ ޹ଇ ϑϨʔϜϫʔΫΛઃܭ͢Δͷͱ ΠϯλϥΫγϣϯͷ࣮૷͕ಘҙͰ͢ɻ σβΠϯ΋ͦΕͳΓʹ΍Γ·͢

  3. ڇʹηϯαʔΛ͚ͭͯεϚϗʹൃ৘Λ௨஌ͨ͠Γ
 ຀৔؅ཧɾ෼ੳΛ͢ΔͨΊͷαʔϏεΛ࡞ͬͯΔձࣾͰ͢ɻ

  4. զ͕ࣾʹ͸ઐۀͷσβΠφʔ͕͓Βͣɺ ݱࡏ͸๻͕݉ۀσβΠφʔΛ͓ͯ͠Γ·͢

  5. ڇͷࣄશવΘ͔ΒΜ

  6. ίʔυ΋ॻ͔Ͷ͹ͳΒΜ

  7. ͕࣌ؒͨΓΜ

  8. ्ҩͱϓϩάϥϚʹ σβΠϯͤ͞Ε͹͍͍ ͦ͏ͩʂʂʂ

  9. Atomic Design

  10. None

  11. ͲΜͳײ͡Ͱ࡞͍ͬͯ Δͷ͔

  12. ͜ͷลΓΛσβΠφʔ ͕࡞ΓࠐΉ

  13. ͜ͷลΓͷୟ͖Λ ्ҩʹ࡞ͬͯ΋Β͏

  14. σβΠφʔ͕࢓্͛ Δ

  15. ࣮ࡍʹίʔυʹམͱͤΔͷʁ

  16. ϓϩάϥϚͱσβΠφͰ ͸ཻ౓ઃܭͷண؟఺͕ҧ ͏ͷͰ௒ٞ࿦ ཻ౓Λௐ੔͢Δ

  17. ࣮ࡍʹ࡞Δͱཻ౓͕ͣΕͨΓ͢ ΔͷͰɺ୭Ͱ΋͍͍ͷͰɺඞͣ σβΠϯʹมߋΛ൓өͤ͞Δ ஫ҙʂ

  18. ࣮ࡍ΍ΔͱɺσβΠϯσʔλͷ
 ΍ΓͱΓେม͡Όͳ͍ͷʁ

  19. FigmaΛ࢖͍·͢

  20. Figma GoogleDriveͱSketchΛࠞͥͨΑ͏ͳπʔϧ

  21. ͱΓ͋͑ͣ͜ΕͰσβΠϯʹ ৘ใΛ੝ΕΔ͚ͩ੝Γଓ͚Δ

  22. ΈΜͳ͕ར༻Ͱ͖ͯ
 ద౰ʹϨΠΞ΢τͯ΋ ࣮૷͕αΫοͱऴΘΔ σβΠϯγεςϜ͕ग़དྷ্͕Δ ݁Ռ