21件
image

p5.js で SVGフィルターを使わない溶ける見た目のエフェクト(Goony Effect)

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

開発中 visibility 119 thumb_up_alt 0 comment 0
image

カメラ映像の注目してほしい箇所に、視線を集められるかもしれないやつを Scratch で作った!

Scratch を使って作った、カメラ映像上にマンガの「集中線」を表示させられるものです。放射上にひろ…

開発中 visibility 90 thumb_up_alt 0 comment 0
image

カメラ映像の注目してほしい箇所に、視線を集められるかもしれないやつを p5.js で作った!

p5.js を使ってカメラ映像上にマンガで用いられる表現の「集中線」を表示させられるものです。放射上…

開発中 visibility 271 thumb_up_alt 0 comment 0
image

OBS のブレンドモードを使ったお手軽 VFX

OBS の 27.2 から、画像編集ソフトなどで行える「加算・減算・乗算・比較などのブレンドモードの処理…

開発中 visibility 399 thumb_up_alt 0 comment 0
image

SVGフィルタを使った溶けるようなエフェクトとパス上を動く複数の球体のアニメーション +3D の動き

五〜十二芒星のパス上を動く複数の球体に、SVGフィルターの溶けるようなエフェクトを適用したり、3D…

開発中 visibility 171 thumb_up_alt 0 comment 0
image

SVGフィルタを使った溶けるようなエフェクトを 3D空間上のオブジェクトに適用したアニメーション

SVGフィルタを使った溶けるようなエフェクト(feGaussianBlur・feColorMatrix の組み合わせ)を、3D…

開発中 visibility 196 thumb_up_alt 0 comment 0
image

SVGフィルタを使った溶けるようなエフェクトとパス上を動く複数の球体のアニメーションの組み合わせ

五〜十二芒星のパス上を動く複数の球体に、SVGフィルターの溶けるようなエフェクト(feGaussianBlur…

開発中 visibility 159 thumb_up_alt 0 comment 0
image

動く 3D の立方体にグローエフェクトを適用してみる(p5.js での実装)

p5.js で実装したグローエフェクト(ブラーフィルターと合成を活用した方法)を、WEBGLモードで描画…

開発中 visibility 167 thumb_up_alt 0 comment 0
image

p5.js でグローエフェクトと伴う図形の描画アニメーション(イージングで動きに変化をつける)

p5.js で作ったグローエフェクト(ブラーフィルターと合成を活用した方法)と anime.js によるイージ…

開発中 visibility 278 thumb_up_alt 0 comment 0
image

p5.js で動画とカメラ映像の合成を試す(海の動画素材との色合いを調整)

p5.js を使って、海の動画とカメラ映像とを合成してみました(海の動画とカメラ映像の色合いが違った…

開発中 visibility 340 thumb_up_alt 0 comment 0
image

p5.js で画像とカメラ映像の合成を試す(窓ガラスと雨の水滴の写真素材を使って)

Photoshop の本で見かけた「曇りガラスと別の画像を合成する方法」を、p5.js の処理に置きかえて試し…

開発中 visibility 347 thumb_up_alt 0 comment 0
image

p5.js で VFX: Canvas の filter(hue-rotate) で色違いの炎を作る

CanvasRenderingContext2D.filter の hue-rotate() で色相の値を変化させて、映像エフェクト用の赤い…

開発中 visibility 337 thumb_up_alt 0 comment 0
image

ブラウザ上での機械学習と描画処理でインタラクティブな「透明マント・光学迷彩」

「両手の親指と人差し指で囲まれた領域は、人の後ろの背景が見える」という光学迷彩・透明マント的な…

完成 visibility 1848 thumb_up_alt 15 comment 0
image

多方向に光が拡散するテキスト用エフェクトを作ってみた: p5.js で実装した画像処理

元々、ブラーフィルタと p5.js での画像合成を組み合わせてグローエフェクトを試作していたものがあ…

開発中 visibility 206 thumb_up_alt 0 comment 0
image

光る軌跡でパーティクル発光: ブラーフィルターと合成処理を使った p5.js でのグローエフェクト

p5.js を使った描画処理で、ブラーフィルターと合成処理を組み合わせたグローエフェクトを試作してい…

開発中 visibility 346 thumb_up_alt 0 comment 0
image

【指先付近のみに焦点があうカメラ映像】p5.js と MediaPipe Hands で実装

人差し指の先を起点に、その周りだけ焦点が合う(その点から遠いとブラーフィルタのぼかしが強くなる…

開発中 visibility 285 thumb_up_alt 0 comment 0
image

p5.js と OpenCV.js(画像処理)の組み合わせ: エッジ検出と線分検出をお試し

p5.js でカメラ映像取得・描画処理を行う構成で、画像処理部分に OpenCV.js を使ってみるテストで、C…

開発中 visibility 911 thumb_up_alt 0 comment 0
image

【2本の指で作る小さな透明マント的エフェクト】p5.js と MediaPipe Hands で実装

親指と人差し指で囲まれた領域は、人の後ろの背景が見えるという、透明マント的なエフェクトをカメラ…

開発中 visibility 1699 thumb_up_alt 1 comment 0
image

【VFX】空間を燃やしたり手から稲妻を出したり:ブラウザ上で動く p5.js 実装のアプリ

After Effects などでの VFX用に配布されてる素材データを使い、ブラウザ上で動く p5.js 実装の処理…

開発中 visibility 787 thumb_up_alt 2 comment 0
image

手からレーザー光線: ブラウザ上で動く p5.js を使ったアプリ

Effekseer というオープンソースのエフェクト作成ソフトの公式サンプルを活用して、p5.js を使った映…

開発中 visibility 436 thumb_up_alt 1 comment 0
image

某アニメの悪役が使う「とっておきの手品」っぽい禁呪が使える(かもしれない)Webアプリ V3

10本の指全てに強力な火炎系呪文を宿す!?某アニメの悪役が使うあの危険な禁呪よりも、さらに強力な…

完成 visibility 836 thumb_up_alt 7 comment 0