¿Qué es WebGL?

• API Javascript para poder comunicarse con la GPU desde el Navegador
• Desarrollada por Kronos Group

Ventajas

• Rendimiento gráfico: Mediante la API el navegador habla ~ "directamente" con la GPU
• La GPU:
  • Trabaja en Paralelo
  • Especializada en operaciones con Matrices
  • "Pinta" triángulos

PixelFactory

del Raster al Vector y viceversa

Terminología en WEBGL

Shaders

Los Shaders se definen mediante un lenguaje específico: GLSL

• Vertex Shader
• Fragment Shader

¿Cómo le paso información al Shader?

• Buffers y Attributos
• Uniforms
• Texturas
• Varyings

Ejemplo Práctico

Puff...¿Y tengo que aprenderme tantas cosas?

NO :-)

Three.JS

by Ricardo Cabello AKA (@mrdoob)

Ejemplos

• SatelliteMap
• LandSat Viewer
• Scene Layer with Buildings (@ekenes)
• No es sólo 3D
• Resumen(@alejanndropeq)
• ShaderToy
• Arts Experiments with Google
• Droste Effect - M.C Escher