情報メディア入門III 2022 ヒューマンコンピュータインタラクション / IM3-2022

2022年9月26日(月)北海道情報大学 情報メディア学科「情報メディア入門III」の講義資料

Transcript

1. 2022.09.26 ౬ଜ ཌྷ !"#$%&%'"#()%(*+,-% ./0102345 /01063.789:8;873<=3>=:? ৘ใϝσΟΞೖ໳III
2. %&'( • ౬ଜ ཌྷ (@yumu19) • ৘ใϝσΟΞֶՊ ।ڭत (2021/04ʙ) • ઐ໳͸৘ใՊֶ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ • ϢϏΩλείϯϐϡʔςΟϯά • ΤϯλςΠϯϝϯτίϯϐϡʔςΟϯά • όʔνϟϧϦΞϦςΟ • ωοτϫʔΫ 3
3. )*+,- • VRαοΧʔ࡞ઓ൫ • iPadͰࢦࣔͨ͠બख഑ஔΛHMDʹͯҰਓশࢹ఺ө૾Λఏࣔ 4
4. ./+0123 • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯͱ͸ • ݚڀ঺հ • ֶձҎ֎ͷൃදɾ৘ใऩू • ҰݟςΫϊϩδʔܥͷ࿩͕ଟΊʹݟ͑Δ͔΋͠Ε·ͤ Μ͕ɺσβΠϯͷ࿩Ͱ΋͋Γ·͢ 5
5. 4567898:56;<8;=>?@8A! 6 ਓؒͱίϯϐϡʔλͷؔ܎ੑʹ͍ͭͯͷݚڀ෼໺Ͱ͋Δʢͬ͘͟Γʣ Human ਓؒ Computer ίϯϐϡʔλ Interaction ΠϯλϥΫγϣϯ HCIͱུ͞ΕΔ
6. 4567898:56;<8;=>?@8+,-A! • ਓ͕ؒίϯϐϡʔλΛ࢖͏ͨΊͷΠϯλϑΣʔε(ڥք)ͷݚڀ • ৽͍͠ΠϯλϑΣʔεͷݚڀ։ൃ • ΠϯλϑΣʔεʹؔ͢Δௐࠪݚڀ • ίϯϐϡʔλ͕ਓؒʹ༩͑ΔӨڹͷݚڀʢ৺ཧֶతݚڀʣ • ίϯϐϡʔλ͕ਓؒͷ׆ಈΛࢧԉ͢ΔγεςϜͷݚڀ • ͳͲ • ͱͯ΋෯޿͍ 7
7. <8;BC6D • 1) ϋʔυ΢ΣΞΠϯλϑΣʔε • ػցͱػցͷڥք • USBɺHDMIͳͲ • 2) Application Programming Interface (API) • αʔόͱΫϥΠΞϯτͷڥք • ϝΠϯϓϩάϥϜͱϥΠϒϥϦͷڥք • 3) User Interface (UI) • ίϯϐϡʔλΛ࢖͏ਓͱίϯϐϡʔλͷڥք 8 ৘ใٕज़(IT)ͷੈքͰΑ͘ొ৔͢ΔΠϯλϑΣʔε͸ ࣄ෺΍ྖҬͳͲΛ෼͚Δڥ໨ͷ͜ͱ ڥք - Wikipedia (2021/06/14Ӿཡ) ڥքɿ ࠓ೔͸͜Ε
8. <8;BC6D • ೖྗΠϯλϑΣʔεͱग़ྗΠϯλϑΣʔε • ೖྗΠϯλϑΣʔε • Ϛ΢εɺΩʔϘʔυͳͲ • ग़ྗΠϯλϑΣʔε • σΟεϓϨΠɺεϐʔΧʔͳͲ 9
9. E6F<8;BC6DGHIJK 10 Ϩάβ७ਖ਼ΦϓγϣϯϦϞίϯ ʛςϨϏʛREGZAɿ౦ࣳ https://www.regza.com/ regza/option/remo/ ER-W16 | ిࢠϨϯδ/ΦʔϒϯϨϯδ | ౦ࣳϥΠϑελΠϧגࣜձࣾ https://www.toshiba-lifestyle.com/ jp/microwaves/er-w16/ ιϑτ΢ΣΞ (ը໘) ϋʔυ΢ΣΞ (Ϙλϯ)
10. <8;BC6D$LMNOP,-+Q • େᆘ༸հɼബӋେथɼࢁத঵ଠɼٶԼ๕໌ɽը໘֯ͱը໘୺ͷλʔήοτ഑ஔ͕ ૢ࡞࣌ؒʹ༩͑ΔӨڹɼݚڀใࠂώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ ʢHCIʣɼVol.2022-HCI-197ɼIssue.1ɼNo.55ɼpp.1-8ɼ2022ɽ 11
11. RS<8;BC6D+TU 12 [CHI2020] Norimaki Synthesizer: Taste Display Using Ion Electrophoresis in Five Gels - YouTube https://www.youtube.com/watch?v=7HIm4LoAZxU
12. VWX+,- 13 [Preview] Patch-O: Shape Changing Woven Patches for On Body Actuation - YouTube https://www.youtube.com/watch?v=l9x-HROUfy0
13. YZ[Z\]^$_N`abcDde< 14 ArticuLev: An Integrated Self-Assembly Pipeline for Articulated Multi-Bead Levitation Primitives - YouTube https://www.youtube.com/watch?v=jnQEMg_iwQk
14. fghiN98:56;HjklmnoK 15 Logic Bonbon: Food as Computational Artifact - YouTube https://www.youtube.com/watch?v=U0K7quCUzT8
15. pqr+sbcDde< 16 BubBowl: Display Vessel Using Electrolysis Bubbles in Drinkable Beverages - YouTube https://www.youtube.com/watch?v=QDoqyS9K7NE
16. tuvwxyz{|}<8;BC6D 17 Zooids: Building Blocks for Swarm User Interfaces - YouTube https://www.youtube.com/watch?v=8Ik7V_QH5wk
17. ~ÄÅ2+ÇWyrkÉÑ+:8ÖÜá 18 Elevate: A Walkable Pin-Array for Large Shape-Changing Terrains - YouTube https://www.youtube.com/watch?v=R1NzSW3MdPw
18. ~àâäãåAçéè+Lêë+OP 19 More Kawaii than a Real-Person Streamer: Understanding How the Otaku Community Engages with and ... - YouTube https://www.youtube.com/watch?v=IuMhbo0MZrU
19. <=Dxíìîï 20 Yi-Ching Huang, Jerry Yu-Heng Chan, and Jane Hsu. 2018. Reflection before/after Practice: Learnersourcing for Drawing Support. In Extended Abstracts of the 2018 CHI Conference on Human Factors in Computing Systems (CHI EA '18)
20. ñ8Dóòôöîï?Dõú 21 ଟࢹ఺μϯεө૾ͷΠϯλϥΫςΟϒฤूγεςϜ - YouTube https://www.youtube.com/watch?v=IzhDQhCcnx4
21. ùûü†°¢£§,-+•¶ö#N+ß • ʲ௒ΦεεϝʳTwitter @shiropen2 ΛϑΥϩʔ • ࠃ಺ͷγϯϙδ΢ϜΛݟΔ(YouTube഑৴ͰແঈࢹௌՄ) • EC(ΤϯλςΠϯϝϯτίϯϐϡʔςΟϯάγϯϙδ΢Ϝ) • WISS • ΠϯλϥΫγϣϯ • ࠃࡍձٞ(CHI, UIST, SIGGRAPH)ͷςΟβʔಈըΛݟΔ • ࠃࡍձٞ(CHI, UIST, SIGGRAPH)ͷษڧձ(೔ຊޠ)ʹࢀՃ͢Δ 22
22. •¶®bc©™´+L¨01 • σβΠϯܥ΋ςΫϊϩδʔܥ΋෯޿ؔ͘܎͋Δ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯಛ࿦ʢେֶӃʣ • େֶӃਐֶ͠Α͏ʂ • ৽͍͠ΠϯλϑΣʔεͷ։ൃʹ͸ϋʔυ΢ΣΞ։ൃͷεΩϧ͕͋ Δͱ͍͍ • → ϝσΟΞϓϩάϥϛϯάԋश (2೥ޙظ) 23
23. ®bc©du≠=Æ8≠lØGH∞±≤≥K • ArduinoΛ࢖ͬͯϑΟδΧϧίϯϐϡʔςΟϯάΛֶͿ • LEDɺηϯαɺϞʔλͳͲͷ࢖͍ํΛֶͿ • Tinkercad (͘͢͝ྑ͘ग़དྷͯΔγϛϡϨʔλ) ΋׆༻ 24
24. ¥+µ∂ë∑Æ • ʮΞΠσΞΛܗʹ͢ΔʯΛςʔϚʹ΋ͷͮ͘ΓΛߦ͏Jθϛ(ࣗओθϛ) • ୲౰ڭһɿ⁋ ॱฏɾ౬ଜ ཌྷ • ݄1ճ։࠵ • ࣍ճ 10/14(ۚ) 6ߨ ˏ ϓϩδΣΫτߨٛࣨ(༧ఆ) • Twitter: @HIU_Maker 25
25. ,-!∏+π$`∫+ß • Θ͔Βͳ͍ (※ݚڀςʔϚʹΑΓ·͢) • 3೥ޙʹ໾ʹཱ͔ͭ΋͠Εͳ͍͠ɺ50೥ޙʹ໾ʹཱ͔ͭ΋͠Εͳ͍͠ɺ໾ʹཱͨͳ͍͔΋͠ Εͳ͍ • কདྷ໾ʹཱͭ΋ͷ͕Կ͔͸୭ʹ΋Θ͔Βͳ͍ • ඞཁʹͳ͔ͬͯΒݚڀͯ͠͸ؒʹ߹Θͳ͍ • ྫɿiPhone͕Ͱ͖Δͣͬͱલ͔ΒϚϧνλονͷݚڀ͸͞Ε͍ͯͨ 26 Rekimoto, SmartSkin: An Infrastructure for Freehand Manipulation on Interactive Surfaces (2002)
26. ªºÖ,-MN+ß • ਓྨʹͱͬͯ • ஌ࣝͷ֦େ • ͍ͭͲ͜ͰͲΜͳ஌͕ࣝ໾ʹཱͭͷ͔Θ͔Βͳ͍ • ࡂ֐ͳͲ • ৽͍ٕ͠ज़͕ੜ·ΕΔͱ๛͔ʹͳΔ • ࢿຊओٛͷ੒ཱ͸ٕज़ֵ৽͕લఏ • େֶੜʹͱͬͯ • ੜ্͖͍ͯ͘Ͱ໾ཱͭεΩϧΛຏ͘͜ͱ͕Ͱ͖Δ • ະ஌ͷঢ়ଶ͔Βௐ΂Δʢจݙௐࠪʣ • ஌ࣝͷ஍ਤΛඳ͘ʢ஌ࣝɾ৘ใͷ੔ཧʣ • ԾઆͷཱҊͱݕূ • ਓʹ఻͑Δʢจষͷॻ͖ํɺϓϨθϯςʔγϣϯʣ • ৘ใϝσΟΞֶՊͰ͸3೥ੜ͔Βθϛ഑ଐ͞Ε·͢ 27
27. ™Ωæø$¥¢£§¥+$¿iN¡Ω¬√N • ݚڀ / ֶձ͸ϋʔυϧ͕ߴ͍ • Կ͔Λ࡞ָͬͯ͠Έ͍ͨ • Maker Faire • ώʔϩʔζϦʔά 28
28. ƒ≈∆ãåG«≈»åã • ΋ͷͮ͘Γͷࡇయ • झຯͰ࡞ͬͨ΋ͷΛɹ లࣔ • ੈք֤ࠃͰ։࠵ • ೔ຊͰ͸౦ژɺژ౎ɺ େ֞ɺࢁޱɺͭ͘͹ɺ ઋ୆ɺ඿দ 29
29. ƒ≈∆ãåG«≈»åã+ì…Q 30 Human Controller, ු͘શࣗಈϧʔϏοΫΩϡʔϒ https://youtu.be/2vG-YtRmBSw
30. 46u6 À6≠ • ΋ͷͮ͘Γίϯςετ https://heroes-league.net/ • ࠓ೥͸׬શΦϯϥΠϯͰ։࠵ • ࡞඼ΞʔΧΠϒαΠτProtopediaʹશ࡞඼ܝࡌ https://protopedia.net/ 31
31. 46u6 À6≠+ì…Q 32 Star ˑ Jam Street ʙਗ਼૟ָثԻָເ૝ʙ https://youtu.be/4QAUfQ7c6DY
32. 46u6 À6≠+ì…Q 33 Yukio Shinoda, Glowing Air-Bubble Clock - ver.2 with origin; powered by ESP8266 https://youtu.be/wvD58wH-RZA
33. ÃåÕŒÕÃ㜻≈ 34 https://protopedia.net/
34. –I–—“ 35 https://gugen.jp/
35. ”‘’÷ 36 ϑϥϯΫɾϞε
    
    .*5ϝσΟΞϥϘʕຐ๏ͷ
    Πϊϕʔγϣϯɾύϫʔ
     όʔνϟϧϦΞϦςΟֶ
    
     ౉ᬑܙଠ
    ༥͚ΔσβΠϯ
    ʕ ϋʔυºιϑτºωοτ࣌୅ͷ ৽ͨͳઃܭ࿦
     ॹํᆹਓ
    
    ίϯϰΟϰΟΞϧɾ ςΫϊϩδʔ
    
36. ”‘à◊»ŒŒãå 37 @shiropen2 @make_jp @fabcrossjp
37. ÿêë$ 38 • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ͸ਓؒͱίϯϐϡʔλͷؔ܎ੑʹ͍ͭͯͷݚڀ෼໺ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯݚڀ͸ΠϯλϑΣʔεݚڀʢ͚ͩ͡Όͳ͍͚Ͳʣ • ৽͍͠ϢʔβΠϯλϑΣʔεΛߟ͑Δ͜ͱ͸ɺະདྷΛσβΠϯ͢Δ͜ͱ • ֶ֎ʹ޿͕͍ͬͯΔΠϯϓοτɾΞ΢τϓοτͷ৔ʹ΋໨Λ޲͚Α͏ ./0102345 /01063.789:8;873<=3>=:?