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
Hiroaki WAKATSUKI - Cookpad TechConf 2017
Search
puzzeljp
January 21, 2017
Design
2
9.2k
Hiroaki WAKATSUKI - Cookpad TechConf 2017
「サービス開発におけるデザインの取り組み方」
puzzeljp
January 21, 2017
Tweet
Share
More Decks by puzzeljp
See All by puzzeljp
「料理の追体験」を実現するデザイン
puzzeljp
6
11k
「いま」と「むかし」
puzzeljp
0
130
sketch.app 基礎講座
puzzeljp
0
670
Life is Tech! の 4 回目の夏。
puzzeljp
0
140
Hack 4 Good Teens (TEAM C) ちっちとゆかいな仲間たち
puzzeljp
0
140
Other Decks in Design
See All in Design
パンくずリストかわいい(breadcrumb so cute)
ysuda
0
270
AI動画生成ガチャ紹介
piyo7
1
110
新年あけおめWSの実施スキルをみんなで振り返りタイムのススメ
sugiyama_sukedachi
0
120
minpaku-community-scrum-patterns
norinity1103
1
110
ビジネス成果を最大限に発揮するPORTFOLIO
ataxi1003
0
190
harutaka Vision Deck
zenkigenforrecruit
0
130
ポートフォリオ_藤田歩希(ほまれ)
akifujita_homarecreate
0
590
もうひとつのアーキテクチャ #kichijojipm
kondoyuko
0
240
誰もがAIエージェントを"操作"したがる〜AIエージェントに求められるUX〜
ikeyatsu
2
1.8k
問いの変遷
iflection
0
140
今日から意識できるアクセシビリティ
fumiko
0
240
1920*1080pxに設定したケース / Google Slide Size Test
arthur1
0
2.8k
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.3k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
16
940
Become a Pro
speakerdeck
PRO
28
5.4k
Automating Front-end Workflow
addyosmani
1370
200k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Scaling GitHub
holman
459
140k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.8k
How to train your dragon (web standard)
notwaldorf
92
6.1k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Designing for Performance
lara
609
69k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Transcript
αʔϏε։ൃʹ͓͚Δ σβΠϯͷऔΓΈํ Hiroaki WAKATSUKI @puzzeljp 2017/01/21 @ Ebisu the Garden
Room. Cookpad TechConf 2017
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ "HFOEB w ࣗݾհ w ߘ։ൃ෦ͰऔΓΜͩ͜ͱ w ՁݕূͷͨΊͷϓϩτλΠ ϐϯά
w ϓϩμΫτ։ൃͱվળ w 9DPEFͷσβΠϯௐ w ·ͱΊ 2
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 3 ࣗݾհ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ए݄ܒ૱ )JSPBLJ8","546,* !QV[[FMKQ ৽ଔσβΠφʔ J04ΞϓϦɾߘ෦ͷσβΠϯ w 5FDI$POG৽ଔͷαΠτ
ͷ੍࡞ w தֶੜͷࠒ͔Β8FCαΠτ࡞ɻ w झຯɺະ։෧ͷΧηοτςʔϓΛूΊΔ͜ ͱʮΧηοτςʔϓίϨΫλʔʯͰݕࡧʂ 4 ࣗݾհ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ࣗݾհ ݄ೖࣾϢʔβʔϑΝʔετਪਐࣨଐ ΞϧόΠτ 5
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ࣗݾհ ݄ೖࣾϢʔβʔϑΝʔετਪਐࣨଐ ΞϧόΠτ ݄৽ଔͱͯࣾ͠һʹ 6
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ࣗݾհ ݄ೖࣾϢʔβʔϑΝʔετਪਐࣨଐ ΞϧόΠτ ݄৽ଔͱͯࣾ͠һʹ ݄ߘ։ൃ෦ଐ 7
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 8 σβΠφʔͷࣄʺը໘σβΠϯ ຊͷ͓
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 9 ΫοΫύου৽ଔ ߘ։ൃ෦ଐ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ϨγϐΛॻ͘ը໘ͷվળ৽ػೳͷ։ൃ ΫοΫύου৽ଔ ߘ։ൃ෦ ଐ 10
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 11 ߘ։ൃ෦ શһͰϒϨετ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 12 ߘ։ൃ෦ શһͰϒϨετ ,1*ʹج͍ͮͯΔ͔Βͳ͍͔Λδϟοδ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 13 ߘ։ൃ෦ શһͰϒϨετ ,1*ʹج͍ͮͯΔ͔Βͳ͍͔Λδϟοδ ΞαΠϯ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 14 ߘ։ൃ෦ શһͰϒϨετ ,1*ʹج͍ͮͯΔ͔Βͳ͍͔Λδϟοδ ΞαΠϯ ༷ܾఆ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 15 ߘ։ൃ෦ શһͰϒϨετ ,1*ʹج͍ͮͯΔ͔Βͳ͍͔Λδϟοδ ΞαΠϯ ༷ܾఆ ϓϩτλΠϐϯάɾσβΠϯ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ ։ൃϑϩʔ 16 ߘ։ൃ෦ શһͰϒϨετ ,1*ʹج͍ͮͯΔ͔Βͳ͍͔Λδϟοδ ΞαΠϯ ༷ܾఆ ϓϩτλΠϐϯάɾσβΠϯ
࣮
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 17 ߘ։ൃ෦ ՁݕূͷͨΊͷϓϩτλΠϐϯά
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 18 ՁݕূͷͨΊͷ ϓϩτλΠϐϯά ߘ։ൃ෦ NEW! ʮϨγϐΛۙʹײ͡Δʯ͜ͱ͕Ͱ͖Δ ʮ৽͍͠Ϩγϐʯͱͷग़ձ͍ͷ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 19 ߘ։ൃ෦ ՁݕূͷͨΊͷ ϓϩτλΠϐϯά
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 20 ࣮ࡍͷϨγϐσʔλΛͬͨ͜ͱͰ w ಈ͖ͷΠϝʔδ͕ͭ͘͜ͱ w ։ൃͷίετͳͲ͕໌֬ʹ w εϐʔυײ͋Δ։ൃ͕Մೳʹ
J04൛ΫοΫύουͷʮΈΜͳͷߘʯλϒ͔Β͑Δ ߘ։ൃ෦ NEW! ՁݕূͷͨΊͷ ϓϩτλΠϐϯά ͔Βͷֶͼ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 21 ߘ։ൃ෦ ϓϩμΫτ։ൃͱվળࢪࡦ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 22 w ڞ༗ൣғΛ༑ਓՈʹݶఆͯ͠ ϨγϐΛڞ༗Ͱ͖ΔΑ͏ʹ w ࠓ·ͰɺʮΫοΫύουʹެ։ʯ ͔ʮԼॻ͖อଘʯͷͭͷঢ়ଶ͔͠ ͳ͔ͬͨ
ݶఆެ։Ϩγϐߘը໘ ڞ༗͞ΕͨϨγϐը໘ ߘ։ൃ෦ ݶఆެ։ػೳ ϓϩμΫτ։ൃ ݶఆެ։ͷߘJ04ΞϓϦͷΈ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 23 ߘ։ൃ෦ ݶఆެ։ػೳ ར༻γʔϯ ϝϞͷ༷ͳެ։͢Δ΄Ͳ͡Όͳ͍ ϨγϐΛۙͳਓʹڭ͍͑ͨ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 24 ݶఆެ։ػೳ վળࢪࡦ w ݱঢ়Ѳ w ఆྔௐࠪʢϩάͳͲʣ w
ఆੑௐࠪʢϢʔβʔΠϯλϏϡʔʣ ߘ։ൃ෦
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 25 ݶఆެ։ػೳ վળࢪࡦ w ݱঢ়Ѳ w ఆྔௐࠪʢϩάͳͲʣ w
ఆੑௐࠪʢϢʔβʔΠϯλϏϡʔʣ w Ϣʔβʔೝ֦େ w ΞϓϦ͓Βͤ w ϝʔϧ৴ w հϖʔδͷ࡞ ߘ։ൃ෦
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 26 ݶఆެ։ػೳ ͔Βͷֶͼ ΤϯδχΞͱίϛϡχέʔγϣϯΛऔΓ ඞཁͳ෦͚ͩσβΠϯΛ੍࡞͢Δ͜ͱͰ ࣌ؒॖΛߦ͑ͨ σβΠφʔ ඞཁͳσβΠϯ
Ͳ͜Ͱ͔͢ σβΠφʔ ༻ҙ͠·͢ ΤϯδχΞ ͜͜ͷσβΠϯͱ ૉࡐ͕΄͍͠Ͱ͢
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 27 ݶఆެ։ػೳ ͔Βͷֶͼ վળࢪࡦ ఆྔతʹஅͤͣఆੑతͳҙݟΛऔ ΓೖΕΔ͜ͱͰɺ ࣍ͷΞΫγϣϯ͕໌֬ʹͳΓɺޮՌ ͕ग़ͨ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 28 ߘ։ൃ෦ 9DPEFͰ σβΠϯௐ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 29 9DPEFͰ σβΠϯௐ w ΤϯδχΞͷۤखͳ࡞ۀͷ ݮ w σβΠϯௐͷίϛϡχέʔ
γϣϯʹ͔͚Δ࣌ؒͷॖ త
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 30 9DPEFͰ σβΠϯௐ ͷྲྀΕ 1 2 3 4
5 ࠷ॳʹ 4UPSZCPBSEͷ આ໌Λฉ͘ ࢼ͠ʹ )FMMP8PSME ͯ͠ΈΔ ࣮ࡍʹ4UPSZCPBSE ͷมߋΛߦ͏ 13Λग़ͯ͠ ϨϏϡʔͯ͠Β͏ -(5.
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 31 9DPEFͰ σβΠϯௐ ؾΛ͚ͭͨ͜ͱ ίʔυॻ͔ͳ͍ɻ ˠมͳίʔυΛॻ͍ͯ͠·͏ͱ͔͑ͬͯΤϯδχΞ͕Ϩ Ϗϡʔ͢Δͷେมʹͳͬͯ͠·͏ͨΊ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 32 ˔ΤϯδχΞͷεέδϡʔϧʹ༨༟͕Ͱ͖Δ ˔ࣗͰσβΠϯௐ͕Ͱ͖Δ 9DPEFͰ σβΠϯௐ ͔Βͷֶͼ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 33 ·ͱΊ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 34 ·ͱΊ ՁݕূͷͨΊͷ ϓϩτλΠϐϯά ϓϩμΫτ։ൃͱ վળࢪࡦ 9DPEFͰ σβΠϯௐ
σβΠφʔͷࣄʺը໘ͷσβΠϯ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 35 σβΠφʔͷࣄʹ ྉཧ͢Δਓͷʮָ͍͠ʂʯΛٕज़Ͱ࣮ݱ͍ͯ͘͜͠ͱ ·ͱΊ ՁݕূͷͨΊͷ ϓϩτλΠϐϯά ϓϩμΫτ։ൃͱ վળࢪࡦ
9DPEFͰ σβΠϯௐ
$PPLQBE5FDI$POG )JSPBLJ8","546,*!QV[[FMKQ 36 ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