SlideShare a Scribd company logo
Mobility Technologies Co., Ltd.
Rustで3D graphics programming
Kiyotomo Hiroyasu
2020/10/29 MoT.rs #2
Mobility Technologies Co., Ltd.
● これから話す内容
○ Rustで3D graphics programmingしたい動機
○ GPU使った3D描画パイプラインの概要
○ three-d crateの紹介
○ まとめ
はじめに
2
Mobility Technologies Co., Ltd.
動機
3
Mobility Technologies Co., Ltd.
● エッジAI開発において、入力画像の前処理をGPU上で高速に実現したい
○ shaderを使った並列処理
● OpenGLとかshaderとかなんもわからんので簡単に試しながら学習できる環
境がほしい
開発主言語がRustなので、いい感じにshader扱えるcrateはないか探す
動機
4
Mobility Technologies Co., Ltd.
3D描画のパイプライン概要
5
Mobility Technologies Co., Ltd.
・多量のpolygonについて処理が
実行されて3D描画が行われる
・各Shaderの処理はGPU上で
並列で高速に実行
3D graphicsの描画処理パイプライン
6
OpenGLのレンダリングパイプライン図
(OpenGL wikiより)
Mobility Technologies Co., Ltd.
three-d crate
7
Mobility Technologies Co., Ltd.
● crates.ioでOpenGLで検索かけたときに上の方に出てきたcrate
● OpenGLESには対応してなさそうだが、学習環境として使えないかと思い試用
● WebAssemblyのビルドにも対応している
○ examplesはwasmでビルドされたモジュールを使用している
three-d crate
8
Mobility Technologies Co., Ltd.
● ビルドしてサンプル実行するまでに5分かからない
○ リポジトリのREADMEに書いてあるとおり実行するだけでdesktop版も
Web版も簡単に動作確認できる(wasm版は要node.js)
three-d crate
9
Mobility Technologies Co., Ltd.
● shaderも簡単に実装できる
○ hello_worldサンプルの実装内容を紹介
色付きのポリゴンがY軸中心に回転するだけのサンプル
頂点座標と対応する色情報をshaderに渡して描画
three-d crate
10
Mobility Technologies Co., Ltd.
● shaderのコンパイルや描画実行も簡単な記述で可能
● vertex shaderに渡す頂点座標/色情報と回転行列を指定してdraw_arrays()するだけ
three-d crate
11
←ここでshaderが起動し、ポリゴンが描画される
Mobility Technologies Co., Ltd.
● shaderコード
○ vertex shaderで入力頂点座標に指定された回転行列を乗算
○ fragment shaderはvertex shaderに渡されたcolorを描画ピクセルに設定して
いるだけ
■ ピクセル座標に応じた補間値が渡されるのでグラデーションになる
three-d crate
12
vertex shaderのソース(color.vert) fragment shaderのソース(color.frag)
Mobility Technologies Co., Ltd.
まとめ
13
Mobility Technologies Co., Ltd.
● three-d crateを使うとシンプルな記述でshader起動するコードが書ける
○ 生のOpenGL APIで同じ事しようとすると数倍のコード量になる
○ shader初心者でも簡単に始められる(手を動かしながらの学習に良い)
○ wasm+WebGLに対応してるので、Web向けビルドも可能
● OpenGLESに対応しておらず、エッジ向けにビルドできないのがBad
○ 汎用計算に使用するcompute shaderにも非対応
○ 他にも使えそうなcrateがないかさらに調査する
まとめ
14

More Related Content

What's hot

CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
Fixstars Corporation
 
【Unite Tokyo 2019】AWS for Unity Developers
【Unite Tokyo 2019】AWS for Unity Developers【Unite Tokyo 2019】AWS for Unity Developers
【Unite Tokyo 2019】AWS for Unity Developers
UnityTechnologiesJapan002
 
