Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
2018-bonfire-design-komerco-design-system
Search
kenshir0f
April 20, 2018
Design
8.8k
10
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
2018-bonfire-design-komerco-design-system
2018/04/20で発表したBonfire Design #3 の登壇資料です。
kenshir0f
April 20, 2018
Transcript
37 slides
Cookpad Inc. খ࢝͘͞ΊΔ৽نࣄۀͷσβΠϯγεςϜ ౻Ҫݠ࢜࿕
Cookpad Inc. All Rights Reserved. ࣗݾհ ౻Ҫݠ࢜࿕ @kenshir0f ΫοΫύουגࣜձࣾ Komercoࣄۀ෦ϦʔυσβΠφʔ
2017৽ଔೖࣾࣾձਓ2 ֶੜ࣌ʮ·͝νϟϯωϧʯͷ։ൃͱσβΠϯ ೖࣾޙRailsΛ༻͍ͨweb։ൃͱσβΠϯ ݱࡏϒϥϯυ͔ΒΞϓϦUIͳͲαʔϏεશମͷσβΠϯ
Cookpad Inc. All Rights Reserved. ࠓͷ͓ গͳ͍ϦιʔεͰ࠷େͷޮՌΛൃش͢Δʹʁ ಋೖͷཧ༝ͱܦҢͱۤ࿑ͨ͠Α͔ͬͨͳͲ ৽نࣄۀͰಋೖͨ͠σβΠϯγεςϜͷ
Cookpad Inc. All Rights Reserved. ΫοΫύουͷ৽نࣄۀʁ
Cookpad Inc. All Rights Reserved. 20186݄OPEN komer.co ݕࡧ
Cookpad Inc. All Rights Reserved. Komercoͷ։ൃମ੍ ΤϯδχΞ σβΠφʔ σΟϨΫλʔ "
" "
Cookpad Inc. All Rights Reserved. σβΠϯ͍ͯ͠ΔྖҬ ϒϥϯσΟϯά αʔϏε w τϯϚφ
w ϩΰ w ςʔϚΧϥʔ w ໊ w εϥΠυࢿྉ w &UDʜ w ΞϓϦ w ମݧઃܭ w 6* w ΞΠίϯ w 8FC w σβΠϯ w ࣮
Cookpad Inc. All Rights Reserved. σβΠϯ͍ͯ͠ΔྖҬ ϒϥϯσΟϯά αʔϏε w τϯϚφ
w ϩΰ w ςʔϚΧϥʔ w ໊ w εϥΠυࢿྉ w &UDʜ w ΞϓϦ w ମݧઃܭ w 6* w ΞΠίϯ w 8FC w σβΠϯ w ࣮ ࣌ؒͷϦιʔεෆʹͳΓ͕ͪ
Cookpad Inc. All Rights Reserved. ࣌ؒͷϦιʔεෆͩͱͲ͏ͳΔʁ ɾશମͷσβΠϯཧ͕͍͠ ɾҰͭʹूதͯ͠࡞ۀ͢Δ͕͍࣌ؒ ɾਫ਼ਆӴੜ্Α͘ͳ͍
Cookpad Inc. All Rights Reserved. ࣌ؒͷϦιʔεෆΛͲ͏ղܾ͢Δ͔ʁ
Cookpad Inc. All Rights Reserved. σβΠϯγεςϜͷಋೖ
Cookpad Inc. All Rights Reserved. σβΠϯγεςϜͱʁ σβΠϯͷߟ͑ํΛݟ͑ΔԽͨ͠ϓϩμΫτ ͕ߟ͑Δ ͍ΖΜͳղऍ͕ग़࢝Ί͍ͯΔ࠷தͱ͍͏ೝࣝͰ͢
ਤ
ਤ ਤ
Cookpad Inc. All Rights Reserved. σβΠϯγεςϜΛ࣋ͭϝϦοτ ɾମܥతʹσβΠϯΛ·ͱΊΒΕΔ ɾίϛϡχέʔγϣϯίετͷݮ ɾ6*ίϯϙʔωϯτͷѲ͕͍͢͠
Cookpad Inc. All Rights Reserved. ͊͞ɺσβΠϯγεςϜಋೖ͢Δͧʂ
આಘฤ~WhyͳͥΔͷ͔~ ୈҰষ
Cookpad Inc. All Rights Reserved. ·ͣʮͳͥʯΔͷ͔ΛνʔϜʹ͑Δ
Cookpad Inc. All Rights Reserved. ޮྑ͘σβΠϯ͍ͨ͠ʜ KomercoσβΠϯγεςϜಋೖ͢Δͧʂʂʂ ࣌ؒແ͍ͷʹ࣌ؒͬͯγεςϜ࡞Δඞཁ͋Δͷʁ
Cookpad Inc. All Rights Reserved. Ұݟໃ६͍ͯ͠ΔΑ͏ʹݟ͑Δ ͕࣌ؒ΄͍͔͠Β ޮԽ͍ͨ͠ ޮԽ͍͔ͨ͠Β ͕࣌ؒ΄͍͠
Cookpad Inc. All Rights Reserved. ࣮ࡍ͜͏ͳΔͱઆ໌ͨ͠ هԱ͕͍͋·͍
Cookpad Inc. All Rights Reserved. σβΠϯγεςϜͷՁΛ͖ͪΜͱ͑Δ͜ͱ͔Β͡ΊΔ
ಋೖฤ~HowͲ͏Δͷ͔~ ୈχষ
ਤ
Cookpad Inc. All Rights Reserved. ͍͖ͳΓܗΛࢦ͞ͳ͍
Cookpad Inc. All Rights Reserved. ඞཁͳͷ͚ͩ࡞͍ͬͯ͘
Cookpad Inc. All Rights Reserved. ඞཁͳͷͱʁ ʻ ແ͍ͱࠔΔ ͋ͬͨΒศར
Cookpad Inc. All Rights Reserved. ྫ1ελΠϧΨΠυͷ࡞ Komerco KomercoCreator ίϯϙʔωϯτϥΠϒϥϦΛελΠϧΨΠυԽ
Cookpad Inc. All Rights Reserved.
Cookpad Inc. All Rights Reserved. ྫ2σβΠϯΨΠυϥΠϯͷ࡞
Cookpad Inc. All Rights Reserved. গͣͭ͠ଗ͍͑ͯ͘ ɾϑΥτσΟϨΫγϣϯΨΠυϥΠϯ ɾiOSσβΠϯΨΠυϥΠϯ ɾίϯϙʔωϯτελΠϧΨΠυ ɾϒϥϯυΨΠυϥΠϯͱϩΰΞηοτ
σβΠϯγεςϜ
Cookpad Inc. All Rights Reserved. খ࢝͘͞ΊͯσβΠϯγεςϜ࡞Δ͜ͱͰ গͣͭ͠ޮΛ্͍͛ͯ͘
݁Ռฤ~What Կ͕มΘͬͨͷ͔~ ୈࡾষ
Cookpad Inc. All Rights Reserved. σβΠϯγεςϜಋೖͰମײ͍ͯ͠Δ͜ͱ ɾίϛϡχέʔγϣϯίετͷԼ ɾσβΠϯͷ౷Ұੑͷ্ ɾ૬ޮՌʹΑΔΫΦϦςΟͷ্
Cookpad Inc. All Rights Reserved. ಋೖʹۤ࿑ͨ͠ ɾ͡ΊͷʮΔͧʂʯΛߦಈʹҠ͢ࡍͷઆಘ ɾσβΠϯγεςϜ࡞ɾཧͷ࣌ؒ֬อ ɾͲ͜·Ͱ࡞ΓΔ͔ͷઢҾ
·ͱΊ ৽نࣄۀͰσβΠϯγεςϜͰޮԽΛࢦ͢ ɾσβΠϯγεςϜͷՁΛཧղͯ͑͠Δ͜ͱ͕େࣄ ɾ͍͖ͳΓͤ͞ͳ͍ɺখཻ͍͞Ͱগͣͭ͠ଗ͍͑ͯ͘
https://info.cookpad.com/careers ΫοΫύουσβΠφʔΛืू͍ͯ͠·͢ʂ
More Decks by kenshir0f
See All by kenshir0f
Figma with Cookpad
kenshir0f
16
17k
How Cookpad use Figma
kenshir0f
3
940
Easy Semantic HTML Structure for Komerco Team
kenshir0f
5
6.3k
Cookpad Spring Internship 2019 Service Development Course
kenshir0f
2
1.3k
Cookpad TechConf 2019 Komerco Service Dev
kenshir0f
14
10k
Introduce Atomic Design with small rework
kenshir0f
3
330
Basic css note for Komerco Team
kenshir0f
6
8.2k
Design for Behavior and Impact
kenshir0f
9
5.2k
tech-kitchen-#16-komerco-design
kenshir0f
4
5.9k
Other Decks in Design
See All in Design
AIの定期タスクを6本作って、3本止めた話
rai263
0
170
もっともらしさ生成器と暮らす – AI懐疑派の試行錯誤
sekiguchiy
0
220
コールセンターのオペレーターに6時間だけなってみた
h0sa
0
490
UNION TEC GROUP | 2026' Project Portfolio
uniontec2000
0
150
インターンから2年新卒フロントエンドエンジニアから見たサイボウズのアクセシビリティ
taku10101
0
220
Bet AI Day 2026丨デザインハーネス:専門職の判断基準をコードのように運用する
layerx
PRO
6
7.9k
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
4.5k
The ISO 25964 standard on Information and documentation — Thesauri and interoperability with other vocabularies
accessinnovations
0
490
明日から真似できる、AIでデザインシステムを活用する方法
vivion
0
1k
泥臭く語るUIデザイン会|ホワイトボードチャレンジ【RAMEN TECH 2026】
garyuten
1
270
デザなに#1「問いのデザイン」の紹介LT
garyuten
0
190
noteらしさを織り込むハーネスエンジニアリング
uto
0
2.9k
Featured
See All Featured
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
590
Site-Speed That Sticks
csswizardry
13
1.6k
Accessibility Awareness
sabderemane
1
300
How to build a perfect <img>
jonoalderson
1
6.2k
New Earth Scene 8
popppiees
5
2.8k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.6k
Designing Powerful Visuals for Engaging Learning
tmiket
1
650
Making Projects Easy
brettharned
120
6.9k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
[RailsConf 2023] Rails as a piece of cake
palkan
59
7.1k