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
3D + the Web Platform
Search
vladikoff
May 23, 2017
Technology
0
380
3D + the Web Platform
vladikoff
May 23, 2017
Tweet
Share
More Decks by vladikoff
See All by vladikoff
The state of end-to-end testing for modern web apps
vladikoff
0
68
SmashingConf 2020
vladikoff
0
18
dotJS 2019 - Into WebAssembly
vladikoff
0
15
7 years of three.js
vladikoff
0
130
node.js @ GA 2015
vladikoff
0
430
JS Testing Stack - Full Stack Toronto 2014
vladikoff
1
810
Node.JS Intro - General Assembly
vladikoff
3
470
CSS Preprocessor Workflow with Grunt
vladikoff
3
2.7k
3D Voxel Worlds with voxel.js
vladikoff
1
1.9k
Other Decks in Technology
See All in Technology
LeSSに潜む「隠れWF病」とその処方箋
lycorptech_jp
PRO
2
120
Shift-from-React-to-Vue
calm1205
3
1.3k
AWS re:Inventを徹底的に楽しむためのTips / Tips for thoroughly enjoying AWS re:Invent
yuj1osm
1
570
Aurora_BlueGreenDeploymentsやってみた
tsukasa_ishimaru
1
130
生成AIと知識グラフの相互利用に基づく文書解析
koujikozaki
1
140
[AWS JAPAN 生成AIハッカソン] Dialog の紹介
yoshimi0227
0
150
現地でMeet Upをやる場合の注意点〜反省点を添えて〜
shotashiratori
0
530
物価高なラスベガスでの過ごし方
zakky
0
380
新卒1年目が向き合う生成AI事業の開発を加速させる技術選定 / ai-web-launcher
cyberagentdevelopers
PRO
7
1.5k
Fargateを使った研修の話
takesection
0
120
日経電子版におけるリアルタイムレコメンドシステム開発の事例紹介/nikkei-realtime-recommender-system
yng87
1
510
プロダクトチームへのSystem Risk Records導入・運用事例の紹介/Introduction and Case Studies on Implementing and Operating System Risk Records for Product Teams
taddy_919
1
170
Featured
See All Featured
Adopting Sorbet at Scale
ufuk
73
9k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
7.9k
The Power of CSS Pseudo Elements
geoffreycrofte
72
5.3k
YesSQL, Process and Tooling at Scale
rocio
167
14k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
Thoughts on Productivity
jonyablonski
67
4.3k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
7
150
Scaling GitHub
holman
458
140k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Imperfection Machines: The Place of Print at Facebook
scottboms
264
13k
Writing Fast Ruby
sferik
626
61k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Transcript
3D + The Web Platform
• WebGL • WebVR • WebAR • WebAssembly
@vladikoff
2011 webgl 1.0 2009 webgl WG 2010 three.js 2017 webgl
2.0, WebAR WG, React VR 2013 shadertoy.com pixi.js 2014 WebVR WG, PlayCanvas 2016 WebVR 1.0 2012 sketchfab.com Future • WebAR 1.0 • three.js w/ webgl 2.0 • Cross-browser WebVR • Better tooling for 3D • VR / AR web browsers
None
Demo Whitestorm.js & nin
WebGL2
Demo webgl2
Virtual Reality
None
None
None
None
Augmented Reality
None
Demo ar1.vf.io
WebAssembly
Demo wasm Thanks to Kamaron Peterson for the amazing WASM
brew install cmake # Get the emscripten SDK git clone
https://github.com/juj/emsdk.git cd emsdk ./emsdk install sdk-incoming-64bit binaryen-master-64bit ./emsdk activate sdk-incoming-64bit binaryen-master-64bit # Make "emcc" available in the PATH source ./emsdk_env.sh # Ready! emcc program.c
hacks.mozilla.org/category/webassembly webassembly.org
None
vf.io/3dweb References • Xbox Controller with Babylon.js: https://xboxdesignlab.xbox.com/en-CA/customize • WebGL
2 demo: https://playcanv.as/e/p/44MRmJRU/ • AFrame Gallery: https://aframe.io/examples/showcase/360-image-gallery/ • A-Painter: https://aframe.io/a-painter/ • Servo on Steam VR: https://www.youtube.com/watch?v=STm7VBBM26A • AR.js: https://github.com/jeromeetienne/AR.js • WASM 3d demo: https://github.com/sessamekesh/wasm-3d-animation-demo • Dubstep: https://www.youtube.com/watch?v=hmzvV--FwnM • WASM-init: https://github.com/shamadee/wasm-init • hacks.mozilla.org/category/webassembly • ninjadev tools: https://github.com/ninjadev/nin • whitestorm.js: https://github.com/WhitestormJS/whitestorm.js