[Three.js] Three.jsでシェーダー入門 - Qiita

はじめに デモページ Three.jsやBabylon.jsのようなWebGLライブラリで、シェーダーを利用すると表現力が向上します。 シェーダーは難解です。これから学習を始める人にとって、どこから手をつけていいのかわからなくなります。WEB上にはシェーダーを扱ったさまざまな記事がありますが、どのような読者を想定して書かれているかは千差万別です。著者が想定している前提知識を持っておらず、読者が内容を理解できないことがあります。 この記事ではThree.jsを利用することを前提に、シェーダーを利用してマテリアルを自作するまでの方法を解説します。 上の2つのリポジトリは、私がシェーダーの学習の過程で製作したものです。先頭のGIFアニメの元のマテリアルもこのリポジトリで公開しています。ご参考までに。 想定する読者 この記事は 現在Three.jsを利用している。 WebGL, GLSLの知識はな