takumifukasawa’s blog

WebGL, Shader, Unity, UE4

2020-03-01から1ヶ月間の記事一覧

CSSスプライトアニメーションをGPUレンダリングさせる

※内容は以前書いたこちらの記事と同じでさらに文章に校正を加えたものになります。jsdo.itをデモとして使っていたのですがjsdo.itがクローズになってデモが動作しなくなったのでデモをcodepenに移したためです。 CSSスプライトアニメーションをGPUレンダリン…

【WebGL】Google Chrome の Hardware Acceleration 無効時の挙動

WebGL開発をする際に、Chromeのハードウェアアクセラレーションを無効にしたときでもWebGLコンテンツを動作させたい機会があり、挙動を調べる機会があったのでメモとして残しておきます。 設定方法の変更 有効・無効時のブラウザの機能の違い Chrome と CPU…

【three.js】背面カリングを用いたアウトライン表現

リアルタイムレンダリングにおいてアウトラインを生成する方法はいくつかあります。 背面カリングを利用した方法や、ポストプロセスによる生成が主かと思います。 今回は前者の、背面カリングを使ったアウトライン表現を行ってみたいと思います。 デモ 手法…

【Unity】AzureKinectの環境構築・接続

AzureKinectを使う機会があったので、セットアップとミニマムな疎通確認までをまとめておきたいと思います。 azure.microsoft.com 環境 手順 1. Azure Kinect SDK をダウンロード 2. SDKのインストール 3. Unityプロジェクトを作成 4. NuGet をUnityPackage…

【Unity】CSVを読み込むC#クラス

CSVファイルを読み込んでパースするクラスを、MonoBehaviourではなくC#クラスとして欲しい場面があったので作成してみました。 まず、コードの全文はこちらです。 gist.github.com Assets/Resources/ 以下に入っているCSVファイルを読み込みます。 例えば As…

【SparkAR】リムライト風シェーダー

SparkARは、簡単なシェーディングであればパッチエディターでノードを組み合わせることで実現できるのですが、それだけでは難しい表現の場合はJSでスクリプトを書く必要があります。 なぜスクリプトかと言うと、SparkARではシェーダーを直接書くことができず…

【Javascript】ブラウザでシェーダーを使わずにレイマーチングをしてみる

はじめに 作ったもの 環境 CPU版 デモ コード GPU版 デモ コード 比較 結果 参考 はじめに ブラウザでレイマーチングを行うには、WebGLを使ってシェーダーで書くのが一般的なやり方かと思います。むしろ、高いFPSを実現するにはそれ以外の方法は実質難しいは…