MagicOnion入門
MagicOnion入門MagicOnion入門
MagicOnion入門
torisoup
 
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭するCEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
Yoshifumi Kawai
 
暗号技術の実装と数学
暗号技術の実装と数学暗号技術の実装と数学
暗号技術の実装と数学
MITSUNARI Shigeo
 
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
sairoutine
 
中3女子でもわかる constexpr
中3女子でもわかる constexpr中3女子でもわかる constexpr
中3女子でもわかる constexpr
Genya Murakami
 
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
UnityTechnologiesJapan002
 
オンラインゲームの仕組みと工夫
オンラインゲームの仕組みと工夫オンラインゲームの仕組みと工夫
オンラインゲームの仕組みと工夫
Yuta Imai
 
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動するStargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
Kohei Tokunaga
 
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化についてマルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
Fixstars Corporation
 
shared_ptrとゲームプログラミングでのメモリ管理
shared_ptrとゲームプログラミングでのメモリ管理shared_ptrとゲームプログラミングでのメモリ管理
shared_ptrとゲームプログラミングでのメモリ管理
DADA246
 
Addressables で大量のリソース管理・困りどころと解消法
Addressables で大量のリソース管理・困りどころと解消法Addressables で大量のリソース管理・困りどころと解消法
Addressables で大量のリソース管理・困りどころと解消法
Kenta Nagai
 
ゲームサーバ開発現場の考え方
ゲームサーバ開発現場の考え方ゲームサーバ開発現場の考え方
ゲームサーバ開発現場の考え方Daisaku Mochizuki
 
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
Yoshiki Hayama
 
【Unity】 Behavior TreeでAIを作る
 【Unity】 Behavior TreeでAIを作る 【Unity】 Behavior TreeでAIを作る
【Unity】 Behavior TreeでAIを作る
torisoup
 
できる!並列・並行プログラミング
できる!並列・並行プログラミングできる!並列・並行プログラミング
できる!並列・並行プログラミング
Preferred Networks
 
Riderはいいぞ!
Riderはいいぞ!Riderはいいぞ!
Riderはいいぞ!
UnityTechnologiesJapan002
 
その素敵なUI基盤を目指して・・・
その素敵なUI基盤を目指して・・・その素敵なUI基盤を目指して・・・
その素敵なUI基盤を目指して・・・
KLab Inc. / Tech
 
Photon Fusionのはじめの一歩
Photon Fusionのはじめの一歩Photon Fusionのはじめの一歩
Photon Fusionのはじめの一歩
聡 大久保
 

What's hot (20)

CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
CPU / GPU高速化セミナー!性能モデルの理論と実践:実践編
 
【Unite Tokyo 2019】AWS for Unity Developers
【Unite Tokyo 2019】AWS for Unity Developers【Unite Tokyo 2019】AWS for Unity Developers
【Unite Tokyo 2019】AWS for Unity Developers
 
MagicOnion入門
MagicOnion入門MagicOnion入門
MagicOnion入門
 
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭するCEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
 
暗号技術の実装と数学
暗号技術の実装と数学暗号技術の実装と数学
暗号技術の実装と数学
 
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
 
中3女子でもわかる constexpr
中3女子でもわかる constexpr中3女子でもわかる constexpr
中3女子でもわかる constexpr
 
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
 
オンラインゲームの仕組みと工夫
オンラインゲームの仕組みと工夫オンラインゲームの仕組みと工夫
オンラインゲームの仕組みと工夫
 
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動するStargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
Stargz Snapshotter: イメージのpullを省略しcontainerdでコンテナを高速に起動する
 
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化についてマルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
マルチレイヤコンパイラ基盤による、エッジ向けディープラーニングの実装と最適化について
 
shared_ptrとゲームプログラミングでのメモリ管理
shared_ptrとゲームプログラミングでのメモリ管理shared_ptrとゲームプログラミングでのメモリ管理
shared_ptrとゲームプログラミングでのメモリ管理
 
