Welcome to Hobby 3D Game Programming!

Hi and welcome to my game programming blog.  My name is Erich and I am a hobbyist 3D game developer.  In other words, I make simple 3D computer games in my spare time... for fun!

Goals for this blog:

  • Learn the basics of creating an .html template page to hold our games
  • Learn how to use the awesome Three.js library for drawing the 3D graphics
  • Discover what's going on beneath the surface of simple games that make them work
  • Learn basic algorithms that move the game's objects and characters around realistically
  • And most importantly, to have fun!
Obviously we won't be making the latest triple-A hit games; that usually requires a dedicated team of software engineers and artists working round the clock.  However what we will be able to make in this blog series are simple, solid, true 3D games that are fast and responsive to player's input. 

 So if you are ready,  let's get started on a deep and fun journey into 3D game programming! 

Popular posts from this blog

Timing on Different Systems with Three.js

Let's consider the effect of timing on games.   Typically, all moving game objects and players/characters are updated every cycle through the game code.  This means that if you instruct the game to "move a character/object by 1 unit", it will indeed move by 1 unit on every pass through your game program.    Take our sun light object for example.  On every frame of animation we want its height to move smoothly, so we type: sunHeight = sunHeight + 1; Just like we expect, the sun will rise smoothly, and it will work on any computing device or smartphone.  That's all good, until you consider that not everyone's device is running at the same rate.  A powerful desktop computer might loop through this statement 60 times a second, while a smartphone or old computer might only get around to it 20 times a second.  That means that the person playing your game on their powerful desktop computer will see and feel a different game experience than the person ...
Read more

Adding Keyboard Input (part 1)

At this point we have the makings of a fun graphics demo, but it is not responsive yet for the player.  Other than re-sizing the browser window, the user has no way of interacting with our program.  It's time to remedy that!  What we will do in this post is add a simple keyboard input file to our project.  When we've done that, our demo (future game) will respond to keyboard key-presses in real time.    You may recall back when we added the Three.js library file to our project, I said that it makes our 3D game programming lives much easier.  Three.js takes care of the not-so-fun raw GL graphics / math initialization for us, so that we can focus on the fun stuff.   However, Three.js is meant to only aid in 3D graphics rendering inside the browser.  It purposefully leaves out libraries of keyboard/mouse/touch input, AI, networking, game physics, audio, and other various components that we might need for our future games.  If it DID incl...
Read more

Adding Lights with Three.js (part 1)

Now it's time for one of the most important elements in 3D games and graphics:  lights and lighting.   The Three.js library offers us some of the latest and most realistic lighting and shading options available in today's web browsers.   There are a lot of options for types of lights, types of surface materials on the subjects that are lit,  and equations/algorithms that affect the final look of the lighted scene.  This will be a multi-part post because we have to cover quite a bit of setup for lighting to work well in Three.js.   First, we have to change the material (or skin) of our colored cube so that it will correctly respond to lights in the game world.  If you recall, here is the old way of setting up the material/skin of our green-colored cube: var material = new THREE.MeshBasicMaterial({ color: 'rgb(0,255,0)' }); Unfortunately, this way of setting up a 'Basic' material will only shade the cube with the rgb color that you manually give to it...
Read more