What's new
Photoshop Gurus Forum

Welcome to Photoshop Gurus forum. Register a free account today to become a member! It's completely free. Once signed in, you'll enjoy an ad-free experience and be able to participate on this site by adding your own topics and posts, as well as connect with other members through your own private inbox!

Creating a sprite sheet, want 2 different color versions


cavillac

Member
Messages
9
Likes
0
As the title hints at ... I'm creating a sprite sheet with a bunch of icons and all of them are going to plain white. I then want a second version of that sprite sheet but in a different color.

All the icons are going to be in their own layers or else I'd use a simple Color Overlay ... but that's the gist of what I'm trying to do - some layer that works like a color overlay for all layers underneath it. That way I can save the standard image to get the white icons and then display this magical Overlay layer and save that "color copy" off as a variant.


Thanks in advance.
 
If each icon is on their own layer and depending on how they are designed, you could use a clipping mask. Then they all can be individual colors or you could add a clipping mask to a group.

Individual
Screen Shot 2014-05-13 at 8.53.41 AM.png

Screen Shot 2014-05-13 at 8.53.56 AM.png

Group

Screen Shot 2014-05-13 at 8.54.24 AM.png

Screen Shot 2014-05-13 at 8.54.31 AM.png
 
Is that available in CS4? When I move all the layers into a group and then put the Clipping Layer above the group it still just affects the first layer of the group
 
Yes, it's available in CS4.

How the clipping mask will affect the icons is based on how they are designed (as mentioned above).

Notice that my Icon is on a transparent layer.

Screen Shot 2014-05-13 at 9.22.09 AM.png

I would have to see one of yours to offer any further help.
 
So my icons look like this (blue checker background is just to help position/see them - it will be hidden when I save the file)
psgPreview.png

My layers look like this
psgLayers.png

I want to take Layer 3 and make it a Clipping mask for all the layers in the Icons group.

If I right click on Layer 3 right now, Create Clipping Mask is grayed out. If I move it in the group, it is enabled but using it will only affect the first layer (PA). I've tried Linking the layers together ... I've tried making Layer 3 a Clipping Mask while in the Group and then moving it out ... nothing seems to work yet.
 
Ok, can the checker board be turned off so that you only have the icons?
 
Yes. What do I need to try after hiding the checker layer? I don't really see any differences in options/behaviors after hiding that layer
 
Yours should look like this.....

Original Icons, white on transparent BG.

Screen Shot 2014-05-13 at 10.03.55 AM.png


With an added BG.
Screen Shot 2014-05-13 at 10.01.18 AM.png

Now red using clipping mask.
Screen Shot 2014-05-13 at 10.01.29 AM.png

Screen Shot 2014-05-13 at 10.02.06 AM.png
 
I'm a bit confused as to what you're needing ... but here is my image with the checkers gone and the Clipping Mask applied to one of my layers:
psgJustOne.png
 
Ok, based on your example in post #11

Remove the clipping mask on the car. Leave the checked layer (layer 1) off. Collapse the group. Add a new layer above the group. Fill with the color you desire. Clip the new layer to the group.
 
If you tell me it only affects the first layer, then I see another possible problem.
 
Clip the new layer to the group.

This is what I can't figure out how to do. Here's what it looks like after I removed the Red Mask, created a new Layer above the Group, filled it with Blue and then right clicked on that Layer...
psgNoClipping.png


Create Clipping Mask isn't an option at this point. Is there something else I need to do first?
 
OK, I can't find a reason for this problem other than you may be right about CS4 not being able to clip to a group. Still working on it.
 
Last edited:
I can't find an easier way. Maybe someone else will chime in with a better idea! Sorry!

Your going to have to add a clipped color layer to each individual icon layer.

Screen Shot 2014-05-13 at 11.24.11 AM.png
 

Back
Top