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
複雑なアプリケーションにオブジェクト指向UIで立ち向かう
Search
cawpea
February 14, 2018
Design
28
120k
複雑なアプリケーションにオブジェクト指向UIで立ち向かう
Goodpatch Engineer Meetup Vol.4で発表した資料です。
https://goodpatch.connpass.com/event/77080/
cawpea
February 14, 2018
Tweet
Share
More Decks by cawpea
See All by cawpea
不確実なソフトウェア開発におけるUXエンジニアの意義と役割
masakiohsumi
9
13k
デザインとエンジニアリングをつなぐコンポーネントの運用設計
masakiohsumi
6
9.4k
デザイナーとエンジニアの垣根を取り払う"デザインエンジニア"という考え方
masakiohsumi
7
4.4k
Other Decks in Design
See All in Design
ネーミングの極意 - その名は体を現していますか? -
kakukoki
2
440
【Designship 2024|10.13】デザイン組織を進化させるための仕組み化の要諦
payatsusan213
1
750
私たちは、世界とデザインの〝次の一歩〟を、どこへ向けるか。
tkhr_kws
2
250
portfolio2025_kanakoohata
kanako106
0
470
プロダクトデザイナー視点から見た チームでの意思決定の難しさと 重要ポイント3点
kei141
0
560
発表資料テンプレート / My slide template
thatblue
0
170
Arborea Art Book
thebogheart
1
320
ENEOS社事例|アプリ事業を加速させるデザイナーの取り組み / dx-eneos-design
cyberagentdevelopers
PRO
1
650
デザインできるもの、できないもの | Designship 2024 | Yasuhiro Yokota
yasuhiroyokota
2
980
Findy - デザイナー向け会社紹介 / Hiring Findy's Designers
findyinc
6
61k
Where to Start with a Design System Across Different Frontend Frameworks | SpectrumTokyoMeetup#15
tararira
0
110
241214_StackNagoya_プレイングマネージャーのプレイングの時間の使い方
kiyoshifuwa
0
190
Featured
See All Featured
Scaling GitHub
holman
459
140k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Six Lessons from altMBA
skipperchong
27
3.6k
Testing 201, or: Great Expectations
jmmastey
41
7.2k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
240
The Power of CSS Pseudo Elements
geoffreycrofte
74
5.4k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
30
2.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.2k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Agile that works and the tools we love
rasmusluckow
328
21k
Transcript
ෳࡶͳΞϓϦέʔγϣϯʹ ΦϒδΣΫτࢦ6*Ͱཱ͔ͪ͏
େ֯কً.BTBLJ0ITVNJ 'SPOUFOE%FWFMPQFS !N@PITVNJ NBTBLJPITVNJ
None
ͱ͋ΔΞϓϦέʔγϣϯͰ๊͍͑ͯͨΈ
αΠτͷಋઢɺػೳ͕ෳࡶͰ ϚχϡΞϧΛݟͳ͍ͱ͍͜ͳͤͳ͍
ϚχϡΞϧ͕ແͯ͑͘Δͷ
Ҿ༻ݩɿIUUQCMVFTQFBLFSKQEPXOMPBETXBMMQBQFSXPPETIFMGIUNM
Ҿ༻ݩɿIUUQCMVFTQFBLFSKQEPXOMPBETXBMMQBQFSXPPETIFMGIUNM J1IPOFͷֶशޮ͕ߴ͍ͷͦͷ6*͕ΦϒδΣΫτϕʔεͰ ઃܭ͞Ε͍ͯΔ͔ΒͰ͢ɻͭ·ΓϞʔυϨεͰ͋Δ͜ͱ͕େ͖ ͳϑΝΫλʔʹͳ͍ͬͯ·͢ɻ༏Εͨ (6* ΞϓϦέʔγϣϯ ʹରͯ͠Ϣʔβʔ͕ʮϚχϡΞϧΛಡ·ͳͯ͑͘Δʯͱײ ͡Δͷͩͱ͢ΕɺͦΕखॱ͕͍͔֮͑͢ΒͰͳ͘ɺ ܾͦͦ·ͬͨखॱ͕ແ͍͔ΒͳͷͰ͢ɻ OOUX
– ΦϒδΣΫτϕʔεͷUIϞσϦϯά
6*ͷجຊ λεΫϕʔεͱΦϒδΣΫτϕʔε
$6* ಈࢺ໊ࢺͷߏจ (6* ໊ࢺಈࢺͷߏจ λεΫϕʔε ΦϒδΣΫτϕʔε ྫSNd%FTLUPQTBNQMFUYU ྫTBNQMFUYUΛબͯ͠ΰϛശʹҠಈ
ϢʔβʔΞΫγϣϯ͝ͱʹ࣮ߦॱংΛ֮͑Δඞཁ͕͋Δ λεΫϕʔεͰ࡞ΒΕͨΞϓϦέʔγϣϯͷྫ ࠶ੜ ࣸਅҰཡ ࣸਅৄࡉ ฤू ࣸਅҰཡ ࣸਅฤू ফڈ ࣸਅҰཡ
ࣸਅআ ΞΫγϣϯʢಈࢺʣΛબͨ͠ޙʹࣸਅʢ໊ࢺʣΛબ͢Δ ΦϦϯύεϛϡʔͷϝχϡʔ
ࣸਅҰཡ ࣸਅৄࡉ μϯϩʔυ ฤू ΦϒδΣΫτϕʔεͰ࡞ΒΕͨΞϓϦέʔγϣϯͷྫ Ϣʔβʔ࠷ॳʹରΛબͼɺͦΕʹରԠ͢ΔΞΫγϣϯΛࣗ༝ʹબͰ͖Δ ࣸਅʢ໊ࢺʣΛબͨ͠ޙʹΞΫγϣϯʢಈࢺʣΛબ͢Δ %SPQCPYͷ8FC্ͷࣸਅҰཡ আ
ΦϒδΣΫτϕʔεͷ6*ϢʔβʔΛϞʔυ͔Βղ์͠ɺ զʑ͕ಓ۩ͷ͍ํʹ͍ؔͯ࣋ͬͯ͠Δجຊతͳϝϯλϧ ϞσϧΛө͠·͢ɻఝΛଧͭ࣌ɺզʑ·ͣϋϯϚʔΛ ࣋ͪɺͦΕ͔ΒৼΓԼΖ͠·͢ɻৼΓԼΖ͔ͯ͠ΒϋϯϚʔ Λ࣋ͭਓ͍ͳ͍ͷͰ͢ɻ l z OOUX – ΦϒδΣΫτϕʔεͷUIϞσϦϯά
ΦϒδΣΫτϕʔεͰ6*Λઃܭ͢Δ
Ϣʔβʔͷؔ৺ͷରͰ͋ΔΦϒδΣΫτΛΫϥεͱͯ͠ ఆٛ͠ɺͦΕΛͦͷ··εΫϦʔϯʹొͤ͞ΔͷͰ͢ɻ $PVOUFSQBSUc.PEFMFTTBOE.PEBM l z
ΦϒδΣΫτͱlϢʔβʔͷؔ৺ࣄz
ࣗͷϝοηʔδΛߘ͍ͨ͠ ΈΜͳͷϝοηʔδΛӾཡ͍ͨ͠ ୭͔ͷϝοηʔδΛڞ༗͍ͨ͠ ͨͱ͑ɺ5XJUUFSͷzϢʔβʔͷؔ৺ࣄzԿ͔ʁ
໊ࢺΦϒδΣΫτͱͯ͠நग़Ͱ͖Δ ࣗͷϝοηʔδΛߘ͍ͨ͠ ΈΜͳͷϝοηʔδΛӾཡ͍ͨ͠ ୭͔ͷϝοηʔδΛڞ༗͍ͨ͠ lϢʔβʔz ΦϒδΣΫτ lϝοηʔδz ΦϒδΣΫτ
ࣗͷϝοηʔδΛߘ͍ͨ͠ ΈΜͳͷϝοηʔδΛӾཡ͍ͨ͠ ୭͔ͷϝοηʔδΛڞ༗͍ͨ͠ ಈࢺΞΫγϣϯͱͯ͠நग़Ͱ͖Δ lߘzɺzӾཡzɺzڞ༗z ΞΫγϣϯ
நग़͞ΕͨΦϒδΣΫτͱΞΫγϣϯ ΦϒδΣΫτ ΞΫγϣϯ ຊ࣭త ݱత Ϣʔβʔ ϝοηʔδ ߘ Ӿཡ ڞ༗
ΦϒδΣΫτมΘΓʹ͘͘ɺΞΫγϣϯมΘΓ͍͢
㲔 ΦϒδΣΫτΛϕʔεʹ6*ϞσϧΛઃܭ͢Δ ΦϒδΣΫτ Ϗϡʔ ϝοηʔδ Ϣʔβʔ ϝοηʔδҰཡ ϝοηʔδͷ ίϨΫγϣϯ ϝοηʔδৄࡉ
ɾϝοηʔδͷ༰ ɾϦπΠʔτ ɾ͍͍Ͷ Ϣʔβʔৄࡉ ɾ໊લ ɾϓϩϑΟʔϧը૾ ɾߘͨ͠ϝοηʔδ ڞ༗ɺআ ฤू ৽نߘ
6*ϞσϧΛϕʔεʹϫΠϠʔϑϨʔϜΛߟ͑Δ 6TFSOBNF ϝοηʔδҰཡ ϝοηʔδͷ ίϨΫγϣϯ ϝοηʔδৄࡉ w ϝοηʔδͷ༰ w ϦπΠʔτ
ʜ Ϣʔβʔৄࡉ w ໊લ w ϓϩϑΟʔϧը૾ ʜ
6*ϞσϧΛϕʔεʹϫΠϠʔϑϨʔϜΛߟ͑Δ 6TFSOBNF ϝοηʔδҰཡ ϝοηʔδͷ ίϨΫγϣϯ ϝοηʔδৄࡉ w ϝοηʔδͷ༰ w ϦπΠʔτ
ʜ Ϣʔβʔৄࡉ w ໊લ w ϓϩϑΟʔϧը૾ ʜ ΦϒδΣΫτΛϕʔεʹใઃܭ͢ΔࣄʹΑͬͯ ޮతͰແବͷͳ͍6*Λߟ͑͘͢ͳΔ
ΦϒδΣΫτࢦ6*͕ ΤϯδχΞϦϯάʹͨΒ͢ͷ
λεΫϕʔεͷ6* ϝοηʔδฤू ϝοηʔδҰཡ" σʔλ ϢʔβʔΠϯλʔϑΣʔε ϝοηʔδআ ϝοηʔδҰཡ# औಘ
\ NFTTBHFT< \JE CPEZlGPPz^ \JE CPEZlCBSz^ \JE CPEZlCB[z^ > ^ औಘ
ΦϒδΣΫτϕʔεͷ6* ϝοηʔδҰཡ ϝοηʔδฤू σʔλ ϢʔβʔΠϯλʔϑΣʔε ϝοηʔδআ औಘ \ NFTTBHFT<
\JE CPEZlGPPz^ \JE CPEZlCBSz^ \JE CPEZlCB[z^ > ^ ػೳՃ
ΦϒδΣΫτϕʔεͷ6* ϝοηʔδҰཡ ϝοηʔδฤू σʔλ ϢʔβʔΠϯλʔϑΣʔε ϝοηʔδআ औಘ \ NFTTBHFT<
\JE CPEZlGPPz^ \JE CPEZlCBSz^ \JE CPEZlCB[z^ > ^ ػೳՃ ΦϒδΣΫτϕʔεͷ6*σʔλͷө͕ త͔ͭن͕େ͖͘ͳͬͯෳࡶԽ͠ʹ͘͘ͳΔ
˓˓ը໘ͷ࣌ͷ˚˚ϘλϯͷσβΠϯΛมߋ ͍͍ͯ͠Ͱ͔͢ʁ ˚˚Ϙλϯผͷը໘Ͱͬͯ·͕͢ɺ ͦ͜มߋ͍͍ͯ͠Ͱ͔͢ʜʁ σβΠφʔ ΤϯδχΞ σβΠϯΛมߋ͢Δ࣌ʹ࣌ં͋Δޫܠ ͳΔ΄Ͳʜɻͪΐͬͱ֬ೝ͠·͢ɻ σβΠφʔ
σβΠϯ͕෦తʹ͔͠ߟ͑ΒΕ͓ͯΒͣɺ֬ೝʹख͕͔͔ؒΔ σβΠφʔͱೝ͕ࣝ߹Θͣɺ͕ͦͦల։͞ΕΔ ࣮ޙʹߟྀ࿙Ε͕ൃ֮͠ɺۓٸରԠ͕ൃੜ͢Δ 6*͕ෳࡶͳ࣌ʹى͜Γ͕ͪͳͨͪ ʁ
σβΠϯ͕෦తʹ͔͠ߟ͑ΒΕ͓ͯΒͣɺ֬ೝʹख͕͔͔ؒΔ σβΠφʔͱೝ͕ࣝ߹Θͣɺ͕ͦͦల։͞ΕΔ ࣮ޙʹߟྀ࿙Ε͕ൃ֮͠ɺۓٸରԠ͕ൃੜ͢Δ 6*͕ෳࡶͳ࣌ʹى͜Γ͕ͪͳͨͪ ʁ 6*ͷෳࡶੑΛഉআ͢ΔࣄͰ ΤϯδχΞͱσβΠφʔͷ ίϛϡχέʔγϣϯΛԁʹ͢Δ
·ͱΊ
w ΦϒδΣΫτΛ·ͣબͤ͞ΔࣄͰɺϞʔυϨεͰࣗવͳ6*ʹͳΔ w ΦϒδΣΫτͰཧ͢ΔࣄʹΑͬͯແବͷͳ͍6*Λߟ͑͘͢ͳΔ σβΠϯతଆ໘ ٕज़తଆ໘ w 6*ͱσʔλͷॲཧ͕తʹͳΓɺίʔυ͕ෳࡶԽ͠ʹ͍͘ w 6*ͷෳࡶੑΛഉআ͢ΔࣄͰσβΠφʔͱڠಇ͘͢͠ͳΔ
ΦϒδΣΫτࢦతʹઃܭͰ͖Δ͔ߟ͑Α͏
ΤϯδχΞσβΠϯʹؔ৺Λ࣋ͬͯɺ ྑ͍Ϟϊ࡞͍͖ͬͯ·͠ΐ͏ɻ
5IBOLTGPSZPVSBUUFOUJPO