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
フィジカルコンピューティングでアイデアをカタチに! / hiu-physcom
Search
yumulab
August 03, 2025
Technology
73
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
フィジカルコンピューティングでアイデアをカタチに! / hiu-physcom
北海道情報大学オープンキャンパス模擬講義資料
yumulab
August 03, 2025
More Decks by yumulab
See All by yumulab
非試合日の野球場を楽しむためのARホームランボールキャッチ体験システムの開発 / EC79-miyazaki
yumulab
0
320
MR流体を用いたセルフセンシング可能な触覚デバイスの提案 / haptics36-kamimura
yumulab
0
81
Bluetooth Low Energyの海に潜る / Dive to Bluetooth Low Energy
yumulab
0
150
湯村研究室の紹介2025 / yumulab2025
yumulab
0
370
Proposal of an Information Delivery Method for Electronic Paper Signage Using Human Mobility as the Communication Medium / ICCE-Asia 2025
yumulab
0
360
研究室から社会へ 〜 情報科学でつなぐ科学技術コミュニケーション実践 / #CoSTEP20th
yumulab
0
200
A Proposal of an Information Delivery Method using Human Movement as a Communication Medium for Electronic Paper Signage / ICEC2025
yumulab
0
160
メタバース空間で対話相⼿に向かって⾃律移動するAIアバター『ノア』の開発 / EC2025-Oyamada
yumulab
0
380
足位置の視覚的提示による電子オルガンのペダル鍵盤演奏学習支援システムの提案 / EC2025-Hokin
yumulab
0
320
Other Decks in Technology
See All in Technology
人依存からAIネイティブの体制へ:バックエンド開発の裏側【SORACOM Discovery 2026】
soracom
PRO
0
130
セキュリティ研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
31
26k
基調講演:人とAIをつなぐIoTの今と未来 ー 「フィジカル」と「デジタル」が出会うその先へ【SORACOM Discovery 2026】
soracom
PRO
0
360
AIエージェントに財布を渡す日 ― 承認付き"買い物エージェント"を作って実演
yama3133
0
110
現場との対話から始める “作る前に問い直す”業務改善
mochico50
2
340
QA・ソフトウェアテスト研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
3
1.8k
QAタスクをスキル化したいときに考えること
aomoriringo
0
130
13年運用タイトルのサーバーサイドが辿り着いた現在地 ― モンスターストライクにおける技術・組織・AI活用から得た知見
mixi_engineers
PRO
1
330
オートマトンと字句解析でRoslynを読む
tomokusaba
0
130
『モンスターストライク』 の運営に伴走する! データ民主化への 解析グループの3つのアプローチ
mixi_engineers
PRO
0
180
AIがAPIを書く時代に、私たちは何を設計すべきか
nagix
0
170
ウォーターフォール開発案件のPMとしてAI活用を模索している話
hatahata021
2
210
Featured
See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
250
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.8k
Embracing the Ebb and Flow
colly
88
5.1k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.7k
Leo the Paperboy
mayatellez
8
2k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
Code Reviewing Like a Champion
maltzj
528
40k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
430
So, you think you're a good person
axbom
PRO
2
2.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
10k
Paper Plane (Part 1)
katiecoart
PRO
1
9.9k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
780
Transcript
ւಓใେֶ ΦʔϓϯΩϟϯύε ٖߨٛ ʢใϝσΟΞֶ෦ ใϝσΟΞֶՊʣ ౬ଜ ཌྷ フィジカルコンピューティングでアイデアをカタチに! @yumulab
[email protected]
ࢿྉΞοϓϩʔυࡁ https://speakerdeck.com/yumulab/hiu-physcom
今日の講義の内容 • ϑΟδΧϧίϯϐϡʔςΟϯά֓ཁ (20) • ϑΟδΧϧίϯϐϡʔςΟϯά (ArduinoγϛϡϨʔλ) ԋश (25) •
ͦͷଞɾ·ͱΊɾ࣭ (5) 2
フィジカルコンピューティング概要
「フィジカルコンピューティング」とは • Physical (ཧతͳ) + Computing • ϋʔυΣΞΛѻ͏γεςϜͷϓϩάϥϛϯά • ޫɺಈ͖ɺԻ
ͳͲͳͲ • ΞϓϦήʔϜͷϓϩάϥϛϯάͱԿ͕ҧ͏͔ʁ • ΞϓϦήʔϜίϯϐϡʔλͷதʹด͍ͯ͡Δ • ϑΟδΧϧίϯϐϡʔςΟϯάίϯϐϡʔλͷ֎ͷσʔλΛऔಘ ͨ͠ΓϋʔυΣΞΛಈ͔͢ • ʮInternet of Things (IoT)ʯʮࠐΈίϯϐϡʔςΟϯάʯͱڞ௨ ͋Δ (एׯҧ͏߹͋Δ) 4
フィジカルコンピューティングの例 | 光のボール 5 teamLab, Light Ball Orchestra / ޫͷϘʔϧͰΦʔέετϥ
https://youtu.be/NN1vbIbH3GE
フィジカルコンピューティングの例 | LEDスーツ 6 Wall Recordings, SAMURIZE - Killer Instinct
(Of fi cial Video) https://youtu.be/rjMD36M4GMM
フィジカルコンピューティングの例 | 飲み物の泡ディスプレイ 7 BubBowl: Display Vessel Using Electrolysis Bubbles
in Drinkable Beverages - YouTube https://www.youtube.com/watch?v=QDoqyS9K7NE
フィジカルコンピューティングの例 | 変形するテーブル 8 TRANSFORM - Amazing Technology Invented By
MIT https://youtu.be/lCARHatJQJA
フィジカルコンピューティングの例 | 群ロボットを活用したインタフェース 9 Zooids: Building Blocks for Swarm User
Interfaces - YouTube https://www.youtube.com/watch?v=8Ik7V_QH5wk
どうやって作る? • ͍Ζ͍ΖͳπʔϧɾςΫϊϩδʔ͕ΘΕΔ • Χϝϥը૾ղੳ • ө૾ΤϑΣΫτ੍࡞ (AfterEffect, Blender, Unity)
• ϓϩδΣΫγϣϯϚοϐϯά • ηϯα • Ϟʔλʔ • LED • ϫϯϘʔυϚΠίϯ 10 ͜ͷߨٛͷର
ワンボードマイコン • ී௨ͷPCͱൺͯ • ͍҆🙆 • খ͍͞🙆 • ফඅిྗ🙆 •
ੑೳ͍🙅 11 M5Stack Basic (¥6,831) https://ssci.to/9010 Arduino Uno R3 (¥5,500) https://ssci.to/789 micro:bit (¥3,366) https://ssci.to/7952 Raspberry Pi 4 Model B / 2GB (¥9,570) https://ssci.to/5681 ͜ͷߨٛͷର
Arduino • ʮΞϧσϡΠʔϊʯͱಡΈ·͢ • ͨͿΜੈքҰ༗໊ͳϫϯϘʔυϚΠίϯ • ͍҆ޓ͋ΔɿύνϞϊ͡Όͳͯ͘ΦʔϓϯιʔεϋʔυΣΞ • Arduino IDEͰ։ൃɿC++ݴޠ
12 Arduino Uno R3 https://ssci.to/789 Arduino IDE
Tinkercad | Arduinoシミュレータ • ͑Δ෦ଟ͘ɺ͍ΖΜͳ͜ͱ͕Ͱ͖Δ • ߨٛTinkercadΛͬͯਐΊ·͢ • ※ Tinkercadʹଞʹ3DϞσϦϯάπʔϧؚ·Ε͍ͯ·͕͢ɺ͜ͷߨٛͰ
3DϞσϦϯάπʔϧͷػೳ༻͠·ͤΜ 13
フィジカルコンピューティング演習
Tinkercadを準備しよう • Google ChromeΛ։͘ (σεΫτοϓͷγϣʔτΧοτ͔Β) • ΞυϨεόʔʹ https://bit.ly/hiu-ocͱೖྗ 15
Tinkercadを準備しよう • χοΫωʔϜͰࢀՃ → χοΫωʔϜΛೖྗ • χοΫωʔϜͨ͠ࢴʹॻ͍͍ͯ·͢ (hiu01ʙhiu30) 16 ΫϦοΫ
هೖ ΫϦοΫ ※ ՈͰΔͱ͖ https://www.tinkercad.com/ ʹΞΫηεͯ͠ʮΞΧϯτΛ࡞ʯ ·ͨʮଞαʔϏεΞΧϯτ(Google / Apple / Microsoft / Facebook)ͰαΠϯΠϯʯ ͍ͯͩ͘͠͞
新しい回路の作成 17 ʮճ࿏ʯΛબ ΫϦοΫ
回路シミュレータ画面 • ԋशͰجຊతʹ͜ͷը໘Λ͍·͢ 18 ໊લΛΫϦοΫͯ͠ ฤू͠Α͏ ෦ΛΫϦοΫ → ஔ (υϥοάˍυϩοϓͰOK)
今日やること • (1) LEDΛޫΒͤΔ • (2) NeoPixel (LEDςʔϓ) ΛޫΒͤΔ •
(3) NeoPixelͷ৭Λม͑ͯΈΔ • (4) LCDΛಈ͔ͯ͠දࣔจࣈΛม͑ͯΈΔ • (5) ͍ΖΜͳ෦(ελʔλʔ)Λಈ͔ͯ͠ΈΔ • ͨͿΜશ෦Ͱ͖ͳ͍ͷͰɺͥͻ͓͏ͪͰͬͯΈ͍ͯͩ͘͞ 19
LEDを光らせる 20 ໊લΛΫϦοΫͯ͠ ฤू͠Α͏ ෦ΛΫϦοΫ → ஔ (υϥοάˍυϩοϓͰOK)
21 ෦ͷࢠΛΫϦοΫ →ଓઌࢠΛΫϦοΫ LEDを光らせる
22 ಈ͔͢ʹ͜͜ΛΫϦοΫ LEDを光らせる
23 ɹΫϦοΫͰ෦બ → BackspaceͰআ shiftΛԡ͠ͳ͕ΒΫϦοΫ͢Δͱ ෳબՄೳ Undo ctrl+zͰՄ LEDを光らせる
24 ϚεϗΠʔϧͰը໘֦େ/ॖখ ෦ͷճస (Shiftԡ͠ͳ͕Β ΫϦοΫͰٯճస) ϓϩύςΟมߋ ͳʹͳ͍ͱ͜ΖΛ υϥοά͢Δͱ ը໘Ґஔͷௐ LEDを光らせる
NeoPixel • AdafruitࣾͷϚΠίϯଂϑϧΧϥʔLED • ͭͳ͛ͯ૿ͤΔʂ • ςʔϓঢ়ɺϦϯάঢ়ʹͭͳ͕͍ͬͯΔΛ͏͜ͱ͕ଟ͍ • ੍ޚʹArduinoͳͲΛ͏ •
ϥΠϒϥϦΛ͍͍͑ײ͡ʹͰ͖ΔͷͰɺ੍ޚํ๏ͷৄࡉΛΒͳͯ͘େৎ 25 Adafruit Industries, NeoPixel RGBW LEDs w/ Integrated Driver Chip - Natural White [~4500K - Black Casing - 10 Pack] https://www.adafruit.com/product/2761 $5.95 / 10ݸ εΠοναΠΤϯε, NeoPixel Ring - 12࿈ϑϧΧϥʔγϦΞϧLED https://www.switch-science.com/catalog/1593/ 1,177ԁ Adafruit Industries, NeoPixel Digital RGB LED Strip - White 30 LED - WHITE https://www.adafruit.com/product/1376 $16.95 / meter
NeoPixelを光らせる • ελʔλʔ (෦ͷΈ߹Θͤ)ͷஔ 26 1. ελʔλʔ͔Β “Arduino” Λબ 2.
NeoPixelΛબͯ͠ஔ 3. γϛϡϨʔγϣϯΛ։࢝ ࢀߟɿ࣮ࡍͷNeoPixel
NeoPixelの光る色を変える • ίʔυ (ϓϩάϥϜ/εέον) ͷฤूํ๏ 27 ʮίʔυʯΛΫϦοΫ
NeoPixelの光る色を変える • 25ߦͷredColor, greenColor, blueColorΛফͯ͠ 0ʙ255ͷ͖ͳࣈʹॻ͖͑ • ॻ͖͑ͨΒʮγϛϡϨʔγϣϯΛ։࢝ʯΛΫϦοΫ 28 ͜͜Λॻ͖͑
ྫ͑
LCD • Liquid Crystal Display (=ӷথσΟεϓϨΠ) ͷུ • ArduinoͷΑ͏ͳϚΠίϯϘʔυͰใΛදࣔ͢Δوॏͳखஈ •
16 × 2 (ԣ16จࣈɺॎ2จࣈ) • ઢ͕େม • ελʔλʔʹઢࡁΈͷͷ͕͋ΔͷͰɺͦΕΛ͏ͷָ͕ 29 ळ݄ిࢠ௨, ̡̘̙ΩϟϥΫλ σΟεϓϨΠϞδϡʔϧɹ̍̒×̎ ߦɹόοΫϥΠτനൈ͖ https://akizukidenshi.com/catalog/g/ gP-02919/ 800ԁ
LCD • ελʔλʔ͔ΒʮLCDʯΛબ 30 LCDΛબͯ͠ஔ
LCD • ʮίʔυʯˠʮจࣈʯΛબ 31
LCD • ʮଓߦʯΛΫϦοΫ 32
LCD • දࣔ͢ΔจࣈɺࣈͷҐஔΛม͑ͯΈ·͠ΐ͏ 33 ͜͜Λॻ͖͑ ͜͜ॻ͖͑ͯΈͯOK
いろんな部品(スターター)を動かしてみる • ͍ΖΜͳελʔλʔ͕͋ΔͷͰ͍Ζ͍Ζࢼͯ͠Έ·͠ΐ͏ • جຊతʹɺஔ࣮ͯ͠ߦ͢Δ͚ͩͰಈ͖·͢ • Α͘Θ͔Βͳ͍ͷ͋Δͱࢥ͍·͕͢ • Իͷग़Δͷ͋ΔͷͰҙ •
ͨ͘͞Μஔ͢Δͱಈ࡞͕ॏ͘ͳΔͷͰɺ͍ऴΘͬͨ෦ফ͠·͠ΐ͏ (બͯ͠BackSpaceΩʔ) 34
その他・まとめ
参考:NeoPixelハードウェア解説 • 3ຊͷଓ͕ඞཁɿ৴߸ઢɺ5VɺGND • ଓͯ͠૿͢͜ͱ͕Ͱ͖Δ • Կݸ·ͰଓͰ͖Δʁ → ߋ৽ϨʔτʹΑΔ •
Tinkercadͩͱ100ݸۙ͘ͳΔͱॏ͘ͳΔ 36 ͜ΕͰ1ݸ 0 1 2 3 4 5 6 7 8 9 10 11 ৴߸͕ྲྀΕΔํ ͭͳ͛ͯ૿ͤΔ (ಉ͡छྨͷࢠΛଓ) DIN:৴߸ઢೖྗ(Digital IN) 5V GND DO:৴߸ઢग़ྗ(Digital OUT)
micro:bit • ଞͷϚΠίϯϘʔυ micro:bitʢϚΠΫϩϏοτʣհ͠·͢ • 2015ʙ ։ൃ͞Εͨڭҭ༻ϚΠίϯϘʔυ • ΠΪϦεͰখֶੜʹແঈ͞Εͨ •
ݱࡏϚΠΫϩιϑτࡿԼͷϓϩδΣΫτ • 2020ʹv2ʹόʔδϣϯΞοϓ • LED 5×5 = 25ݸɺϘλϯ2ݸɺεϐʔΧɺϚΠΫɺ໌Δ͞ηϯαʔɺՃηϯαʔɺ ࣓ྗηϯαʔɺԹηϯαʔɺແઢ௨৴ػೳʢBLEʣΛࡌ 37 εΠοναΠΤϯε, micro:bit https://ssci.to/7952 3,366ԁ
micro:bit • Webϒϥβͷ։ൃڥͰ։ൃ͢Δ • ϒϩοΫɺJavaScriptɺPythonͰ։ൃ • ͲͷίʔυͰॻ͍ͯޓੑ͕͋ΔʢมՄೳʣ • ։ൃڥʹγϛϡϨʔλ͕ଐ͢Δ 38
部品の購入 39 εΠοναΠΤϯε, ArduinoΛ͡ ΊΑ͏Ωοτ https://ssci.to/181 7,150ԁ εΠοναΠΤϯε, The Arduino
Starter Kitʢຊޠ൛ʣ https://ssci.to/2628 22,000ԁ εΠοναΠΤϯε, M5GO IoTε λʔλʔΩοτ V2.7 https://ssci.to/9011 9,845ԁ • ͬͱֶͼ͍ͨਓɺͥͻ࣮ػΛߪೖͯ͠Έ͍ͯͩ͘͞ • ࠷ॳΩοτ͕͓͢͢ΊͰ͢ • Arduino୯ମͩͱ΄ͱΜͲԿͰ͖ͳ͍ • ύʔπબͼ͕͍͠
スイッチサイエンス • ΩοτɺϚΠίϯɺNeoPixelɺߴՁ֨ଳηϯα(¥1,000Ҏ্) 40
秋月電子通商 • Ձ֨ଳ෦(߅ɺLEDɺεΠονɺIC)ɺܭଌػث • ळ༿ݪʹ࣮ళฮ͕͋Γ·͢ 41
推薦図書 42 ౻ݪຑཬࡊ, ແବͳϚγʔϯ Λൃ໌͠Α͏! (2021) Ϊϟϧి, Ϊϟϧిͱͭ͘Δ! όΠϒεςϯΞήαΠόʔύϯΫ ޫΓిࢠ࡞
(2021) ArduinoΛ͡ΊΑ͏ ୈ3൛ (2015)
推薦Twitter 43 @shiropen2 @make_jp @FabSceneJp
推薦YouTubeチャンネル 44 Πνέϯ ແବͮ͘Γ
おわりに • ͍ΖΜͳઌੜ͕͍ΖΜͳݚڀΛ͍ͯ͠·͢ • ւಓใେֶͦͷଞͷେֶͷWebαΠτΛௐͯΈ͍ͯͩ͘͞ 45 @yumulab
[email protected]