
ルーレットコントローラー 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 を利用してブラウザとの連動を実現しています。

【2025年】 minacoding Day17「梅雨をコードで表現」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、17日目のお題「梅雨をコードで表現」の作品として投稿したものです

【2025年】 minacoding Day6「架空の生き物」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、6日目のお題「架空の生き物」の作品として投稿したものです

【2025年】 minacoding Day5「朝一番にコードを描く」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、5日目のお題「朝一番にコードを描く」の作品として投稿したものです

【2025年】 minacoding Day4「ランダムを使ったコード」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、4日目のお題「ランダムを使ったコード」の作品として投稿したものです

【2025年】 minacoding Day2「自分なりのケーキ」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、2日目のお題「自分なりのケーキ」の作品として投稿したものです

【2025年】 minacoding Day1「円だけを使った描画」を p5js で作る
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、1日目のお題「円だけを使った描画」の作品として投稿したものです

太鼓型のコントローラーの入力に反応する輝くパーティクル(p5.jsでの描画) 【試作版】
太鼓の達人用コントローラーや100均の空気ポンプでの入力に反応する輝くパーティクルです。パーティクルはp5.jsで描画していて、作品展示に向けて試作していたものです。

p5.js のカスタムシェーダーでインタラクティブなパーティクル:円状に拡がるアニメーション描画
p5.js のカスタムシェーダーでインタラクティブなパーティクルの描画を作ったものです。中心から円状に拡がるアニメーションをシェーダーで描きました。

p5.js のカスタムシェーダーでインタラクティブな光るパーティクル・拡がる円のエフェクト描画
p5.js のカスタムシェーダーでインタラクティブな光るパーティクルの描画を作っていたのですが、そこに馴染むように拡がる円のエフェクトをシェーダーでの描画に加えてみました

太鼓型のコントローラーや100均の空気ポンプでの入力に反応する輝くパーティクル(p5.jsでの描画)
太鼓の達人用コントローラーや100均の空気ポンプでの入力に反応する輝くパーティクルです。パーティクルはp5.jsで描画しています。

p5.js のカスタムシェーダーでインタラクティブな光るパーティクル描画
p5.js のカスタムシェーダーを使った光るパーティクル描画で、キー操作で一部のパーティクルが外方向に跳ねるような動きをしたり、マウスカーソルを左右に動かすと軌跡が変わったりします

Seeed SenseCAP Watcher で人を検出したら LINEアプリに通知
Seeedさんの「SenseCAP Watcher W1-A」と、そのデバイス用の Node-RED のノードを組み合わせ、さらに LINE用ノードを使って「人検出 ⇒ アプリ通知」という仕組みを作成

ビジュアルプログラミングと振動するガジェットで楽しむ科学実験遊び
子どもが学びを得つつ楽しめる「科学実験遊び」。その科学実験の部分に、ビジュアルプログラミング・ガジェットの要素をコラボさせてみた試みです。

100均の空気ポンプや太鼓型のコントローラーで toio を動かす(ブラウザでの処理)
小さなロボットの toio を、ブラウザ経由で制御する際に、100均の空気ポンプや太鼓型のコントローラーによる物理的入力を toio を動かすきっかけに使います

太鼓の達人用コントローラーを叩くほど自分の姿が透明になっていく...
太鼓の達人用コントローラーを叩くほど、自分の姿がだんだんと透明になっていく...という作品を作りました(ふちを叩くと、透明になりかけた/透明になった姿が元通りになります)

p5.js でシェーダーを使った画像フィルターと何かの外枠を作って Webカメラ映像と組み合わせる
p5.js でシェーダーを使った画像フィルター(シェーダーの処理は自前で実装)と、何かの外枠を作って、それらを Webカメラ映像と組み合わせてみた作品です

フィットネスアシスタントガジェット - Fitness Assistant Gadget
ずっと座ったままで作業を続けるのは良くない! ということで、その問題を解消するための仕組みを M5Stack系デバイスと Chromecast の組み合わせで試作してみました

100均で売っている空気が吹き出るアイテムを入力インターフェースにする(マイクを利用)
100均で売っている「空気ポンプ」や「ピコピコハンマー」の空気の吹き出し口にマイクをあて、それらを入力インターフェースにする、というお試しです

Nintendo Switch の Joy-Con の傾きと Babylon.js の描画との連動
Nintendo Switch の Joy-Con の傾きを WebHID API で取得して、それを Babylon.js の球の高さと連動させてみた、という簡単なテストです

Nintendo Switch の Joy-Con の傾きを p5.js の描画と連動させる
Nintendo Switch の Joy-Con の傾きを WebHID API で取得して、それを p5.js の線の描画の向きと連動させてみた、という簡単なテストです