WebGL Academy

Learn WebGL and 3D algorithmic for free

This platform has been developed in order to learn WebGL and 3D algorithmic with a progressive and interactive way. It is a simplified online IDE with automatic indentation, syntax highlighting for HTML, Javascript, GLSL and Python. You can run your code and download your project. It uses Codemirror.

The courses are presented in a progressive way, always in connection with the code. Sometimes there are some development exercises. The numbering of the courses only depends on their chronological writing. Because there are many tutorials, I have grouped them in several lessons with a suggested order.

Before starting the courses, you should be comfortable with javascript and it would be great if you already know basics of linear algebra (multiplication, addition matrix/vector) and trigonometry (cosinus and sinus stories...).

The code provided for the different demonstrations is given in a very sequential format. It won't be handy to have too many files with our IDE and we want to focus on WebGL instead of javascript best practices, so most of the time the code is grouped in script.js. If you want to develop your own 3D engine, you should split the code in different modules and classes and you should use software engineering to keep it clean.

The lessons

Click here to launch WebGL Academy IDE with all the tutorials.

In this section, I have grouped the tutorials into differents lessons. For each lesson, I recommend performing the tutorials in the provided order (from top to bottom).

Advanced lessons
You should have done the previous part, WebGL Basis, before starting these tutorials. These modules are not linked.

About me

I am Xavier Bourry. You can contact me either using Linkedin, or Twitter, or Google +.

I have cofounded a research company, Jeeliz, specialized in GPU deep learning in the browser. Our technology uses feedforward deep neural networks to process images or video streams, mainly for real time pattern recognition.

I teach 3D programming with WebGL in a French school of computer science engineering, l'Esipe MLV. I also offer training in web 3D programming and 3D algorithmic using either raw WebGL or Three.js. My training sessions are in French or in English and I can freely move around the Paris Area in France. I am not interested in giving online training session (videoconferencing is so boring...). Of course, I use this tool for my training sessions, and I even improve it after each session!

I provide 3D web development services with my company, SPACEGOO. I have also written a framework agnostic book on webgl programming. It is in French. It is entitled Webgl: guide de développement d'applications web 3D .

I am an organizer of the WebGL Paris annual conference. More information are available on the WebGL Paris official website www.webglparis.com.

If you want to thank me

If these tutorials were helpful and you just want to thank me, nothing is easier: just share the glasses virtual tryon application on your twitter, google+ or facebook account. With the Jeeliz team, we have working hard on it and it is a really cool application. We are currently trying to gain notoriety for this application. It is available on https://jeeliz.com/sunglasses. Thank you very much for your help!