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
組織で取り組むアクセシビリティのはじめ方
masakiohsumi
0
150
不確実なソフトウェア開発におけるUXエンジニアの意義と役割
masakiohsumi
9
14k
デザインとエンジニアリングをつなぐコンポーネントの運用設計
masakiohsumi
6
9.5k
デザイナーとエンジニアの垣根を取り払う"デザインエンジニア"という考え方
masakiohsumi
7
4.5k
Other Decks in Design
See All in Design
Liquid Iron
mcduckyart
1
110
The Golden Whitney
ohtristanart
PRO
0
520
CMS管理画面のアクセシビリティ
magi1125
6
2k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
240
なぜプレイドにデザインエンジニアが必要だったのか?
t32k
0
510
エンジニアでも捗る デザイナー的思考入門
tinykitten
PRO
1
1.1k
【最新】マズロー安達の弟子実績(1期-4期の26人分)
maslow_akkun
0
280
harutaka Vision Deck
zenkigenforrecruit
0
140
Light My Fire/ハートに火をつけるコミュニティ
kgsi
1
130
ビジネス成果を最大限に発揮するPORTFOLIO
ataxi1003
0
190
Bulletproof Design System with TypeScript
takanorip
6
3.5k
Kid Cowboy 103
marilutwin
0
260
Featured
See All Featured
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
17
950
Thoughts on Productivity
jonyablonski
69
4.7k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.5k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Build The Right Thing And Hit Your Dates
maggiecrowley
36
2.8k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
How GitHub (no longer) Works
holman
314
140k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Testing 201, or: Great Expectations
jmmastey
42
7.6k
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