#p5.jsの検索結果

p5.js でマウスを使ったインタラクション:イージングを適用した動きをする円を誘導する
p5.js を使った実装で、マウスカーソルを動かすと、その位置に向かって円が集まる(動きにはイージン…

MediaPipe「手のジェスチャー認識」と p5.js での引力が働くオブジェクトの描画の組合せ
MediaPipe「手のジェスチャー認識」と p5.js での描画を組み合わせました。描画の内容は、相互に引力…

Googleさんの MediaPipe の「手のジェスチャー認識」と p5.js の組み合わせ v2
Googleさんの MediaPipe の新機能「手のジェスチャー認識」を p5.js の描画と組み合わせました。ジェ…

Googleさんの MediaPipe の「手のジェスチャー認識」と p5.js の描画と組み合わせ
Googleさんの MediaPipe の新機能「手のジェスチャー認識」を p5.js の描画と組み合わせました。p5.j…

p5.js で SVGフィルターを使わない溶ける見た目のエフェクト(Goony Effect)
よく事例を見かける SVGフィルターを使って溶ける見た目のエフェクト(Goony Effect)を実現するので…

p5.js で数万個のパーティクルの描画を高速化(PIXI.ParticleContainer で)
p5.js で数万個のパーティクルの描画を高速化するために、PixiJS の PIXI.ParticleContainer を組み…

p5.js を使った色が変化しつつ波打つ曲線のアニメーション描画
p5.js を使った線の描画で、色が変化しつつ波打つような曲線のアニメーションを描画してみたものです

p5.js の WEBGLモードで 3D空間内を跳ね回る球体のパーティクル
以前作っていた、2D平面上で円のパーティクルが跳びはねて消える(重力方向に力を受けつつ跳ね回る)…

p5.js で描画した回転しつつ動く同心円を WEBGLモード上で歪めて表示させてみる
p5.js で描画した回転しつつ動く同心円(元は 2D描画だったもの)を、WEBGLモード上で三次元的に歪め…

p5.js の WEBGLモードの sphere() と三角関数を使った描画:生成過程を視点を変えて
p5.js の WEBGLモードの sphere() と三角関数を使った描画をやっていて、生成過程をアニメーションで…

p5.js の WEBGL モードで Box がたくさん並んだ中を走るアニメーションを 2視点で見る
p5.js の WEBGL モードで、Box がたくさん並んだ中を走る見た目のアニメーションを、走る物体の後ろ…

p5.js で WebAR(ARマーカーに紐付く 3つの描画領域を立体的に配置してみるテスト)
p5.js・AR.js・A-Frame を組み合わせた WebAR の試作で、ARマーカーを認識したら立体的な位置関係の …

p5.js用ライブラリ p5.simpleAR を使って過去に作った同心円などを使った作品で AR
p5.js で作った作品を簡単に ARマーカー上に出せるライブラリ「p5.simpleAR」を使って、過去に作った…

p5.js用ライブラリ p5.simpleAR で過去に作ったパーティクル作品をマーカー上に呼び出す
p5.js で作った作品を簡単に ARマーカー上に出せるライブラリ「p5.simpleAR」を使って、過去に作った…

p5.js で blendMode()・tint() などを組み合わせたグラデーションのランダム描画
p5.js で blendMode()・tint()・translate()・rotate()・ellipse() 等を使ったグラデーションの描画…

p5.js で norm()・dist()・三角関数などを使った描画
Twitter で見かけた Processing の作品の処理を理解するために、p5.js に書きかえてから、内容に手を…

ChatGPT API のサーバー送信イベント経由のデータを p5.js で画面上に随時表示させる
ChatGPT API(gpt-3.5-turbo)で「stream: true」にした際の、Server-Sent Events のデータを、p5.js…

ChatGPT との音声対話を ChatGPT API と p5.js で試す
ChatGPT API を使ったテキストのやりとりに、音声認識・音声合成を組み合わせて、ChatGPT とのやりと…

【2023年 正月🎍】トラの画像が粒子状になりウサギの画像に変化:p5.js・PixiJS で実装
JavaScript を使ったアニメーションで、2023年のお正月ネタ🎍 を作ってみました(描画ライブラリの…

「画像とテキストが細かく分解されて霧散する」という演出を p5.js で作成【試作版】
「画像とテキストが細かく分解されて霧散する」という見た目の演出を、 p5.js を利用した描画で作っ…

「テキストが細かく分解されて飛び散る(またはその逆)」という演出を p5.js で作成【試作版】
「テキストが細かく分解されて飛び散る」という見た目の演出を、 p5.js を利用した描画で作ってみる…

DualShock 4 と p5.js の組み合わせ(gamecontroller.js を利用)
DualShock 4 での操作と p5.js Web Editor上での描画を組み合わせました(Gamepad API用のライブラリ…

p5.js とハーフミラーで作る手作りスマートミラー(まだ着手してみたばかりの段階)
ハーフミラーを使ったスマートミラー的な作品を見かけることがありますが、それをいつか作ってみたい…

TacticBoardVR:VRサッカー作戦盤システム
サッカー作戦盤のVR版システムをヘッドマウントディスプレイ(HMD)を用いて開発しました。タブレット…

カメラ映像の注目してほしい箇所に、視線を集められるかもしれないやつを p5.js で作った!
p5.js を使ってカメラ映像上にマンガで用いられる表現の「集中線」を表示させられるものです。放射上…

すごく恐ろしいものの片鱗を味わったときの強い驚きをカメラ映像上で伝えられるかもしれない Webアプリ
すごく恐ろしいものの片鱗を味わったときに出るかもしれないセリフを使い、カメラ映像上で強い驚きを…

ブラウザでの音声認識結果を物理演算を適用して落下させてみるテスト
p5js(描画) + Matter.js(物理演算)+ p5.speech(Web Speech API のラッパー)の組み合わせで、…

ハロウィン仕様のアニメーションを Webフォントと p5.js で作ってみた(色付けバージョン)
とあるイベントでのハンズオンで、 CSSアニメーションを用いたハロウィン仕様のアニメーションを作っ…

ハロウィン仕様のモノクロのアニメーションを Webフォントと p5.js で作ってみた
とあるイベントでのハンズオンで、 CSSアニメーションを用いたハロウィン仕様のアニメーションを作っ…

AI Zoo Keeper
画像生成AI(Stable Diffusion)でどうぶつに変身して、インターネット上に公開されているAIどうぶつ…