WebGL Game
March 2018
Summary
Though this is my least polished project, it remains one of my favorites, as it was my first introduction to computer graphics, my first time using Javascript, and my first real project. I had lots of fun implementing the naive (and buggy) collision detection, the simple, but satisfying Phong shading, and the double camera setup. This project sparked my interest in computer graphics, and prompted me to become a TA for the class as well as learn more graphics in my spare time, leading me to explore libraries like ThreeJS and OpenGL along with engines like Unreal and Unity, to see what was possible through computer graphics. Going back, I would reimplement a lot of this project, getting rid of the many global variables it relies on, as well as redesigning the collision and movement system to be more effective.
Takeaways
- WebGL and Shaders - I learned how the graphics processing pipeline works and how to implement my own custom shaders in WebGL to produce effects like lighting, multiple cameras, and fog. In addition, a lot of time was spent learning how to optimize the vertices and geometries on the screen, as well as optimizing use of WebGL functions to render efficiently.
- Javascript - As my first project hosted in a browser, I learned about how to use Javascript and its event-driven style to implement interactive scenes and webpages.
- Map Generation - I learned how to generate terrain given a data file, much like a heightmap, as well as how to optimize static map geometry for the graphics card to draw efficiently.