Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
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
69
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.
株式会社リブセンス 会社説明資料(報道関係者様向け)
livesense
PRO
0
770
26新卒_総合職採用_会社説明資料
livesense
PRO
0
1.4k
株式会社リブセンス会社紹介資料 / Invent the next common.
livesense
PRO
1
8.8k
26新卒_Webエンジニア職採用_会社説明資料
livesense
PRO
1
5k
中途セールス職_会社説明資料
livesense
PRO
0
140
EM候補者向け転職会議説明資料
livesense
PRO
0
58
コロナで失われたノベルティ作成ノウハウを復活させた話
livesense
PRO
0
180
転職会議でGPT-3を活用した企業口コミ要約機能をリリースした話
livesense
PRO
0
1.2k
株式会社リブセンス マッハバイト_プレイブック
livesense
PRO
0
720
Other Decks in Technology
See All in Technology
SREが投資するAIOps ~ペアーズにおけるLLM for Developerへの取り組み~
takumiogawa
2
500
アプリエンジニアのためのGraphQL入門.pdf
spycwolf
0
110
Storybook との上手な向き合い方を考える
re_taro
5
990
Next.jsとNuxtが混在? iframeでなんとかする!
ypresto
1
130
Lambda10周年!Lambdaは何をもたらしたか
smt7174
2
130
ExaDB-D dbaascli で出来ること
oracle4engineer
PRO
0
3.9k
Making your applications cross-environment - OSCG 2024 NA
salaboy
0
200
CysharpのOSS群から見るModern C#の現在地
neuecc
2
3.6k
Mastering Quickfix
daisuzu
1
150
あなたの知らない Function.prototype.toString() の世界
mizdra
PRO
2
390
OS 標準のデザインシステムを超えて - より柔軟な Flutter テーマ管理 | FlutterKaigi 2024
ronnnnn
1
300
Why App Signing Matters for Your Android Apps - Android Bangkok Conference 2024
akexorcist
0
130
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
222
8.9k
The Invisible Side of Design
smashingmag
298
50k
A designer walks into a library…
pauljervisheath
204
24k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
28
2k
How to Ace a Technical Interview
jacobian
276
23k
Designing on Purpose - Digital PM Summit 2013
jponch
115
7k
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
A Modern Web Designer's Workflow
chriscoyier
693
190k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
Into the Great Unknown - MozCon
thekraken
32
1.5k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
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