shaderとthree.jsに関するTormitsのブックマーク (1)

  • 【WebGL】three.js : soft particle - KAYAC Engineers' Blog

    ~ この記事はTech KAYAC Advent Calendar 2020の18日目の記事になります ~ こんにちは!クライアントワークチーム・フロントエンドエンジニアの深澤です。web や unity の実装を担当しています。 今日は three.js で soft particle (ソフトパーティクル)を実装する方法を紹介していきたいと思います。 ソフトパーティクルを使って、霧のような雰囲気の中をキツネが駆けるシーンを作ってみました。 この動作デモはこちらから、動作デモのソースはこちらのリポジトリからご覧いただくことができます。 ソフトパーティクルについて ソフトパーティクルとは 特徴 実装方針 three.jsでの実装 JavaScript GLSL 改善点 霧の表現 最後に ソフトパーティクルについて ソフトパーティクルとは おおまかに一言でまとめると「深度値の比較をして透過率

    【WebGL】three.js : soft particle - KAYAC Engineers' Blog
  • 1