Taller UMA
Transcript of Taller UMA
WebGL y la web 3Dun taller de verold
Ross McKegney & Carlos Sánchez
WebGLAPI JAVASCRIPT
WebGLAPI JAVASCRIPT
Tu web o app
Librería Renderizado 3D
Navegador Web
Open GL (Drivers)
Tarjeta Gráfica
WebGL
three.jsLIBRERIA JAVASCRIPT
var scene = new THREE.Scene();var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();renderer.setSize( window.innerWidth, window.innerHeight );document.body.appendChild( renderer.domElement );
var geometry = new THREE.CubeGeometry(1,1,1);var material = new THREE.MeshBasicMaterial({ color: 0x00ff00, wireframe: true } );var cube = new THREE.Mesh( geometry, material );scene.add( cube );
camera.position.z = 5;
function render() {requestAnimationFrame(render);renderer.render(scene, camera);
cube.rotation.x += 0.01;cube.position.z += 0.01;
}
render();
¿Es Javascript suficientemente potente?
Gráficos WebGL
Procesamiento WebCL / Workers / Emscripten
Audio Web Audio
Networking WebRTC
Tiempo real + Dispositivos Web Sockets
Leap Motion
Oculus Rift
Neurosky
Neurosky
● Online y con colaboración en tiempo real
● Importar modelos 3D o usar primitivas
● Componentes predefinidos
COMPORTAMIENTOS, APIs DE DISPOSITIVOS FÍSICOS, ETC.
● Recursos
MATERIALES, TEXTURAS, ANIMACIONES, ILUMINACIÓN, SKYBOXES, ETC.
● Editor de código
HTML, CSS, JAVASCRIPT
Verold Studio
Compatibilidad
Maya, 3D Studio Max, ZBrush, Mudbox, Blender, SketchUp, 123D Catch
Formatos
FBX, OBJ, DAE, STL, PLY, 3DS
Verold Studio
Motor
Brazo Robótico (animado)
Ventiladores Industriales (animados)
Tuberia (animada)
Pisicina (animada e interactiva)
Verold Studio para Diseño Industrial y Arquitectura
Vivienda
Vivienda Interior
Pieza escaneada
Latin Grammy Awards