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
プロトタイプドリブンなデザインを実現する考え方と環境 / Prototype-driven design
Search
sagaraya
October 07, 2019
Design
5
15k
プロトタイプドリブンなデザインを実現する考え方と環境 / Prototype-driven design
実装含めたプロトタイピングをやっていくための考え方や環境について、UX Engineer Meetupで話しました。
sagaraya
October 07, 2019
Tweet
Share
More Decks by sagaraya
See All by sagaraya
入りやすい保育園マップ / Hoikuen-hairu
sagaraya
0
200
エンジニアリングを軸にデザインもやる、UXエンジニアという働き方(公開版)/ Work style as a UX engineer
sagaraya
0
2.5k
エンジニアが使うツールから未来のデザインツールを予想する / Forecast design tools from tools used by engineers
sagaraya
0
520
より良いUXを実現するための開発プロセスとは / Development process for better UX
sagaraya
10
44k
iOSでテーマ(着せ替え)機能を実装した時のTips
sagaraya
1
2.7k
Atomをもっと使いやすくする方法
sagaraya
5
2.6k
Other Decks in Design
See All in Design
Information Architects: The Missing Link in Design Systems
soysaucechin
0
130
B/43プラスカードができるまで
putchomsmartbank
0
530
プロジェクトを成功に導く、デザイナーの仕事
akaneyoshikawa
0
160
TrollsTopia: Funtography- Part 1
kenijam
1
220
デザインシステムで解消するさまざまな分断
hirataaa0220
1
180
新しい資産運用サービスALTERNA(オルタナ)の伝え方の工夫
layerx
PRO
0
1.1k
WHAT ARE ME?
takuro_nakajima
PRO
0
1.6k
PRDがデザインプロセスを高速化した話
tooomo
1
430
もち的デザイナーのキャリアデザイン新提言:副業起業家のすゝめ
mochitaro
0
1.4k
社内管理画面のデザインもプロダクトデザイン
takanorip
4
790
Métricas de UX - Reflexões sobre o uso de dados numéricos no contexto de UX
videlvequio
0
230
良いアプリケーションをデザインするための感覚の持ち方 / Cultivating a Sense for Designing Great Applications
usagimaru
23
8.2k
Featured
See All Featured
Atom: Resistance is Futile
akmur
260
25k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
117
18k
How to Ace a Technical Interview
jacobian
273
22k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
8
3.5k
Building Adaptive Systems
keathley
32
1.9k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
22
1.4k
How to train your dragon (web standard)
notwaldorf
75
5.2k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.7k
Designing for Performance
lara
601
67k
What the flash - Photography Introduction
edds
64
11k
What’s in a name? Adding method to the madness
productmarketing
PRO
17
2.7k
Debugging Ruby Performance
tmm1
70
11k
Transcript
ϓϩτλΠϓυϦϒϯͳσβΠϯ Λ࣮ݱ͢Δߟ͑ํͱڥ 2019/10/7 UX Engineer Meetup ॏా ܡ
ॏా ܡ Shigeta Keisei ϛΫγΟ → Goodpatch → Sen →
ΫοΫύου @sagaraya (Twitter/noteͳͲ) UXΤϯδχΞྺ2ʙ3
ϓϩτλΠϐϯάͯ͠·͔͢ʁ
ϞϊΛݟͳ͕Βͨ͠΄͏͕ੜ࢈ੑ͕ߴ͍ ૣ͘ϑΟʔυόοΫΛΒ͏ ݴ༿ʹͰ͖ͳ͍ͷΛΧλνʹ͠ͳ͕Βߟ͑Δ
࣮ࡍΔͷ͍͠ σβΠϯπʔϧͰͰ͖ͯɺ࣮ϨϕϧͰ Δͷ͞Βʹ͍͠
ͬͱίετͰݕূ͍ͨ͠ ՁͷΘ͔Βͳ͍ͷʹίετΛ ͔͚͍͍ͯͷ͔ ͤ·Δʒ
None
IUUQTUZQFKQFUGFBUVSF ʲUXΤϯδχΞΛࢦ͢ʹʁʳΫοΫύουͷUXΤϯδχΞ ʹฉ͍ͨɺಇ͖ํษڧ๏ - ΤϯδχΞtype | స৬type 20ͷϓϩτλΠϓͱݴޠԽͷ྆ྠͰΞϓϦΛϦ χϡʔΞϧ͠·ͨ͠ IUUQTOPUFNVTBHBSBZBOOBCDBBFG
͜Ε·ͰͰҰ൪ϓϩτλΠϐϯάͰ͖ͯΔ࣮ײ͕͋Δ
None
ͳͥͰ͖ͯΔͷ͔ʁ
1. ʮliving onʯΛॏࢹ͢Δ 2. ΤϯδχΞͱͯ͠ͷৗࣝΛࣺͯΔ 3. ճΓΛॆ࣮ͤͯ͞εϐʔυΞοϓ
ʮliving onʯΛॏࢹ͢Δ 1
$SFBUJWF4FMFDUJPO Q lࣗࣾͷ։ൃதʹɺͦͷΛ։ൃऀ͕ࣗͬͯධՁ͢Δख๏ Λɺ͜ͷۀքͰʮυοάϑʔσΟϯάʯͱ͍͏ɻ͜ͷ༻ޠݸਓతʹ ͋·Γ͖Ͱͳ͔ͬͨ͠ɺΞοϓϧతͳηϯεʹૌ͑ͳ͍ɻʢத ུʣΞοϓϧࣾͰʮυοάϑʔσΟϯάʯͱݺͿ߹͕͋ͬͨɺ ։ൃதͷΛৗੜ׆Ͱ࣮ͷΑ͏ʹ͏͜ͱΛࢦͯ͠ΑΓසൟʹ ΘΕͨͷɺʮMJWJOHPOʢΒ͢ʣʯͱ͍͏දݱͩͬͨɻz
ը໘
ը໘ ΞϓϦར༻தͷମݧ
ը໘ ΞϓϦར༻தͷମݧ ར༻લͷମݧ ར༻ޙͷମݧ ྉཧɾ৯ʹؔ͢Δͷମݧ
ը໘ ΞϓϦར༻தͷମݧ ར༻લͷମݧ ར༻ޙͷମݧ ྉཧɾ৯ʹؔ͢Δͷମݧ ɾɾɾ ɾɾɾ ྉཧɾ৯ʹؔ͢Δຖͷମݧ
ը໘ ΞϓϦར༻தͷମݧ ར༻લͷମݧ ར༻ޙͷମݧ ྉཧɾ৯ʹؔ͢Δͷମݧ ɾɾɾ ɾɾɾ ྉཧɾ৯ʹؔ͢Δຖͷମݧ ຖͷମݧΛͱ͓ͯ͠ɺϢʔβʔ͕ͯ͠ ࣗͷײ֮ͰྉཧΛָ͠ΊΔΑ͏ʹͳΔ
ࢦ͢ͱ͜Ζ
ը໘ ΞϓϦར༻தͷମݧ ར༻લͷମݧ ར༻ޙͷମݧ ྉཧɾ৯ʹؔ͢Δͷମݧ ɾɾɾ ɾɾɾ ྉཧɾ৯ʹؔ͢Δຖͷମݧ ϢʔβʔςετͰ ݕূͰ͖Δൣғ
ը໘ ΞϓϦར༻தͷମݧ ར༻લͷମݧ ར༻ޙͷମݧ ྉཧɾ৯ʹؔ͢Δͷମݧ ɾɾɾ ɾɾɾ ྉཧɾ৯ʹؔ͢Δຖͷମݧ ຊʹݕূ͍ͨ͠ൣғ
living on͢Δʢৗੜ׆ͷதͰ͏ʣ ʹ࣮͢Δ͔͠ͳ͍
ΤϯδχΞͱͯ͠ͷৗࣝ ΛࣺͯΔ 2
σβΠϯ ΤϯδχΞϦϯά ͍͢͞ ඒ͠͞ ՁΛఏڙͰ͖͍ͯΔ͔ ίϯηϓτ͕ΘΔ͔ อकੑ ҆ఆੑ ༷Λຬ͍ͨͯ͠Δ͔
σβΠϯ ΤϯδχΞϦϯά ͍͢͞ ඒ͠͞ ՁΛఏڙͰ͖͍ͯΔ͔ ίϯηϓτ͕ΘΔ͔ อकੑ ҆ఆੑ ༷Λຬ͍ͨͯ͠Δ͔ ϓϩτλΠϐϯάͰߟ͑Δ
ͷͬͪ͜
ϓϩτλΠϐϯάΤϯδχΞϦϯάΛ ͏σβΠϯߦҝ
ΤϯδχΞϦϯά อकੑ ҆ఆੑ ༷Λຬ͍ͨͯ͠Δ͔ ΤϯδχΞͱͯ͠ ͷৗࣝ
͖Ε͍ͳίʔυͰͳ͘εϐʔυΛ༏ઌ͢Δ ίʔυϨϏϡʔ͠ͳ͍ ΞʔΩςΫνϟڽΒͳ͍ εϐʔυ্͕ΔͳΒίʔυڞ௨Խ͢Δ͠ςετॻ͘
༷fix͢ΔͷͰͳ͍ ͋Δͷݱ࣌ͷϕετ ༷ܾ·ͬͯͳ͍͔Β࣮͠ͳ͍/(
ΈΜͳͰݟੵΒͳ͍ ظݶͰͳ͘ɺ࣭ʹϑΥʔΧε͢Δ ʢͱ͍͑ࣗͳΓʹ͍ͭ·ͰʹΔ͔ܾΊΔʣ ͋ͱͰΑΓྑ͍ͷΛࢥ͍͍ͭͯΧλνʹ ͍͢͠
ίʔυΛॻ͘͜ͱʹͩ͜ΘΒͳ͍ σβΠϯπʔϧͬͨ΄͏͕ૣ͘ࢼͤΔ߹͋Δ
ճΓΛॆ࣮ͤͯ͞ εϐʔυΞοϓ 3
None
αʔϏεͰͳ͘ ձࣾͷDesign System ৽نࣄۀͰ͑Δ
ίʔυԽ͞Ε͍ͯͯɺૣ͘ߴ͍࣭ͷͷΛͭ͘ΕΔ
ΫοΫύουͷ։ൃதͷΞϓϦΛμϯϩʔυͰ͖ΔαΠτ
None
ϥϕϧΛ͚ͭΕϚʔδ͠ͳͯࣾ͘৴Ͱ͖Δ ૣ͘৴ͯ͠ϑΟʔυόοΫΛΒ͑Δ ৄͪ͘͜͠Βˣ ಈ࡞֬ೝͷͨΊͷࣾΞϓϦ৴αʔϏεΛ৽ͨʹ࡞ͬͨJ04%$ IUUQTTQFBLFSEFDLDPNTMJHIUBJSJPTED
1. ʮliving onʯΛॏࢹ͢Δ 2. ΤϯδχΞͱͯ͠ͷৗࣝΛࣺͯΔ 3. ճΓΛॆ࣮ͤͯ͞εϐʔυΞοϓ ৗੜ׆Ͱ͏ͨΊʹϓϩτλΠϐϯά͢Δ ϓϩτλΠϐϯάΤϯδχΞϦϯάΛ͏σβΠϯߦҝ citrusʢձࣾͷσβΠϯγεςϜʣʗhanedaʢࣾ৴πʔϧʣ
͓·͚ ࠓ͞ͳ͔ͬͨ͜ͱ ࠙ձͰͯ͠Έ͍ͨ͜ͱ
• ߟ͑ํɾڥͰͳ͘εΩϧ໘ͷ • ΤϯδχΞͱͯ͠1ਓલʹ͍ͬͯ͘εΩϧ ʴ ྑ͍ײ͡ྗ • UXͱ͍͏ݴ༿ͷ൷ͱͦΕʹର͢Δճ • ϓϩτλΠϐϯά͢Δͱ͖ͱ͠ͳ͍ͱ͖ͷ͍͚
• ΫοΫύουͰͷUXΤϯδχΞͷಇ͖ํ • UXΤϯδχΞืूதͳͷͰɺڵຯ͍Δํ͍ͨΒ͓͠·͠ΐ͏ʂ