CG関連

【OpenGL】と【DirectX】のバージョンをまとめてみた【シェーダーメイン】【初心者向け】

チームラボみたいな映像がつくりたいなぁ。

なにやら『Unity』でつくられているらしい。

ということを知りまして。

※この映像は『Unity』でつくられているそうです。

チームラボの『Unity本』がでていたので早速買って読んでいたら、

チームラボのUnity本 vol.1

なにやら見慣れない『シェーダー』がいくつも明記されていました。

  • ジオメトリシェーダー
  • コンピュートシェーダー
アオキ
頂点シェーダとフラグメントシェーダは知ってるけど、他にも種類あるの・・?
アオキ
もしかして、私のバージョン古いかも・・?

と思い、ググりにググり、

『シェーダー』のバージョンをまとめてみることにしました。

2020/5/6追記

チームラボ本が無料PDFに変わったようです。

興味ある方はぜひ。

https://github.com/IndieVisualLab/UnityGraphicsProgrammingSeries

Sponsored link

グラフィックス関連の2つの規格とシェーダー言語

グラフィック関連の規格は大きく2つのタイプがあります。

  • OpenGL・・オープンジーエル (Open Graphics Library)
  • DirectX・・ダイレクトエックス

『シェーダー』言語はそれぞれ下記が使われています。

  • OpenGL・・GLSL(OpenGL Shader Language)
  • DirectX・・HLSL(High Level Shading Language)

ウェブでは『GLSL』が使われて、
『Unity』では『HLSL』が使われるようですが、

『シェーダー』言語自体は少し書き方が違うだけ、のようです。

GLSLをHLSLに書き換える

アオキ
同時にやるとこんがらがるので、はじめはどちらかに絞って取り組んで、ある程度把握してから書き換えした方がよさそうです。

OpenGL関連(OpenGLとWebGLとThree.js)のざっくりまとめ


『OpenGL(オープンジーエル)』は『クロノスグループ』が開発元で、

Windows、mac、Unixなどで使用できます。

携帯や家電向けなどの組み込み用途で、

  • OpenGL ES (OpenGL for Embedded Systems)

という規格もあります。

  • 規格・・決まり、ルールといった意味

また、

グーグルクロムなどのウェブブラウザでグラフィクスを表示させるための、

  • WebGL(ウェブジーエル)・・OpenGLを使いやすくしたAPI

という規格もあります。

  • WebGL1.0 ・・ OpenGL ES2.0の派生規格
  • WebGL2.0 ・・ OpenGL ES3.0の派生規格

参考記事

2019年8月現在では、
『WebGL2.0』 の普及率は5割あるかどうかだそうで、
ホームページで3D表現を実施するなら、
まだまだ『WebGL1.0』が無難な選択肢になるようです。

最新WebGL通信 いまキャッチアップしたいWebGL2・WebGPU・WebXRとは

3Dプログラミングが楽に書けると人気の『Three.js』では、
バージョン『R95』から『WebGL2.0』対応されたものの、
基本設定は現在も『WebGL1.0』なので、
『WebGL2.0』を使いたいなら、切り替え設定が必要だそうです。

  • 『Three.js』・・WebGLを使いやすくしたJavaScriptライブラリ

参考記事
How to use WebGL2

また、プログラミング難易度としては易しい順に、

『Three.js』->『WebGL』->『OpenGL』になります。

参考記事
Three.js と WebGL と OpenGL ES で三角形を描いてみる

アオキ
この記事見ると、『Three.js』って簡単なんやなって思えますね・・

参考記事

Sponsored link

DirectX 関連はさらっと

『DirectX(ダイレクトエックス)』は、

マイクロソフトが開発したゲーム・マルチメディア向けに開発された規格です。

元々はウィンドウズのみ対応だったけれど、

現在は3Dライブラリのスタンダート的な立ち位置だそうです。

アオキ
Windowsのパソコンならもれなくインストールされてますな。

OpenGLとDirectXのバージョン整理と比較

Wikipediaを参考にずらっと並べてみました。

まずは『OpenGL』。

  • OpenGL1.1
  • OpenGL1.5 2003年。
  • OpenGL2.x 2004年。GLSL1.0に対応。
  • OpenGL3.x 2008年。
  • OpenGL3.2 2009年。 ジオメトリシェーダ対応
  • OpenGL4.0 2010年。テッセレーションシェーダ
  • OpenGL4.3 2012年。 GPGPU演算シェーダ
  • OpenGL4.7 2017年。
アオキ
知らないシェーダーがいくつも。WebGL1.0で使ってるGLSLは2004年だったんですな。

ちなみにMacでは、2019年現在も『OpenGL4.1』までの対応のようです。

OpenGL および OpenCL グラフィックスを扱う Mac コンピュータ

続いて『DirectX』。

  • DirectX 1.0 1995年
    〜中略〜
  • DirectX 9.0 2002年。 HLSL導入
  • DirectX 10.0 2007年。 ジオメトリシェーダー対応
  • DirectX 11.0 2009年。コンピュートシェーダ、テッセレーション等
  • DirectX 12 2015年。