Addressables で大量のリソース管理・困りどころと解消法
Addressables で大量のリソース管理・困りどころと解消法Addressables で大量のリソース管理・困りどころと解消法
Addressables で大量のリソース管理・困りどころと解消法
 
ゲームサーバ開発現場の考え方
ゲームサーバ開発現場の考え方ゲームサーバ開発現場の考え方
ゲームサーバ開発現場の考え方
 
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチ
 
【Unity】 Behavior TreeでAIを作る
 【Unity】 Behavior TreeでAIを作る 【Unity】 Behavior TreeでAIを作る
【Unity】 Behavior TreeでAIを作る
 
できる!並列・並行プログラミング
できる!並列・並行プログラミングできる!並列・並行プログラミング
できる!並列・並行プログラミング
 
Riderはいいぞ!
Riderはいいぞ!Riderはいいぞ!
Riderはいいぞ!
 
その素敵なUI基盤を目指して・・・
その素敵なUI基盤を目指して・・・その素敵なUI基盤を目指して・・・
その素敵なUI基盤を目指して・・・
 
Photon Fusionのはじめの一歩
Photon Fusionのはじめの一歩Photon Fusionのはじめの一歩
Photon Fusionのはじめの一歩
 

Similar to Rustで3D graphics programming

RustによるGPUプログラミング環境
RustによるGPUプログラミング環境RustによるGPUプログラミング環境
RustによるGPUプログラミング環境
KiyotomoHiroyasu
 
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
Drecom Co., Ltd.
 
3Dプリンタでロボット作るよ#1_黎明編
3Dプリンタでロボット作るよ#1_黎明編3Dプリンタでロボット作るよ#1_黎明編
3Dプリンタでロボット作るよ#1_黎明編
Yoshihiro Shibata
 
WeDX Flow Hands-on
WeDX Flow Hands-onWeDX Flow Hands-on
WeDX Flow Hands-on
Jingun Jung
 
携帯SoCでの画像処理とHalide
携帯SoCでの画像処理とHalide携帯SoCでの画像処理とHalide
携帯SoCでの画像処理とHalide
Morpho, Inc.
 
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜	【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
虎の穴 開発室
 
Si2017 チームイエスマン 発表スライド
Si2017 チームイエスマン 発表スライドSi2017 チームイエスマン 発表スライド
Si2017 チームイエスマン 発表スライド
Robotics Engineer
 
NGK2023S ChatGPT
NGK2023S ChatGPTNGK2023S ChatGPT
NGK2023S ChatGPT
陽平 山口
 
ベアメタルで実現するSpark&Trino on K8sなデータ基盤
ベアメタルで実現するSpark&Trino on K8sなデータ基盤ベアメタルで実現するSpark&Trino on K8sなデータ基盤
ベアメタルで実現するSpark&Trino on K8sなデータ基盤
MicroAd, Inc.(Engineer)
 
ゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetupゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetup
gree_tech
 
ゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetupゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetup
Ryuichi Kubuki
 
SIGGRAPH 2019レポート
SIGGRAPH 2019レポートSIGGRAPH 2019レポート
SIGGRAPH 2019レポート
Kenichi Takahashi
 
Google の AIツール 『Auto ML』で機械学習してみた
Google の AIツール  『Auto ML』で機械学習してみたGoogle の AIツール  『Auto ML』で機械学習してみた
Google の AIツール 『Auto ML』で機械学習してみた
Yuya Ohara
 
Unreal Studio+機械CADのワークフロー
Unreal Studio+機械CADのワークフローUnreal Studio+機械CADのワークフロー
Unreal Studio+機械CADのワークフロー
エピック・ゲームズ・ジャパン Epic Games Japan
 
宇宙建造物と3Dプリント―3D Printing Corporation
宇宙建造物と3Dプリント―3D Printing Corporation宇宙建造物と3Dプリント―3D Printing Corporation
宇宙建造物と3Dプリント―3D Printing Corporation
(株)3D Printing Corporation
 
