: Compositing transparent paths so topmost pixel wins I'm having difficulty wording what it is I want to accomplish, but I'll try to explain. Let's start with the images below: (a)

@Berumen635

100% Black + 0% Black = still Black

The question sounds sort of funny at first glance - "How can I make a translucent object be opaque?" Technically, this isn't possible by definition of the words. There are ways to do this in Illustrator without creating new objects, but they will not work for you if the only color you can work with is Black.

The thought process is that you can have 2 aspects to your object:


An opaque "base coat"
A varied-opacity upper layer.


You've stated your palette only contains Black so that makes the Base Coat simple -- it has to be black. At this point, it doesn't matter what you do with the top-coat because a translucent Black on top of opaque Black is going to produce, well, Black.

Unless...

End Use / Constraint

I'm not sure I understand your constraint. If you are just creating a monochromatic template image, why not use gray-scale opaque gradients in your Illustrator objects to produce the final image. Then use the produced image as an opacity mask on an all-black object to produce a final image that is varied opacities of Black without being opaque?

Just because your final image must be monochromatic and vary only in opacity doesn't mean that the objects used to create this image must be similarly constrained.

Here's how:



Compositing

There is a way to create flexible objects that have complex appearances without involving clipping masks or layer groups. Starting with CS3 (or earlier?), you can add multiple fills to your objects. When your object has multiple fills they get stacked like layers in the Appearance palette.

If you create an object with an opaque White fill, and then add another fill with gradient-opacity Black above it, you will have 1 object with the desired effect. Your artboard will stay very clean - no extra paths, no cluttered layers or groups, no unnecessary clipping masks, no fear that Direct Selection will only grab some of the anchor points you need, no fear of "tearing" from objects not being lined up to the milli-point.

Example:



It should be noted that, for your example, this is not going to produce a different result than just using a grayscale gradient. However, it's a good technique to have in your kit.

There is a great tutorial at TutsPlus.com that demonstrates the use of multiple fills to create complex effects. It has several good examples of the flexibility and power of this technique.

Vote Up Vote Down

@Michele215

I think what you are looking for is a layer blend mode to do what you want to do. Illustrator doesn't have blend modes, and even if it did, there isn't one (at least in Photoshop) that allows you to do what you want to do. Transparency is a blunt tool in this case because the blend modes react to it; you simply need to allow for the transparency or turn it off completely.

This is precisely what layers are for: to allow you to show the whole of the topmost objects without having to clip everything underneath them. Place each object on its own layer, and you have the editing capabilities you need without having to clip objects to make it all work. Layers are a simple tool that you can use strategically to your advantage.

So, based on your example, you can have the topmost frame with filled rectangles underneath—one with transparency and one opaque—you can swap out as needed. Not ideal, but it is a lot easier to turn a layer on and off than clipping shapes every time you have an edit.

Vote Up Vote Down