Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
HTML5 WebGLについて #TechLunch
Search
Livesense Inc.
PRO
April 23, 2014
Technology
0
76
HTML5 WebGLについて #TechLunch
2012/03/14(水) @ Livesense TechLunch
発表者:島田 喜裕
Livesense Inc.
PRO
April 23, 2014
Tweet
Share
More Decks by Livesense Inc.
See All by Livesense Inc.
27新卒_総合職採用_会社説明資料
livesense
PRO
0
1.4k
27新卒_Webエンジニア職採用_会社説明資料
livesense
PRO
0
5.1k
株式会社リブセンス・転職会議 採用候補者様向け資料
livesense
PRO
0
130
株式会社リブセンス 会社説明資料(報道関係者様向け)
livesense
PRO
0
1.6k
データ基盤の負債解消のためのリプレイス
livesense
PRO
0
510
26新卒_総合職採用_会社説明資料
livesense
PRO
0
12k
株式会社リブセンス会社紹介資料 / Invent the next common.
livesense
PRO
2
47k
26新卒_Webエンジニア職採用_会社説明資料
livesense
PRO
1
13k
中途セールス職_会社説明資料
livesense
PRO
0
280
Other Decks in Technology
See All in Technology
コミューンのデータ分析AIエージェント「Community Sage」の紹介
fufufukakaka
0
490
チーリンについて
hirotomotaguchi
6
1.9k
AWS Security Agentの紹介/introducing-aws-security-agent
tomoki10
0
220
5分で知るMicrosoft Ignite
taiponrock
PRO
0
350
年間40件以上の登壇を続けて見えた「本当の発信力」/ 20251213 Masaki Okuda
shift_evolve
PRO
1
130
世界最速級 memcached 互換サーバー作った
yasukata
0
340
MLflowで始めるプロンプト管理、評価、最適化
databricksjapan
1
210
GitHub Copilotを使いこなす 実例に学ぶAIコーディング活用術
74th
3
3k
Gemini でコードレビュー知見を見える化
zozotech
PRO
1
250
乗りこなせAI駆動開発の波
eltociear
1
1.1k
Power of Kiro : あなたの㌔はパワステ搭載ですか?
r3_yamauchi
PRO
0
120
Databricks向けJupyter Kernelでデータサイエンティストの開発環境をAI-Readyにする / Data+AI World Tour Tokyo After Party
genda
1
110
Featured
See All Featured
Balancing Empowerment & Direction
lara
5
800
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
10
730
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.8k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.3k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.5k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.2k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Embracing the Ebb and Flow
colly
88
4.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
70k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
We Have a Design System, Now What?
morganepeng
54
7.9k
Transcript
HTML5 WebGLについて
WebGLとは? • ブラウザをプレステにしてしまう技術 • 2011年3月に1.0が勧告されたばかりの今一番 ホットな仕組み • OpenGLがWebGLのもとになっている
OpenGL • OpenGL グラフィックスを高速に描画するための専用ハード ウェアを使うためのAPI
GPU(Graphics Processing Unit) nVidiaのGPU
GPU nVidiaのGPU VGAカード
HTML5 HTML5では、これまで単に文章を構造化するのみ から、動画、オーディを扱えるようになった。 →クロスプラットホーム環境を実現
canvas HTML5のcanvas要素では3次元グラフィックスを描 画することができる。 • 2次元や3次元グラフィックスをプラグインなしに HTML上に直接描画することができる。 • 原理的にはどのような3次元グラフィックスも描 画することが可能。
WebGL • Webブラウザで3DCGが表示できる • Flash、SilverLight等のプラグイン不要 • 勝手にGPUを叩いてくれる • インターフェースはJavaScript 動作するブラウザ
• FireFox、Chrome、Safari、Opera • IEではIEWebGL、JebGL、ChromeFrameなどを 使うことで動作させることができる
WebGLの実行環境 • WebブラウザがWebGLに対応していること • PCに搭載されているグラフィックカードの OpenGLのバージョンが2.0以上である必要 (2012年2月現在) →古いPCでは対応してないのが現状 • スマートフォンなどでのWebGLの対応は現在
(2012年2月)準備中段階。 →一気にウェブブラウザ用3次元グラフィックスAPI の地位を築く!?
WebGLの問題 IEがWebGLとは反対の立場をとっている →「OpenGL」と「DirectX」はライバル ↓ DirectXはMS関連製品でしか動作しないため勝敗 は明らか!?
セキュリティーホール WebGLはその機能要件ゆえにセキュリティが危険 に晒される可能性がある 1. ハードウェアの機能がWeb側につつぬけ 2. Webの利用体験を確保するためにサードパー ティを放任しすぎている 3. DoS攻撃に対する不備
デモ • Flash、Unity、WebGLの動作を確認 • ジニーエフェクト • Google Labsが公開するBody • Google
Chrome専用のWebGLコンテンツ • プレゼンテーションをWebGLで加工 • Aquarium
まとめ • WebGLは扱いが難しい? • 仕様策定の行く末やブラウザ対応など課題はあ る • Web上でできることの幅が一段と広がる
次回 WebGL WebSockets WebWorkers WebStorage