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
Prott - Prototyping process 20161221
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Mari Okada
December 21, 2016
Design
540
1
Share
Prott - Prototyping process 20161221
html5j Webプラットフォーム部 第15回勉強会
https://html5j-webplat.connpass.com/event/46630/
Mari Okada
December 21, 2016
Other Decks in Design
See All in Design
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.7k
「バイブコーディングって何?」から始まった、 AIとの一年間と、その先のこと
seto
0
180
Build for the Web, Build on the Web, Build With the Web
csswizardry
0
310
2026の目標「もっと定量的に事業、会社へ貢献する!」
yuri_ohashi
0
770
デザインの文脈を理解する:エンジニアがデザインカンファレンスに参加して得た学びと気づき
hypebeans
0
150
「使いやすさ」だけでは、「勝てる」サービスにはならない。〜KPIとUXの分断を埋める、サービス戦略という「指針」〜
nbkouhou
2
260
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
160
20260215独立行政法人科学技術振興機構(JST) 社会技術研究開発センター(RISTEX)ケアが根づく社会システム _公開シンポジウム
a2k
0
140
Spacemarket Brand Guide
spacemarket
2
380
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
hiro93n
1
150
AI時代、デザイナーの価値はどこに?
tararira
1
960
デザインコンテキストのバトンをつなぐ—AI時代のプロダクトマネジメント
kumanoayumi
6
1k
Featured
See All Featured
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
52k
Deep Space Network (abreviated)
tonyrice
0
97
Build your cross-platform service in a week with App Engine
jlugia
234
18k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
230
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
160
Practical Orchestrator
shlominoach
191
11k
Ethics towards AI in product and experience design
skipperchong
2
240
Into the Great Unknown - MozCon
thekraken
40
2.3k
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
270
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
140
Transcript
© 2016 Goodpatch, Inc. All Right Reserved. ProttΛͬͨϓϩτλΠϐϯάϓϩηε 2016/12/21 html5j
WebϓϥοτϑΥʔϜ෦ ୈ15ճษڧձ
2 Ԭా ຑཬ / Mari Okada גࣜձࣾάουύον Product division Prott
ϓϩμΫτϚωʔδϟʔ ɾݸਓతʹ͖ͳϓϩτλΠϐϯάπʔϧɿPrott & Principle ࣗݾհ ৽ଔͰάουύονʹೖࣾɺϓϩμΫτϚωʔδϟʔʹͳΔલ ϢʔβʔαϙʔτΛ୲͓ͯ͠Γ·ͨ͠ɻ
© 2016 Goodpatch, Inc. All Right Reserved. ࠓͷΞδΣϯμ • Prottʹ͍ͭͯͷ͝հ
& σϞ • ProttΛͬͨ։ൃ / σβΠϯϓϩηεʹ͍ͭͯ • ׆༻ࣄྫɺTipsͳͲ ProttΛͬͨϓϩτλΠϐϯάϓϩηε 3
4 Prottɺ୯७ʹϓϩτλΠϓΛͭ͘Δπʔ ϧͰͳ͘ɺϓϩτλΠϐϯάΛνʔϜʹΠ ϯετʔϧ͢ΔπʔϧͰ͢ɻGoodpatchͷࣗ ࣾαʔϏεͱͯ͠201410݄ʹਖ਼ࣜϦϦʔ εɻେखΣϒαʔϏεاۀʹͯEnterprise ϓϥϯͷ࠾༻࣮ଟʢYahoo!ɺDeNAɺ GREEɺRecruitɺָఱͳͲʣɻ 1000ͷձٞΑΓɺ1ͭͷϓϩτλΠϓ http://prottapp.com
DEMO 5
Prottͷ։ൃॳͷϏδϣϯ ʮϓϩτλΠϐϯάจԽΛ͔ࠜͤɺ σβΠϯϓϩηεΛมֵͤ͞Δʯ 6
ຊͰϓϩτλΠϐϯάͱ͍͏ݴ༿͕ Ұൠతʹͳ͖ͬͯͨ 7
ϓϩτλΠϐϯάπʔϧ͍Ζ͍ΖͰ͖ͯͨ 8
ଞπʔϧͱProttͷҧ͍ͬͯʁ 9
10 ϓϩτλΠϐϯάπʔϧͷछྨ Ξχϝʔγϣϯܕ㲗 τϥϯδγϣϯܕ ݸਓར༻ 㲗 νʔϜͰར༻
11 Ξχϝʔγϣϯܕ τϥϯδγϣϯܕ
12 νʔϜར༻ ݸਓར༻ Ξχϝʔγϣϯܕ τϥϯδγϣϯܕ
1. ؆୯ͳϓϩτλΠϓ͕ૉૣ͘࡞ΕΔ 2. νʔϜͰ͔ͭ͏ͨΊͷπʔϧ 13 Prottͷಛ
ProttΛͬͨ։ൃϓϩηε 14
© 2016 Goodpatch, Inc. All Right Reserved. 15 ProttΛͬͨ։ൃϓϩηεͷྲྀΕ اը
ઃܭ σβΠϯ ࣮ ࢴͱϖϯͰεέον ཁ݅ఆٛ ϫΠϠʔϑϨʔϜ࡞ ϏδϡΞϧσβΠϯ Ξχϝʔγϣϯ࡞ ࣮ Prottͷׂ ΞΠσΞͷԾઆݕূ ใઃܭͷԾઆݕূ ϏδϡΞϧσβΠϯͷ Ծઆݕূ ϓϩτλΠϓΛݩʹ ಈ͖Λ֬ೝ࣮ͯ͠&֬ ೝ ਵ࣌ɺεςʔΫϗϧμʔͱͷೝࣝ߹Θͤ
© 2016 Goodpatch, Inc. All Right Reserved. 16 ϓϩδΣΫτͷ্ྲྀ͔ΒԼྲྀ·Ͱ Ұ؏ͯ͑͠Δ
& ίϛϡχέʔγϣϯπʔϧͱͯ͠ ͏͜ͱ͕Ͱ͖Δ
Prott ׆༻ࣄྫ 17
ϓϩτλΠϓ࡞ = σβΠφʔ͚ͩͷࣄʁ 18
© 2016 Goodpatch, Inc. All Right Reserved. 19 NO
© 2016 Goodpatch, Inc. All Right Reserved. 20 ༷ʑͳ৬छͷࢹΛऔΓೖΕΔ͜ͱͰ ͞ΒʹϓϩμΫτ͕ϒϥογϡΞοϓͰ͖Δ
© 2016 Goodpatch, Inc. All Right Reserved. 21 ProttΛ͏ͱσβΠφʔҎ֎Ͱ ؆୯ʹϓϩτλΠϓΛͭ͘Δ͜ͱ͕Ͱ͖Δ
© 2016 Goodpatch, Inc. All Right Reserved. σβΠφʔҎ֎ͰΨϯΨϯ͑Δʂ ProttΛͬͨϓϩτλΠϐϯάϓϩηε 22
Prottͷը໘ભҠਤػೳɺϑϩϯτΤϯυΤϯδχΞ͕ ࡞ͬͨϫΠϠʔϑϨʔϜΛϕʔεʹ࡞Γ্͛ΒΕͯ·͢ Prottը໘ભҠਤػೳॳظϫΠϠʔ
© 2016 Goodpatch, Inc. All Right Reserved. νʔϜͰ͏ - ProttΛڞ௨ೝࣝΛ߹ΘͤΔͱͯ͠͏
ProttΛͬͨϓϩτλΠϐϯάϓϩηε 23 ϓϩτλΠϓΛϕʔεʹٞΛߦ͏ ͦͷͰϩάΛίϝϯτػೳΛ ͍ͬͯͯ͘͠ ↓ ٞͷϩά͕ਵ࣌Ξοϓσʔτ͞Ε ଓ͚͍ͯ͘ͷͰɺΫϥΠΞϯτؔ ऀΛר͖ࠐΈͳ͕Β͢͢Ή͜ͱ ͕Ͱ͖Δ
© 2016 Goodpatch, Inc. All Right Reserved. ϓϩτλΠϓͱը໘ભҠਤΛߦ͖དྷͯ͠ دΓͱҾ͖ͷࢹΛऔΓೖΕΔ ProttΛͬͨϓϩτλΠϐϯάϓϩηε
24 ભҠਤͰ၆ᛌͯ͠Έͯɺൈ͚࿙Ε͕ͳ͍͔ ใઃܭతʹ͓͔͘͠ͳ͍͔Λ֬ೝ ΞΠσΞΛͲΜͲΜܗʹ͍ͯͬͯ͠ײతʹ ಈ͘ܗΛͭ͘Γ͍͋͛ͯ͘ 㲗
© 2016 Goodpatch, Inc. All Right Reserved. ϓϩτλΠϓͱը໘ભҠਤΛߦ͖དྷͯ͠ دΓͱҾ͖ͷࢹΛऔΓೖΕΔ ProttΛͬͨϓϩτλΠϐϯάϓϩηε
25 ભҠਤͰ၆ᛌͯ͠Έͯɺൈ͚࿙Ε͕ͳ͍͔ ใઃܭతʹ͓͔͘͠ͳ͍͔Λ֬ೝ ΞΠσΞΛͲΜͲΜܗʹ͍ͯͬͯ͠ײతʹ ಈ͘ܗΛͭ͘Γ͍͋͛ͯ͘ 㲗 ը໘ભҠਤΛग़ྗ͢Δ͜ͱͰ ༷ॻ͕ΘΓʹͳΔʂ
© 2016 Goodpatch, Inc. All Right Reserved. ͦͷ΄͔ - Design
sprintͰProttΛ͏ 26 ΞΠσΞΛൃࢄ͠·͘Δ Desing sprint άʔάϧʹΑΔσβΠϯڭҭϝιουͱͦͷϫʔΫγϣοϓɻ ͔࣌ؒΒͰҰؾʹͬͯɺͷίϯηϓτσβΠϯϓϩτλΠϓ࡞Λ্͛ͯ͠·͏ߴͳ σβΠϯख๏ ΞΠσΞΛಈ͘ܗʹ͠ɺϢʔβʔς ετ·ͰΛProttͰ ➡ ProttΛͬͨϓϩτλΠϐϯάϓϩηε
© 2016 Goodpatch, Inc. All Right Reserved. 27 ProttΛͬͨ։ൃϓϩηεͷྲྀΕ اը
ઃܭ σβΠϯ ࣮ ࢴͱϖϯͰεέον ཁ݅ఆٛ ϫΠϠʔϑϨʔϜ࡞ ϏδϡΞϧσβΠϯ Ξχϝʔγϣϯ࡞ ࣮ ProttΛ͏త ΞΠσΞͷԾઆݕূ ใઃܭͷԾઆݕূ ϏδϡΞϧσβΠϯͷ Ծઆݕূ ϓϩτλΠϓΛݩʹ ಈ͖Λ֬ೝ࣮ͯ͠&֬ ೝ ਵ࣌ɺεςʔΫϗϧμʔͱͷೝࣝ߹Θͤ
Ұ࿈ͷྲྀΕ͕ProttΛ த৺ʹߦͳ͏͜ͱ͕Ͱ͖Δʂ 28
ͥͻɺProttΛͬͯ ϓϩτλΠϐϯάͯ͠Έ͍ͯͩ͘͞ʂ 29
30 ProttͰΘ͔Βͳ͍͜ͱ͕Ͱ͖ͯͨ߹
© 2016 Goodpatch, Inc. All Right Reserved. 31 ϓϩμΫτ։ൃʹؔΘΔνʔϜͷ ίϥϘϨʔγϣϯΛ͞Βʹ׆ൃʹͰ͖ΔΑ͏ʹ
ࠓޙͲΜͲΜΞοϓσʔτ͍ͯ͘͠༧ఆͰ͢ͷͰɺ ָ͓͠Έʹ͍ͩ͘͞ʂ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ :) 32 ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