フィットネスアシスタントガジェット - Fitness Assistant Gadget
ずっと座ったままで作業を続けるのは良くない！ ということで、その問題を解消するための仕組みを M5…
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 の線の描画の向きと連動…
Vanta.js の BIRDS の描画を p5.js に取り込んでカメラ画像の描画などと組み合わせ
Vanta.js というライブラリのエフェクトの1つ「BIRDS」を p5.js でのカメラ画像の描画などと組み合わ…
音を奏でて toio を動かす！（p5.js・ml5.js・p5.toio を用いたバージョン）
以前 2020年に、つくばや東京のメーカーフェアに出展した「音で toio を操る作品」の、実装をある AP…
p5play の物理演算エンジンと p5.js のカスタムシェーダーでのグローエフェクト
p5play の物理演算エンジンを使って行った p5.js の描画で、円弧の形状の床の上を転がる円に createF…
炎を召喚したり操ったりする能力を身につけた気になれるWebアプリ：p5.jsでカスタムシェーダー
p5.jsの「createFilterShader()」でのカスタムシェーダーで、ゆらめく炎の見た目を作り、さらにカメ…
p5.js のカスタムシェーダーによる炎の描画を規則的に配置して時間変化させる
p5.js の createFilterShader() を使ったカスタムシェーダーによる炎の描画を、規則的に配置して時間…
p5.js のカスタムシェーダーによる炎の描画にブラーフィルター・2重表示などを組み合わせる
p5.js の createFilterShader() を使ったカスタムシェーダーによる炎の描画に、ブラーフィルター・2…
太陽を召喚する能力を得た気分になれる Webアプリ（Babylon.js ＋ p5.js で実装）
Babylon.js の Particle Helper を使った描画を p5.js の WEBGLモードのキャンバスに描画し、p5.js側…
手から炎を出す能力を身につけた気になれるかもしれないWebアプリ：p5.jsでカスタムシェーダー
p5.jsのフィルター用シェーダー「createFilterShader()」でのカスタムシェーダーで、ゆらめく炎みた…
p5.js の WEBGLモードのキャンバスで三角関数の揺れなどを加えた舞い散る雪のアニメーション
p5.js の WEBGLモードのキャンバスで、y方向の重力・y方向と垂直な方向の風の影響と、y方向に垂直な …
【2024年 🎍正月向け】p5.js のアニメーションで干支の切り替わり ＠ 大晦日ハッカソン
p5.js で、読み込んだ画像をたくさんのパーツにスライスして分解するような表示をさせ、その個々のパ…
ブラウザのウィンドウの動きが p5.js の描画に影響を及ぼすものをシンプルな実装で試す
ブラウザのウィンドウの動きが p5.js の描画に影響を及ぼすものをシンプルな実装で試しました
2つのブラウザのウィンドウのうち一方を動かすと他方が影響を受ける仕組みを p5.js で雑に試す
「1つのブラウザをスクリーン上で動かした際に、それを画面内の描画に影響させる」、「2つのブラウザ…
LINE通知・アプリコミュニケーションのカスタマイザー「感覚でつながるメッセージングアクセサリー」
物理デバイスを使い、メッセージが来たことを音や振動でお知らせする作品です
指でつまんだ場所から空間をちょっと歪められる Webアプリの試作（ #p5js で実装 ）
指でつまんだ場所から空間をちょっと歪めるエフェクトを、p5.js と PixiJS の Filter を組み合わせて…
p5.js でグラデーションのかかったグローエフェクトを適用した複数のカラーオブジェクトの描画
p5.js でのグローエフェクトで、グラデーションを利用した明るさ調整（時間経過で回転）などを行った…
p5.js でグローエフェクトと明るさ・カラーのグラデーションを組み合わせる描画の試作
p5.js でグローエフェクトを適用するオブジェクトで、そのエフェクトの明るさ調整やカラーのグラデー…
#p5play の物理演算や #p5js の描画 #MediaPipe を組み合わせた試作
#p5play の物理演算エンジンを #p5js の描画に適用しつつ、さらに #MediaPipe で認識した手でインタ…
万華鏡写輪眼が開眼できる Webアプリ（p5.js ＋ MediaPipe）
MediaPipe の JavaScript版を使って、カメラ映像から虹彩を検出し、そこに p5.js のベジエ曲線などを…
An Electronic paper nameplate with M5Paper&UIFlow
M5Paper と UIFlow と Macアプリを組み合わせて、比較的手軽な手順で電子ペーパーの名札を作ったとい…
p5.js で魔法陣を作る：ルーン文字と円を描画してグローエフェクトを適用する
p5.js で円をユニコード文字のルーン文字を描画して、グローエフェクトを適用して魔法陣っぽいものを…
p5.js で手から複数の光る魔法陣を生成するアニメーションを作る
p5.js で手から複数の光る魔法陣が出てくるアニメーションを作りました。動きに緩急をつけるために、…
p5.js の vertex で形状変化のアニメーション（円と矩形）：複数のパラメータ違いの図形で
p5.js の vertex で円と矩形を使った形状変化のアニメーションを作りました。複数の異なるパラメータ…
p5.js で 3つの三角関数（sin・cos・tan）を使った円を動かす（グローエフェクト付）
p5.js でタンジェントを含む 3つの三角関数（sin・cos・tan）を使って円を動かしました（図形移動に…
p5.js で作るシンプルなロック解除パズルゲーム
ネットで見かけたロック解除パズルゲームの一番シンプルなステージを、p5.js でシンプルに実装してみ…
p5.js でカメラ映像中から toio のマットの領域を判別（ピクセルごとの色ベースでの判別）
p5.js でカメラ映像中から toio のマットの領域を判別してみたものです。ピクセルごとの色ベースの処…
p5.js で剣の色を変化させる（残像を残しつつ）：ピクセルごとの色ベースでの判別処理
元は緑ベースの色の剣を、カメラ映像に対するピクセルの色ベースの判別処理で、赤や青に変化させます…
