SEARCH

How-To Geek

What Is Anti-Aliasing, and How Does It Affect My Photos and Images?

anti aliasing

Anti-aliasing is a word that’s often thrown around by photographers and gamers when dealing with graphics and images. Take a look at what anti-aliasing is, why we use it, and, most importantly, when it’s best to not use it.

It’s an important part of imagemaking and photography—anti-aliasing is certainly something that should be understood as thoroughly as possible to create high quality images. We hope you’re prepared for a very geeky article, as you have lots of discussion of math and science mixed in with today’s explainer article. Keep reading!

Vectors and Pixels, and Why Cameras Take Pictures With Pixels

sshot-455

You may remember an article from a year ago where we talked about the difference in Vectors and Pixels. There are a number of fundamental differences between the two: pixels are ordered arrays of light, pigment, or color; vectors are mathematical representations of lines, shapes, gradients, etc. Vectors are precise; they exist at absolute coordinates on an algebraic grid. Because they are so absolute, there’s no blurring the line between where they are and where they are not. Even if a monitor cannot render a line segment’s infinite thinness (it always has to show it in pixels), it still is as thin as a line existing only in a theoretical mathematical world.

3169421398_880e17c349_b

That’s the problem with photography—light isn’t as precise as it would need to be to be captured in a perfectly mathematical way. It’s likely that even if we developed cameras capable of reading the locations of individual photons with quantum precision as they hit the sensor, because of the weird nature of physics at the quantum level, the individual particles may actually appear in multiple places on the sensor at the same time. This means it may be absolutely impossible to get the absolute location of that single particle of light at the time it hit the sensor—photography is only an approximation of how that light is captured. The stopping action (ability of the camera to create sharp images from moving objects) can never be perfect—at least it seems very, very unlikely.

Pixels are handy because high-resolution images can approximate colors and shapes, accurately recreating an image in a way that is similar to film-based photography. While this property of pixels and its use in photography is not anti-aliasing exactly, understanding this property of digital photography is one of the best places to start a solid understanding of what anti-aliasing is.

Interpolation: Creating Something From (Almost) Nothing?

1000px-Interpolation_example_spline.svg

Digital photography is an approximation of the colors and values present when light hits a sensor—in this same way, anti-aliasing is an approximation of image data using a technique called “Interpolation.” Interpolation is a fancy-pants math term meaning data created based on the trends of existing data, i.e. an educated guess on what might actually be in that spot if more data points were available. While it is more complicated that simple guessing—there are formulas and proper methods for Interpolation—it can’t be expected to be a perfectly accurate representation of the image data that is actually there. Even the smartest math can’t create something from nothing.

Aliased Antialiased-lanczos Antialiased

When we look at these computer rendered checkerboards, we can begin to understand what anti-aliasing is doing to improve and approximate images. On the leftmost image, there’s no interpolation of data—the checkerboard is rendered in black and white pixels as it recedes back in perspective, and quickly becomes a mess. The visual errors and artifacts created are what we call “aliasing.”  The second and third images above use different forms of “anti-aliasing” to better approximate how human eyes (and cameras) perceive light.

sshot-459 sshot-460

Those images, however, were a translation of absolute mathematical images into pixel based images. How does anti-aliasing apply to your photography? When images are resized, either enlarged or reduced, the image is interpolated based on the data that exist in the image document. The left image is shrunk using the “nearest neighbor” resampling in Photoshop—in other words, it isn’t anti-aliased (you can literally call this aliased). The image on the right is reduced and anti-aliased, creating a much truer image at that small size.

sshot-461

Enlarged images also benefit from anti-aliasing—graphics programs make their best guess based on the data in your image. Keep in mind when you are upsampling (enlarging) images in a graphics program, that you will never actually get more resolution out of a digital enlargement—the kind of interpolation being done can make a good guess as to what should be there, but it’ll never know for sure. Your edges will be soft, and get softer as the photo gets enlarged more and more.

A good rule of thumb is that you can always downsample (shrink) your images without loss of quality from anti-aliasing. Upsampling (enlarging) makes the anti-aliasing very obvious, adds no new resolution, and should only be done if it can’t be avoided.

 

Anti-Aliasing and Vectors: Why Anti-Aliasing Makes Videogames Look Better

5469846748_7e0723732a_o

If you’ve played a PC game in the past 15 or so years, you might have seen video options that included settings for anti-aliasing. If you remember when we discussed vector shapes existing in an absolute position, you should begin to understand why anti-aliasing is important to video games.

3 Dimensional forms are created in vector polygons, and these polygons exist in a math only realm. Anti-aliasing in video games has at least two goals: firstly it wants to be able to render the absolute, hard-edged lines of the polygons in a form that looks decent on a pixel-based monitor; secondly, anti-aliasing better replicates the imprecise way that photography and human eyes perceive light.

 

Anti-Aliasing and Typography

Aliasing_a

On a final note, there are plenty of occasions where anti-aliasing is not ideal. If you’ve ever worked around graphic designers, you’re likely to have heard them complain about typography in Photoshop, and how inferior it is to Illustrator—and they’re right.

Both of the letters above are pixel based typography, with the left one being aliased, the right one anti-aliased. Neither are good representations of typography, or at least that typeface. It is acceptable to render a font on screen with anti-aliasing, but for print, it can have some disastrous consequences.