世代としてはざっくり下記になるようです。

  • OpenGL 2.x ・・ Direct3D 9 ・・プレステ3レベル
  • OpenGL 3.x ・・ Direct3D 10
  • OpenGL 4.x ・・ Direct3D 11 ・・プレステ4レベル
  • Direct3D ・・ DirectXの一部。3Dグラフィックスを描画するAPI。
アオキ
というかプレステ4って2013年発売だったのね、、月日が経つのはあっという間や・・
Sponsored link

OpenGLとDirectXのバージョンまとめてみて

これまでほとんどウェブ関連の『GLSL』を触っていたので、

『シェーダー』といえばてっきり2種類だけかと思っていたのですが、

  • 頂点シェーダー(Vertex Shader)
  • フラグメントシェーダ(Fragment Shader) / ピクセルシェーダ

バージョンが上がるにつれ、

  • ジオメトリシェーダー
  • テッセレーション制御シェーダー
  • テッセレーション評価シェーダー
  • コンピュートシェーダー

などが追加されていることを知りました。

ウェブで表現する場合は、これからもしばらくは『WebGL1.0』でいいのかなと思いつつ、

チームラボ的な『メディアアート』をやろうとするなら、

より高バージョンの『シェーダー』にも触れた方がいいのかなと思ったり。

とはいえ、実のところ、

難しいのは『シェーダー言語』というよりも、『数学』『物理』だったりします。

アオキ
チームラボの『Unity本 vol1』には流体力学(ナビエストークス方程式)がでてきます。(ムズカシイ・・

『ナビエストークス方程式』を把握するには、

  • ベクトル解析(勾配・発散)
  • ベクトル内積
  • 微分(偏微分)
  • 剛体力学

などの知識が必要になってくるので、

学生時代ろくに勉強してなかった身としては、なかなかしんどいところではありつつも、

どうせなら綺麗な映像つくりたいよなぁとも思ったりして、

これからももりもり『シェーダー』に取り組んでいこうと思っとります。

アオキ
とことんやったるどー。

『GLSL(シェーディング)』関係ではこんな記事も読まれています。

1. 【GLSL】プログラムでかっこいい映像をつくりたい! 〜『TouchDesigner』を見据えて

2. 【WebGL】入門 わかりやすく【図解】してみた

3. 【OpenGL】と【DirectX】のバージョンをまとめてみた【シェーダーメイン】【初心者向け】

4. 【GLSL(シェーディング)】でよく使う関数とユーザー関数のまとめ※随時更新

5. 【GLSL】プログラムでかっこいい映像をつくるには『レイマーチング』なるものを覚えればいいらしい

6. 【GLSL】『レイマーチング』入門その1 距離関数とレイとカメラの設定

7. 【GLSL】『レイマーチング』入門(2) 立体的に見せる方法〜光の反射は『内積』で〜

8. 【GLSL】『レイマーチング』入門(3) 距離関数を使ってみる・回転・合成・量産

9. 【TouchDesigner】で『GLSL』を使う方法まとめ【画像あり】

10. 【TouchDesigner】『GLSL MAT』の使い方 3次元でぐりぐり動かしてみる

11. 【GLSL】波のつくり方簡易まとめ。波もプログラムでつくれます【コピペスタイル】

『Unity』関係ではこんな記事も読まれています。

1. 【Unity】本のおすすめはこれで決まり!【初心者向け】1冊をとことんやって次に行きましょ

2. 【Unity】シェーダ入門(サーフェスシェーダ) をまとめてみた。※随時更新

3. 【OpenGL】と【DirectX】のバージョンをまとめてみた【シェーダーメイン】【初心者向け】

4. 【Unity】よく使う用語集【初心者向け】※随時更新

アオキ
ツイッターでも記事ネタ含めちょろちょろ書いていくので、よろしければぜひフォローお願いしますm(_ _ )m

アオキのツイッターアカウント


関連記事一覧 (一部広告あり)

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

アーカイブ

  1. バックエンド

    【Laravel第4弾】Vue.js3(CompositionAPI+Scrip…
  2. データベース

    MySQLの講座をリリースしました
  3. 生成AI

    2024/5/14 OpenAI発表 まとめ
  4. オンライン教材

    ChatGPTをビジネス活用する講座をリリースしました【Udemy】
  5. オンライン教材

    【ChatGPT】エンジニア編をリリースしました
PAGE TOP
Ads Blocker Image Powered by Code Help Pro

広告ブロックを摘出しました!!

ブラウザ拡張を使用して広告をブロックしていることが摘出されました。

ブラウザの広告ブロッカーの機能を無効にするか、
当サイトのドメインをホワイトリストに追加し、「更新」をクリックして下さい。

あなたが広告をブロックする権利があるように、
当方も広告をブロックしている人にコンテンツを提供しない権利と自由があります。

Powered By
Best Wordpress Adblock Detecting Plugin | CHP Adblock