フィジカルインタラクションデザイン -センサーからデバイス連携まで、ブラウザの外のインタラクションデザインのコツ-

D073005d3e2917b69b5138b055d7597b?s=47 024t910
November 07, 2016

フィジカルインタラクションデザイン -センサーからデバイス連携まで、ブラウザの外のインタラクションデザインのコツ-

マートフォンの進化により、どんどんと扱えるセンサーの値が増えてきました。
このセッションでは、センサーを使った作例を通して、フィジカルインタラクションデザインの勘所を解説していきます。

D073005d3e2917b69b5138b055d7597b?s=128

024t910

November 07, 2016
Tweet

Transcript

  1. ϑΟδΧϧΠϯλϥΫγϣϯσβΠϯ ηϯαʔ͔ΒσόΠε࿈ܞ·Ͱɺϒϥ΢βͷ֎ͷΠϯλϥΫγϣϯσβΠϯͷίπ  Δେ੢୓ਓ

  2. େ੢୓ਓ ೥ɺΔגࣜձࣾΛઃཱɻؔ੢͓Αͼ౦ژͷ اۀސ٬ʹ޲͚ͨɺεϚʔτϑΥϯΞϓϦͷ։ൃɺ ϝʔΧʔలࣔձ޲͚ͷίϯςϯπ੡࡞ɺ8&#αʔ Ϗεͷ։ൃɺ੡඼ࢼ࡞඼ͷ։ൃͳͲΛडୗۀ຿Λ த৺ʹߦ͍ͬͯΔɻ ΠϯελϨʔγϣϯͷษڧɺ੍࡞ίϛϡχςΟʮΠ ϯελ෦ʯΛӡӦ͢Δ΄͔ɺࣗ਎Ͱ΋ϓϥΠϕʔ τϫʔΫΛاըɾ੍࡞͍ͯ͠Δɻ ژ౎ਫ਼՚େֶඇৗۈߨࢣɻ

  3. Δͱ͸ ೥݄ઃཱɻؔ੢͓Αͼ౦ژͷاۀސ٬ʹ޲͚ͨɺεϚʔ τϑΥϯΞϓϦͷ։ൃɺϝʔΧʔలࣔձ޲͚ͷίϯςϯπ੡ ࡞ɺ8&#αʔϏεͷ։ൃɺ੡඼ࢼ࡞඼ͷ։ൃͳͲΛडୗۀ຿ Λத৺ʹߦ͍ͬͯΔɻ

  4. εϚʔτϑΥϯʹ౥ࡌ͞Ε͍ͯΔηϯαʔ w ࣠Ճ଎౓ηϯαʔ w ࣠δϟΠϩηϯαʔ w ࣓ؾηϯαʔʢίϯύεʣ w (14ηϯαʔ w

    #MVFUPPUIϞδϡʔϧ w ۙ઀ηϯαʔ w ؾѹηϯαʔ w λονσΟεϓϨΠ
 λονྖҬ
 Ϛϧνλον
 λονڧ౓ w ϚΠΫ w Χϝϥ ˞J1IPOFJ04Λج४ͱͨ͠σʔλͰ͢ɻ
  5. ϒϥ΢β͔Β௚઀ར༻Ͱ͖Δηϯαʔ w ࣠Ճ଎౓ηϯαʔ w ࣠δϟΠϩηϯαʔ w ࣓ؾηϯαʔʢίϯύεʣ w (14ηϯαʔ w

    #MVFUPPUIϞδϡʔϧ w ۙ઀ηϯαʔ w ؾѹηϯαʔ w λονσΟεϓϨΠ
 λονྖҬ
 Ϛϧνλον
 λονڧ౓ w ϚΠΫ w Χϝϥ ˞J1IPOFJ04Λج४ͱͨ͠σʔλͰ͢ɻ
  6. ࠓճ͸ w ࣠Ճ଎౓ηϯαʔ w ࣠δϟΠϩηϯαʔ ʹߜΓɺ͜ͷͭΛͲ͏΍ͬͯ࢖͍౗͔͢Λߟ͑Δɻ ͦΜͳηογϣϯͰ͢ɻ

  7. ࣠Ճ଎౓ηϯαʔ εϚϗͷ9:;࣠ͷ௚ઢํ޲ʹ޲͔ͬͯͷՃ଎౓ΛऔಘͰ͖Δɻ

  8. ࣠δϟΠϩηϯαʔ εϚϗͷ9:;࣠ͷճసʢͻͶΓʣͷ֯଎౓ΛऔಘͰ͖Δɻ

  9. Ճ଎౓ηϯαʔͷ෼ੳํ๏ w ఺ͰݟΔ w ॠؒతͳ༳Ε΍িܸ w ࢟੎ͷݕग़ w ظؒͰݟΔ w

    ूੵͨ͠஋ΛݟΔ w ฏۉ஋ͰݟΔ w ࠷େ஋࠷খ஋ͰݟΔ w ೾ܗͰݟΔ w प೾਺ղੳΛߦ͏ w ૬ؔ܎਺Ͱࣅͨܗ͔Ͳ ͏͔Λ֬ೝ͢Δ w ػցֶशͰҟৗݕ஌
  10. δϟΠϩηϯαʔͷ෼ੳํ๏ w ఺ͰݟΔ w ॠؒతͳ༳Ε΍িܸ w ࢟੎ͷݕग़ w ظؒͰݟΔ w

    ूੵͨ͠஋ΛݟΔ w ฏۉ஋ͰݟΔ w ࠷େ஋࠷খ஋ͰݟΔ w ೾ܗͰݟΔ w प೾਺ղੳΛߦ͏ w ૬ؔ܎਺Ͱࣅͨܗ͔Ͳ ͏͔Λ֬ೝ͢Δ w ػցֶशͰҟৗݕ஌ w ΫΦʔλχΦϯʹม׵
  11. ηϯαʔΛ࢖ͬͨ ΠϯλϥΫγϣϯσβΠϯͷಛ௃ εϚϗΛ࣋ͭखͷಈ͖͕௚઀࿈ಈ͢ΔͷͰɺ গͳ͍ΠϯετϥΫγϣϯͰ ϢʔβʔΞΫγϣϯΛଅ͢͜ͱ͕Ͱ͖Δɻ

  12. ηϯαʔͷར༻ํ๏ͷ෼ྨ w ೳಈܕ
 ͦͷΠϯλϥΫγϣϯΛ໨తʹϢʔβʔ͕ΞΫγϣϯΛߦ͏ɻήʔ Ϝ΍ΤϯλʔςΠϯϝϯτܥʹ޲͘ɻ w ෇Ճܕ
 ඞਢͰ͸ͳ͍͕ɺͦͷΠϯλϥΫγϣϯΛߦ͏͜ͱͰΑΓศརͩͬ ͨΓɺָ͘͠ͳͬͨΓ͢Δɻπʔϧ΍ϢʔςΟϦςΟɺΤϯλϝ޲͚ w

    જࡏܕ
 Ϣʔβʔ͸ΠϯλϥΫγϣϯΛҙࣝͤͣɺࣗಈͰηϯαʔ͕ঢ়ଶΛऔ ಘ͢Δɻ
  13. ೳಈܕͷྫ w ͓΋ͪΌ෩XFCΞϓϦ
 εϚϗΛৼΔͱԻ͕ͳΔɻ w δϟΠϩΛήʔϜίϯτϩʔϥʔʹ
 ୺຤ͷ܏͖ͰϘʔϧΛస͕͢ήʔϜ

  14. ෇Ճܕͷྫ w ύϊϥϚXFCαΠτ
 ௨ৗͷXFCαΠτͷഎܠʹύϊϥϚը૾Λઃஔ w ը໘Λৼͬͯૢ࡞ΛΩϟϯηϧ


  15. જࡏܕͷྫ w า͖εϚϗېࢭϓϥάΠϯ w ར༻ऀͷ؀ڥ৘ใΛऩूʢӾཡதͷ࢟੎΍า͖εϚϗதɺͳ ͕ΒεϚϗͳͲʣ

  16. ϒϥ΢βͷ࿮૊ΈΛ ௒͑ͯߟ͑ͯΈΔ

  17. *P5πʔϧͱͯ͠ͷεϚʔτϑΥϯ εϚʔτϑΥϯ͸༷ʑͳηϯαʔ΍௨৴Ϟδϡʔϧ͕ࡌͬͨɺ *P5ٕज़ͷๅݿɻ ࢖Θͳ͘ͳͬͨࣗ෼ͷεϚʔτϑΥϯ΍ɺձࣾͷݕূػͳͲΛ ࢖ͬͯͰ͖Δ*P5αʔϏεΛ͍͔ͭ͘ߟ͑ͯΈ·ͨ͠ɻ

  18. ͦ΋ͦ΋*P5ͬͯʁ *OUFSOFUPG5IJOHʢϞϊͷΠϯλʔωοτʣͱ͍͏ߟ͑ํɻ Ոి΍ΠϯςϦΞͳͲɺࠓ·ͰΠϯλʔωοτʹͭͳ͕͍ͬͯ ͳ͔ͬͨϞϊΛΠϯλʔωοτʹͭͳ͛Δ͜ͱͰɺ৽͍͠׆༻ ํ๏Λ޿͍͛ͯ͘ࢼΈɻ ࠷ۙ͸Πϯλʔωοτʹͭͳ͕͍ͬͯͳ͍͚ͲεϚϗʹͭͳ͛ Ε͹*P5ͱݴͬͯ͠·͏ਓ΋͍ΔͷͰ஫ҙɻ

  19. ϞϊʹεϚϗΛ͚ͬͭͯ͘*P5Խ͢Δ αϯϓϧ
 τΠϨͷศثʹεϚϗ ΛషΓ෇͚ɻࣗಈͰ֖ ͕ด·ΔλΠϓͷτΠ ϨͳΒɺ࢖༻த͔൱͔ ͕ԕִͰΘ͔ΔΑ͏ʹ ͳΔɻ

  20. ϞϊʹεϚϗΛ͚ͬͭͯ͘*P5Խ͢Δ ࢓૊Έ
 Ճ଎౓ηϯαʔ͔ΒεϚϗͷ܏͖Λݕ஌ɻ ෼͓͖ʹɺঢ়ଶΛXFCαʔόʔʹ௨஌͢ Δɻ

  21. ΄͔ʹ΋ ྫྷଂݿͷυΞʹऔΓ෇͚ δϟΠϩηϯαʔͰ։ดΛݕ஌ɻ໷ͩͬͨΒ໷৯๷ࢭͷΞϥʔ τΛग़͢ γϟπͷഎதʹऔΓ෇͚ ࢓ࣄதͷೣഎΛՃ଎౓ηϯαʔͰ܏͖͔Βऔಘɻೣഎ͕ଓ͘ ͱɺը໘ʹΞϥʔτΛදࣔ ͳͲͳͲʜ

  22. ηϯαʔΛ࢖͏ͱ ਓͷߦಈΛτϦΨʔʹͯ͠ɺ͞·͟·ͳΠϯλϥΫγϣϯΛੜ Ή͜ͱ͕Ͱ͖·͢ɻ ϒϥ΢βͷϚ΢εࢦΩʔϘʔυʹଊΘΕͣɺ৽͍͠Πϯλ ϥΫγϣϯΛΈͳ͞Μ΋ੋඇҰॹʹߟ͑ͯΈ·͠ΐ͏ɻ

  23. ηϯαʔΛ༻͍ͨ΋ͷͮ͘ΓاըͷͨΊͷϑϨʔϜϫʔΫ ղܾ͍ͨ͠໰୊΍ ఏڙ͍ͨ͠Ձ஋ɾػೳ ର৅ͱͳΔਓ෺ ͖͔͚ͬʹͳΔߦಈ ηϯαʔͰଌΔཁૉ ηϯαʔ͕ൃಈͤ͞Δಈ࡞ ਓʹ༩͑ΔӨڹ ࠷ऴతʹఏڙ͢Δ ੡඼ɾαʔϏεͷઆ໌

    VALUE SOLUTION TARGET ACTION SENSING REACTION EFFECT