Datadog Agent on CloudRunによるGCPトレービリティ向上
Datadog Agent on CloudRunによるGCPトレービリティ向上Datadog Agent on CloudRunによるGCPトレービリティ向上
Datadog Agent on CloudRunによるGCPトレービリティ向上
Ryo Sasaki
 
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみたタクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
Tetsutaro Watanabe
 
SDNアプローチによるBGP経路監視の提案
SDNアプローチによるBGP経路監視の提案SDNアプローチによるBGP経路監視の提案
SDNアプローチによるBGP経路監視の提案
Toshiki Tsuboi
 
Hello, DirectCompute
Hello, DirectComputeHello, DirectCompute
Hello, DirectCompute
dasyprocta
 

Similar to Rustで3D graphics programming (20)

RustによるGPUプログラミング環境
RustによるGPUプログラミング環境RustによるGPUプログラミング環境
RustによるGPUプログラミング環境
 
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
3Dリアルマップを用いたモバイルゲーム開発における課題とその解決方法
 
3Dプリンタでロボット作るよ#1_黎明編
3Dプリンタでロボット作るよ#1_黎明編3Dプリンタでロボット作るよ#1_黎明編
3Dプリンタでロボット作るよ#1_黎明編
 
WeDX Flow Hands-on
WeDX Flow Hands-onWeDX Flow Hands-on
WeDX Flow Hands-on
 
携帯SoCでの画像処理とHalide
携帯SoCでの画像処理とHalide携帯SoCでの画像処理とHalide
携帯SoCでの画像処理とHalide
 
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜	【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
【とらのあなラボ Tech Day #3】新規システムにおける技術選定〜GoとgRPCを採用した話〜
 
Si2017 チームイエスマン 発表スライド
Si2017 チームイエスマン 発表スライドSi2017 チームイエスマン 発表スライド
Si2017 チームイエスマン 発表スライド
 
NGK2023S ChatGPT
NGK2023S ChatGPTNGK2023S ChatGPT
NGK2023S ChatGPT
 
ベアメタルで実現するSpark&Trino on K8sなデータ基盤
ベアメタルで実現するSpark&Trino on K8sなデータ基盤ベアメタルで実現するSpark&Trino on K8sなデータ基盤
ベアメタルで実現するSpark&Trino on K8sなデータ基盤
 
Bjarne dont speaking
Bjarne dont speakingBjarne dont speaking
Bjarne dont speaking
 
ゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetupゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetup
 
ゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetupゲームアプリの数学@GREE GameDevelopers' Meetup
ゲームアプリの数学@GREE GameDevelopers' Meetup
 
SIGGRAPH 2019レポート
SIGGRAPH 2019レポートSIGGRAPH 2019レポート
SIGGRAPH 2019レポート
 
Google の AIツール 『Auto ML』で機械学習してみた
Google の AIツール  『Auto ML』で機械学習してみたGoogle の AIツール  『Auto ML』で機械学習してみた
Google の AIツール 『Auto ML』で機械学習してみた
 
Unreal Studio+機械CADのワークフロー
Unreal Studio+機械CADのワークフローUnreal Studio+機械CADのワークフロー
Unreal Studio+機械CADのワークフロー
 
宇宙建造物と3Dプリント―3D Printing Corporation
宇宙建造物と3Dプリント―3D Printing Corporation宇宙建造物と3Dプリント―3D Printing Corporation
宇宙建造物と3Dプリント―3D Printing Corporation
 
Datadog Agent on CloudRunによるGCPトレービリティ向上
Datadog Agent on CloudRunによるGCPトレービリティ向上Datadog Agent on CloudRunによるGCPトレービリティ向上
Datadog Agent on CloudRunによるGCPトレービリティ向上
 
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみたタクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
タクシードライブレコーダーの動画処理MLパイプラインにkubernetesを使ってみた
 
