Traversing the road to success.

So, you are building a 3D game. Everything looks somehow fine while things are moving, but then you take a screenshot to upload it to iTunes and: the horror! You realize the awful truth. Some texture borders seems crappy and pixelated.

Oh, you forgot to turn on the anti-aliasing. That’s easy to solve. Except that… wait, there is no anti-aliasing in OpenGL ES 1.1!  Damn!

Well, we’ve been there too. While we were porting Cube X Words to the iPad, the 3D dice that looked awesome in Mac OS, looked just like a BMP drawn in MS Paint in the iPad. So we did what every self-respecting developer does first: we googled for an answer, but alas!, we found none…

How to solve that? The hard way: mess with everything you’ve done in order to draw a 4X image and then scale it down. But, but… stretching a texture to 4X and then down looks bad, I have to re-do all my textures!  It sometimes works, it sometimes doesn’t, it surely hurts the performance and may end up looking like crap again…

By accident, we found an easier way. It involves a bit of modification to the textures and another bit to the code.

We found out that if you leave a couple of transparent pixels outside of your texture, when the projection is blended, it kind of anti-aliases the texture borders (since whenever OpenGL calculates the pixel’s color value, it mixes the color with the transparent part). So, voila! We just had to give our textures a bigger canvas, and make the sprites bigger accordingly. Just like this:

It worked like a charm. You can check it out in this screenshot. See that the rotated E’s border looks just fine.

Well, I hope this helps you too.

- Rula.

Comments on: "How to emulate anti-aliasing in OpenGL ES 1.1" (1)

  1. Interesting, thanks. I will give this a try.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Tag Cloud

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: