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
総額200円の入力インターフェースで年齢問わず楽しめる体験型展示 / エンジニアの自由研究発表...
Search
you(@youtoy)
PRO
June 04, 2025
Technology
580
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
総額200円の入力インターフェースで年齢問わず楽しめる体験型展示 / エンジニアの自由研究発表会vol.10
you(@youtoy)
PRO
June 04, 2025
More Decks by you(@youtoy)
See All by you(@youtoy)
ローカルLLMとLINE Botの組み合わせ その3 / LINE DC Generative AI Meetup #8
you
PRO
0
130
クラウドファンディング版StackChan 3体(4体)をインタラクティブな体験型作品にして展示もした話 / スタックチャンお誕生日会2026
you
PRO
0
280
イベントで大活躍する電子ペーパー名札 〜その3〜 / ビジュアルプログラミングIoTLT vol.23
you
PRO
0
240
AI時代だけど、わりと力業で追いかけている技術情報収集の話 / 20260518
you
PRO
0
21
最近の技術系の話題で気になったもの色々(IoT系以外も) / IoTLT 花見予定会(たぶんBBQ) @都立潮風公園バーベキュー広場
you
PRO
1
390
Babylon.js を使って試した色々な内容 / Various things I tried using Babylon.js / Babylon.js 勉強会 vol.5
you
PRO
0
490
イベントで大活躍する電子ペーパー名札を作る(その2) 〜 M5PaperとM5PaperS3 〜 / IoTLT @ JLCPCB オープンハードカンファレンス
you
PRO
0
320
Deno・Bunの標準機能やElysiaJSを使ったWebSocketサーバー実装 / ラーメン屋を貸し切ってLT会! IoTLT 2026新年会
you
PRO
0
370
M5Stack Chain DualKey を UIFlow 2.0 + USB接続で試す / ビジュアルプログラミングIoTLT vol.22
you
PRO
2
230
Other Decks in Technology
See All in Technology
オブザーバビリティ、本当に活用できてる? 〜API連携×生成AIで成熟度を自動評価〜
dmmsre
1
2.4k
『AIに負けない』より『AIと遊ぶ』」〜ワクワクが最強のテスト・QA学習戦略_公開用
odan611
2
540
AWS Summit の片隅で、体育座りしながらコミュニティがにぎわう理由を考えた
k_adachi_01
2
360
アカウントが増えてからでは遅い? ~ マルチアカウント統制の勘所 ~
kenichinakamura
0
210
“全部コピーしない”ファイルデータの活用 : — FSx for ONTAP × S3 Tables × Icebergで作るメタデータカタログ
yoshiki0705
0
590
Claude Codeとハーネスについて考えてみる
oikon48
18
8.9k
実装だけじゃない! CCA-F取得エンジニアが教えるClaude Code開発プロセス活用術
diggymo
2
480
AI Driven AI Governance
pict3
0
300
AIで政治は変わるのか? — 中高生と考えたAI時代の民主主義(東海高校サタデープログラム)
eitarosuda
0
410
CIで使うClaude
iwatatomoya
0
190
DMM.com 購入改善推進チーム におけるCodeRabbitを用いた レビューフロー改善の一例
ysknsid25
2
560
NDIAS CTF 2026 問題解説会資料
bata_24
0
180
Featured
See All Featured
The SEO identity crisis: Don't let AI make you average
varn
0
510
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
180
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
Are puppies a ranking factor?
jonoalderson
1
3.7k
Faster Mobile Websites
deanohume
310
32k
Ethics towards AI in product and experience design
skipperchong
2
320
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.1k
How to Ace a Technical Interview
jacobian
281
24k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
190
Claude Code のすすめ
schroneko
67
230k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
6k
Everyday Curiosity
cassininazir
0
250
Transcript
2025年6月4日 (水) エンジニアの自由研究発表会vol.10 @オンライン 豊田陽介( ) @youtoy 総額200円の入力インターフェースで 年齢問わず楽しめる体験型展示
自己紹介 豊田陽介( ) @youtoy ▶ IT系イベント主催、 登壇や運営なども ▶ 機械学習・IoT関連
の書籍を出版 ▶ 子ども向けのIT関連活動 (ITが関係しない活動も) プライベートでの活動 ▶ ガジェット ▶ 描画系/IoT/AI・機械学習系 ▶ ビジュアルプログラミング ▶ JavaScript 好きな技術など
今回の話 総額200円の 入力インターフェース
200円分のアイテム(※ ダイソーで購入) 仕組み:マイクに向けて空気を吹き出させて音で検知
年齢問わず楽しめる体験型展示に ポンプを押すと反応するロボットの動きやアニメーション (ブラウザ上でのJavaScriptを用いたWebアプリ)
対象年齢を問わない体験型展示の構成 体験者による何らかの動作 (年齢問わずできる動作・内容) ↓ 動作に反応する分かりやすい フィードバック (動く、光る、音が鳴る、など) さらに「意外性」 の要素を加えると より良い感じに
過去の作品例: ・楽器の音色で ロボットを動かす ・SFみたいな見た目 のフィードバック
余談:セットでよく使う入力インターフェース 200円ではないけれど(太鼓の達人用コントローラー)
200円の入力 インターフェース 狙った3つのポイント
1・2)「金額の安さ」・「耐久性」 1)故障時の懐へのダメージが少ない「金額の安さ」 2)乱暴に扱われてもそこそこ大丈夫な「耐久性」 空気入れという通常 用途を考慮すると、 耐久性を期待できる (少なくとも 自作するよりは)
3)使い方の説明不要な「分かりやすさ」 何をするか(=押して使うこと)は一目瞭然 または別の人が体験している 様子を見れば、すぐ分かる (「こうやって押してね」と シンプルにも伝えられる ワンアクション)
想定外の利点「接続時の容易さ・頑丈さ」など 空気が出る部分と マイク部分 直差しで 固定 マイクがホース内にあるので周囲のノイズとなる音が入りにくい
当初の試作時のマイクではできなかった接続方法 約600円のマイクのコストダウンを狙ったら思わぬメリットが
この後は 時間があれば紹介
Scratchで「弱押し・強押し」を試した事例 マイク音量がとれれば押し込み検知可能 + 時間変化で強弱区別
体験型展示の作品(Webアプリ)で使った技術 ・マイク関連:Web Audio API ・描画まわり:Canvas API ・ロボット制御:Web Bluetooth API ・太鼓の達人用コントローラー:
Gamepad API ブラウザのAPIをフル活用 (一部はラッパーライブラリで)
複数個での入力も可能(要USBアダプタ) マイク入力をUSBに変換するアダプを併用 ⇒
空気ポンプ+マイクにたどり着くまでの流れなど 詳細はQiitaの記事に
身のまわりのアイテムには 面白い使い方がいろいろ!
終わり!