࠷ѱͳ UX ʹରॲ͢Δؠखݝେɾձେ߹ಉ LT @6݄7
View Slide
$ whoami• @ktr_0731• u-aizu / s123• STEINS;GATE
;ͭ͏ͷformΛ͔͍͍ͭͨ by ·ͪ2http://hamachiya.com/form/
??
Ṗ 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 ͷΤϯυϙΠϯτʹμΠϨΫτͰ߈ܸ͞ΕΔ
ͪΐͬͱϢʔβઢͰߟ͑ΕͤʹͳΕΔ