Upgrade to Pro — share decks privately, control downloads, hide ads and more …

エラー処理のUIデザイン

2377be1c3f33751ea7c73a7bd8d58996?s=47 T. MOTOOKA
November 15, 2018

 エラー処理のUIデザイン

モバイルアプリのデザインをする上で、ついつい目を覆いがちな「エラー処理」。ここで気にするべき大事なこととは…

2377be1c3f33751ea7c73a7bd8d58996?s=128

T. MOTOOKA

November 15, 2018
Tweet

Transcript

  1. Τϥʔॲཧͷ 6*σβΠϯ CZ5.0500," .PCJMF"DU50,:0 https://mobileact.connpass.com/event/104870/

  2. "CPVUUIF4QFBLFS w 5.0500,"!U@NPUPPLB w $3.γεςϜͷίϯαϧɺडୗ։ൃɺӡ༻ɺFUDʜ w 8FC͹͔Γ w ඇˑੵۃ࠾༻தʢϦϞʔτɾ୹࣌ؒۈ຿ݶఆ࠾༻ʣ w

    .BDJ04ΞϓϦझຯ։ൃऀ w ࠷ۙ"OESPJE୺຤Λങͬͨʢ(JOHFSCSFBEҎདྷʣ w 47(1%'खඳ͖
  3. ओͨΔ࣮੷ͦͷ̍ "QQ4UPSFͰʮಥવͷࢮʯͰݕࡧŜŧŕ

  4. ओͨΔ࣮੷ͦͷ̎ https://booth.pm/ja/items/1049475 ʮ47(खඳ͖ຊʯ ςΩετΤσΟλͱϒϥ΢βͰ ॻ͚Δɾඳ͚Δ 47(

  5. ओͨΔ࣮੷ͦͷ̏ https://speakerdeck.com/motooka/mobairuapuritogdpr લճࢀՃ࣌ͷ ൃද಺༰ ˡ

  6. ຊ୊ Τϥʔॲཧͷ6*σβΠϯ

  7. ઌ݄͋ͬͨ൵͍͠ग़དྷࣄ w ๭ΫϨΧձࣾͷJ04ΞϓϦΛىಈ w ໊ࣾ΍ΞϓϦ໊͸࠙਌ձʹͯ w ىಈͯࣗ͠ಈͰϩάΠϯ͢Δ࢓૊Έ   w

    λΠϜΞ΢τ⏰ w *%ύεϫʔυೖྗը໘ʹҠಈ
  8. ύεϫʔυΛ ؒҧ͑ͨ༁Ͱ΋ͳ͍ͷʹʁ *%ύεϫʔυೖྗը໘ʹҠಈ

  9. ͡Ό͋ɺͲ͏ͨ͠Β͍͍ͷ w ύεϫʔυ࠶ೖྗͤͣͱ΋ϦτϥΠͰ͖Δ6* w ΋͠΋ຊ౰ʹύεϫʔυؒҧ͑ͯͨΒ࠶ೖྗͤ͞Δ6* w 8FC͔Βύεϫʔυมߋͨ͠ͱ͖ͱ͔ w ͦͷͨΊʹ͸❓ w

    Τϥʔ❗ͷݪҼ෼ੳ
  10. ϩάΠϯΤϥʔͷ ܏޲ͱରࡦ

  11. ͋Γ͕ͪΤϥʔͦͷ̍ w ύεϫʔυؒҧ͍ w ͜Ε͸࠶ೖྗͯ͠΋Β͍·͠ΐ͏ w *%ؒҧ͍ w ͜Ε΋࠶ೖྗ w

    ηΩϡϦςΟࣄ৘Ͱɺ18ؒҧ͍ʹॲཧΛ౷߹ w 8J'JP⒎ඈߦػϞʔυͦͷଞɺ௨৴ೳྗແ͠ w ʮग़௚͍ͯ͜͠řƄőşŐʯͱ͍͏BMFSUΛදࣔ
  12. ͋Γ͕ͪΤϥʔͦͷ̎ w ి೾͕ݍ֎ w Ұൠਓ͸ؾ෇͔ͣݍ֎ʹߦ͘ɻ w ࢲ΋ͦ͏͍͏৔ॴʹߦ͘ɻ w ͔ͩΒ༏͘͠ڭ͑ͯ͋͛Α͏ w

    )551ϦΫΤετ͕λΠϜΞ΢τ w ͜Ε΍΍͍͔͜͠ΒޙͰ
  13. ͋Γ͕ͪΤϥʔͦͷ̏ w αʔόଆॲཧதʹి࿩ண৴ͨ͠ΓΞϓϦ੾Γସ͑ͨΓ w ߟ͑ͨ͘΋ͳ͍ w αʔόଆॲཧதʹ୺຤ిݯஅ w ిݯͳΜ͍ͯͭͰ΋ࢮ͵ w

    ࣍ճىಈ࣌ɺద੾ͳεςʔτͰىಈͰ͖Δ͔ͳ0 w αʔόଆॲཧதʹݍ֎ͳͱ͜Ζ΁ w ޙड़͢ΔλΠϜΞ΢τͱݟ෼͚͕͔ͭͳ͍ w ϦτϥΠઓུ͸λΠϜΞ΢τͱಉ͡
  14. ϨΞ΋ͷΤϥʔͦͷ̍ w ໊લղܾͰ w λΠϜΞ΢τ w %/4తͳΤϥʔ w 5$16%1తͳΤϥʔ w

    શ෦ʮճઢࢮΜͰΜͰʯͱݴ͍͍ͨͱ͜Ζ w %/4ḉࢮ๢ͬͯ͜ͱ΋͋Δ
  15. ϨΞ΋ͷΤϥʔͦͷ̎ w 5$1*1ϋϯυγΣΠΫ໌ࣔతࣦഊʢ5$1345ʣ w αʔόো֐ͱ͔Ͱ͔͢Ͷ w ʮαʔϏεऴྃޙʯͱ͍͏ʢ͈́ w 5$1*1ϋϯυγΣΠΫதͷλΠϜΞ΢τʢແ"$,ʣ w

    ಉ্ w ϑΝΠΞ΢ΥʔϧͷઃఆϛεͷՄೳੑʜʂ
  16. ϨΞ΋ͷΤϥʔͦͷ̏ w 44-5-4ূ໌ॻΤϥʔ w .*5.߈ܸ w ௨৴ճઢͷ໰୊ͷՄೳੑͩͬͯ͋Δ w ʮαʔϏεऴྃޙʯͱ͍͏ʢ͈́ w

    ূ໌ॻݕূʹෆ۩߹͋Δͷ͸੬ऑੑ w 伴ަ׵ͷλΠϜΞ΢τ w ͜Ε͸αʔόো֐ͬΆ͍ΑͶ w αʔϏεऴྃޙɺͩͬͨΒԿͰ΋ىͤͦ͜͏͚ͩͲ
  17. ϨΞ΋ͷΤϥʔͦͷ̐ w )5513FRVFTUૹग़׬ྃલͷ5$1*1੾அ 5$1345  w ʢී௨ͷαʔό࣮૷ͳΒʣ·ͣॲཧͰ͖ͯͳ͍ΑͶ w ҋӢʹϦτϥΠͯ͠0,ͬΆ͍ w

    )5513FTQPOTFड৴։࢝ޙͷ5$1*1੾அ w গͳ͘ͱ΋TUBUVTMJOF·Ͱ͸ಡΊΔ͸ͣʜʂ w ಉ͡*%18Ͱ࠶ࢼߦ͢΂͖͔൱͔ɺΘ͔ΔΑͶʁ w TFTTJPOUPLFOΛ࠷ޙͷจࣈ·Ͱϩʔυ׬ྃʁ֬ೝʂ w ਖ਼ৗऴྃ࣌ͷ݁Ռ͸+40/౳Ͱฦ͢ΑΓ΋
 SFTQPOTFIFBEFSͰฦͨ͠ํ͕ڧ͍ΑͶ
  18. ϨΞ΋ͷΤϥʔͦͷ̑ w σʔλվ͟ΜΛ5-4ͷػߏͰݕ஌ w େମ.*5.߈ܸ͔ͳ w CJUೖΕସΘΓωοτϫʔΫ w )551ϔομσίʔυࣦഊ w

    αʔόϓϩηε్͕தͰࢮΜͩɺͱ͔ʁ w ྲྀੴʹ͜Ε͸ܹϨΞͰ͸ ϔομύέοτͰඈͿͬ͠ΐ  w )551SFTQPOTFCPEZH[JQσίʔυࣦഊ w ʢ͜ͳ͍ͩ࢓ࣄͰ͜ΕʹϋϚͬͨʣ w αʔόϓϩηε్͕தͰࢮΜͩɺͱ͔
  19. ϨΞ΋ͷΤϥʔͦͷ̒ w )551 w αʔϏεऴྃͯ͠Δʁʂ w αʔόଆσϓϩΠࣦഊͱ͔ʁ w )551 w

    ૹ৴ͨ͠ύέοτ͕վ͟Μ͞Εͨͱ͔ʁ w )551YY w ͜Ε͸໌֬ʹαʔόো֐ͩͶɻ w ϨΞ͚ͩͲ࠶ݱ΋ରॲ΋؆୯ w ͑ͬɺϨΞ͡Όͳ͍ɺͩͬͯʁʂ
  20. Ұ൪΍΍͍͜͠΍ͭ w )551ϦΫΤετૹग़׬ྃޙͷλΠϜΞ΢τ w αʔόଆͰ͸ॲཧ͕ਐΜͰΔ͔΋͠Εͳ͍ w ॲཧ͞Εͯͳ͍͔΋͠Εͳ͍ w ύεϫʔυؒҧ͑͗͢ϩοΫػߏ͕͋Δ৔߹ w

    ϩάΠϯࢼߦ͸ႈ౳ͳॲཧ͡Όͳ͍ʂ w ෆ҆ఆͳి೾؀ڥͰҰൃϩοΫͨ͠Βٽ͚Δ
  21. ͜Μͳදࣔ௒ΧοίΠΠ w ౰αʔϏε͸ऴ͍ྃͯ͠·͢ɻ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ w αʔόͷॲཧʹ͕͔͔͍࣌ؒͬͯΔΑ͏Ͱ͢ɻ w αʔϏεͰো֐͕ൃੜ͍ͯ͠ΔΑ͏Ͱ͢ɻ w ͓࢖͍ͷճઢͰ͸ਖ਼͘͠௨৴Ͱ͖ͳ͍Α͏Ͱ͢ɻ ˞ΧοίΠΠͷ͸ద੾ʹग़͠෼͚Ͱ͖ͯΔਓʹݶΔ


    ɹʢදࣔ͢Δ͚ͩͳΒ୭Ͱ΋Ͱ͖Δʣ
  22. ·ͱΊ w Τϥʔʹ͸୔ࢁͷछྨ͕͋Δ❤ w ͦΕͧΕɺϢʔβ͕औΔ΂͖ߦಈ͸ҧ͏͔΋ w Ϣʔβͷߦಈ͕ҟͳΔ΂͖ͳΒɺσβΠϯ΋ҟͳΔ΂͖ w ΤϥʔରॲͷσβΠϯͦ͜6*ઃܭͷΩϞ w

    ႈ౳ͳૢ࡞͔൱͔ʁ͸σβΠϯ޻ఔͰॏཁͳ֬ೝࣄ߲ w ΤϥʔݪҼΛ੾Γ෼͚Ͱ͖ͳ͍ʁ w ʮϥΠϒϥϦΤϥʔݪҼฦ͞ͳ͍ʯ͸؁͑ w ௿ϨϕϧͳੈքʹજΓࠐ΋͏ w ͜Ε͚ͩ୔ࢁߟ͑Δ͜ͱ͕͋Δ w ઃܭऀ>ɾ։ൃऀ?ڞʹߴ͍څ༩ΛٻΊΑ͏
  23. ࢀߟจݙ w ϞόΠϧΞϓϦͷΤϥʔʹͲ͏ରॲ͢Δ͔ w ͍·஻ͬͨ͜ͱͱࣅͨ࿩ʢεϥΠυ࡞ͬͨޙʹؾ෇͍ͨʣ https://goodpatch.com/blog/how-to-deal-with-application-error/ w 4XJGUͷΤϥʔ෼ྨ͕ૉ੖Β͗͢͠ΔͷͰΈΜͳʹ஌ͬͯ΄͍͠ w 4XJGUͷݴޠϨϕϧͰݟͨΤϥʔ෼ྨ

    https://qiita.com/koher/items/a7a12e7e18d2bb7d8c77 w "MFSUT7JFXTJ04)VNBO*OUFSGBDF(VJEFMJOFT w ੟ॻ https://developer.apple.com/design/human-interface-guidelines/ios/views/alerts/
  24. ࣭໰౳ ͋Ε͹

  25. ׬