Page 1 of 1

An Isometric 3D Engine

Posted: Sat Sep 20, 2014 7:53 pm
by mode7
I usually don't post demos and experiments here. But this was so much fun todo, that I want to share it.

I always thought Isometric 2d graphics were strangely compelling. The simplicity and the slightly artificial look really appealed to me.
I especially like the look of early PS1 games which had an isomtric perspective, bute the camera could be freely rotated, for example Final Fantasy Tactics or Breath of Fire III/IV.

I wanted to recreate this look, which is somewhere between 2d and 3d. Since the arrival of meshes an image can be easily transformed into an isometric view so I thought I'll give it a try.

It took me several tries to get it right. After I realized there's no way around some math, I did read up on some stuff and learned a lot in the process. I didn't use shaders, because I sometimes code on my netbook, which doesn't support them, so this is just using löve's meshes

It can load an .obj model. You have to specify the texture though, as it ignores .mtl*s.
Oh and don't expect much from the obj importer, it's really rushed. Yiou have to trianglute your mesh first. Also make sure your faces are in "vertex/uv/normal" format in the obj format.

So this is by no means a complete 3d engine as it comes with a lot of limitations:

[*] Only one parallel light source (currently hard coded), no soft shading (could probably be done, if I get to wrap my mind around)
[*] Pretty low vertex count. This example has about 370 triangles and renders with about 110 FPS on my netbook, so you could still go a little higher but not much because....
[*] No Z-Buffer: Depth Sorting is the bottleneck here, this is what limits the amount of vertices.
[*] Only one texture per mesh. This is a love mesh restriction.

Probalby many more. Still it succeeds to recreate the look and feel of what I was trying to achieve. Feel free to poke around in the code. I tried to annotate as much as possible.
Just wanted this to share and get some feedback. I might continue with this for a little longer.

* Added smooth shading.
Utah Teapot
Utah Teapot
isoscreen.png (43.84 KiB) Viewed 7365 times

Re: An Isometric 3D Engine

Posted: Sun Sep 21, 2014 12:29 am
by undef
Wow, I like it a lot!
I've been playing around with 3d a bit myself, but nothing fancy...
I really like the look and feel of this, reminds me of nintendo 64 times :)

Re: An Isometric 3D Engine

Posted: Sun Sep 21, 2014 7:08 am
by Jasoco
Looks intriguing. You need to make something of this. It's my favorite art style. Any reason you went with isometric and not full 3D with depth perception?

Re: An Isometric 3D Engine

Posted: Sun Sep 21, 2014 11:56 am
by mode7
The main reason for orthographic projection is to avoid texture warping effects as love 2d only supports parametric (?) mapping. I could render this in a perspective view with a few lines of code but textures would look distorted like on some ps1 games.

Im currently trying to speed up depth sorting as its the main bottleneck. Anybody knows a fast alternative to luas table sort function. Im thinking binary heaps could be what I'm looking for but i have to do some reading about them.

Re: An Isometric 3D Engine

Posted: Sun Sep 21, 2014 5:34 pm
by jjmafiae
Very awesome, this would be great for a tank game or a RTS game.

Re: An Isometric 3D Engine

Posted: Sun Sep 21, 2014 8:31 pm
by mode7
Made pseudo smooth shading work. Not really accurate but it does the job.
Also made some tests with a Utah Teapot model. As you can see 1500 Tris are kind of the limit here, at least on my Netbook.
I updated the demo. For some reason the love crashes for me when I try to change models. It works however when it's not zipped...strange...

EDIT: OK it doesn't crash it just loads really slow.

Re: An Isometric 3D Engine

Posted: Tue Sep 23, 2014 8:41 am
by silver_hawk
Nice, really loved the psuedo 3d zelda like terrain :D

And yes, the loading of the teapot is incredible slow :S

But anyway really nice work there :)

Re: An Isometric 3D Engine

Posted: Wed Sep 24, 2014 9:10 am
by mode7
I experimented some more.

The big advantadge of orthografic projection is that there is no perspective distortion.
This means that once a mesh has been updated, it can be drawn mutliple times like a tile in a tileset.

I also switched back to flat lightning. What you can do however is pre-render lightning. As you can see in the example below, I used blender to bake ambient occlusion, with some creative texture work you can get a nice quality 3D-Isotile.

Z-Sorting remains a big problems though. Polygons pop up everywhere. This severly limits the kinds of meshes you can use.

The example below, only uses one mesh multiplied 10 times and an ambient occlusion texture. This results in quite high performance. This particular scene gets 200 fps on my netbook (with an empty love, I get about 300) and 1000 on my desktop (which is the limit).

Re: An Isometric 3D Engine

Posted: Mon Jan 19, 2015 11:12 am
by DmL
If you don't mind, could you post a version of this which does perspective /clipping? I modified it a little and was able to get some perspective, everything that's "behind" the camera turns to soup (I guess that's what's happening), but my math is nowhere near good enough to actually fix the problem.

The texture warping is no problem for me, as I can use smaller triangles, and it's actually part of the effect I'm going for!!