Solution for anti-aliased seams imported illustrator objects

[Herbert123]

A while ago I posted about an issue with rendering anti-aliased vector objects that consist of precisely aligned objects.

To recap, turning on anti-aliasing for certain imported vector illustrations may introduce seams due to perfectly aligned parts.
It looks like this:

Untitled2.png

Here is an example of one of the game elements of a mobile game I have worked on:

Untitled1.png

The problem is, without anti-aliasing, the seams disappear, but no nice anti-aliasing, and the edges become very grainy looking.

So, how about we COMBINE the two?

Untitled.png

Simple: create a copy, and put the anti-aliased version on top.
Then turn off anti-aliasing for the bottom version (important!!!).
<ctrl> click the bottom version's thumbnail, and create a layer mask based on the alpha.

This will solve the seams issue, but also introduces some edge artefacts. To remove these, apply a minimum adjustment layer to the alpha mask. Depending on the resolution or size of the original, you may have to reduce the edge of the alpha more or less. In this low resolution bear example, 1px was more than enough to remove the artefacts.

DONE! Problem solved. Nicely anti-aliased version without any seams. A pretty good and flexible solution and workaround.



note: photoshop CS6 users experience the identical issue with imported illustrator objects into a smart object layer. Because there is no method to turn off anti-aliasing on a per layer basis in Photoshop, those users are out of luck. To be fair, this issue does not occur in cs5.5 or CC.