the browser as console: HTML5 and WebGL for game development tony parisi vizi, inc. april 24, 2014
Jan 27, 2015
the browser as console:
HTML5 and WebGL for game
developmenttony parisi
vizi, inc.april 24, 2014
04/10/2023
http://www.tonyparisi.com
a wild web of game development
image: http://www.arvindsaba.blogspot.com/
+ =
04/10/2023
http://www.tonyparisi.com
… and one platform to rule them
all…
04/10/2023
http://www.tonyparisi.com
the browser as game platform
fast JavaScript virtual machines
3D rendering and hardware-accelerated compositing
animation support
Workers, WebSockets, local storage, local databases
new languages/tools: Dart, Typescript, asm.js, Emscripten
mobile-inspired features: location, touch, device orientation…
mobile platforms rapidly adopting all HTML5 features in browsers and embedded WebView controls - near-ubiquity
04/10/2023
http://www.tonyparisi.com
a GPU-powered web
WebGL hardware-accelerated 3D rendering
CSS 3D hardware-accelerated transforms, transitions, and animations
04/10/2023
http://www.tonyparisi.com
ready for prime time
http://www.tonyparisi.com
ported in 5 daysUnreal native C++ engine -> JavaScriptEmscripten + asm.js60FPS
Unreal 4 in WebGLhttps://www.youtube.com/watch?v=c2uNDlP4RiE#t=42
04/10/2023
game engines and tools
http://www.tonyparisi.com
game engines/IDEs
Goo Enginehttp://www.gootechnologies.com/
Verold http://verold.com/
Turbulenz https://turbulenz.com/
PlayCanvas http://www.playcanvas.com/
Artillery Engine
https://artillery.com/
Sketchfab https://sketchfab.com/
Unreal https://www.unrealengine.com/
Unity http://unity3d.com/#unity-5
scene graph libraries/page frameworks
Three.js
http://threejs.org/
SceneJS
http://scenejs.org/
BabylonJS
http://www.babylonjs.com/
Vizi
https://github.com/tparisi/Vizi
Voodoo.js
http://www.voodoojs.com/
PhiloGL
http://www.senchalabs.org/philogl/
tQuery
http://jeromeetienne.github.io/tquery/
04/10/2023
http://www.tonyparisi.com
mobile HTML5 gaming
HTML5 runs in all mobile browsers, and as embedded WebView components in apps
WebGL is supported in most* mobile environments* except mobile Safari - DERP! – iAds only• Android – mobile Chrome, mobile Firefox
• Tizen, Firefox OS, Amazon FireOS (Kindle Fire HDX), Blackberry
• Surface (Windows 8.1)
• NVIDIA Shield
CSS 3D transforms are supported in all mobile environments
04/10/2023
http://www.tonyparisi.com
cross-browser HTML5 and WebGL
hybrid app development use CocoonJS™http://ludei.com/ or Impact Ejecta
desktop HTML5 and WebGL
all browsers support all features, nearly identically
mobile WebGL• iOS - mobile Safari – iAds
only• Android – mobile Chrome,
Firefox• Amazon Silk, Kindle Fire OS• Blackberry, Tizen, Firefox OS• NVIDIA Shield
04/10/2023
http://www.tonyparisi.com
the tipping point
Microsoft now fully supports WebGL in IE and Windows mobile.
Kindle Fire HDX: at $229, the 7” is probably the best multimedia device deal on the planet… thanks in part to WebGL.
Sony built the whole PS4 user interface out of WebGL. 4.2M seats in one whack… and growing.
the 2013 NORAD Tracks Santa site saw 48.8% WebGL success across all browsers & platforms for 20M visitors, an increase of 146% over 2012.
Opera Devices SDK – WebGL coming soon to a Bang & Olufsen TV near you!
pro game middleware (Unreal, Unity) fully on board
CSS 3D transforms are supported on all platforms
can Apple be far behind… ?
on the frontier…
WebGL 2!based on GL ES 3
will contain popular WebGL extensions – 3D textures, multiple render targets, vertex array objects (VAOs), …
just getting under way – no dates yet
draft specification
http://www.khronos.org/registry/webgl/specs/latest/2.0/
Brandon Jones explains
http://blog.tojicode.com/2013/09/whats-coming-in-webgl-20.html
image: http://www.bitrebels.com
04/10/2023
http://www.tonyparisi.com
on the horizon:total immersion
WebGL on the Oculus Rift: Space fighter demo using Vizi + Three.js + Oculus Bridge
04/10/2023
http://www.tonyparisi.com
the browser as game console
an open web-based infrastructure takes gaming to a new, totally disruptive place…
full searchability/discoverability
not dominated by “gated communities” – there is no ONE interface to find games and people other than your browser
developers have freedom to experiment with business models: asset stores, app stores, free to play
open technologies lower barriers to entry for new devs
open technologies represent an endless playground for experimentation: collaborative sandbox/co-op, JavaScript modding, new social gaming…
(some might call that place the METAVERSE…)
04/10/2023
http://www.tonyparisi.com
stay in touch…
contact [email protected]: auradeluxehttp://twitter.com/auradeluxe http://www.tonyparisi.com/http://www.learningwebgl.com/
get the books!WebGL: Up and Runninghttp://www.amazon.com/dp/144932357XProgramming 3D Applications with HTML and WebGLhttp://www.amazon.com/Programming-Applications-HTML5-WebGL-Visualization/dp/1449362966
get Vizihttps://github.com/tparisi/Vizi
SF WebGL Meetuphttp://www.meetup.com/WebGL-Developers-Meetup/
book source codehttps://github.com/tparisi/WebGLBook
https://github.com/tparisi/Programming3DApplications