Recommandé
Contenu connexe
Plus de 理玖 川崎
Dernier
Dernier (9)
WAVE_WITH_GLSL
- 2. こんにちは！
- 3. 自己紹介 • RaspBerry Pi 持ってました
- 4. 自己紹介 • RaspBerry Pi 持ってました • はんだ付けに失敗しました
- 5. 自己紹介 • RaspBerry Pi 持ってました • はんだ付けに失敗しました • 新しいの買いました
- 6. 自己紹介 • RaspBerry Pi 持ってました • はんだ付けに失敗しました • 新しいの買いました • Survoblasterしか入ってません
- 7. 自己紹介 • C#に挫折
- 9. 自己紹介 • C#に挫折 • ActionScript + Stage3D
- 10. 自己紹介 • C#に挫折 • ActionScript + Stage3D • よりネイティブなコートが書きたい
- 11. 自己紹介 • C#に挫折 • ActionScript + Stage3D • よりネイティブなコートが書きたい • →C++
- 12. 自己紹介 • C#に挫折 • ActionScript + Stage3D • よりネイティブなコートが書きたい • →C++ SDL Opengl
- 13. 自己紹介 • C#に挫折 • ActionScript + Stage3D • よりネイティブなコートが書きたい • →C++ SDL Opengl GLSL
- 14. 自己紹介 • C#に挫折 • ActionScript + Stage3D • よりネイティブなコートが書きたい • →C++ SDL Opengl GLSL
- 15. WAVE_WITH_GLSL
- 19. GLSLとは • GLSL (OpenGL Shading Language) は GLslangとしても知られ、C言語をベー スとした高レベルシェーディング言語 である。これはアセンブリ言語やハー ドウェアに依存した言語を使わないで、 開発者がグラフィックスパイプライン を直接制御できるようにOpenGL ARB で策定された。 • Wikipediaより引用
- 20. GLSLとは • GLSL (OpenGL Shading Language) はGLslangとしても知られ、C言語を ベースとした高レベルシェーディング 言語である。これはアセンブリ言語や ハードウェアに依存した言語を使わな いで、開発者がグラフィックスパイプ ラインを直接制御できるようにOpenGL ARBで策定された。 • Wikipediaより引用
- 21. OpenGLって何？
- 22. OpenGLとは • OpenGL（オープンジーエル、Open Graphics Library）は、Khronosグルー プが策定しているグラフィックスハー ドウェアのアプリケーションプログラ ミングインタフェース (API)。2次元・3 次元コンピュータグラフィックス両方 が扱える。 • Wikipediaより引用
- 24. まとめると OpenGLとは
- 27. OpenGLとは • 高品質なグラフィックスが • 速く、 • フリーで、
- 28. OpenGLとは • 高品質なグラフィックスが • 速く、 • フリーで、 • いろいろなところで使える。
- 29. OpenGLとは • 高品質なグラフィックスが • 速く、 • フリーで、 • いろいろなところで使える。 • たまに違うバージョン使うとで自分が 使ってたAPIが非推奨でつらくなる APIは簡単だよ！！
- 30. GLSLとは • GLSL (OpenGL Shading Language) は GLslangとしても知られ、C言語をベー スとした高レベルシェーディン グ言語である。これはアセンブリ言 語やハードウェアに依存した言語を使 わないで、開発者がグラフィックスパ イプラインを直接制御できるように OpenGL ARBで策定された。 • Wikipediaより引用
- 31. シェーディング言語って 何？
- 34. まとめると GLSLとは
- 37. GLSLの仕組み
- 40. GLSLの仕組み • プログラム • ↓ いろいろなデータ • 頂点シェーダー • ↓ いろいろなデータ • フラグメントシェーダー • ↓ 色情報 • 画面
- 41. いろいろなデータって 何？
- 42. いろいろなデータ • 頂点情報
- 44. いろいろなデータ • 頂点情報 • テクスチャ • 変換行列
- 45. いろいろなデータ • 頂点情報 • テクスチャ • 変換行列 •なんでも送れるよ
- 49. 頂点シェーダーでの変形
- 53. どうやって変形するか
- 54. パーリンノイズ
- 56. 何が偉いの？
- 60. パーリンノイズ • 空間上の点Xでの乱数を取得する。 • 空間内に格子があると考える。 • それぞれの格子点からランダムな方向 に正規ベクトルが伸びていると考える
- 64. パーリンノイズ • 恥ずかしながら自分の実装は重すぎて 使い物にならなりませんでした • https://github.com/ashima/webgl-noise から拝借させていただきました。
- 68. フラグメントシェーダー
- 70. スカイボックスって何？
- 76. 反射ベクトルの求め方
- 78. 反射ベクトル • 法線ベクトルをN、入射ベクトルをVと 置くと、 • 𝑁 × 2 × 𝑑𝑜𝑡(−𝑉, 𝑁) + 𝑉 • で求まる。
- 80. 屈折ベクトルの求め方
- 81. スネルの法則
- 85. 屈折ベクトル • スネルの法則を使って計算する。 • 簡単のため、屈折率の比を n (= sin(β) sin(α) ) と定義する
- 87. 屈折ベクトル • V、N、nから屈折ベクトルを求める • cos(α) = 𝑑𝑜𝑡(−𝑉, 𝑁) • cos(β) = 1 − 𝑛2(1 − 𝑐𝑜𝑠2(α))
- 88. 屈折ベクトル • V、N、nから屈折ベクトルを求める • cos(α) = 𝑑𝑜𝑡(−𝑉, 𝑁) • cos(β) = 1 − 𝑛2(1 − 𝑐𝑜𝑠2(α)) • 𝑉 × 𝑛 + n × cos α − cos β × 𝑁 と求まる
- 91. フレネル効果って何？
- 93. フレネルの式
- 96. フレネルの式 • sin 𝛼−𝛽 sin 𝛼+𝛽 2 + tan 𝛼−𝛽 tan 𝛼+𝛽 2 2 • で求められる。
- 98. フレネルの式 • VとNから求める • cos α , cos β , 𝑛 から求まればよい
- 99. フレネルの式 • VとNから求める • cos α , cos β , 𝑛 から求まればよい • 展開すると・・・
- 100. フレネルの式 • VとNから求める • cos α , cos β , 𝑛 から求まればよい • 展開すると・・・ • n×cos α −cos(β) n×cos α +cos(β) 2 + n×cos β −cos(α) n×cos β +cos(α) 2 2
- 103. まとめ
- 106. まとめ • GLSLを使うと簡単に効果を作れる • 可能性は無限大 • GLSLの波はまだ中高生にはあまり届い ていない？
- 109. 友人Kとの会話 • 僕「画像処理もGLSLでやろう！」 • K「並行処理で常勝！」 • 僕「・・・」
- 110. みんなOpenGLやろう！