![]() ![]() But look at the 'n' in the title ... no jagged edges! How come? As long as an image lines up horizontally or vertically, the computer can draw absolutely straight lines with these little boxes ... ![]() But as soon as the computer tries to show something that has curves in it ... ![]() ... the computer is forced to draw the curves with little boxes, and it looks jagged. Here's the same curve magnified a little so you can see the boxes trying to form a curve: ![]() There's no way around it ... a computer screen draws pictures and text with little boxes, so the edges of everything that's curved will be jagged. But your eye can be fooled into thinking a jagged edge is smooth! ![]() Have a look at the letters on the right. The left column shows a large and small 'S' made from little boxes. You can clearly see the jagged edges, even on the smaller one. The letters in the right column, however, seem to be much smoother. How was this accomplished using just black squares? In fact, the smooth letters aren't entirely made from black pixels. All around the edge are a variety of grey squares that gradually fade to white. They are placed around the edge of the letter in a precise fashion ... one that fools your brain into thinking the curves are smooth. Your brain is fooled because your eyes can't really see the grey pixels very well, so your brain assumes the black letter is smoothly curved. This process is called anti-aliasing. Here are some close-ups of the tops of two letters ... one without anti-aliasing and one with it. ![]() ![]() You can clearly see how the grey squares fade to near-white around the edge of the anti-aliased letter. At normal size this will make the lower letter appear smoothly rounded. Text that appears on your screen has been anti-aliased by the computer. This is also a useful process to know about when you are working with photographs on a computer. ![]() However, if you tried to print this picture on paper, or zoomed in to see it up close, you would immediately see that it's made from little boxes called pixels. In fact, all photos are made from very tiny bits of colour. High resolution photographic prints use such tiny bits that you'd need a magnifying glass to see them ... but they're there. A computer image is made from pixels, which aren't as small ... you can sometimes make them out if you look really closely at a computer image. Anti-aliasing is important when you want to crop part of a picture. For example, suppose we wanted to crop out the image below in order to paste it onto a white background. ![]() ![]() At the left is the cutout without anti-aliasing. At the right is the same cutout with the edges anti-aliased. The difference is striking, and clearly the right picture will blend evenly into whatever background it is added to. |