professional artpaths for WebGLdevelopmenttony parisimay 15, 2013artists only:
export OBJ.1convert to Three.js.2today’s WebGL art pathwrite code. lots of code.3prepared to be F!@#$ED.4
NO lights.NO scene hierarchy.NO animations.you’re F!@#$ED…NO cameras.programmersdo the lighting.programmersdo the animations.programmersset up thecameras.programmerslay out thescene.by typingNUMBERS.
// CAMERAScamera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 100000 );cameraCube = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 100000 );// SCENEscene = new THREE.Scene();sceneCube = new THREE.Scene();// LIGHTSvar ambient = new THREE.AmbientLight( 0x050505 );scene.add( ambient );directionalLight = new THREE.DirectionalLight( 0xffffff, 2 );directionalLight.position.set( 2, 1.2, 10 ).normalize();scene.add( directionalLight );directionalLight = new THREE.DirectionalLight( 0xffffff, 1 );directionalLight.position.set( -2, 1.2, -10 ).normalize();scene.add( directionalLight );pointLight = new THREE.PointLight( 0xffaa00, 2 );pointLight.position.set( 2000, 1200, 10000 );scene.add( pointLight );… well and truly.
it’s time to put art creationback where it belongs
COLLADA - 3D asset exchangeschema• Khronos Group standardhttp://www.khronos.org/collada/• well-supported by professional tools… at least itwas for a while– industry support has waned in the last few years• feature-rich– meshes, materials, textures, scenehierarchy, cameras, lights, animations…
COLLADA and WebGL• three.s implementation buggy and incomplete…until now.https://github.com/mrdoob/three.js/commit/1f0f08d3f72daabb6383e84eb15b3d9458fe239bimage courtesy ofSymantec andNeumatic, Inc.
glTF – the gl transmission format• COLLADA has issues for use with WebGL– files are text-based XML, big to download and slow to parse in abrowser or mobile application• the COLLADA working group is designing glTF, anew, JSON+binary-based format for use in WebGLand OpenGL ES mobile applications• glTF bridges the gap between common 3D formatsand gl-based APIs– mesh and animation data in compact .bin files that directly loadinto WebGL data structures without additional processing– scene structure/properties, materials, cameras, lights in JSONfiles that are quick and easy to parse
the glTF content pipelineOpenCOLLADA – open-source exporter plugins for Max and Maya,Windows, Linux and Mac OSX http://collada.org/mediawiki/index.php/OpenCOLLADACOLLADA2GLTF converter under development
glTF project status• working group initiative, not an official spec (yet)• work in progress– next milestones for SIGGRAPH 2013– draft spec by end of 2013• design being done in the openhttps://github.com/KhronosGroup/glTF
leave art to the artists, andcoding to the programmers(Maya|Max) + COLLADA + glTF +WebGL ==!(f!@#$ed) == team_happy;we thank you.