SDNアプローチによるBGP経路監視の提案
SDNアプローチによるBGP経路監視の提案SDNアプローチによるBGP経路監視の提案
SDNアプローチによるBGP経路監視の提案
 
Hello, DirectCompute
Hello, DirectComputeHello, DirectCompute
Hello, DirectCompute
 

Rustで3D graphics programming

  • 1. Mobility Technologies Co., Ltd. Rustで3D graphics programming Kiyotomo Hiroyasu 2020/10/29 MoT.rs #2
  • 2. Mobility Technologies Co., Ltd. ● これから話す内容 ○ Rustで3D graphics programmingしたい動機 ○ GPU使った3D描画パイプラインの概要 ○ three-d crateの紹介 ○ まとめ はじめに 2
  • 4. Mobility Technologies Co., Ltd. ● エッジAI開発において、入力画像の前処理をGPU上で高速に実現したい ○ shaderを使った並列処理 ● OpenGLとかshaderとかなんもわからんので簡単に試しながら学習できる環 境がほしい 開発主言語がRustなので、いい感じにshader扱えるcrateはないか探す 動機 4
  • 5. Mobility Technologies Co., Ltd. 3D描画のパイプライン概要 5
  • 6. Mobility Technologies Co., Ltd. ・多量のpolygonについて処理が 実行されて3D描画が行われる ・各Shaderの処理はGPU上で 並列で高速に実行 3D graphicsの描画処理パイプライン 6 OpenGLのレンダリングパイプライン図 (OpenGL wikiより)
  • 7. Mobility Technologies Co., Ltd. three-d crate 7
  • 8. Mobility Technologies Co., Ltd. ● crates.ioでOpenGLで検索かけたときに上の方に出てきたcrate ● OpenGLESには対応してなさそうだが、学習環境として使えないかと思い試用 ● WebAssemblyのビルドにも対応している ○ examplesはwasmでビルドされたモジュールを使用している three-d crate 8
  • 9. Mobility Technologies Co., Ltd. ● ビルドしてサンプル実行するまでに5分かからない ○ リポジトリのREADMEに書いてあるとおり実行するだけでdesktop版も Web版も簡単に動作確認できる(wasm版は要node.js) three-d crate 9
  • 10. Mobility Technologies Co., Ltd. ● shaderも簡単に実装できる ○ hello_worldサンプルの実装内容を紹介 色付きのポリゴンがY軸中心に回転するだけのサンプル 頂点座標と対応する色情報をshaderに渡して描画 three-d crate 10
  • 11. Mobility Technologies Co., Ltd. ● shaderのコンパイルや描画実行も簡単な記述で可能 ● vertex shaderに渡す頂点座標/色情報と回転行列を指定してdraw_arrays()するだけ three-d crate 11 ←ここでshaderが起動し、ポリゴンが描画される
  • 12. Mobility Technologies Co., Ltd. ● shaderコード ○ vertex shaderで入力頂点座標に指定された回転行列を乗算 ○ fragment shaderはvertex shaderに渡されたcolorを描画ピクセルに設定して いるだけ ■ ピクセル座標に応じた補間値が渡されるのでグラデーションになる three-d crate 12 vertex shaderのソース(color.vert) fragment shaderのソース(color.frag)
  • 13. Mobility Technologies Co., Ltd. まとめ 13
  • 14. Mobility Technologies Co., Ltd. ● three-d crateを使うとシンプルな記述でshader起動するコードが書ける ○ 生のOpenGL APIで同じ事しようとすると数倍のコード量になる ○ shader初心者でも簡単に始められる(手を動かしながらの学習に良い) ○ wasm+WebGLに対応してるので、Web向けビルドも可能 ● OpenGLESに対応しておらず、エッジ向けにビルドできないのがBad ○ 汎用計算に使用するcompute shaderにも非対応 ○ 他にも使えそうなcrateがないかさらに調査する まとめ 14