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
スーパーマリオRPGのリメイク版の変更点からみるUX
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
にしはら
September 06, 2024
Technology
1.1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
スーパーマリオRPGのリメイク版の変更点からみるUX
スーパーマリオRPGの新旧を比較し、UXの変化を考察します
にしはら
September 06, 2024
More Decks by にしはら
See All by にしはら
個人でデジタル庁の デザインシステムをVue.jsで 作っている話
nishiharatsubasa
3
6.4k
速くて安いWebサイトを作る
nishiharatsubasa
21
19k
defineModelを使って気軽にコンポーネントのv-modelをやろう
nishiharatsubasa
3
1.6k
2023 CSS
nishiharatsubasa
7
4.9k
vue_component_from_composable
nishiharatsubasa
2
740
エルデンリングに学ぶ道に迷わないUIと世界観
nishiharatsubasa
0
1.6k
HTMLとCSSだけでつくるリアルな絵 / How to make a realistic picture only HTML and CSS
nishiharatsubasa
2
7.3k
Other Decks in Technology
See All in Technology
“全部コピーしない”ファイルデータの活用 : — FSx for ONTAP × S3 Tables × Icebergで作るメタデータカタログ
yoshiki0705
0
410
Why is RC4 still being used?
tamaiyutaro
0
290
AWS Summit 2026で見えたSIerにとっての Amazon Quickの位置づけ
maf_0521
0
160
記録をかんたんに、提案をパーソナルに ── AIであすけんが目指すもの
oprstchn
0
140
cccccc
moznion
0
1.7k
CSに"SLO"は要らない、経営層に"99.9%"は伝わらない - SREを全社に"翻訳"する3原則
cscengineer
PRO
0
740
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
8.3k
Hatena Engineer Seminar 37 jj1uzh
jj1uzh
0
420
勉強会企画をアプリで構造化してみた 〜そこで見えた、AIとの付き合い方〜 / I've structured a study group plan using an app.
pauli
0
310
End-to-Endで考える信頼性 —LINEアプリにおけるクライアント開発×SRE連携の実践
maruloop
1
230
AIに「使われる」時代のSaaS戦略 〜既存WebAPIのMCPサーバー化における開発ノウハウ〜
ekispert_api
0
290
インフラ寄りSREでも 開発に踏み出せる〜境界を越えてユーザー体験に向き合いたい〜
sansantech
PRO
0
330
Featured
See All Featured
The untapped power of vector embeddings
frankvandijk
2
1.8k
Code Reviewing Like a Champion
maltzj
528
40k
How to Think Like a Performance Engineer
csswizardry
28
2.7k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
180
SEO for Brand Visibility & Recognition
aleyda
0
4.6k
So, you think you're a good person
axbom
PRO
2
2.1k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
150
Testing 201, or: Great Expectations
jmmastey
46
8.2k
Claude Code のすすめ
schroneko
67
230k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.6k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.2k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
360
Transcript
εʔύʔϚϦΦRPGͷ ϦϝΠΫ൛ͷมߋ͔ΒΈΔUX εʔύʔϚϦΦRPGͷ ϦϝΠΫ൛ͷมߋ͔ΒΈΔUX DIST.45 ʮήʔϜ͔ΒֶͿ UXʯ
ݪ ཌྷ גࣜձࣾ ICS ϑϩϯτΤϯυΤϯδχΞ @crayfisher_zari
Λ͞·͟·ͳܗࣜͷจࣈྻʹʂ toLocaleString()ΛͬͯεϚʔτʹม͠Α͏ has() ٙࣅΫϥεͰίʔσΟϯά͕มΘΔʂ CSS ࠷৽ελΠϦϯά https://ics.media/entry/240808/ https://ics.media/entry/240529/ ICS MEDIAͰهࣄΛॻ͍͍ͯ·͢
NEW !
ɾεʔύʔϚϦΦRPGʹ͍ͭͯ ɾൺֱ͠Α͏ͱࢥ͖͔͚ͬͨͬ ɾϦϝΠΫ൛ͰมԽ͔ͨ͠ΒΈΔUXߟ ɾWebʹԠ༻Ͱ͖Δ ࠓ͓͢Δ͜ͱ
εʔύʔϚϦΦ RPG ʹ͍ͭͯ
εʔύʔϚϦΦ RPG 1996ൃചͷεʔύʔ ϑΝϛίϯ༻ιϑτ ޙͷϚϦΦετʔϦʔϖʔύʔϚϦΦγϦʔζͱଓ͘ ϚϦΦγϦʔζͰॳͱͳΔRPG ఱಊͱεΫΣΞʢݱɿεΫΣΞɾΤχοΫεʣ͕ λοάΛΜͰ࣌ΛݺΜͩ BGM ߴ͘ධՁ͞Ε͍ͯΔ
͜ͷϦϝΠΫ൛͕ 2023ʹൃച͞Εͨ
ετʔϦʔ ͞ΒΘΕͨϐʔνඣΛॿ͚ΔͨΊɺ͍ͭͷΑ͏ʹΫούͱ͔͍ઓ͏ϚϦΦ ΫούΛ͠ϐʔνͱͷ࠶։ଋͷؒɺڊେͳ͕ಥવΫούʹಥ͖͞Γɺ ̏ਓͪΓͫΓʹඈ͞Εͯ͠·͏ʜ ͓͓͖ͳͷۄͷʮΧδΦʔʯਓʑͷئ͍ࣄΛ͑ΔʮελʔϩʔυʯΛഁյ͠ɺ ثʹΑΔࢧΛͨ͘ΒΜͰ͍ͨ ٽ͖ͷࣗশΧΤϧͷϚϩɺελʔϩʔυ͔Βͷऀδʔϊɺ॓ແ͠ͱͳͬͨΫούɺ ͓ͦͯ͠ͼͰݥʹͰΔϐʔνͱͱʹੈքΛٹ͏ͨΊʹϚϦΦ্ཱ͕͕ͪΔ
ൺֱ͠Α͏ͱࢥ͖͔͚ͬͨͬ
ൺֱ͠Α͏ͱࢥ͖͔͚ͬͨͬ খֶੜ࣌Λࢥ͍ग़͠ͳ͕ΒϓϨΠ͍ͯ͠Δͱ ৽͘͠Ճ͞ΕͨཁૉҎ֎ʹมΘ͍ͬͯΔʹؾ͍ͮͨ چ࡞Λ΄΅౿ऻ͍ͯ͠Δࠓ࡞ͰมΘ͕ͬͨ͋Δͱ͢Ε ͦ͜ࠓ͔ͩΒͰ͖ΔΑ͏ʹͳͬͨվળͳͷͰͳ͍͔ͱࢥͬͨ ˞વͳ͕ΒɺΖ͏ʹ࣌ͷٕज़ϦιʔεͰෆՄೳͩͬͨ͜ͱ͋Δͱࢥ͍·͢
ϦϝΠΫ൛ʹ͓͚ΔUI/UXͷมԽ
ήʔϜγεςϜมߋʹ͏෦ࠓճର֎ͱ͠·ͨ͠ ˞͢Ͱʹ๚Εͨ͜ͱͷ͋ΔॴʹϫʔϓͰ͖Δػೳ ɾઓಆίϚϯυૢ࡞ͷҰ؏ੑ ɾઓಆΞΫγϣϯͷλΠϛϯάɺఢͷऑͷ໌ࣔతදࣔ ɾϝχϡʔը໘ͷมԽ ɾऔΓฦ͠ͷ͔ͭͳ͍ཁૉͷରԠ ɾΦʔτηʔϒͱϑΝ εττϥϕϧ˞ ϦϝΠΫ൛ͰมԽͨ͠
ઓಆίϚϯυૢ࡞ͷҰ؏ੑ
ઓಆίϚϯυૢ࡞ͷҰ؏ੑ ઓಆ࣌ A B X Y ͔ΒίϚϯυΛબ͠ɺ ͦͷத͔Β͞ΒʹίϚϯυΛબͿ͜ͱͰ λʔϯͷߦಈΛ࣮ߦ͢Δ چ࡞Ͱ
AͰ߈ܸΛબΜͩΒAϘλϯ͕ܾఆɺ XͰΞΠςϜΛબΜͩΒXϘλϯ͕ܾఆͩͬͨ ϦϝΠΫ൛ͰܾఆϘλϯҰ؏ͯ͠A Ϙλϯͱͳͬͨ ʢઃఆ͔Βچ࡞༷ʹมߋͰ͖Δʣ
ɾ ʮܾఆʯͱ͍͏ߦҝʹରͯ͠ૢ࡞Λ౷Ұ͠ɺϓϨΠϠʔͷࠞཚΛ͙ ɾ࣌ؒ࣠ͱ͍͏Ұ؏ੑʹରͯ͠چ࡞༷ʹมߋͰ͖Δ ʢ׳Ε͠Μͩૢ࡞Λҡ࣋Ͱ͖Δʣ ૢ࡞ͷҰ؏ੑͷϙΠϯτ
ઓಆΞΫγϣϯλΠϛϯάͷ໌ࣔతදࣔ
ઓಆΞΫγϣϯλΠϛϯάͷ ໌ࣔతදࣔ ઓಆ࣌ʹλΠϛϯάΑ͘ϘλϯΛԡ͢ͱ ߈ܸμϝʔδΛ૿Ճͤͨ͞ΓɺඃμϝʔδΛݮΒͤΔ νϡʔτϦΞϧͰͦͷػೳΛڭ͑ͯ͘ΕΔ͕ɺ چ࡞ͰͦͷλΠϛϯά໌ࣔ͞Εͳ͍ ͔ͦ͠ͷλΠϛϯάث૬खͷ߈ܸʹΑΔ ϦϝΠΫ൛ͰͦͷλΠϛϯά͕໌ࣔతʹදࣔ͞ΕΔ
ઓಆΞΫγϣϯλΠϛϯάͷ ໌ࣔతදࣔ ઓಆ࣌ʹλΠϛϯάΑ͘ϘλϯΛԡ͢ͱ ߈ܸμϝʔδΛ૿Ճͤͨ͞ΓɺඃμϝʔδΛݮΒͤΔ νϡʔτϦΞϧͰͦͷػೳΛڭ͑ͯ͘ΕΔ͕ɺ چ࡞ͰͦͷλΠϛϯά໌ࣔ͞Εͳ͍ ͔ͦ͠ͷλΠϛϯάث૬खͷ߈ܸʹΑΔ ϦϝΠΫ൛ͰͦͷλΠϛϯά͕໌ࣔతʹදࣔ͞ΕΔ
ઓಆΞΫγϣϯλΠϛϯάͷ ໌ࣔతදࣔ ׳ΕͯλΠϛϯάΑ͘ԡͤΔΑ͏ʹͳΔͱ දࣔ͠ͳ͘ͳΔ ͦͷޙɺԿ͕ࣦഊ͍ͯ͠Δͱ·ͨग़ͯ͘ΔΑ͏ʹͳΔ ΄͔ʹޚෆՄͷ߈ܸ໌ࣔ͢ΔΑ͏ʹͳͬͨ ఢͷ໊ٕ͕දࣔ͞ΕΔͷ֓ͶޚෆՄ͕ͩɺ ྫ֎νϥϗϥ͋ΔͷͰ͔ͬͨ͠
ऑͷ໌ࣔతදࣔ
ऑͷ໌ࣔతදࣔ ऑଐੑͷ߈ܸΛ༩͑Δͱʮ͡Όͯ͘Μʯͱ දࣔ͞ΕΔΑ͏ʹͳͬͨ چ࡞Ͱ͜ͷද͕ࣔͳ͍ͨΊɺ ऑ͔Ͳ͏͔͔Βͳ͔ͬͨ Ұ෦ͷϘεڃͷఢԠ͕͋Δ͜ͱ͋Δ͕ ਪͯ͠ਤΔ͔͠ͳ͍
ऑͷ໌ࣔతදࣔ ऑଐੑͷ߈ܸΛ༩͑Δͱʮ͡Όͯ͘Μʯͱ දࣔ͞ΕΔΑ͏ʹͳͬͨ چ࡞Ͱ͜ͷද͕ࣔͳ͍ͨΊɺ ऑ͔Ͳ͏͔͔Βͳ͔ͬͨ Ұ෦ͷϘεڃͷఢԠ͕͋Δ͜ͱ͋Δ͕ ਪͯ͠ਤΔ͔͠ͳ͔ͬͨ
ɾΞΫγϣϯ͕Մೳ / ෆՄೳͰ͋Δ͜ͱΛ໌ࣔ͢Δ͜ͱͰ ϓϨΠϠʔͷೝෛՙΛԼ͛Δ ɾ׳ΕͨϓϨΠϠʔʹରͯ͠దͳλΠϛϯάͰ߇͑Δ ໌ࣔతදࣔͷϙΠϯτ
ϝχϡʔͷը໘มԽ
ϝχϡʔը໘ͷมԽ ϦϝΠΫͰେ͖͘UI͕มΘͬͨͷϝχϡʔը໘ چ࡞ϝχϡʔ͕߲Λબ͔ͯ͠Β ৄࡉը໘ʹ͍͍͕ͬͯͨɺ ϦϝΠΫ൛ UI ͕ೋׂ͞Ε ը໘Γସ͑ͳ͠ʹϝχϡʔͷৄࡉը໘͕දࣔ͞ΕΔ εϜʔζͳૢ࡞ମݧ͕࣮ݱͰ͖ΔΑ͏ʹͳͬͨ
ϝχϡʔը໘ͷมԽ ϦϝΠΫͰେ͖͘UI͕มΘͬͨͷϝχϡʔը໘ چ࡞ϝχϡʔ͕߲Λબ͔ͯ͠Β ৄࡉը໘ʹ͍͍͕ͬͯͨɺ ϦϝΠΫ൛ UI ͕ೋׂ͞Ε ը໘Γସ͑ͳ͠ʹϝχϡʔͷৄࡉը໘͕දࣔ͞ΕΔ εϜʔζͳૢ࡞ମݧ͕࣮ݱͰ͖ΔΑ͏ʹͳͬͨ
ɾը໘Γସ͑Λ͞·ͳ͍ͷͰεϜʔζͳભҠମݧ͕Մೳʹͳͬͨ ɾ࣮ݱʹٕज़্େ͖͍ ϝχϡʔը໘ͷมԽͷϙΠϯτ
औΓฦ͠ͷ͔ͭͳ͍ཁૉͷରԠ
औΓฦ͠ͷ͔ͭͳ͍ ཁૉͷରԠ Ӆ͠ๅശͱ͍͏Ӆ͞Εͨๅശ͕֤ʹ͋Δ ʢΓ͜Έཁૉͷ̍ͭʣ چ࡞Ωϊίʹ͋Δ͜ͷๅശʹॳΊͯ๚Εͨͱ͖ Ҋ͢ΔΩϊϐΦͷ಄ʹ͍͔ͬͯͳ͍ͱऔΕͳ͍ ϦϝΠΫ൛Ͱॳճ๚࣌Ҏ֎ʹऔΕΔΑ͏ʹͳͬͨ ˞ͦͷ΄͔ɺ ʮߦ͚Δײʯͷ͋ΔσβΠϯʹมߋ͞Εͨ
ɾқ͕ߴ͍͜ͱͱཧෆਚͰ͋Δ͜ͱͷ ɾࣄલʹ͍ͬͯͳ͍ݶΓରԠͰ͖ͳ͍Γ͜Έཁૉ ཧෆਚʹͳΔՄೳੑʢʹήʔϜϦηο τ͔͠ͳ͍ʣ औΓฦ͠ͷ͔ͭͳ͍ཁૉͷରԠͷϙΠϯτ
ΦʔτηʔϒͱϑΝετ τϥϕϧ
Φʔτηʔϒͱ ϑΝ εττϥϕϧ ϦϝΠΫ൛ͰΦʔτηʔϒͱϑΝ εττϥϕϧ͕ ར༻Ͱ͖ΔΑ͏ʹͳͬͨ ैདྷͷηʔϒϒϩοΫʹΑΔҙλΠϛϯάͷ ηʔϒՄೳ ϑΝ εττϥϕϧػೳՃ͞ΕͨͷͰɺ
μϯδϣϯͰ͙͢ʹϫʔϧυϚοϓҠಈͰ͖Δ
Φʔτηʔϒͱ ϑΝ εττϥϕϧ ϦϝΠΫ൛ͰΦʔτηʔϒͱϑΝ εττϥϕϧ͕ ར༻Ͱ͖ΔΑ͏ʹͳͬͨ ैདྷͷηʔϒϒϩοΫʹΑΔҙλΠϛϯάͷ ηʔϒՄೳ ϑΝ εττϥϕϧػೳՃ͞ΕͨͷͰɺ
μϯδϣϯͰ͙͢ʹϫʔϧυϚοϓҠಈͰ͖Δ
ɾλΠϛϯάΛؾʹͤͣήʔϜΛதஅͰ͖ΔΑ͏ʹͳͬͨ ʮૣ͘ Ίͳ͍͞ʯ ʮηʔϒϙΠϯτ·Ͱ ʂʯͱ͍͏ΓͱΓݮΔ ʢʁʣ ॆిΕͱ͍ͬͨಥൃతͳήʔϜதஅʹରԠͰ͖Δ ɾΦʔτηʔϒऔΓฦ͠ͷ͔ͭͳ͍ཁૉʹରͯ͠γϏΞʹͳΔ ɾϑΝ εττϥϕϧ͕͋ΔͷͰμϯδϣϯΛΔແବͳҠಈΛݮΒͤΔ
ΦʔτηʔϒͱϑΝ εττϥϕϧͷϙΠϯτ
WebʹԠ༻Ͱ͖Δͱ͜Ζ
ɾࣄલʹ͍ͬͯͳ͍ݶΓରԠͰ͖ͳ͍ ɾը໘Γସ͑Λ͞·ͳ͍ͷͰεϜʔζͳભҠʹͳͬͨࢥߟதஅ͠ͳ͍ ɾλΠϛϯάΛؾʹͤͣήʔϜΛதஅͰ͖ΔΑ͏ʹͳͬͨ ɾΞΫγϣϯ͕Մೳ / ෆՄೳͰ͋Δ͜ͱΛ໌ࣔ͢Δ͜ͱͰ ϓϨΠϠʔͷೝෛՙΛԼ͛Δ ɾ ʮܾఆʯͱ͍͏ߦҝʹରͯ͠ૢ࡞Λ౷Ұ͠ɺ ϢʔβʔͷෛՙΛݮΒ͢
ɾ࣌ؒ࣠ͱ͍͏Ұ؏ੑʹରͯ͠چ࡞༷ʹมߋͰ͖Δ ʢ׳Ε͠Μͩૢ࡞Λҡ࣋Ͱ͖Δʣ ɾϑΝ εττϥϕϧ͕͋ΔͷͰμϯδϣϯΛΔແବͳҠಈΛݮΒͤΔ ɾ׳ΕͨϓϨΠϠʔʹରͯ͠దͳλΠϛϯάͰ߇͑Δ
ɾࣄલʹ͍ͬͯͳ͍ݶΓରԠͰ͖ͳ͍ ɾը໘Γସ͑Λ͞·ͳ͍ͷͰεϜʔζͳભҠʹͳͬͨࢥߟதஅ͠ͳ͍ ɾλΠϛϯάΛؾʹͤͣήʔϜΛதஅͰ͖ΔΑ͏ʹͳͬͨ ɾΞΫγϣϯ͕Մೳ / ෆՄೳͰ͋Δ͜ͱΛ໌ࣔ͢Δ͜ͱͰ ϓϨΠϠʔͷೝෛՙΛԼ͛Δ ɾ ʮܾఆʯͱ͍͏ߦҝʹରͯ͠ૢ࡞Λ౷Ұ͠ɺ ϢʔβʔͷෛՙΛݮΒ͢
ɾ࣌ؒ࣠ͱ͍͏Ұ؏ੑʹରͯ͠چ࡞༷ʹมߋͰ͖Δ ʢ׳Ε͠Μͩૢ࡞Λҡ࣋Ͱ͖Δʣ ɾϑΝ εττϥϕϧ͕͋ΔͷͰμϯδϣϯΛΔແବͳҠಈΛݮΒͤΔ ɾ׳ΕͨϓϨΠϠʔʹରͯ͠దͳλΠϛϯάͰ߇͑Δ WebͰେࣄ
ɾ ʮܾఆʯͱ͍͏ߦҝʹରͯ͠ૢ࡞Λ౷Ұ͠ɺϢʔβʔͷෛՙΛݮΒ͢ ˠઃఆͷมߋ͕ଈ࠲ʹө͞ΕΔͷ͔อଘϘλϯΛԡ͢ͱө͞ΕΔͷ͔ɺαʔϏεͰ౷Ұ͢Δ ɾ࣌ؒ࣠ͱ͍͏Ұ؏ੑʹରͯ͠چ࡞༷ʹมߋͰ͖Δ ˠΞοϓσʔτͰૢ࡞͕มߋʹͳͬͯچ༷Ͱૢ࡞Ͱ͖Δ ɾΞΫγϣϯ͕Մೳ / ෆՄೳͰ͋Δ͜ͱΛ໌ࣔ͢Δ͜ͱͰϓϨΠϠʔͷೝෛՙΛԼ͛Δ ˠૢ࡞ՄೳɾෆՄೳͳͷΛݟͨ +
ࢧԉٕज़ʹରͯ͠໌ࣔ͢Δ ɾ׳ΕͨϓϨΠϠʔʹରͯ͠దͳλΠϛϯάͰ߇͑Δ ˠ׳ΕͨϢʔβʔʹରͯ͠աͳ͓ΒͤΛݮΒ͢
ɾը໘Γସ͑Λ͞·ͳ͍ͷͰεϜʔζͳભҠʹͳͬͨࢥߟதஅ͠ͳ͍ ˠඇಉظॲཧͳͲΛ׆༻ͯ͠εϜʔζͳॲཧભҠΛ৺͕͚Δ ɾࣄલʹ͍ͬͯͳ͍ݶΓରԠͰ͖ͳ͍ ˠࣄલʹใʹΞΫηεͰ͖ΔΈόοΫΞοϓͷ֬อ ɾλΠϛϯάؾʹͤͣήʔϜΛதஅͰ͖ΔΑ͏ʹͳͬͨ ˠ͍ϑΥʔϜͳͲҙͷλΠϛϯάͰอଘͰ͖ɺҙਤ͠ͳ͍௨৴அ࣌ʹରԠͰ͖Δ ɾϑΝ εττϥϕϧ͕͋ΔͷͰμϯδϣϯΛΔແବͳҠಈΛݮΒͤΔ ˠखؒͳ͘رͷϖʔδʹҠಈͰ͖ΔΑ͏ͳಈઢܭը
·ͱΊ
ɾϦϝΠΫଓฤͰมߋʹͳͬͨՕॴUI/UXͷมߋͰ͋Δ ͦ͜ʹண͢Δͱ໘ന͍ൃݟ͕͋Δ͔͠Εͳ͍ ɾϓϨΠϠʔͷମݧ͕ϝΠϯͰ͋ΔήʔϜҰͷ͕͋Δ WebσβΠϯʹԠ༻Ͱ͖ΔϙΠϯτ͕ͨ͘͞Μ͋Δ ·ͱΊ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ ICS ͰϑϩϯτΤϯυΤϯδχΞΛืूத https://ics-web.jp/recruit/