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

磨いて光らせるUI/UX

 磨いて光らせるUI/UX

UI/UXの背景や用語の解説です

yohei sugigami

March 24, 2014
Tweet

More Decks by yohei sugigami

Other Decks in Technology

Transcript

  1. ຏ͍ͯޫΒͤΔ
    69ೖ໳
    ʙϢʔβࢹ఺Ͱ69Λվળ͠Α͏ʂʙ

    View full-size slide

  2. ࣗݾ঺հ
    69%.1.
    J04%FW
    "EWJTPS

    View full-size slide

  3. ࠓճͷ69ͷ͓࿩͸
    Photo by: ioannis kounadeas

    View full-size slide

  4. ΞδΣϯμ
    69ͱ͸
    69ͷඞཁੑ
    69ͷվળख๏
    ·ͱΊ

    View full-size slide

  5. 69ͷҙຯͬͯ
    ஌ͬͯ·͔͢ʁ

    View full-size slide

  6. ͪΌΜͱఆٛ͸͋Δͷʁ

    View full-size slide

  7. 69ఏএऀʹΑΔࢲతఆٛ
    CZχʔϧηϯɾϊʔϚϯɾάϧʔϓ
    IUUQXXXOOHSPVQDPN

    View full-size slide

  8. %"ϊʔϚϯത࢜

    View full-size slide

  9. Ϡίϒɾχʔϧηϯത࢜

    View full-size slide

  10. IUUQXXXOOHSPVQDPNBSUJDMFTEFpOJUJPOVTFSFYQFSJFODF

    View full-size slide

  11. ސ٬ͷχʔζΛػೳతͳຬ଍ͷΈʹཹ·Βͣ
    Ϣʔβͷମݧʹ͓͚ΔتͼΛ΋ͨΒͨ͢Ίʹ
    ϓϩμΫτʹؔΘΔෳ਺ͷઐ໳෼໺͕
    ༥߹ͯ͠ఏڙ͢Δ
    1IPUPCZ+TPO8IJUUBLFS
    ʻཁ໿ʼ

    View full-size slide

  12. ϓϩμΫτͷ࢖༻ɾॴ༗ͳͲΛ௨ͯ͡
    ਓ͕ؒೝ஌͢Δ༗ҙٛͳମݧͷ͜ͱ
    ϓϩμΫτΛར༻͢Δաఔͷ඼࣭Λॏࢹ͠
    Ϣʔβʔͷਅʹ΍Γ͍ͨ͜ͱΛ
    ʮָ͘͠ʯʮ໘ന͘ʯʮ৺஍Α͘ʯ
    ʹߦ͑Δ఺ΛlఏڙՁ஋zͱͯ͠
    ߟ͑Δίϯηϓτ
    ʻ69ఆ֦ٛେղऍʼ

    View full-size slide

  13. *40
    &SHPOPNJDTPGIVNBOTZTUFNJOUFSBDUJPO
    1BSU)VNBODFOUSFEEFTJHOGPS
    JOUFSBDUJWFTZTUFNT

    View full-size slide


  14. ϓϩμΫτʹର͢Δ࢖༻͓Αͼ
    ࢖༻Λ༧૝ͨ࣌͠ͷ
    ਓͷ஌֮ͱ൓Ԡ
    ൈਮ*40ʢ*53ʹΑΔ࿨༁ʣ
    ࢖༻લɺ࢖༻தɺ࢖༻ޙʹൃੜ͢ΔɺϢʔβʔͷײ৘ɺ৴པΛؚΉ

    ϒϥϯυΠϝʔδɺݟͨ໨ɺػೳɺγεςϜɾύϑΥʔϚϯεͷ݁Ռ

    View full-size slide

  15. Apple͸։෧ͷମݧ͑͞΋
    UXͱͯ͠ߴΊ͍ͯΔ

    View full-size slide

  16. ͷ69Λத৺ʹ
    ࠓ೔͸

    View full-size slide

  17. σβΠϯʢઃܭʣͷแׅؔ܎
    8IP0XOT:PVS691IJMPTPQIZ
    ਓؒ޻ֶσβΠϯ
    69σβΠϯ
    ϢʔβϏϦςΟ
    6*
    σβΠϯ
    *"
    σβΠϯ
    ίϛϡχέʔγϣϯ
    σβΠϯ
    Ұ෦վม

    View full-size slide

  18. 69ͷཁૉΛ·ͱΊͨ
    ϋχΧϜߏ଄ਤ
    IUUQTFNBOUJDTUVEJPTDPNQVCMJDBUJPOTTFNBOUJDTQIQ

    View full-size slide

  19. ͳͥ69Λॏࢹ͢Δͷʁ

    View full-size slide

  20. QIPUPCZWJDUPSJBGVOFSBMTDPNBV
    ແ਺ͷϓϩμΫτ͕ϦϦʔε͞ΕΔ࣌୅

    ؀ڥมԽ

    ϓϩμΫτͱϢʔβͷ࣭ͷఈ্͛ʹΑΔՁ஋ͷมԽ
    ࠩผԽ
    ɹಠࣗੑͷߴ͍Ձ஋ఏڙͷඞཁੑ
    όΠϥϧੑ
    ɹײ৘ओମͷՁ஋ධՁʹΑΔߴ͍ݪಈྗ

    View full-size slide

  21. Ϣʔβ͕҉໧తʹ
    ٻΊ͍ͯΔՁ஋
    ؀ڥมԽ

    View full-size slide

  22. ࠩผԽ
    Ϣʔβͱڞʹ
    ங͖͋͛ΔಠࣗͷՁ஋
    QIPUPCZ$IJO-BX'JSNc3VTTFMM$IJO "UUPSOFZ

    View full-size slide

  23. QIPUPCZ5XJUUFS #JSE 8BMMQBQFST
    ੒௕ઓུͷཁ
    όΠϥϧੑ

    View full-size slide

  24. 69ͷվળख๏

    View full-size slide

  25. Ͳ͏΍ͬͯ69Λ
    ߴΊΔͷʁ

    View full-size slide

  26. ਓؒத৺ઃܭ )$%

    View full-size slide

  27. *40
    )VNBODFOUSFEEFTJHOJTBOBQQSPBDIUPJOUFSBDUJWF
    TZTUFNTEFWFMPQNFOUUIBUBJNTUPNBLFTZTUFNT
    VTBCMFBOEVTFGVMCZGPDVTJOHPOUIFVTFST UIFJSOFFET
    BOESFRVJSFNFOUT BOECZBQQMZJOHIVNBOGBDUPST
    FSHPOPNJDT BOEVTBCJMJUZLOPXMFEHFBOEUFDIOJRVFT

    View full-size slide

  28. ਓؒத৺ઃܭ͸ɺγεςϜΛ࢖͍΍͘͢࢖͍উखͷྑ
    ͍΋ͷʹ͢Δ͜ͱΛاਤͨ͠ΠϯλϥΫςΟϒγες
    Ϝ։ൃͷҰͭͷΞϓϩʔνͰ͋ΓɺϢʔβ΍ͦͷχʔ
    ζɺඞཁ৚݅ʹয఺Λ͋ͯɺਓؒ޻ֶ࿑ಇՊֶ΍Ϣʔ
    βϏϦςΟͷ஌ࣝ΍ٕ๏Λద༻͢Δ΋ͷͰ͋Δɻ
    ੿༁

    View full-size slide

  29. IUUQIDEXPSLTDPNBQQSPBDI
    ᶃϢʔβΛ஌Δ
    ཁٻ೺Ѳ
    ᶄϢʔβͷ͜ͱΛߟ͑Δ
    ཁٻ෼ੳ
    ᶅղܾࡦΛߟ͑Δ
    ཁٻઃܭ
    ᶆ࣮ࢪɾݕূ͢Δ
    ཁٻධՁ
    ਓؒத৺ઃܭͷ̐αΠΫϧ

    View full-size slide

  30. 1%$"
    IUUQKBXJLJQFEJBPSHXJLJ1%$"αΠΫϧ
    ඼࣭Ϛωδϝϯτ*40

    View full-size slide

  31. খ͞ͳ੒ޭମݧΛੵΈॏͶͯ
    େ͖ͳ໨ඪͷୡ੒ʹͭͳ͍͛ͯ͘
    IUUQXXXQUDBQEDBDPNQEDBIUN

    View full-size slide

  32. HCDϓϩηε
    IUUQXXXIDEOFUPSHIDEDPMVNOIDE@QIQ
    ਓؒத৺ઃܭਪਐػߏ

    View full-size slide

  33. ೺ѲΠϯλϏϡʔ

    View full-size slide

  34. ෼ੳϖϧιφγφϦΦ
    QIPUPCZOJTTBO

    View full-size slide

  35. ઃܭϓϩτλΠϓϫΠϠϑϨʔϜ
    IUUQXFSLTUBUUTFU[LBTUFO(SVQQF@TDSFFOEFTJHO@IUNM

    View full-size slide

  36. ධՁΞφϦςΟΫε

    View full-size slide

  37. ར༻Ͱ͖Δ͜ͱ
    ৴པग़དྷΔ͜ͱ
    ڞײͰ͖Δ͜ͱ
    ϋοϐʔͳ͜ͱ

    View full-size slide

  38. ·ͱΊ
    νʔϜΈΜͳͰ69ͷຊ࣭Λཧղ͠
    Ϣʔβͷࢹ఺Ͱܧଓతʹ69Λվળ͠Α͏
    Ϣʔβ͸αʔϏεɺϓϩμΫτͷՁ஋Λ
    69ͷྖҬʹ͓͍ͯٻΊ͍ͯΔ

    View full-size slide