socialgo
Apr 4th

Photoshop Layer Comps

By ezra vancil
If you are designing your custom graphics for your social network with Photoshop, you have enviably run in to the "big mess" of layers and moving something in your header, then wishing you hadn't. 

Photoshop Play room

What if you could play around with different ideas for your layout without having to make a new file every time. What if all these versions could be saved in one file? Well you can do this with Layer Comps. Layer comps remember allot of the mundane things you do every day in photoshop. I remember back in the day saying to a client sitting at my desk, "do you like it this way?", then I went for 10min and turned off 20 layers, moved some stuff around, "Or this way?" Now with layer comps, I just move everything, and save it as a Comp.

Don't go hog wild

Comps are great for layouts, and also great for design but you need to use them differently for both.
They are also really great for slicing your site but back to the layouts and design. Comps do not remember everything. They remember mostly positioning and layer states, but this doesn't mean they are not good for comp'n design actions. Just do your designs as you would with separate documents - if you want to see the logo smaller and with shadows in one comp, and plain in the other, just make two logo states on different layers; turn them on and off and save as comps.

Slice and Dice the easy way

Where comps come in handy is slicing your design. Have you ever tried to slice up your design and had to move and change layers all through the process? Well here is a easier way.

1. Save a comp with the full image as it should be. Like here you see I have a comp named all:

allcomp.png

2. Save a comp for each stage that you need to turn off layers or move something. Here I have logo. I want the background transparent for the logo because I'm making a PNG.

logocomp.png


Of course you don't see my slices, I have set up slices already of all the elements. Continue doing this for every element that needs things moved, or layers adjusted.

backgroundcomp.png

You will then have a very organized process for  retooling your entire site and exporting it in min.