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
最悪な UX に対処する
Search
ktr
June 07, 2017
Programming
0
690
最悪な UX に対処する
ktr
June 07, 2017
Tweet
Share
More Decks by ktr
See All by ktr
激動の一年を通じて見えてきた「技術でリードする」ということ
ktr_0731
8
9.5k
Monorepo における Go テストの差分実行 / Running Differential Go Tests in a Monorepo
ktr_0731
1
190
Designing libraries in Go way
ktr_0731
7
1.5k
Go Modules and Proxy Walkthrough
ktr_0731
8
27k
ソフトウェアの複雑さに立ち向かう技術 / Tackling software complexity
ktr_0731
0
210
Fuzzy finder as a Go library
ktr_0731
3
6k
つよくてニューゲーム / NewGame++
ktr_0731
0
1k
やはり俺の Go アプリケーション設計はまちがっている。 / My Go Application Design Is Wrong, As I Expected
ktr_0731
13
3.7k
GopherCon2018
ktr_0731
2
1.8k
Other Decks in Programming
See All in Programming
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
oukayuka
2
920
5つのアンチパターンから学ぶLT設計
narihara
1
160
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
nrslib
2
650
GraphRAGの仕組みまるわかり
tosuri13
8
530
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
o0h
PRO
1
250
レベル1の開発生産性向上に取り組む − 日々の作業の効率化・自動化を通じた改善活動
kesoji
0
120
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
nealle
1
9.1k
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
760
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
170
PipeCDのプラグイン化で目指すところ
warashi
1
270
Code as Context 〜 1にコードで 2にリンタ 34がなくて 5にルール? 〜
yodakeisuke
0
120
プロダクト志向ってなんなんだろうね
righttouch
PRO
0
180
Featured
See All Featured
How to Ace a Technical Interview
jacobian
277
23k
4 Signs Your Business is Dying
shpigford
184
22k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
A designer walks into a library…
pauljervisheath
207
24k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
730
The Cost Of JavaScript in 2023
addyosmani
51
8.5k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Building Applications with DynamoDB
mza
95
6.5k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
270
Transcript
࠷ѱͳ UX ʹରॲ͢Δ ؠखݝେɾձେ߹ಉ LT @6݄7
$ whoami • @ktr_0731 • u-aizu / s123 • STEINS;GATE
;ͭ͏ͷformΛ͔͍͍ͭͨ by ·ͪ2 http://hamachiya.com/form/
None
??
Ṗ select • ग़ੜෆৄͳਓͳΜ͍ͯΔͷ͔ʁ • 1902ੜ·ΕͷਓͳΜ͍ͯΔͷ͔ʁ
Ṗ select • ग़ੜෆৄͳਓͳΜ͍ͯΔͷ͔ʁ • 1902ੜ·ΕͷਓͳΜ͍ͯΔͷ͔ʁ • ؒҧ͍ͳ͘1996ੜ·ΕͷਓΑΓগͳ ͍
దͳΛσϑΥϧτҐஔ ʹͯ͋͛͠Α͏
ଞʹ৭ʑ͋Δ
ॅॴ༣ศ൪߸͔Βࣗಈੜ ͯ͋͛͠Α͏
લͷϖʔδʹ ͬͯ΄͘͠ͳ͍ͳΒ ΠϕϯτΛϋϯυϦϯά͢Δ
֯ɾશ֯ͷҧ͍ͷٵऩɹ αʔόαΠυͷࣄ
όϦσʔγϣϯ͍ͨ͠ͷ Ͱ͖Δ͚ͩϒϥβଆͰ ඇಉظʹνΣοΫ͢Δ
HTMLͷඪ४ͷόϦσʔγϣ ϯར༻͠Α͏
input λάͷ type ଐੑ • password • date • email
• number • …
input λάͷ type ଐੑ • password • date • email
• number • … MDN Έͯ
ΦϨΦϨڍಈΛͭ͘Βͳ͍
νϟοτΞϓϦͷྫ • վߦ Enter or CTRL + Enter ? •
Slack (Mobile)ɺLINEɺetc. • Slack (Desktop)
νϟοτΞϓϦͷྫ • վߦ Enter or CTRL + Enter ? •
Slack (Mobile)ɺMessangerɺLINEɺetc. • Slack (Desktop)
iOS ͱ Android ͷ UI ҧ͏
iOS ͱ Android ͷ UI ҧ͏ → Android Ͱ iOS
ͷ UI Λ ͏ͱҧײΛײ͡Δ
ηΩϡϦςΟతʹ ͍͚ͬͯͳ͍͜ͱ͋Δ
idɺύεϫʔυͷ ͲͪΒ͕ؒҧ͍ͬͯΔ͔ͷදࣔ
idɺύεϫʔυͷ ͲͪΒ͕ؒҧ͍ͬͯΔ͔ͷදࣔ → ΫϥοΧʔʹώϯτΛ༩͑ͯ͠· ͏
ϑΥʔϜͷηογϣϯΛཧ ͠ͳ͍
ϑΥʔϜͷηογϣϯΛཧ ͠ͳ͍ → CSRF ͞Γ·͘Δ
ΫϥΠΞϯταΠυ only ͷ όϦσʔγϣϯ → API ͷΤϯυϙΠϯτʹμΠϨΫ τͰ߈ܸ͞ΕΔ
ͪΐͬͱϢʔβઢͰ ߟ͑ΕͤʹͳΕΔ