Submit Search
Upload
OpenGL ES2.0 一問一答
•
Download as PPTX, PDF
•
7 likes
•
4,216 views
Takashi Komada
Follow
Introduction to OpenGL ES2.0 from new view. OpenGL ES2.0の新しい切り口からの入門です。
Read less
Read more
Technology
Slideshow view
Report
Share
Slideshow view
Report
Share
1 of 24
Download now
Recommended
ゲーム開発とデザインパターン
ゲーム開発とデザインパターン
Takashi Komada
ゲーム開発とMVC
ゲーム開発とMVC
Takashi Komada
ゆるロボ製作所開発事例 – ドローコール削減
ゆるロボ製作所開発事例 – ドローコール削減
Mikito Yoshiya
ゲームオブジェクトの管理
ゲームオブジェクトの管理
Shota Homma
関数型プログラミング入門 for Matlab ユーザー
関数型プログラミング入門 for Matlab ユーザー
Ichiro Maruta
本当のオブジェクト指向は可読性を上げる
本当のオブジェクト指向は可読性を上げる
Wataru Terada
オブジェクト指向エクササイズのススメ
オブジェクト指向エクササイズのススメ
Yoji Kanno
What, Why, How Create OSS Libraries - 過去に制作した30のライブラリから見るC#コーディングテクニックと個人OSSの...
What, Why, How Create OSS Libraries - 過去に制作した30のライブラリから見るC#コーディングテクニックと個人OSSの...
Yoshifumi Kawai
Recommended
ゲーム開発とデザインパターン
ゲーム開発とデザインパターン
Takashi Komada
ゲーム開発とMVC
ゲーム開発とMVC
Takashi Komada
ゆるロボ製作所開発事例 – ドローコール削減
ゆるロボ製作所開発事例 – ドローコール削減
Mikito Yoshiya
ゲームオブジェクトの管理
ゲームオブジェクトの管理
Shota Homma
関数型プログラミング入門 for Matlab ユーザー
関数型プログラミング入門 for Matlab ユーザー
Ichiro Maruta
本当のオブジェクト指向は可読性を上げる
本当のオブジェクト指向は可読性を上げる
Wataru Terada
オブジェクト指向エクササイズのススメ
オブジェクト指向エクササイズのススメ
Yoji Kanno
What, Why, How Create OSS Libraries - 過去に制作した30のライブラリから見るC#コーディングテクニックと個人OSSの...
What, Why, How Create OSS Libraries - 過去に制作した30のライブラリから見るC#コーディングテクニックと個人OSSの...
Yoshifumi Kawai
デキるプログラマだけが知っているコードレビュー7つの秘訣
デキるプログラマだけが知っているコードレビュー7つの秘訣
Masahiro Nishimi
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
Koichi Tanaka
ドメイン駆動設計のためのオブジェクト指向入門
ドメイン駆動設計のためのオブジェクト指向入門
増田 亨
オブジェクト指向の設計と実装の学び方のコツ
オブジェクト指向の設計と実装の学び方のコツ
増田 亨
「速」を落とさないコードレビュー
「速」を落とさないコードレビュー
Takafumi ONAKA
OpenGLと行列
OpenGLと行列
miyosuda
OpenGLと行列
OpenGLと行列
miyosuda
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
Hiroshi Tomioka
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
sugiuralab
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
More Related Content
Viewers also liked
デキるプログラマだけが知っているコードレビュー7つの秘訣
デキるプログラマだけが知っているコードレビュー7つの秘訣
Masahiro Nishimi
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
Koichi Tanaka
ドメイン駆動設計のためのオブジェクト指向入門
ドメイン駆動設計のためのオブジェクト指向入門
増田 亨
オブジェクト指向の設計と実装の学び方のコツ
オブジェクト指向の設計と実装の学び方のコツ
増田 亨
「速」を落とさないコードレビュー
「速」を落とさないコードレビュー
Takafumi ONAKA
OpenGLと行列
OpenGLと行列
miyosuda
OpenGLと行列
OpenGLと行列
miyosuda
Viewers also liked
(7)
デキるプログラマだけが知っているコードレビュー7つの秘訣
デキるプログラマだけが知っているコードレビュー7つの秘訣
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
ドメイン駆動設計のためのオブジェクト指向入門
ドメイン駆動設計のためのオブジェクト指向入門
オブジェクト指向の設計と実装の学び方のコツ
オブジェクト指向の設計と実装の学び方のコツ
「速」を落とさないコードレビュー
「速」を落とさないコードレビュー
OpenGLと行列
OpenGLと行列
OpenGLと行列
OpenGLと行列
Recently uploaded
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
Hiroshi Tomioka
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
sugiuralab
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
Recently uploaded
(9)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版) 2024年4月作成
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
OpenGL ES2.0 一問一答
1.
OpenGL ES2.0 一問一答 もんぐり
2.
最初に ・私はOpenGLや3Dグラフィックスについてはまだまだ勉強中です。 誤った言葉づかいや間違った説明をしたときは優しく優しくご指摘ください。 ・私よりも詳しい方は社内におられると思います。私はグラフィックス関連 の技術や理論が大好きなので是非ご指導ご鞭撻いただきたく。 ・この分野が好きな人は一緒に何かして遊びましょう
3.
OpenGLとは? 「標準化団体Khronosグループが策定しているグラフィックスハードウェア 用のAPI。2次元・3次元コンピュータグラフィックス両方が扱える。」 ・仕様がオープン。 ・APIを実装するのはGPUのベンダー。 ・OpenGL ESは、組み込み機器向けのサブセット。 ・cocos2d-xやUnityは、iOSとAndroidではOpenGL ES2.0を使用している。
4.
ここでいうグラフィックスハードウェアとは? ディスプレイ描画や画像処理や3D処理を担当するハードウェア。 GPU、VRAMなどで構成される。 ・PCのグラフィックスハードウェア 価格や用途により複数パターンあり -ビデオカード(グラフィックカード)としてマザーボードと独立 -オンボードとしてマザーボードに一体化 -VRAMやGPU自体が独立して存在せずメインメモリやCPUと一体型 ・スマホのグラフィックスハードウェア -GPUはCPUと別だがVRAMがメインメモリと物理的に一体というケース が多い。
5.
「Graphics Processing Unit(グラフィックス
プロセッシング ユニット、略してGPU)とは、パー ソナルコンピュータやワークステーション等の画像処理を担当する主要な部品のひとつ。 現在の高機能GPUは高速のVRAMと接続され、グラフィックスシェーディングに特化した演算器を複 数搭載するマイクロプロセッサとなっている。」 GPUとCPUの関係はサーバとクライアント、 GPUはCPUに画像処理を委託され、従属して動作する。 OpenGLはGPU制御用のAPIと考えて良い。 GPUとは? CPU GPU メイン メモリ VRAM兼用 ディス プレイ
6.
iPhone5SのプロセッサA7の画像 CPU:デュアルコア1.3GHz ARMv8、GPU:PowerVRG6430 ※画像出典 EE TimesJapan 「iPhone
5sのプロセッサ「A7」 を解析」
7.
GPUとCPUの違いって? CPU GPU コア数 一、二桁(2コア)
三、四桁(100程度) できること 豊富 浮動小数点ベクトル演算くらい ()内はA7の例 GPUは3Dモデルや画像データ(どちらも浮動小数点ベクトルデータ)の大量 並列演算に特化している
8.
GPUって本当に必要なのか? ゲームをすべてCPUで処理するとどうなるか ・全頂点の位置計算 例:社内製スマホ3Dゲームのキャラクター3Dモデル 一体、3000〜5000頂点 ・画面の全ピクセルでのブレンドやz座標を考慮した表示色の計算 例:iPhone4S 640×960 = 65万ピクセル 60FPS=0.016秒以内でこれらの浮動小数点数ベクトルのデータをつぎつぎに 扱う 大量並列演算のできる専用のハードウェアを使わないと負荷が大きい
9.
スマホのGPUは? Tegraシリーズ(NVIDIA) Nexus7など Maliシリーズ(ARM) Galaxy S3αなど Adrenoシリーズ(Qualcomm) Nexus5など PowerVRシリーズ(Imagination Technolygies) Galaxy
Nexus、iOS端末一般など ※cocos2d-xでは起動時にGPUのプロファイルをログ出力するよ! ※PCではGPU市場はNVIDIAとAMDの寡占状態
10.
OpenGL ES2.0で何ができるのか? ・点、線、三角形を描画する ・テクスチャをはりつける 他にもいろいろあるが、主要な機能はこんなもの。低レベルなAPI。 低レベルAPIだからこそハードウェアの性能を引き出せるし、カスタマイズが きく → ハイエンドだったりリアルタイムなグラフィックスレンダリング向き (OSの用意した高レベルグラフィックスAPIやウィンドウシステムは遅く、 カスタマイズに制限がある)
11.
OpenGL以外のGPU用APIは? ・DirectX(Direct3D) MicrosoftのAPI ・Metal iOS8と同時に発表されたiOSデバイス専用の薄いAPI ・GPUベンダーの自社製品用に開発されたAPI CUDA(NVIDIA)、Mantle(AMD)など
12.
OpenGL ES2.0の描画の手順って? 最終的に、ディスプレイに表示するピクセルデータ(フレームバッファ)を 用意すればよい。 ①フレームバッファのクリア ②3Dモデルごとにレンダリングパイプラインを実行してフレームバッファに 描画していき、最終的画面描画を完成させる ③フレームバッファのディスプレイへの反映 ※これはOpenGL ES2.0の仕事ではなく、OSのAPIを用いる 上記を毎フレーム行う。2Dの場合もz座標がないだけで流れは同じ。 ※厳密にはフレームバッファを直接ディスプレイには反映しない(ダブルバ ッファリング)
13.
レンダリングパイプラインとは? グラフィックスハードウェアの中で起こっている処理とデータの流れのこと ※1と2はCPU処理 ※画像出典 マイナビニュース 「3Dグラフィックス・マニアッ クス」
14.
OpenGL ES2.0のAPIにはどんなのがある? 頂点配列の設定 glVertexAttribPointer テクスチャの設定
glBindTexture 使用するシェーダプログラムの設定 glUseProgram フレームバッファへの描画の実行(ドローコール) glDrawXxx ドローコールによって、設定した各種データを用いてレンダリングパイプラ インが実行される
15.
シェーダとは? レンダリングパイプラインにおいて、頂点単位の処理、ピクセル単位の処理 をカスタマイズするためのプログラムのこと。 (元は名前どおり陰影処理から来ているが、それ以外のいろいろな表現用途 に使うことができる) OpenGL ES2ではバーテックスシェーダとフラグメントシェーダの2箇所でパ イプライン処理をカスタマイズ可能 ※OpenGL ES1系では、この部分がAPIで指示できる範囲の決め打ちの処理に なっており、カスタマイズ不能だった
16.
バーテックスシェーダとは? 頂点パイプラインで実行するシェーダ → バーテックスシェーダ GPUの複数コアで頂点単位で並列実行
17.
フラグメントシェーダとは? ピクセルパイプラインで行うシェーダ → フラグメントシェーダ(ピクセルシェーダ) GPUの複数コアでピクセル単位で並列実行
18.
バーテックスシェーダとは?2 例:cocos2d-x attribute vec4 a_position; attribute
vec2 a_texCoord; attribute vec4 a_color; varying lowp vec4 v_fragmentColor; varying mediump vec2 v_texCoord; void main() { gl_Position = CC_MVPMatrix * a_position; v_fragmentColor = a_color; v_texCoord = a_texCoord; } cocos2d-xで一番良く使われるバーテックスシェーダ。 座標変換行列で画面上の頂点位置計算、頂点色とテクスチャのUV座標のフラグメントシェーダへ の受け渡しをしている。 各3Dモデルの頂点の数だけ実行される。 ※レンダリングパイプラインのES1系でのデフォルトの処理をしているのと変わらない
19.
バーテックスシェーダとは?3 例:フラットシェーディング、グーローシェーディング 両者、ライティング(光の陰影計算)の技法で、法線と光の方向をバーテッ クシェーダーに与えて表面色への係数を計算する ・フラットシェーディング ポリゴンごとに一意な法線ベクトルを持たせる ・グーローシェーディング 頂点ごとに法線ベクトルを持たせる。フラットシェーディングの発 展。 ※画像出典 マイナビニュース 「3Dグラフィックス・マニ アックス」など
20.
フラグメントシェーダとは?2 例:cocos2d-x varying vec4 v_fragmentColor; varying
vec2 v_texCoord; void main() { gl_FragColor = v_fragmentColor * texture2D(CC_Texture0, v_texCoord); } cocos2d-xで一番良く使われるフラグメントシェーダ。 バーテックスシェーダから与えられたテクスチャのUV座標を使ってテクスチャから取り出したテ クセルに、やはり与えられた頂点色(ラスタライズによって補間)を乗算しているだけ。 各3Dモデルのポリゴンのピクセルごとに実行される。 ※レンダリングパイプラインのES1系でのデフォルトの処理をしているのと変わらない
21.
フラグメントシェーダとは?3 例:バンプマッピング ライティング(光の陰影計算)の技法で、RGBAベクトルでなく法線ベクトル をピクセルごとに定義したテクスチャをフラグメントシェーダに与え、ピク セルごとに表面色を計算する
22.
デザイナのためにシェーダを作成する必要があ るのか? シェーダは表現に関わる部分なのでデザイナに調整させたい。 →最近のゲームエンジンではシェーダ作成をGUIツール化してデザイナに提供 している。 ・用意されたシェーダにパラメータを調整するもの ・処理をノードベースの操作で組み立てるもの
23.
スマホにおけるOpenGLESの最適化手法は? 3Dにも2Dにも適用できる手段で定番のものを3つ。 ①描画する頂点やテクスチャの容量を減らす ②ドローコールの数を減らす。 ③バーテックスバッファなどのVRAMバッファを使用する。 ②について なるべく一回のドローコールで多くのポリゴンを描画する。 定番の手法はテクスチャアトラス(スプライトシート)。 3Dではマテリアルの切り替えを頻繁に行わないようなモデル作りを意識する と良い。 2Dではノードツリートラバースでテクスチャの切り替えが多くならないよう なツリー構成を意識すると良い。
24.
おまけ: シェーダ同好会的なのを作りたいなー 作ったシェーダを自慢するだけとか 3Dグラフィックスやゲームの基幹技術が好きな人と遊べる場を何らかの形で 用意できればいいなと思っています。
Editor's Notes
駒田はGPUやOpenGLについては専門家ではありません。勉強をはじめたのはここ1、2年です。指摘歓迎します。 また、かなり基礎的な内容からはじめるので既に知ってる方すみません
グラボの写真を貼ろう CPUとGPUの関係図を貼るのが一番速い気がする。 ★★論理的に別?というのは本当?
グラボの写真を貼ろう CPUとGPUの関係図を貼るのが一番速い気がする。 ★★論理的に別?というのは本当?
これは表にまとめる
簡単に言うと、GPUはCGに特化した単純な命令しか実行できないし1コアの速度が遅いが大量並列計算により高速。 CPUは汎用な命令に対応して高速だがコア数が少ない。
グラボの写真を貼ろう CPUとGPUの関係図を貼るのが一番速い気がする。 ★★論理的に別?というのは本当?
各コマンド(API)はかなりの低レベルである
DirectXはゲームのフレームワーク、OpenGLにあたるのはDirect3D。 MetalはiOS8と同時に発表されたiOS端末用のAPI。 下2つはハードウェアに特化している分、薄くて速い。
ここは図を使って複数ページに分けよう
ここは図を使って複数ページに分けよう
ここは図を使って複数ページに分けよう
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
固定処理パイプラインはドローコール前にAPIで座標変換行列やカメラ行列や視野行列を与えて、シンプルにそれらを使用して描画するのみであった。 ES2.0
Download now