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
ユニークなデザインシステム改革
Search
makiozmurai
February 15, 2019
Design
2.1k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ユニークなデザインシステム改革
一般化や汎用性のあるデザインシステムではなく、「エモい命名」や「組織、プロダクトにあった設計」で作るユニークなデザインシステムを構築しよう。
makiozmurai
February 15, 2019
Other Decks in Design
See All in Design
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
600
Signull 団体説明資料
signull
0
780
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
ryu1013
0
220
【CEDEC2026】派手さと見やすさは両立できる!『Shadowverse: Worlds Beyond』エフェクト・3D背景の超進化したビジュアル設計
cygames
PRO
0
1.4k
エンジニアがAI活用してスライドデザインできる世界が来たよ!
kaikou
1
380
デザインの文脈を理解する:エンジニアがデザインカンファレンスに参加して得た学びと気づき
hypebeans
0
260
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
tinykitten
1
320
個人理念(自分の言葉)の言語化ワークショップ
kakukoki
1
160
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
ayumidesign
0
170
設計の進め方と 品質特性品質特性
harakeishi
0
1.1k
Техники структурирования беседы с собой, заказчиком и командо
ashapiro
0
250
Warner Bros. Discovery 2025 Box Office Booklet
samb1rd
0
110
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Prompt Engineering for Job Search
mfonobong
0
410
The Cult of Friendly URLs
andyhume
79
7k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Six Lessons from altMBA
skipperchong
29
4.4k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.9k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.3k
The Language of Interfaces
destraynor
162
27k
It's Worth the Effort
3n
188
29k
First, design no harm
axbom
PRO
2
1.3k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.5k
Transcript
presented by Design system revolution with unique naming Ϣ χ
ʔ Ϋ ͳ σ β Π ϯ γ ε ς Ϝ վ ֵ a ͍ ɺ Ұ ൠ Խ Ί Α ͏ Ϙ ι ο
presented by ͡Ί·ͯ͠ Profile ٠ক࢙ Owls, Inc. ʛCDO ɾ%SFTTDBNQΞγελϯτσβΠφʔ ɾ,*/0ϝϯζϑΝογϣϯσβΠφʔ
ɾ౦ژίϨΫγϣϯΦϦδφϧϒϥϯυͱͯ͠ࢀՃ ɾ#SVUP *ODσβΠφʔϓϥϯφʔ ɾϑϦʔϥϯεσβΠφʔ ɾ0XMT *OD$%0ʢνʔϑσβΠϯΦϑΟαʔʣ
presented by ͡Ί·ͯ͠ Profile اۀՁΛσβΠϯ͢Δ ίϯαϧςΟϯά σβΠϯΧϯύχʔ
presented by ͡Ί·ͯ͠ Profile
presented by ͡Ί·ͯ͠ Profile ͍ͭ͜
presented by ͡Ί·ͯ͠ Profile ͍ͭ͜ ͜ͷΠϕϯτͷΦʔΨφΠβʔ͕ ʮεϙϯαʔΒͳ͍ʁʯ ͬͯ༠ׂ͖ͬͯͨʹϦϛοτɹɹɹɹɹɹͳͷͰ μογϡͰ͠·͢ɻ
presented by 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍ 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ ͓͢Δ͜ͱ Agenda
presented by 01. ΞτϛοΫσβΠϯΛಋೖ͢Δత
presented by ˠΞτϛοΫσβΠϯΛೖΕ͍ͨɻ ɻɻɻࠓͬΆ͍Β͍͠͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత
presented by ˠΞτϛοΫσβΠϯΛೖΕ͍ͨɻ ɻɻɻࠓͬΆ͍Β͍͠͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత ʢ͜Εئʣ
presented by ˠΞτϛοΫσβΠϯΛͬͯӡ༻͍ͨ͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత
presented by ˠΞτϛοΫσβΠϯΛͬͯӡ༻͍ͨ͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత ʢ͜Εئʣ
presented by ˠαʔϏε͕ͯ͠ઃܭࢥ͕͑͏Δӡ༻Λ͍ͨ͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత
presented by ˠαʔϏε͕ͯ͠ઃܭࢥ͕͑͏Δӡ༻Λ͍ͨ͠ 01.ΞτϛοΫσβΠϯΛಋೖ͢Δత ʢ͜Εʂʣ
presented by 02. ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
presented by 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍ Atomic Design ࣮ଶ ΄͑ʔɺ͔֬ʹΘ͔Δʔ ͜ΕͰཧͰ͖ͨΒΧοί͑͑ͳ͋ ATMOSʹΘ͔Δ MOLECULESʹ͏Μɻɻɻ
ORGANISMSʹ͏Μʂʁ TEMPLATESʹ ΤϯδχΞ Θ͔Δɻ σβΠφ ʁʁʁ PAGES= ΤϯδχΞσβΠφʣ·͋·͋ɻɻɻ
presented by ҋਂ͗͢ ࣄҊൃੜத 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ͋͞ɺ͋ͳͨͲΕʁ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ߹Θͤͨ͘ͳͬͪΌ͏ΑͶ ϧʔϧ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ׂͱࡉ͔͘ఆٛ͞ΕͯΔ෩ -Wදه֊ߏ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ Ծʹࢮ͵ؾͰ߹Θͤͨͱ͠Α͏ɻ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ Ծʹࢮ͵ؾͰ߹Θͤͨͱ͠Α͏ɻ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ࣮ɺଞαʔϏεͷίϯϙʔωϯτࢦ͕ ϕʔεʹͳ͍ͬͯͨͨΊɺ ରαʔϏεͷߟ͑ํ͕վఆ͞Ε ่յ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ Ծʹࢮ͵ؾͰ߹Θͤͨͱ͠Α͏ɻ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ͦͯͪ͠ΖΜࢮ͵ؾͰ߹Θͤͨ#ࣾ ่յ ࣮ɺଞαʔϏεͷίϯϙʔωϯτࢦ͕ ϕʔεʹͳ͍ͬͯͨͨΊɺ ରαʔϏεͷߟ͑ํ͕վఆ͞Ε ่յ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ Ծʹࢮ͵ؾͰ߹Θͤͨͱ͠Α͏ɻ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ͦͯͪ͠ΖΜࢮ͵ؾͰ߹Θͤͨ#ࣾ ่յ ࣮ɺଞαʔϏεͷίϯϙʔωϯτࢦ͕ ϕʔεʹͳ͍ͬͯͨͨΊɺ ରαʔϏεͷߟ͑ํ͕վఆ͞Ε ่յ όϧεʂ
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ׂͱࡉ͔͘ఆٛ͞ΕͯΔ෩ -Wදه֊ߏͳͷͰѱ͘Θͳ͍ ଧͭखͳ͠
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ׂͱࡉ͔͘ఆٛ͞ΕͯΔ෩ -Wදه֊ߏͳͷͰѱ͘Θͳ͍ ͍͍͡Όͳ͍ͷΑɻ ϢχʔΫͳఆٛҰॹʹ࡞Ζ͏Α
presented by "ࣾͱ#ࣾͷΞτϛοΫσβΠϯͷఆٛ ATMOS MOLECULES "ࣾ #ࣾ ͋͞ɺඪ४Խࢦ͠·͠ΐ͏ ORGANISMS 02.ඪ४Խʹಉ࣭Խʁʹӡ༻͍͢͠ͱݴ͑ͳ͍
ཁૉ ҙຯΛ࣋ͨͳ͍άϧʔϓ ҙຯΛ࣋ͬͨίϯςϯπ TEMPLATES ίϯςφͳͲ͕ఆٛ͞Εͨ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ATMOS MOLECULES ORGANISMS ཁૉ -W ίϯϙʔωϯτʢ-W ίϯϙʔωϯτͷίϯϙʔωϯτʢ-W TEMPLATES ҙຯΛ͍࣋ͯͬͯͳ͍ςϯϓϨʔτ PAGES ☝͕ΈΘͤΒΕͨϖʔδ ׂͱࡉ͔͘ఆٛ͞ΕͯΔ෩ -Wදه֊ߏͳͷͰѱ͘Θͳ͍ σβΠϯγεςϜ ඪ४Խ͢Δ͖Ͱͳ͍ɻ
presented by 03. ࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ
presented by 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ ͜͜Ͱ͍͖ͳΓ ϒϥϯυͷ
presented by 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ Ϛελʔϒϥϯυମܥ ϑϦʔελϯσ Οϯάϒϥϯυମܥ $* #*7* $* #*7*
ϝϦοτ σϝϦοτ ϒϥϯυͷίϛϡχέʔγϣϯޮ͕͍͍ ѱධ͕શମʹٴͿՄೳੑ͕͋Δ ϑϦʔελϯσΟϯάϒϥϯυମܥ ϝϦοτ σϝϦοτ ݸผͷੈք؍Λࣗ༝ʹߏங ͦΕͧΕʹϚʔέςΟϯάίετ͕͔͔Δ
presented by 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ ͳΜ͔ۙ͘ͳ͍ʁ
presented by 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ Ϛελʔϒϥϯυମܥ ϑϦʔελϯσ Οϯάϒϥϯυମܥ $* #*7* $* #*7*
"ࣾ #ࣾ ϝϦοτ σϝϦοτ ։ൃ͕গͳ͍ վम͕શମʹٴͿՄೳੑ͕͋Δ ϑϦʔελϯσΟϯάϒϥϯυମܥ ϝϦοτ σϝϦοτ ݸผͷੈք؍Λࣗ༝ʹߏங ͦΕͧΕʹ։ൃίετ͕͔͔Δ The Design System
presented by 03.࣮σβΠϯγεςϜϒϥϯσΟϯάͷ֓೦ͱ͍ۙͷΑ αʔϏε͝ͱʹ ࠷దԽ͞ΕͯવΔ͖
presented by ࠷ޙʹ Epilogue " 5 - " 4 4
* " / " J S C O C 4 Q P U J G Z
presented by ࠷ޙʹ Epilogue ا ۀ Ձ Λ σ
β Π ϯ ͢ Δ ຊ 6 4 ͔ Β Ε ͯ ͍ · ͢ ɻ σ β Π ϯ γ ε ς Ϝ ੈ ք Ͱ ඪ ४ ͱ ͳ Γ ͭ ͭ ͋ Γ · ͢ ɻ ͦ ͷ ߟ ͑ ɺ ج ຊ ଟ ༷ Խ ͠ ͯ ͍ · ͢ ɻ
presented by ࠷ޙʹ Epilogue Ұ ॹ ʹ ࡞ Ζ ͏
Ξ ϧ ε ί ϯ α ϧ ܕ ͷ σ β Π ϯ ৫ ɻ ক དྷ ࣗ Ͱ ࣄ ۀ Λ ى ͜ ͠ ͨ ͍ ਓ ɺ ݸ ͷ ྗ Λ ࠷ େ Խ ͞ ͤ ͨ ͍ ਓ Π ϊ ϕ ʔ γ ϣ ϯ ͷ ۙ ͘ ʹ ͍ ͳ ͚ Ε ͍ ͚ ͳ ͍ ɻ
presented by ࠷ޙʹ Epilogue Ұ ॹ ʹ ࡞ Ζ ͏
༷ ʑ ͳ α ʔ Ϗ ε ͱ Ϗ δ ω ε ʹ ৮ Ε ͯ ɺ ࠓ ׆ ͖ Δ ٕ ज़ Ͱ ͳ ͘ ɺ ະ དྷ ͷ ࣗ ͷ ͨ Ί ͷ ܦ ݧ ʹ ࢿ ͠ Α ͏ ɻ
presented by '*/