Thursday, 12 April 2012

Graphics Part 5

We now take our resized Icon and use the same technique we used to remove the Jpeg noise to redo the transparency.

That is we fill the background with Magenta and look for any pixels which look out of place.
This is much harder now as the image relies heavily on the anti-aliasing for detail so we need to keep the tolerance low.

Squinting helps, but it's still quite tricky.

We have resized the image to 62x62, The icon will actually be 64 by 64, so we have allowed for a transparent border all round which is not part of this image.  That means this image should touch each edge - which it does.

Things to look out for are jagged bits, like at the very bottom and odd pixels that are very different from the ones next to them.  As before we are only concerned with the parts of the image close to the transparent sections, the body of the image we leave well alone.

Here's I have highlighted with (bady drawn) green rings the pixels that I believe should be transparent.
There is no hard and fast rule, it's mainly experience, but in the case of most of these is is to do with them being too light.

In the areas indicated, the object is getting darker was we go towards the edge and then suddenly there is a lighter pixel, which looks (to me at least) out of place.  This is most likely because the anti-aliasing is filling the difference between the dark image and the mid-grey background.

There are exceptions, such as the light coloured tool extending up to the left of the handle, so care should be taken.

Here is the image cleaned up - remember to squint as you look at it.
Originally I was going to leave the trip of grey down the right hand side, but as I worked on the rest it started to look more and more out of place so it had to go.

Quite often as you remove some stray pixels, others become more apparent.

Here is the icon actual size with both the Magenta Back and a Transparent Back.

No comments:

Post a Comment