Photoshop Finally Gets Slices and Linking Right

Share on facebook
Share on twitter
Share on linkedin
Share on email

As a web designer who works in Photoshop nearly every day, I’ve come to depend on the program for just about everything – creating website mockups, presentations, and editing photos, just to name a few. Once you’ve learned the complexity and tools wrapped into this powerful program, you can create just about anything, and even make a living with it.

But its main draw as a feature-filled program is also Photoshop’s Achilles heel: The program is slow to change to web trends and new workflows, as feature updates only come every several years or so. And some features that have existed in other Adobe programs – like Illustrator and InDesign – don’t make it into Photoshop.

In the two most recent updates to Photoshop, Adobe seems to be correcting both of those negatives. In versions 14.1 and 14.2 of Photoshop CC, Adobe has finally brought a modern way to export image assets and proper file linking to Photoshop.

Adobe Generator

In the past, if you wanted to get a logo image out of Photoshop, you’d have to use slices – a time consuming process of setting up “boxes” and exporting images to JPEG, GIF, or PNG file formats manually. If your layout had a major change, you’d have start all over and slice your document again. The proliferation of Retina devices – smartphones, tablet, and laptops – only compounded this process, as you might need a high resolution and normal resolution of each image too. Slicing became messy.

Photoshop’s new feature, called Adobe Generator, now makes slices a thing of the past, saving designers tons of time. Now all you need to do is name your layers in Photoshop in accordance to a set syntax, and Photoshop will automagically produce all of your image files for you. If you change a layer, it’s automatically re-exported for you in the background. To turn on Generator, all go to File > Generate > Image Assets.

For example, if you name your layer “200% Logo-Retina.png, Logo.png”, Photoshop will generate two PNG files – one that’s high resolution for Retina devices, and one that’s normal resolution for non-Retina devices. Optionally, you can tell Generator to export in GIF or JPEG formats, along with some options in scaling and quality for each. Set it and forget it!

Linked Smart Objects

The other useful feature just added to Photoshop is being able to link to Smart Objects – an evolution of “placing” files into a Photoshop document. Placing a file into Photoshop has never worked the way you wanted it to: if you have to update that placed file, you have to manually place and adjust in Photoshop again. What we’ve really wanted is the ability to link to files much like Illustrator and InDesign have been for years.

Now, with the latest update, if you link to a Smart Object, and you make a change to it later – say a color change – your Photoshop doc is updated accordingly. This saves tons of time and opens up more team collaboration, too. One designer could be working on a logo, and another could be working on a web layout – if the logo designer makes a color change to his document, the web designer’s document is updated automatically and seamlessly. As a designer I can definitely see how this is fitting in with Adobe’s Creative Cloud vision.

Resources

Adobe has nice video overviews of Generator and linking Smart Objects, so be sure to check those out to learn more.

No Comments

Leave a Comment

Your email address will not be published. Required fields are marked *