: Efficient ways to save individual layers or assets in Photoshop CC When I am designing a mockup in Photoshop CC (a website for example), I typically have each element of the website on an
When I am designing a mockup in Photoshop CC (a website for example), I typically have each element of the website on an individual layer. This is both for production of creating the assets for development and ease of use within photoshop (editing the actual mockup).
When it comes time to create the assets for production, I would copy them, create a new file, paste and save them as needed. However, is this actually efficient and it begs the question of what are other ways of accomplishing this task.
What are efficient workflows for exporting assets from a design mockup in Photoshop CC that are different from previous versions of photoshop. Are there plugins that can assist and are there downsides? Sometimes plugins are not as controllable as manually control for example.
Here are some I can think of with consideration of transparencies etc:
As mentioned above, Copy the layer, open a new file, paste and save
Ctrl Click the layer tile, crop, save, Undo the crop (not generally
"safe")
Convert the layer into a smart object, open it, save
Others?
More posts by @Moriarity648
1 Comments
Sorted by latest first Latest Oldest Best
Photoshop CS6 (Creative Cloud version) introduce a new feature called "Generate" (File > Generate > Image Assets). In Ps CC this also allows creating an Edge Reflow project, although that function remains incomplete while Reflow is in Preview status.
Generate works with layers that are specially named to indicate the image type that Ps should export. Instead of naming a layer "logo," you might name it "logo.png" to have it export as a png. Naming conventions allow you to specify the compression for a jpeg, the bit depth for a png, etc.
Activating the Image Assets feature is as simple as choosing it from the menu. Ps CC creates a new folder called [filename]-assets immediately, and exports any specially named layer (as above) instantly and automatically. This is transparent to the user. Any updates to a layer are immediately updated in the assets folder.
The Ps layers can be smart objects, regular raster layers, shape layers, anything that can be turned into an image.
So far, so fantastic, but cries of "Moar! Moar!" were heard in the various Adobe forums, because all that special naming was tedious. (How easily we are spoiled.) So the indefatigable Russell Brown got to work, and now the most efficient way to use Generate (Ps CC only) is in conjunction with the Adobe Layer Namer extension. This monster of designer decadence renames layers for you, based on your selection of JPG (with a slider to select compression), PNG (with radio buttons for 8, 24 or 32 bit) or GIF. As a bonus, there's a "2x" checkbox that will generate a second image at double the resolution, for High DPI displays.
The best way to wrap your wits around all this is to watch the tutorial video for the Layer Namer. It's frankly much easier to show than to explain.
Layer > Copy CSS, Generate and the Layer Namer have made Photoshop a far more efficient web design tool.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.