Inside Photoshop
Naming and organizing your Photoshop layers and using Layer comps.
Layer naming and Structure
- Group connected items in folders and give them a name
This will help Developers and other designers to locate item quickly and provide context.
2. Group layers logically
Arrange your layer groups according to the flow of the document with the header group at the top, footer group at the bottom, and everything else in the middle.
3. Delete unnecessary layers when ready to pass off file to dev
Once you’re finished working on your Photoshop file remove all unused layers from the Layer Palette.
A great tool to use to help remove unused layers is this Photoshop script:Download script*
How to Install:
1. Save script somewhere you keep all your photoshop resources
2. Save your PSD to a new file
3. In Photoshop, load script
4. Wait until script is complete (can take sometime is the file is large)
Using Layer Comps in Photoshop
A layer comp is a snapshot of a state of the Layers panel. They help to create multiple compositions or comps of a page. Layer Comps record three types of layer options:
- Layer visibility — whether a layer is showing or hidden.
- Layer position in the document.
- Layer appearance — whether a layer style is applied to the layer and the layer’s blending mode.
Do’s
- Clear and Meaningful Naming
- Visibility and Appearance are applied
- Don’t forget to Update each comps once you make updates!
- Use Layer Comps for hover & pressed states of buttons/navigation
Dont’s
- Don’t provide broken layer comps in your PSD
Further reading
How to use Photoshop Layer Comps by twosixcode