
MacBook の画面の開閉を可視化:Web HID API で取得して p5.js で可視化する
X で見た MacBook のパネルのヒンジの角度を Macアプリで使うという作品について、コードを見たら HID で取得する実装のようだったので、ブラウザの Web HID API で使ってみました

サオコン・100均の空気ポンプ・toio・パーティクル描画を組み合わせた体験型展示
サオコン・100均の空気ポンプ・toio・パーティクル描画を組み合わせた体験型展示です

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

【2025年】 minacoding Day21「枠線などの線だけでの描画」をルーレット型デバイスで
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、21日目のお題「枠線などの線だけでの描画」の作品として投稿したものです

【2025年】 minacoding Day29「思いきりカラフルに」をリングコンで
毎日設定されているお題にそって作品を作る minacoding というイベントの 2025年版で、29日目のお題「思いきりカラフルに」の作品として投稿したものです

サオコン + Joy-Con を p5.js の描画と連動させてみた:Gamepad API を利用
サオコン + Joy-Con を p5.js の描画と連動させてみた試作です。Gamepad API を利用してブラウザとの連動を実現しています。

PixTuneBox
思い出から音楽を奏でる、終わらないオルゴール。 カメラから画像を読み取り、ピクセル情報に応じて音を奏でます。直前の演奏から次の数秒間ドラム音を作成することを繰り返し、常に変わり続ける音楽となります。

【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 のカスタムシェーダーを使った光るパーティクル描画で、キー操作で一部のパーティクルが外方向に跳ねるような動きをしたり、マウスカーソルを左右に動かすと軌跡が変わったりします

エクリチュールの声、またはLLMのアンチテーゼ
「エクリチュールの声」という過去にp5.jsで作った作品を、誰でも体験可能なWebアプリにしました。

ステアラ -Station Alarm-
電車での乗り過ごし・寝過ごしを防止するアプリ。車内アナウンスを音声認識して駅の手前でお知らせする。

あつあつフロア〜観客の反応や演者の動きに合わせて変化する演出装置〜
観客反応や演者の動きによってスクリーンにスポットライトキラキラ、炎など特定の演出が投影されるインタラクティブ演出装置

ひとりでおきれるもん
誰にも迷惑をかけることなく居眠りをしなくなり、様々な罰やご褒美でモチベーションUP!できる居眠り防止ツール

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

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

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

チームhp 誰もが抱える闇を吐き出せる掲示板「吐き溜め」
誰もが抱える闇を吐き出せる掲示板「吐き溜め」 心の奥底に潜む、誰もに言えない憎悪、妬み、嫉妬を吐き出す場所 吐き溜めは、いいねもリプライもいらない、誰もが自由に自分の言葉をぶつけられる掲示板です。

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

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

Vanta.js の BIRDS の描画を p5.js に取り込んでカメラ画像の描画などと組み合わせ
Vanta.js というライブラリのエフェクトの1つ「BIRDS」を p5.js でのカメラ画像の描画などと組み合わせました。Three.js に依存しており、p5.js と併用できるよう対応しました

音を奏でて toio を動かす!(p5.js・ml5.js・p5.toio を用いたバージョン)
以前 2020年に、つくばや東京のメーカーフェアに出展した「音で toio を操る作品」の実装を、ある API から別ライブラリなどに変えたバージョンを作りました