Jeremy Abroad

Making a 3D Game

June 27, 2015

I’ve decided I’m going to make a video game.

It’s going to be 3D and use WebGL and Three.js so that it can load in the browser without any plugins. I’ll probably utilize an existing open source physics engine at some point, but for the time being I’m doing all my simple collision detection with raycasting.

Although Three.js makes things magnitudes of order simpler than using raw WebGL, it still does very little for you in the context of creating a video game. Also I have no background in 3D modeling and video game development.

My objective isn’t merely to make a game, but to also learn how everything works in 3D development. I want to know the math, the proper collision detection algorithms to use, how to organize my code into clean decoupled stateless modules, performance optimization, artificial intelligence, etc.

Basically, this is a daunting undertaking on my end which will probably require hundreds if not thousands of hours of work outside my day job. I know that I’ll inevitably face a period of hardship where I’ll feel overwhelmed and tempted to give up, which is why I’m writing this post to keep track of my progress and hold myself accountable.

Human beings are very irrational. It is very much not a human instinct to optimize your life for the long term as opposed to chasing short term highs. This is my commitment to the latter.

I’m going to update this post with a daily log of my progress. Also I hope to have a link up shortly to a live version of whatever I’ve done so far.


6/22-26 - Created basic 3D world with FPS view, ability to walk on non-level terrain (eg. walk up ramps) via raycasting, ability to select objects with raycasting, ability to shoot properly rotated cylinders in any direction (had to brush up on my freaking trigonometry for this), audio visualizations via Web Audio API, brushed up on basic fragment/vertex shader workings

6/27 - Added Collada model loading. Took longer than expected due to error being thrown by global variables. Submitted PR (my first PR to an open source project btw).

Goals for tomorrow: make it so I can load multiple Collada models (yea…it’s not built into the library), learn 3D modeling and figure out the best way to create buildings and walls

6/28 - Learned about BufferGeometries, how to merge geometries, and how to delete faces. Started making the map editor, using the voxel painter example as a foundation.

Although I worked all day, felt like 80% of my work was done at night (stayed up till 4am) because I was much more focused. Maybe I should only work at night.

6/29 - First day back to work. Didn’t get any 3D stuff done because I spent my after-work time finishing up and launching the new upgraded jbernier.com.

Other notable accomplishments of the day include eating both a Chipotle burrito and a Mighty Quinn’s brisket for dinner.

OFF TOPIC: It bothers me that most restaurants skimp you on the meat. My Chipotle burrito had a pathetic amount of meat on it relative to everything else. Meat is the cornerstone of every meal. Everything else is a supplement. When asked what’s for dinner tonight, the first thing you say isn’t “broccoli”, it’s “steak”.

So why does only 7% of my Chipotle burrito consist of steak? I can get a ton of salsa, peppers, onions, lettuce, corn, and guacamole, but only 10 little cubes of steak?

I’ve decided I’m going to try to write every day, even if it’s just a little blurb. That way I can look back to every single day of my life and recall what I did on that day.


Sorry guys, I ended up abandoning this project.

You can see the unfinished 3d stuff I made here

My main takeaway? Just use Unity (or any other game framework)

In any case, this was a great learning experience and I had fun with it.


Jeremy Bernier

Written by Jeremy Bernier who left the NYC rat race to travel the world, work remotely, and make the world a better place.