IMAG0372

When you think about what letters are, they don’t really follow the same rules that digital photography requires. Letters are abstract ideas and absolute shapes—they fall better into the “pure math” category of vector artwork. And depending on the type of printing process used to create them, those pure math vector shapes become absolutely important.

IMAG0367

This image above was created with anti-aliased type, and then most likely offset printed. When we look closely we can see why that’s bad.

IMAG0362

It becomes clear very quickly that these anti-aliased forms did not hold up well when printed this way. This is an example of how anti-aliasing (as well as pixel-based imaging) can be inferior when rendering typography.

Of course, had this been an image (like a photograph) and not the abstract forms of type, it would have held up quite well.

IMAG0378

Type, being an abstract medium, requires the precision of vectors to hold up under the kinds of printing processes that don’t use inkjet dots to create an image. Even at very close distances, we don’t see any dots or evidence that anti-aliasing that went into the files used to print this Coke can.

Of course, most HTG readers won’t be offset printing most of their photos, so pixel-based typography printed from dot-based printers will work out just fine. Simply be aware of your anti-aliasing when you’re working with typography and when you’re working with photography—you’ll find you’re better prepared to make the right choices that will give you the best possible images.


If you have any questions regarding anti-aliasing and your photographs you feel we haven’t answered, or maybe you think we’ve left something important out, feel free to let us know about it in the comments below.

Image credits: Varena #1 by hasensaft, available under Creative Commons. Blurred umbrella portrait by Shannon, available under Creative Commons. Dragon Age 2 Demo Ogre VH by Deborah Timmins, available under Creative Commons. Anti-Aliasing Images by Loisel, available under GNU Free License.

Eric Z Goodnight is an Illustrator and Graphics Geek who hopes to make Photoshop more accessible to How-To Geek readers. When he’s not headbanging to heavy metal or geeking out over manga, he’s often off screen printing T-Shirts.

  • Published 09/12/11

Comments (22)

  1. Aaron Sun Camacho

    Great Physics/Math/Graphics article! Very well written and illustrated… read this and you WILL understand (anti)aliasing.

  2. Patrice

    Thanks, interesting article.

  3. MrCaringi

    Gran artículo, muy bien explicado! gracias!

  4. Ted M

    Great article! Well written.

  5. HR_PR

    Super nice!!!

  6. Shawon

    Awesome post!

  7. Kevin

    Ta!
    But have to say that my understanding of it was only in the generalities
    Still liked and will save for a future attempt

  8. Jeroen

    I thought i knew what is was, and now I do! Thanks.

  9. narrative

    Very informative … thanks.

  10. danaross

    Great article. Thanks.

  11. jose mcc

    It was said that the shutter speeds are the main drawback with cameras and quite possibly might never be resolved ,,would,nt a shutter speed that can close up to light speed solve that minor inconvenience…yeah so s,ppose possibly never then yeah,,,

  12. MichaeljY

    I’ll have to say that, since subscribing to How-To Geek a couple of months ago, I haven’t seen much that I could use in my own computing experiences. Now this great article comes along and makes the subscription worthwhile. Thanks!

  13. tim

    The stair-step effect explained perfectly , although I knew (more or less) how this worked in gaming and how it is rendered , my knowledge is now expanded into where it is NOT advisable or beneficial . I’ll never use this knowledge in shooting photographs , but I better understand what it (really) , is . Thankyou for this informative info.

  14. Ben S

    You ever hear of that saying Keep it Simple Stupid. Well being someone who specializes in Digital Signal Processing this article did a really good job of explaining something that can get very complicated mathmatically really quick. Good job on this one How To Geek.

  15. pn2bade

    Great article! Btw, what game is that in the picture right under the header ‘Anti-Aliasing and Vectors: Why Anti-Aliasing Makes Videogames Look Better’?

  16. pn2bade

    Oh, never mind. I didn’t see that at the end.

  17. Bigchez

    Hi, My company gets images created in 3d by a third party. When we received the 3d walkthrough of a particular job I noticed some pixels and asked if they could make the presentation in a higher resolution to be seen on a plasma. They told me that what I was seeing was antialiasing. They would have used a graphics program like 3ds or similar to do up the presentation. Is this possible and is it the program they use that does this, is there a solution?

  18. Juan

    So Coke is better than Pepsi. Hmmm.

  19. Roland

    very educational, thanks

  20. Kevalin

    Whoa, great timing… though it may mean some serious extra work! I’m in the process of creating a mostly-type t-shirt design for a fundraiser, using GIMP. I’m guessing now that I’d a) better check and make sure any antialiasing features are not awake, or b) consider using an Illustrator-type program instead, if I want a decent quality print job.

  21. lorimain

    If you want to enlarge a photograph should it be done in smaller increments such as 10% at a time. Will this help to lessen the guesswork?

  22. Eric Z Goodnight

    @lorimain: That’s an interesting question. I’m going to say no, it won’t change a thing. If it did, that’s what the program would already be doing. I’m thinking it would be sort of like multiplying by a number by 10 x 10 instead of multiplying by 100–maybe only *slightly* different.

Enter Your Email Here to Get Access for Free:

Go check your email!