├── .gitignore ├── README.en.md ├── README.md └── images ├── DiffuseBRDFPlotv1.png ├── DiffuseBRDFv3.png ├── EffectTextureMaker.png ├── RelationshipOfDepthValue.png └── rayt.png /.gitignore: -------------------------------------------------------------------------------- 1 | *.untrack -------------------------------------------------------------------------------- /README.en.md: -------------------------------------------------------------------------------- 1 | # NOTICE 2 | 3 | This site has been moved to below: 4 | 5 | - https://mebiusbox.github.io/docs/lab/article 6 | 7 | 8 | # Publications 9 | 10 | ## Articles (PDF) 11 | 12 | [docs - https://github.com/mebiusbox/docs](https://github.com/mebiusbox/docs) 13 | 14 | ## Articles (Qiita) 15 | 16 | - [Basic of Physically-based Rendering (Japanese)](https://qiita.com/mebiusbox2/items/e7063c5dfe1424e0d01a) 17 | - [Basic of Physically-based Rendering(Implementation)(Japanese)](https://qiita.com/mebiusbox2/items/8a4734ab5b0854528789) 18 | - [Diffuse BRDF (Japanese)](https://qiita.com/mebiusbox2/items/1cd65993ffb546822213) 19 | - [Specular BRDF (Japanese)](https://qiita.com/mebiusbox2/items/8db00cdcaf263992a5ce) 20 | - [Raytracing vol.1 "Ray and Reflection" (Japanese)](https://qiita.com/mebiusbox2/items/89e2db3b24e4c39502fe) 21 | - [Raytracing vol.2 "Texture and Cornel Box" (Japanese)](https://qiita.com/mebiusbox2/items/33421b49c05df0b95fb0) 22 | - [Raytracing vol.3 "Monte Carlo Raytracing" (Japanese)](https://qiita.com/mebiusbox2/items/5a388ef4d5089568a529) 23 | - [Probability and Statistics for Computer Graphics (Japanese)](https://qiita.com/mebiusbox2/items/1b69ccf5d76b173350e5) 24 | - [Probability for Computer Graphics #1 (Japanese)](https://qiita.com/mebiusbox2/items/bc1a150b8f5789e5e0d5) 25 | - [Probability for Computer Graphics #2 (Japanese)](https://qiita.com/mebiusbox2/items/3852324532bd3ca88351) 26 | - [A primer of Linear Algebra for Computer Graphics -Vector- (Japanese)](https://qiita.com/mebiusbox2/items/172131bf95da172d1371) 27 | - [A primer of Linear Algebra for Computer Graphics -Matrix- (Japanese)](https://qiita.com/mebiusbox2/items/5941801416e8a6993851) 28 | - [A primer of Linear Algebra for Computer Graphics -Determinant- (Japanese)](https://qiita.com/mebiusbox2/items/191dcbead5d927f9b557) 29 | - [A primer of Fourier Transform -Fourier series- (Japanese)](https://qiita.com/mebiusbox2/items/657df6e458d85303e50d) 30 | - [Quaternion for Computer Graphics (Japanese)](https://qiita.com/mebiusbox2/items/2fa0f0a9ca1cf2044e82) 31 | - [glTF note (Japanese)](https://qiita.com/mebiusbox2/items/c6b1c1f401a8df8df552) 32 | - [Check UTF-8BOM with Hook Script of Git (Windows) (Japanese)](https://qiita.com/mebiusbox2/items/a1092b7bdd4af50e4bc9) 33 | - [How to use markdown (Japanese)](https://qiita.com/mebiusbox2/items/7341b13579133dc6b018) 34 | - [Generating document with MkDocs (Japanese)](https://qiita.com/mebiusbox2/items/a61d42878266af969e3c) 35 | 36 | ## Images 37 | 38 | (Click on the image, it will be displayed in the actual size) 39 | 40 | ### Diffuse BRDF v3 41 | 42 | 43 | 44 | ### Diffuse BRDF Plot v1 45 | 46 | 47 | 48 | Source code: [brdf_plot](https://github.com/mebiusbox/brdf_plot) 49 | 50 | ### Relationship of depth value (Three.js) 51 | 52 | 53 | 54 | ## pixy.js 55 | 56 | My shader and utility library for three.js. 57 | 58 | ### Features 59 | 60 | - PBR(Diffuse: Lambert or Oren-Nayar, Specular: Cook-Torrance) 61 | - Deferred Shading (use three.js custom version) 62 | 63 | ### Examples 64 | 65 | - [Phong Shading](http://mebiusbox.github.io/contents/pixyjs/samples/shader_phong.html) 66 | - [Texture Mapping](http://mebiusbox.github.io/contents/pixyjs/samples/shader_texture.html) 67 | - [Glass](http://mebiusbox.github.io/contents/pixyjs/samples/shader_glass.html) 68 | - [Fog, RimLight, Light Map](http://mebiusbox.github.io/contents/pixyjs/samples/shader_fog.html) 69 | - [Displacement Map, Inner Glow, Line Glow](http://mebiusbox.github.io/contents/pixyjs/samples/shader_displacement.html) 70 | - [Inner Glow](http://mebiusbox.github.io/contents/pixyjs/samples/shader_innerglow.html) 71 | - [UV Projection](http://mebiusbox.github.io/contents/pixyjs/samples/shader_projection.html) 72 | - [Velvet, Distortion, UV Scroll](http://mebiusbox.github.io/contents/pixyjs/samples/shader_velvet.html) 73 | - [Scattering, Ocean](http://mebiusbox.github.io/contents/pixyjs/samples/shader_sky.html) 74 | - [PBR (based on UE4, Oren-Nayar)](http://mebiusbox.github.io/contents/pixyjs/samples/shader_standard.html) 75 | - [Overlay](http://mebiusbox.github.io/contents/pixyjs/samples/shader_overlay.html) 76 | - [Grass, Shadowed, Instance](http://mebiusbox.github.io/contents/pixyjs/samples/shader_grass.html) 77 | - [Deferred, Bloom, Tone Mapping](http://mebiusbox.github.io/contents/pixyjs/samples/shader_deferred.html) 78 | - [Sphere Area Light (roughness hack)](http://mebiusbox.github.io/contents/pixyjs/samples/shader_area_light_hack.html) 79 | - [Tube Area Light (roughness hack)](http://mebiusbox.github.io/contents/pixyjs/samples/shader_tube_light_hack.html) 80 | - [Area Light](http://mebiusbox.github.io/contents/pixyjs/samples/shader_area_light.html) 81 | - [Parallax, Distortion](http://mebiusbox.github.io/contents/pixyjs/samples/shader_parallax.html) 82 | - [Parallax occlusion mapping, Relief mapping](http://mebiusbox.github.io/contents/pixyjs/samples/shader_parallax_occlusion.html) 83 | - [Soft, GPU Particle](http://mebiusbox.github.io/contents/pixyjs/samples/softparticle.html) 84 | - [Dithering](http://mebiusbox.github.io/contents/pixyjs/samples/shader_dither.html) 85 | - [Tone Mapping](http://mebiusbox.github.io/contents/pixyjs/samples/shader_tonemap.html) 86 | - [Color Balance](http://mebiusbox.github.io/contents/pixyjs/samples/shader_colorbalance.html) 87 | 88 | ## Shader 89 | 90 | - [PBR (Lambert, Cook-Torrance, Clear-coat, Anisotropic, Multi-scattering microfacet BRDF)](http://mebiusbox.github.io/contents/pbrwip/) 91 | 92 | ## EffectTextureMaker 93 | 94 | [EffectTextureMaker](http://mebiusbox.github.io/contents/EffectTextureMaker/) is generating texture tool on the web browser. This tool you can make a lot of vfx textures and you can also make animated sprites sheet. [more](http://mebiusbox.github.io/software/2017/01/06/EffectTextureMaker.html) 95 | 96 | The texture generated with EffectTextureMaker can be freely used for commercial and non-commercial products. The texture is licensed under the CC0. 97 | 98 | 99 | 100 | ### Features 101 | 102 | - A lot of type of template for vfx texture. 103 | - Make a normal map. 104 | - Make a animated sprites sheet. 105 | - You can save as image format supported by the web browser. 106 | - Support image maximum of 2048 sizes. 107 | - Support color balance adjustment. 108 | 109 | ## rayt 110 | 111 | This is source code of my ray tracing articles. 112 | 113 | [rayt - https://github.com/mebiusbox/rayt](https://github.com/mebiusbox/rayt) 114 | 115 | ![](./images/rayt.png) 116 | 117 | ## pixyrt 118 | 119 | A simple raytracing renderer in c++. 120 | 121 | [pixyrt - https://github.com/mebiusbox/pixyrt](https://github.com/mebiusbox/pixyrt) 122 | 123 | ## Links 124 | 125 | ### Rendering 126 | 127 | - [The Research and Development Department in tri-Ace](http://research.tri-ace.com/) 128 | - [LIBRARY | テクノロジー推進部 ADVANCED TECHNOLOGY DIVISION | SQUARE ENIX](http://www.jp.square-enix.com/tech/publications.html) 129 | - [講演資料 | シリコンスタジオ](https://www.siliconstudio.co.jp/rd/presentations/) 130 | - [CEDiL](https://cedil.cesa.or.jp/search) 131 | 132 | ### Texture 133 | 134 | - [Compressonator](https://github.com/GPUOpen-Tools/Compressonator) : Tool suite for Texture and 3D Model Compression, Optimization and Analysis using CPUs, GPUs and APUs 135 | - [DirectXTex](https://github.com/Microsoft/DirectXTex) : DirectXTex texture processing library 136 | - [dds_thumbnail](https://github.com/oteguro/dds_thumbnail) : DirectX 11のテクスチャ圧縮フォーマットBC1～BC7をサムネイル表示 137 | - [DDS ファイルフォーマットの詳細解説](http://dench.flatlib.jp/ddsformat) 138 | - [DDSファイルを自力で読んでみよう](http://techblog.sega.jp/entry/2016/12/26/100000) 139 | - [DirectX 11の圧縮フォーマットBC1～BC7について（前編）](http://www.webtech.co.jp/blog/optpix_labs/format/6993/) 140 | - [DirectX 11の圧縮フォーマットBC1～BC7について（後編）](http://www.webtech.co.jp/blog/optpix_labs/format/7006/) 141 | - [DDS Susie Plugin](https://www.dropbox.com/s/njhn5ckk7r98gzr/ifDirectXTex.zip?dl=0) : BC1～BC7対応 142 | 143 | ### Book 144 | 145 | - [フォトンマッピング](https://www.amazon.co.jp/dp/4274079503) 146 | - [なるほど微積分](https://www.amazon.co.jp/dp/4875252005) 147 | - [ゼロから学ぶ線形代数](https://www.amazon.co.jp/dp/4061546538/) 148 | - [ゼロから学ぶ微分積分](https://www.amazon.co.jp/dp/406154652X/) 149 | - [富田の英文読解１００の原則 上](https://www.amazon.co.jp/dp/4479190465/) 150 | - [富田の英文読解１００の原則 下](https://www.amazon.co.jp/dp/4479190473/) -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # お知らせ 2 | 3 | 以下の場所に移動しました． 4 | 5 | - https://mebiusbox.github.io/docs/lab/article 6 | 7 | 8 | # 公開しているもの 9 | 10 | ## 書いたもの(PDF) 11 | 12 | [docs - https://github.com/mebiusbox/docs](https://github.com/mebiusbox/docs) 13 | 14 | ## 書いたもの(Qiita) 15 | 16 | - [基礎からはじめる物理ベースレンダリング](https://qiita.com/mebiusbox2/items/e7063c5dfe1424e0d01a) 17 | - [基礎からはじめる物理ベースレンダリング（実装編）](https://qiita.com/mebiusbox2/items/8a4734ab5b0854528789) 18 | - [拡散BRDF](https://qiita.com/mebiusbox2/items/1cd65993ffb546822213) 19 | - [鏡面BRDF](https://qiita.com/mebiusbox2/items/8db00cdcaf263992a5ce) 20 | - [レイトレーシング入門１「光線の基本と反射」](https://qiita.com/mebiusbox2/items/89e2db3b24e4c39502fe) 21 | - [レイトレーシング入門２「テクスチャとコーネルボックス」](https://qiita.com/mebiusbox2/items/33421b49c05df0b95fb0) 22 | - [レイトレーシング入門３「モンテカルロレイトレーシング」](https://qiita.com/mebiusbox2/items/5a388ef4d5089568a529) 23 | - [CGのための確率・統計入門](https://qiita.com/mebiusbox2/items/1b69ccf5d76b173350e5) 24 | - [CGのための確率　前編](https://qiita.com/mebiusbox2/items/bc1a150b8f5789e5e0d5) 25 | - [CGのための確率　後編](https://qiita.com/mebiusbox2/items/3852324532bd3ca88351) 26 | - [CGのための線形代数入門　ベクトル編](https://qiita.com/mebiusbox2/items/172131bf95da172d1371) 27 | - [CGのための線形代数入門　行列編](https://qiita.com/mebiusbox2/items/5941801416e8a6993851) 28 | - [CGのための線形代数入門　行列式編](https://qiita.com/mebiusbox2/items/191dcbead5d927f9b557) 29 | - [CGのためのフーリエ変換　フーリエ級数編](https://qiita.com/mebiusbox2/items/657df6e458d85303e50d) 30 | - [CGのためのクォータニオン](https://qiita.com/mebiusbox2/items/2fa0f0a9ca1cf2044e82) 31 | - [glTF覚え書き](https://qiita.com/mebiusbox2/items/c6b1c1f401a8df8df552) 32 | - [GitのフックスクリプトでUTF-8BOMチェック(Windows)](https://qiita.com/mebiusbox2/items/a1092b7bdd4af50e4bc9) 33 | - [Markdown活用法](https://qiita.com/mebiusbox2/items/7341b13579133dc6b018) 34 | - [MkDocsによるドキュメント作成](https://qiita.com/mebiusbox2/items/a61d42878266af969e3c) 35 | 36 | ## 画像 37 | 38 | 画像をクリックすると，本サイズの大きさで表示されます． 39 | 40 | ### Diffuse BRDF v3 41 | 42 | 43 | 44 | ### Diffuse BRDF Plot v1 45 | 46 | 47 | 48 | ソースコード：[brdf_plot](https://github.com/mebiusbox/brdf_plot) 49 | 50 | ### 深度値の関係 (Three.js) 51 | 52 | 53 | 54 | ## pixy.js 55 | 56 | Three.js 用の独自シェーダとユーティリティライブラリです． 57 | 58 | ### 機能 59 | 60 | - 物理ベースレンダリング（拡散反射：ランバート，オーレン・ナイヤー，鏡面反射：クック・トランス） 61 | - ディファードシェーディング（three.js の MRT カスタムバージョンを使用） 62 | 63 | ### サンプル 64 | 65 | - [フォン・シェーディング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_phong.html) 66 | - [テクスチャマッピング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_texture.html) 67 | - [ガラス](http://mebiusbox.github.io/contents/pixyjs/samples/shader_glass.html) 68 | - [フォグ，リムライト，ライトマップ](http://mebiusbox.github.io/contents/pixyjs/samples/shader_fog.html) 69 | - [ディスプレイスメントマップ，インナーグロー，ライングロー](http://mebiusbox.github.io/contents/pixyjs/samples/shader_displacement.html) 70 | - [インナーグロー](http://mebiusbox.github.io/contents/pixyjs/samples/shader_innerglow.html) 71 | - [投影マッピング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_projection.html) 72 | - [ベルベット，歪み，ＵＶスクロール](http://mebiusbox.github.io/contents/pixyjs/samples/shader_velvet.html) 73 | - [大気散乱，海](http://mebiusbox.github.io/contents/pixyjs/samples/shader_sky.html) 74 | - [物理ベースレンダリング（ＵＥ４ベース，オーレン・ナイヤー）](http://mebiusbox.github.io/contents/pixyjs/samples/shader_standard.html) 75 | - [オーバーレイ](http://mebiusbox.github.io/contents/pixyjs/samples/shader_overlay.html) 76 | - [草，影，インスタンス](http://mebiusbox.github.io/contents/pixyjs/samples/shader_grass.html) 77 | - [ディファード，ブルーム，トーンマッピング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_deferred.html) 78 | - [球状エリアライト（ラフネスハック）](http://mebiusbox.github.io/contents/pixyjs/samples/shader_area_light_hack.html) 79 | - [線状エリアライト（ラフネスハック）](http://mebiusbox.github.io/contents/pixyjs/samples/shader_tube_light_hack.html) 80 | - [エリアライト](http://mebiusbox.github.io/contents/pixyjs/samples/shader_area_light.html) 81 | - [視差，歪み](http://mebiusbox.github.io/contents/pixyjs/samples/shader_parallax.html) 82 | - [視差オクリュージョン，リリーフマッピング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_parallax_occlusion.html) 83 | - [ソフト，ＧＰＵパーティクル](http://mebiusbox.github.io/contents/pixyjs/samples/softparticle.html) 84 | - [ディザリング](http://mebiusbox.github.io/contents/pixyjs/samples/shader_dither.html) 85 | - [トーンマップ](http://mebiusbox.github.io/contents/pixyjs/samples/shader_tonemap.html) 86 | - [カラーバランス](http://mebiusbox.github.io/contents/pixyjs/samples/shader_colorbalance.html) 87 | 88 | ## シェーダ 89 | 90 | - [PBR (Lambert, Cook-Torrance, Clear-coat, Anisotropic, Multi-scattering microfacet BRDF)](http://mebiusbox.github.io/contents/pbrwip/) 91 | 92 | ## EffectTextureMaker 93 | 94 | [EffectTextureMaker](http://mebiusbox.github.io/contents/EffectTextureMaker/) は，ブラウザで主にエフェクト用のテクスチャを作成することができるものです．様々な種類のテンプレートを選択して，適当にパラメータを調整するだけで，簡単かつ直感的にテクスチャを作成することができます．また，アニメーションにも対応しており，特定のフレームごとにレンダリングした画像をまとめたスプライトシートも作成することができます．さらに詳しいことは [この記事](http://mebiusbox.github.io/software/2017/01/06/EffectTextureMaker.html) を参照してください． 95 | 96 | EffectTextureMaker で作成したテクスチャは商用・非商用問わず，自由に使ってもらって構いません．作成したテクスチャは CC0 (Creative Commons Zero) が適用されます． 97 | 98 | 99 | 100 | ### 機能 101 | 102 | - 66種類のエフェクトテンプレートがあります 103 | - セーブ・ロード機能 104 | - ノーマルマップを作成することができます 105 | - スプライトシートを作成することができます 106 | - ブラウザがサポートしている画像形式で保存することができます 107 | - 最大 2048 サイズに対応しています 108 | - カラーバランス調整により，色の指定をハイライト，中間，シャドウの３つに分けて行うことができます 109 | 110 | ## rayt 111 | 112 | 「レイトレーシング入門」シリーズのソースコードです． 113 | 114 | [rayt - https://github.com/mebiusbox/rayt](https://github.com/mebiusbox/rayt) 115 | 116 | ![](./images/rayt.png) 117 | 118 | ## pixyrt 119 | 120 | 学習用に作ったレイトレーシングレンダラーです． 121 | 122 | [pixyrt - https://github.com/mebiusbox/pixyrt](https://github.com/mebiusbox/pixyrt) 123 | 124 | ## リンク 125 | 126 | 127 | ## Rendering 128 | 129 | - [The Research and Development Department in tri-Ace](http://research.tri-ace.com/) 130 | - [LIBRARY | テクノロジー推進部 ADVANCED TECHNOLOGY DIVISION | SQUARE ENIX](http://www.jp.square-enix.com/tech/publications.html) 131 | - [講演資料 | シリコンスタジオ](https://www.siliconstudio.co.jp/rd/presentations/) 132 | - [CEDiL](https://cedil.cesa.or.jp/search) 133 | 134 | ## Texture 135 | 136 | - [Compressonator](https://github.com/GPUOpen-Tools/Compressonator) : Tool suite for Texture and 3D Model Compression, Optimization and Analysis using CPUs, GPUs and APUs 137 | - [DirectXTex](https://github.com/Microsoft/DirectXTex) : DirectXTex texture processing library 138 | - [dds_thumbnail](https://github.com/oteguro/dds_thumbnail) : DirectX 11のテクスチャ圧縮フォーマットBC1～BC7をサムネイル表示 139 | - [DDS ファイルフォーマットの詳細解説](http://dench.flatlib.jp/ddsformat) 140 | - [DDSファイルを自力で読んでみよう](http://techblog.sega.jp/entry/2016/12/26/100000) 141 | - [DirectX 11の圧縮フォーマットBC1～BC7について（前編）](http://www.webtech.co.jp/blog/optpix_labs/format/6993/) 142 | - [DirectX 11の圧縮フォーマットBC1～BC7について（後編）](http://www.webtech.co.jp/blog/optpix_labs/format/7006/) 143 | - [DDS Susie Plugin](https://www.dropbox.com/s/njhn5ckk7r98gzr/ifDirectXTex.zip?dl=0) : BC1～BC7対応 144 | 145 | ## Book 146 | 147 | - [フォトンマッピング](https://www.amazon.co.jp/dp/4274079503) 148 | - [なるほど微積分](https://www.amazon.co.jp/dp/4875252005) 149 | - [ゼロから学ぶ線形代数](https://www.amazon.co.jp/dp/4061546538/) 150 | - [ゼロから学ぶ微分積分](https://www.amazon.co.jp/dp/406154652X/) 151 | - [富田の英文読解１００の原則 上](https://www.amazon.co.jp/dp/4479190465/) 152 | - [富田の英文読解１００の原則 下](https://www.amazon.co.jp/dp/4479190473/) -------------------------------------------------------------------------------- /images/DiffuseBRDFPlotv1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mebiusbox/lab/3160f56316391b5772646590e36331ca4890110c/images/DiffuseBRDFPlotv1.png -------------------------------------------------------------------------------- /images/DiffuseBRDFv3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mebiusbox/lab/3160f56316391b5772646590e36331ca4890110c/images/DiffuseBRDFv3.png -------------------------------------------------------------------------------- /images/EffectTextureMaker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mebiusbox/lab/3160f56316391b5772646590e36331ca4890110c/images/EffectTextureMaker.png -------------------------------------------------------------------------------- /images/RelationshipOfDepthValue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mebiusbox/lab/3160f56316391b5772646590e36331ca4890110c/images/RelationshipOfDepthValue.png -------------------------------------------------------------------------------- /images/rayt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mebiusbox/lab/3160f56316391b5772646590e36331ca4890110c/images/rayt.png --------------------------------------------------------------------------------