Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
情報メディア入門I 2024 ヒューマンコンピュータインタラクション / IM1-2024
Search
yumulab
June 12, 2024
Technology
0
160
情報メディア入門I 2024 ヒューマンコンピュータインタラクション / IM1-2024
2024年6月12日(水)に開催された北海道情報大学の講義「情報メディア入門I」の第10回「ヒューマンコンピュータインタラクション」の講義資料
yumulab
June 12, 2024
Tweet
Share
More Decks by yumulab
See All by yumulab
ASSADS:ASMR動画に合わせて撫でられる感覚を提示するシステムの開発と評価 / ec75-shimizu
yumulab
1
380
ウッドスタックチャン:木材を用いた小型エージェントロボットの開発と印象評価 / ec75-sato
yumulab
1
410
MGDSS:慣性式モーションキャプチャを用いたジェスチャによるドローンの操作 / ec75-yamauchi
yumulab
0
230
チャッドローン:LLMによる画像認識を用いた自律型ドローンシステムの開発と実験 / ec75-morisaki
yumulab
1
440
NOVVS:北海道情報大学図書館における滞在人数可視化システムの開発と検証 / i2025-minami
yumulab
0
84
CHaserWeb:ブラウザ上で動作する対戦型プログラミング学習環境の提案と評価 / i2025-inoue
yumulab
0
220
CARMUI-NET:自動運転車遠隔監視のためのバーチャル都市プラットフォームにおける通信品質変動機能の開発と評価 / UBI85
yumulab
0
240
待機電力を削減したネットワーク更新型電子ペーパーサイネージの研究開発 / UBISympo2025
yumulab
0
110
デジタルファブリケーションの未来を北海道・札幌から考える / SIAF School 2025
yumulab
0
110
Other Decks in Technology
See All in Technology
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
310
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
shigeruoda
4
520
mrubyと micro-ROSが繋ぐロボットの世界
kishima
2
290
Witchcraft for Memory
pocke
1
350
Postman AI エージェントビルダー最新情報
nagix
0
110
生成AI時代 文字コードを学ぶ意義を見出せるか?
hrsued
1
440
AWS テクニカルサポートとエンドカスタマーの中間地点から見えるより良いサポートの活用方法
kazzpapa3
2
550
25分で解説する「最小権限の原則」を実現するための AWS「ポリシー」大全 / 20250625-aws-summit-aws-policy
opelab
9
1.1k
MySQL5.6から8.4へ 戦いの記録
kyoshidaxx
1
210
Fabric + Databricks 2025.6 の最新情報ピックアップ
ryomaru0825
1
140
「Chatwork」の認証基盤の移行とログ活用によるプロダクト改善
kubell_hr
1
160
Uniadex__公開版_20250617-AIxIoTビジネス共創ラボ_ツナガルチカラ_.pdf
iotcomjpadmin
0
160
Featured
See All Featured
How GitHub (no longer) Works
holman
314
140k
Scaling GitHub
holman
459
140k
Into the Great Unknown - MozCon
thekraken
39
1.9k
A better future with KSS
kneath
239
17k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.3k
Faster Mobile Websites
deanohume
307
31k
Writing Fast Ruby
sferik
628
61k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
17
940
Why Our Code Smells
bkeepers
PRO
337
57k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
210
Designing Experiences People Love
moore
142
24k
Transcript
2024.06.12 ౬ଜ ཌྷ ヒューマンコンピュータインタラクション ใϝσΟΞೖI @yumu19 / @yumulab
[email protected]
はじめに • X (Twitter)ͷײɾ࣭ͷߘܴ • (͜ͷतۀͷࢲͷճͷΈ) • ϋογϡλά #ใϝσΟΞೖ •
HIU-WiFi͔ΒTwitterͭͳ͕Βͳ͍ͷͰ(͝ΊΜͶ🥺)ɺɹ εϚϗ͔Βߘ͍ͯͩ͘͠͞ • ࢲͷճͰεϥΠυͷࡱӨɾεΫγϣߘOKͰ͢🙆 2
自己紹介 • ౬ଜ ཌྷ (@yumu19) • ใϝσΟΞֶՊ ।ڭत (2021/04ʙ) •
ઐใՊֶ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ • ϢϏΩλείϯϐϡʔςΟϯά • ΤϯλςΠϯϝϯτίϯϐϡʔςΟϯά • όʔνϟϧϦΞϦςΟ • ωοτϫʔΫ 3
最近の研究 (ゼミ学生) 4 ϝϞ͔ΒεϥΠυΛࣗಈੜ͢ΔϓϨθϯπʔϧ ർ࿑ΛՄࢹԽ͢ΔΞΫηαϦ ਭσʔλΛͬͯ ΨνϟΛҾ͘ ϔϧεέΞΞϓϦ αφͰͷϓϩδΣΫγϣϯϚοϐϯά
今日の講義内容 • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯ(HCI)ͱ • HCIͷݚڀհ • ൃදɾใऩूʹ͍ͭͯ • ςΫϊϩδʔܥͱσβΠϯܥɺ྆ํʹؔ͢Δ༰ Ͱ͢
5
ヒューマンコンピュータインタラクションとは 6 ਓؒͱίϯϐϡʔλͷؔੑʹ͍ͭͯͷݚڀͰ͋Δʢͬ͘͟Γʣ Human ਓؒ Computer ίϯϐϡʔλ Interaction ΠϯλϥΫγϣϯ HCIͱུ͞ΕΔ
ヒューマンコンピュータインタラクションの研究とは • ਓ͕ؒίϯϐϡʔλΛ͏ͨΊͷΠϯλϑΣʔε(ڥք)ͷݚڀ • ৽͍͠ΠϯλϑΣʔεͷݚڀ։ൃ • ΠϯλϑΣʔεʹؔ͢Δௐࠪݚڀ • ίϯϐϡʔλ͕ਓؒʹ༩͑ΔӨڹͷݚڀʢ৺ཧֶతݚڀʣ •
ίϯϐϡʔλ͕ਓؒͷ׆ಈΛࢧԉ͢ΔγεςϜͷݚڀ • ͳͲ • ͱͯ෯͍ 7
インタフェース • 1) ϋʔυΣΞΠϯλϑΣʔε • ػցͱػցͷڥք • USBɺHDMIͳͲ • 2)
Application Programming Interface (API) • αʔόͱΫϥΠΞϯτͷڥք • ϝΠϯϓϩάϥϜͱϥΠϒϥϦͷڥք • 3) User Interface (UI) • ίϯϐϡʔλΛ͏ਓͱίϯϐϡʔλͷڥք 8 ใٕज़(IT)ͷੈքͰΑ͘ొ͢ΔΠϯλϑΣʔε ࣄྖҬͳͲΛ͚Δڥͷ͜ͱ ڥք - Wikipedia (2021/06/14Ӿཡ) ڥքɿ ࠓ͜Ε
インタフェース • ೖྗΠϯλϑΣʔεͱग़ྗΠϯλϑΣʔε 9 ʢίϯϐϡʔλʣೖྗ ʢίϯϐϡʔλ͔Βʣग़ྗ ϚεɺΩʔϘʔυ etc. σΟεϓϨΠɺεϐʔΧ etc.
ユーザインタフェース (UI) 10 Ϩάβ७ਖ਼ΦϓγϣϯϦϞίϯ ʛςϨϏʛREGZAɿ౦ࣳ https://www.regza.com/ regza/option/remo/ ER-W16 | ిࢠϨϯδ/ΦʔϒϯϨϯδ
| ౦ࣳϥΠϑελΠϧגࣜձࣾ https://www.toshiba-lifestyle.com/ jp/microwaves/er-w16/ ιϑτΣΞ (ը໘) ϋʔυΣΞ (Ϙλϯ)
インタフェース研究 11 Sketchpad CG, CAD, VR (Ivan Sutherland, 1963) oN-Line
System(NLS) Mouse, GUI (Douglas Engelbart, 1968) Dynabook (Alan Kay, 1968)
FurAir:毛のモフモフを超音波で再現する装置 12 [SIGGRAPH Asia 2023 E-tech] FurAir: Non-contact Presentation of
Soft Fur Texture - YouTube https://www.youtube.com/watch?v=Cj0DC_XycA4
VTuberの頭突きを感じる 13 LivEdge siggraph2023 video - YouTube https://www.youtube.com/watch?v=08aEhiMcGTU
SkinPaper 14 SkinPaper: Exploring Opportunities for Woven Paper as a
Wearable Material for On-Skin Interactions - YouTube https://www.youtube.com/watch?v=ydAO186J3o4
飲み物の泡ディスプレイ 15 BubBowl: Display Vessel Using Electrolysis Bubbles in Drinkable
Beverages - YouTube https://www.youtube.com/watch?v=QDoqyS9K7NE
味覚インタフェースの開発 16 [CHI2020] Norimaki Synthesizer: Taste Display Using Ion Electrophoresis
in Five Gels - YouTube https://www.youtube.com/watch?v=7HIm4LoAZxU
医療装具に電子部品を組み込むツールキット 17 E-Orthosis: Augmenting Off-the-shelf Orthoses with Electronics - YouTube
https://www.youtube.com/watch?v=YNetyKD26qI
オウムのためのビデオ会議システム 18 Kleinberger et al., Birds of a Feather Video-Flock
Together: Design and Evaluation of an Agency- Based Parrot-to-Parrot Video-Calling System for Interspecies Ethical Enrichment.
陶磁器に電子回路を組み込む 19 Crafting Interactive Circuits on Glazed Ceramic Ware -
YouTube https://www.youtube.com/watch?v=P-K3AfB3AuM
VR空間内の地形を物理世界のピンで再現 20 Elevate: A Walkable Pin-Array for Large Shape-Changing Terrains
- YouTube https://www.youtube.com/watch?v=R1NzSW3MdPw
イラスト修正におけるコミュニケーション支援 21 We-toon Video - YouTube https://www.youtube.com/watch?v=csZMW-e5cC0
変形布の研究 22 [Preview] Patch-O: Shape Changing Woven Patches for On
Body Actuation - YouTube https://www.youtube.com/watch?v=l9x-HROUfy0
超音波音響浮揚による立体ディスプレイ 23 ArticuLev: An Integrated Self-Assembly Pipeline for Articulated Multi-Bead
Levitation Primitives - YouTube https://www.youtube.com/watch?v=jnQEMg_iwQk
食べられるコンピュータ(論理演算装置) 24 Logic Bonbon: Food as Computational Artifact - YouTube
https://www.youtube.com/watch?v=U0K7quCUzT8
群ロボットを活用したインタフェース 25 Zooids: Building Blocks for Swarm User Interfaces -
YouTube https://www.youtube.com/watch?v=8Ik7V_QH5wk
YouTuber or VTuber どちらが支持される? 26 ӽޙل, ޖ݈࿕, ৽Ҫوߛ, ӬࢻԻ, খྛູ.
(2023). ΧςΰϦผʹ͓͚Δ VTuber ͱ YouTuber ͷ৴ελΠϧʹΑΔҹධՁ. ใॲཧֶձจࢽ
ダンス映像編集支援システム 27 ଟࢹμϯεө૾ͷΠϯλϥΫςΟϒฤूγεςϜ - YouTube https://www.youtube.com/watch?v=IzhDQhCcnx4
どうやって面白い研究の情報集めるの? • ʲΦεεϝʳTwitter @shiropen2 ΛϑΥϩʔ • ࠃͷγϯϙδϜΛݟΔ(YouTube৴ͰແঈࢹௌՄ) • EC(ΤϯλςΠϯϝϯτίϯϐϡʔςΟϯάγϯϙδϜ) •
WISS • ΠϯλϥΫγϣϯ • ࠃࡍձٞ(CHI, UIST, SIGGRAPH)ͷςΟβʔಈըΛݟΔ • ࠃࡍձٞ(CHI, UIST, SIGGRAPH)ͷษڧձ(ຊޠ)ʹࢀՃ͢Δ 28
情報メディア学科のHCI関連講義 • σβΠϯܥςΫϊϩδʔܥ෯ؔ͋͘Δ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯʢେֶӃʣɿେֶӃਐֶ͠Α͏ʂ • ৽͍͠ΠϯλϑΣʔεͷ։ൃʹϋʔυΣΞ։ൃͷεΩϧ͕͋Δͱ͍͍ • → ϑΟδΧϧίϯϐϡʔςΟϯάԋश
(2) • ήʔϜΤϯδϯUnity͕͑Δͱݚڀʹඇৗʹཱͭ (ಛʹVRɾARܥ) • → ήʔϜϓϩάϥϛϯάԋश (2) 29
ヒューマンコンピュータインタラクション(大学院講義) 30
フィジカルコンピューティング演習 (守・湯村) • ArduinoΛͬͯϑΟδΧϧίϯϐϡʔςΟϯάΛֶͿ • LEDɺηϯαɺϞʔλͳͲͷ͍ํΛֶͿ • Tinkercad (͘͢͝ྑ͘ग़དྷͯΔγϛϡϨʔλ) ׆༻
31
研究は何の役に立つの? • Θ͔Βͳ͍ (※ݚڀςʔϚʹΑΓ·͢) • 3ޙʹʹཱ͔ͭ͠Εͳ͍͠ɺ50ޙʹʹཱ͔ͭ͠Εͳ͍͠ɺʹཱͨͳ͍͔͠ Εͳ͍ • কདྷʹཱͭͷ͕Կ͔୭ʹΘ͔Βͳ͍ •
ඞཁʹͳ͔ͬͯΒݚڀͯؒ͠ʹ߹Θͳ͍ • ྫɿiPhone͕Ͱ͖Δͣͬͱલ͔ΒϚϧνλονͷݚڀ͞Ε͍ͯͨ 32 Rekimoto, SmartSkin: An Infrastructure for Freehand Manipulation on Interactive Surfaces (2002)
なんで研究するの? • ਓྨʹͱͬͯ • ࣝͷ֦େ • ͍ͭͲ͜ͰͲΜͳ͕ࣝʹཱͭͷ͔Θ͔Βͳ͍ʢࡂͳͲʣ • ৽͍ٕ͠ज़͕ੜ·ΕΔͱ๛͔ʹͳΔ →
ࢿຊओٛͷཱٕज़ֵ৽͕લఏ • େֶੜʹͱͬͯ • ੜ্͖͍ͯ͘ͰཱͭεΩϧΛຏ͘͜ͱ͕Ͱ͖Δ • ະͷঢ়ଶ͔ΒௐΔʢจݙௐࠪʣ • ࣝͷਤΛඳ͘ʢࣝɾใͷཧʣ • ԾઆͷཱҊͱݕূ • ਓʹ͑Δʢจষͷॻ͖ํɺϓϨθϯςʔγϣϯʣ • ใϝσΟΞֶՊͰ3ੜ͔Βθϛଐ͞Ε·͢ • 2ؒ͡ΌΓͳ͍ → େֶӃʂ 33
学会以外にも面白いものに触れる機会がある • ݚڀ / ֶձϋʔυϧ͕ߴ͍ • Կ͔Λ࡞ָͬͯ͠Έ͍ͨ • Maker Faire
• ώʔϩʔζϦʔά • ͷͮ͘Γθϛ 34
Maker Faire • ͷͮ͘Γͷࡇయ • झຯͰ࡞ͬͨͷΛɹ లࣔ • ੈք֤ࠃͰ։࠵ •
ຊͰ౦ژɺژɺ େ֞ɺࢁޱɺͭ͘ɺ ઋɺদ 35
Maker Faireの作品例 36 Human Controller, ු͘શࣗಈϧʔϏοΫΩϡʔϒ https://youtu.be/2vG-YtRmBSw
ヒーローズリーグ • ͷͮ͘Γίϯςετ https://heroes-league.net/ • ࠓશΦϯϥΠϯͰ։࠵ • ࡞ΞʔΧΠϒαΠτProtopediaʹશ࡞ܝࡌ https://protopedia.net/ 37
ヒーローズリーグの作品例 38 Star ˑ Jam Street ~ ਗ਼ָثԻָເ ~ https://youtu.be/4QAUfQ7c6DY
ヒーローズリーグの作品例 39 Yukio Shinoda, Glowing Air-Bubble Clock - ver.2 with
origin; powered by ESP8266 https://youtu.be/wvD58wH-RZA
ProtoPedia 40 https://protopedia.net/
GUGEN 41 https://gugen.jp/
ものづくりゼミ • ʮΞΠ デ ΞΛܗʹ͢ΔʯΛςʔϚʹͷ づ ͘ΓΛߦ͏Jθ ϛ(ࣗओ ゼ ϛ)
• ୲ڭһɿ⁋ ॱฏɾ౬ଜ ཌྷ • ݄1ճ։࠵ • Twitter: @HIU_Maker 42
推薦図書 43 ϑϥϯΫɾϞε .*5ϝσΟΞϥϘʕຐ๏ͷ Πϊϕʔγϣϯɾύϫʔ όʔνϟϧϦΞϦςΟֶ
ᬑܙଠ ༥͚ΔσβΠϯʕ ϋʔυºιϑτºωοτ࣌ͷ ৽ͨͳઃܭ ॹํᆹਓ ίϯϰΟϰΟΞϧɾ ςΫϊϩδʔ
推薦Twitter 44 @shiropen2 @make_jp @fabcrossjp
おわりに 45 • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯਓؒͱίϯϐϡʔλͷؔੑʹ͍ͭͯͷݚڀ • ώϡʔϚϯίϯϐϡʔλΠϯλϥΫγϣϯݚڀΠϯλϑΣʔεݚڀʢ͚ͩ͡Όͳ͍͚Ͳʣ • ৽͍͠ϢʔβΠϯλϑΣʔεΛߟ͑Δ͜ͱɺະདྷΛσβΠϯ͢Δ͜ͱ • ֶ֎ʹ͕͍ͬͯΔΠϯϓοτɾΞτϓοτͷʹΛ͚Α͏
@yumulab
[email protected]