Aunque soy un completo profano en el mundo de los gráficos 3D, siempre me he sentido atraído por el, desde la distancia, eso si, ya que mi territorio es la Web y hasta hace bastante poco 3D para la Web era sencillamente impensable.

Con el auge tecnológico reciente los navegadores se han convertido en poderosas plataformas para mostrar contenido multi-media, vídeo, imagen, sonido… el 3D interactivo era cuestión de tiempo y así ha sido. WebGL (basado en OpenGL ES, la versión de OpenGL para dispositivos móviles) trae a nuestras pantallas un despliegue tridimensional completamente interactivo.

Las demostraciones de lo que se puede hacer con WebGL no han tardado en aparecer en la red, para que cualquiera pueda ver el potencial todavía por exprimir que nos traen los gráficos 3D interactivos en la Web. Es aquí donde comienza mi viaje ya que he tomado la determinación de aprender esta tecnología a un nivel básico, antes de finalizar el año.

¿WebGL nativo?. No, gracias.

Como siempre, al abordar una nueva tecnología, lo primero es buscar los mejores recursos disponibles y jerarquizarlos para su consulta y consumo posterior. Es una labor imprescindible si se quiere obtener resultados, más si cabe en este caso ya que WebGL es algo completamente alien para mi.

Durante esta fase me di cuenta de varias realidades. La primera es que casi nadie con un trasfondo Web (mi caso) quiere lidiar con WebGL «a secas», cuando ves el código de un shader, por ejemplo, no pasa por tu cabeza el tener que escribirlo a mano. Es ahí donde llegué a la segunda realidad, casi todo el mundo usa librerías que ayudan a trabajar con WebGL y simplificar un montón de tareas que se repiten en cualquier escena. No tarde mucho en averiguar cual era la librería más popular, se llama Trhee.js y resulta que su autor, @mrdoob, es español.

Llegados a este punto ya tenía claro que usaría Three.js, una librería Javascript (donde me siento cómodo) para acceder y utilizar WebGL. La conclusión lógica de todo esto, y siempre desde mi punto de vista, es que para aprender a usar WebGL hay que aprender a utilizar una librería, en este caso Three.js.

Cómo aprender a utilizar Three.js

Lo cierto es que Three.js no posee una documentación demasiado extensa o elaborada. El tutorial de inicio de rigor te lleva a otra Web donde hay una introducción. Eso es todo. Pronto te das cuenta de que además tampoco hay mucha documentación* o recursos de terceras personas. En base, se reduce a dos:

He comenzado los dos y por el momento no puedo agregar demasiado. El curso de UDACITY me está pareciendo una pasada, muy al nivel académico acostumbrado por esta plataforma. Siempre intenta explicarte el porqué de las cosas, además de su funcionamiento, de ahí que todo el capítulo 1 del curso esté dedicado a explicar terminología 3D, como geometría, material, mesh, pipeline, FPS, además de situaciones y procedimientos que se dan cuando uno trabaja con gráficos 3D, como stalling y starving.

En cuanto al libro de Tony Parisi, tengo sensaciones encontradas. Se que al tratarse de un «Up and Runnig» el texto ha de ser breve y conciso y llevarte directamente al resultado pero, ¿se puede ser conciso y breve abordando un tema como WebGL?. Parisi trata de lograr esa brevedad con una multitud de subterfugios, tales como pasar de WebGL nativo a Three.js demasiado pronto e introducir en la ecuación un pequeño framework (Sim.js) creado por el que antepone a Three.js. No tengo nada claro que ese sea el camino que quiero seguir, es decir, tener que aprender un framework que controla una librería que accede a WebGL (al fin). Como no lo he terminado, realmente no puedo valorarlo de forma justa.

Independientemente de los materiales didácticos, como en cualquier cruzada que tiene que ver con el aprendizaje, hay un método que nunca falla, «prueba y error». He acabado dedicando mucho tiempo en la consola de desarrollador de Chrome cambiando parámetros, quitando líneas y viendo el resultado. Parece difícil pero se aprende bastante con este método cuyo nombre bonito es ingeniería inversa, pero cualquier desarrollador Web lo habrá utilizado cientos, miles de veces. WebGL no es una excepción.

Conclusión

Con solo una semana abordando WebGL estoy comprobando de primera mano lo que antes solo percibía. Crear experiencias 3D en el navegador desktop, laptop, tablet o smartphone donde el usuario sea el protagonista e interactue con la Web, datos y elementos a un nivel jamás visto, es lo más avanzado hoy en día y todo apunta (sobre todo cuando iOS y Android lo soporten al 100%) a que será un nuevo estándar en las aplicaciones Web del futuro.

Yo quiero estar listo.

*Con documentación me refiero a material ordenado, conectado y relacionado entre si. Para mi vídeos random en Youtube y artículos diseminados en varias Webs/blog no cuentan.