Thursday, September 15, 2011

Screens of the day 17 - Cats

Today we are going to combine the two new tehniques: creating dynamically sized shapes filled with a procedural pattern and converting a 2D texture to an isometric texture that can be applied on the before-mentioned shapes.

Let us take this random grass texture that I found by googling "grass texture":


This is not a good texture to use because it is big and detailed and my result will be small, thus dropping a lot of detail. Still, let us try an see what we get:


Not bad! It looks like it is gaining detail rather than scaling up, but I am still not 100% happy. Let's try another random grass texture:


Converted, it looks like this:


Something is not right there. Look carefully! I'll try a more distinct texture to better observe the behavior:



The conversion result is clearly wrong (except for the GIF pallet; GIFs use 256 colors and my images do not use pallet optimization and dithering to compensate for that). I'll illustrate this by using this cute cat:



Aha! We can only see the head. There is a bug in the scaling algorithm. Let me fix it:


Normally I'd go back and fix the previous sample images, but since this blog is a lot about documenting, it is OK to document the bugs too.

The process works of course for larger sizes too: 


This is why I wanted to try a 3D engine again. It comes with great flexibility and you get a lot of things for free. But I guess I will be sticking with the hard way.

The final step is to take these techniques and create the first prototype of the new and experimental Flexy engine!

2 comments:

  1. Is your scaling gamma correct?

    ReplyDelete
  2. I have absolutely no idea. I am using homebrewed algorithms because I just can't seem to create a truly 3D engine where I could rely on tried and true algorithms and a lot of hardware support.

    ReplyDelete