インタラクティブな Webアプリ 2つの展示（拍手で花火、空間を歪ませる波紋）【NT函館2026】
NT函館2036の飛び入り展示「展示体験ポジティブブース」に出展した時のものです
複数台の StackChan（ｽﾀｯｸﾁｬﾝ）を手の動きで操る Webアプリ
複数台の StackChan を手の動きで操る Webアプリを試作してみました。2本の指を近づけたところを起点に、アナログジョイスティック的なものが出てきて、それを使って操作します。
Three.jsを使ったオブジェクトの見た目が変わったり波紋が出たりする3Dアニメーション
Three.jsを使ったブラウザ上での3Dアニメーション作ってみました。グローエフェクトや波紋のようなアニメーションを使ったり、シェーダー描画を混ぜたりしつつ、揺らぎを加えたりもしています
両手を使ってインタラクティブに大型・小型花火を出せる体験型Webアプリ
p5.js や MediaPipe、シェーダー描画を組み合わせたインタラクティブな Webアプリで、拍手をすると花火を出せたり、両手の人差し指を近接させることで小型花火を連続で出せたりします
インタラクティブに空間を歪ませるエフェクトを出せるWebアプリ
片手の親指・人差し指をくっつける動作をしたり、両手を画面内で動かしたりする動作により、インタラクティブに空間を歪ませるエフェクトを出せるWebアプリです
ガジェット・インタラクティブな Web アプリの複合的な展示【つくろがや！4（2026/5）】
ガジェット・Webアプリを使った体験型展示をまとめて体験できる構成にしたものです
ガジェット・Webアプリを使った体験型展示（複合版）【2026/7、内容検討中】
【内容検討中】2026年7月の展示に向けて検討中の、ガジェット・Webアプリを使った体験型展示です
Remotion ＋ VOICEVOX動画テンプレート【元ネタ】と Codexアプリを使った解説動画
Claude Code用に公開されている Remotion ＋ VOICEVOX動画テンプレート【元ネタ】に手を加えて Codexアプリで使えるようにして生成した解説動画です
複数台の toio が p5.js での処理上で衝突しないように動きが計算されて動作する展示
複数台の toio の動きを p5.js での処理で計算して、その結果を toio の専用マットを使った絶対位置座標を扱う仕組みで実際に反映させるものです（お互いが衝突しないように動こうとします）
【2026年正月向け】 Three.js を使った「3D 謹賀新年」（途中段階）＠ 大晦日ハッカソン
2025年の年末、大晦日ハッカソンで進めた内容です。思ったように時間がとれず、準備段階で 12/31 は終わってしまいました。
インタラクティブな多段階の光学迷彩／透明マントエフェクトが体験できるWebアプリ
p5.js と MediaPipe を組み合わせて、インタラクティブな多段階の光学迷彩／透明マントエフェクトが体験できるWebアプリを作りました
動物（ウサギ・ネコ・犬）を描き出すインタラクティブなパーティクル（Webアプリ）
パーティクルが動物の輪郭を描き出す仕組みを作り、その位置や色を手のジェスチャーでインタラクティブに変化させる仕組みを足した Webアプリです
ガジェット・Webアプリを使った体験型展示（複合版）【2026/3 ＠ 広島・松戸】
ガジェット・Webアプリを使った体験型展示をまとめて体験できる構成にしたものです
Scratch の「Face Sensing」でシンプルな試作： 顔に追従するスプライト
Scratch の「Face Sensing」でシンプルな試作： 顔に追従するスプライト
BOCCO emo ミニシアター
BOCCO emo で複数のキャラの声（BOCCO emo、AITalk WebAPI、VOICEVOX の声）や効果音を組み合わせた読み聞かせなどを行うことができるミニシアター
「片手／両手の親指と人差し指でつまむ動作」で流体の見た目を操るインタラクション【元ネタあり】
PavelDoGreat/WebGL-Fluid-Simulationのリポジトリで公開されている流体の見た目を、p5.jsのキャンバスで動かした試作に、AIによる両手の認識を使った機能を加えました
ブラウザ上でAI・機械学習と描画処理でインタラクティブな「透明マント・光学迷彩」- 【2025】
両手の親指と人差し指で囲まれた領域で「光学迷彩・透明マント的なエフェクト」を出す、インタラクティブな体験型展示です。カメラ画像に対するAI・機械学習処理と描画ライブラリによる描画で実装しました。
リングコン・サオコン・toio・パーティクル描画を組み合わせた体験型展示【2025/10】
リングコン・サオコン・toio・パーティクル描画を組み合わせた体験型展示です
p5.js Web Editor上で流体の見た目を両手で操るインタラクションの試作【元ネタあり】
PavelDoGreat/WebGL-Fluid-Simulationのリポジトリで公開されている流体の見た目を、p5.jsのキャンバスで動かした試作に、AIによる両手の認識を使った機能を加えました
p5.js Web Editor上で流体の見た目のやつを動かしてみる【元ネタあり】
元ネタでPavelDoGreat/WebGL-Fluid-Simulationというリポジトリで公開されているものがあり、その処理をp5.js Web Editor上のsketch.jsで動かしました
ルーレットコントローラー 2台を同時にブラウザで扱う： Web HID API ＋ p5.js
人生ゲーム for Nintendo Switch専用ルーレットコントローラーの数字の取得と描画を、ブラウザ上の JavaScript のみでやってみつつ、それを 2台同時にやってみたものです
ルーレットコントローラーをブラウザで扱う：Web HID API で取得して p5.js で可視化
人生ゲーム for Nintendo Switch専用ルーレットコントローラーの数字の取得と描画をブラウザ上の JavaScript のみでやってみた、というものです（数字の取得は Web HID）
MacBook の画面の開閉を可視化：Web HID API で取得して p5.js で可視化する
X で見た MacBook のパネルのヒンジの角度を Macアプリで使うという作品について、コードを見たら HID で取得する実装のようだったので、ブラウザの Web HID API で使ってみました
M5 GraviTimer： 回転させて／傾けて使う自動開始のタイマー【M5Stack】
M5Stack Core2 の底面・上面・片側の側面を地面に置くと、その時のデバイスの向きによって、異なる規定の時間でのカウントダウンが自動で始まるタイマーです
サオコン・100均の空気ポンプ・toio・パーティクル描画を組み合わせた体験型展示
サオコン・100均の空気ポンプ・toio・パーティクル描画を組み合わせた体験型展示です
サオコン・太鼓型コントローラー・100均の空気ポンプの入力に反応するパーティクル：p5.jsでの描画
サオコンや太鼓の達人用コントローラー、100均の空気ポンプでの入力に反応する輝くパーティクルです。パーティクルはp5.jsで描画しています。
サオコン ＋ Joy-Con を Scratch と連動させてみた（ブラウザの拡張機能自作による）
Nintendo Switch の釣りゲーム用のコントローラー「サオコン（＋ Joy-Con）」を、Scratch と連動させてみました。実現方法は、ブラウザの拡張機能の自作です。
【2025年】 minacoding Day21「枠線などの線だけでの描画」をルーレット型デバイスで
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、21日目のお題「枠線などの線だけでの描画」の作品として投稿したものです
【2025年】 minacoding Day29「思いきりカラフルに」をリングコンで
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、29日目のお題「思いきりカラフルに」の作品として投稿したものです
サオコン ＋ Joy-Con を p5.js の描画と連動させてみた：Gamepad API を利用
サオコン ＋ Joy-Con を p5.js の描画と連動させてみた試作です。Gamepad API を利用してブラウザとの連動を実現しています。
