For Web developers who use Photoshop to build design mockups, Adobe just eliminated one of your biggest headaches. Yesterday the company announced Adobe Generator, a new tool that allows you to create image assets in real-time as you work and access them in Edge Reflow, no copying, slicing, or manual exporting of any layer required. Generator comes as part of a software upgrade available to Creative Cloud members starting today.
Generator integrates with Edge Reflow, a tool for creating responsive Web designs. This means that assets saved in Photoshop, including text, are available in real-time in Edge Reflow and organized in the correct hierarchy. While you work, any changes made to assets in Photoshop are automatically synced to Edge Reflow.
Using Adobe Generator
To take advantage of Adobe Generator, go to File -> Generate -> Image Assets. Then rename the layers and layer groups you want to export.
Adobe supports the following tags:
- .png (Default value: png32 with semi-transparent alpha), .png8, .png24, .png32
- .jpg (Default value: 8), .jpg(1-10), .jpg(1-100%)
- 1-n%, (Number) px x (Number) px for scaling
Use these tags to produce 2x assets, max quality assets, custom-scaled assets, and more.
Adobe aims for Generator to open doors for designers and developers. This is why it’s released the platform and its image assets generation feature as open source projects. You can find Generator’s source code on GitHub.
To learn more about using Adobe Generator, check out this video tutorial:
Other Updates to Photoshop CC
Besides adding Generator, this week’s update to Photoshop CC will also add enhancements to Color Range options, Isolation mode, and path selection, as well as native PSDX support (read-only) and 32-bit image support.
The Creative Cloud apps are the newest version of Adobe’s Creative Suite apps, including Photoshop, Illustrator, and InDeisgn. To use Creative Cloud, designers pay a monthly subscription fee rather than a one-time fee for software licensing. Since the software is now based in the cloud, Creative Cloud subscribers receive software updates in more frequent bursts than when using Creative Suite desktop apps.
This update to Photoshop follows Adobe’s announcement of the Photoshop Photography Program, a special offer for discounted Photoshop CC membership available for those who own Photoshop CS3 or later.
Do you use Photoshop to design mockups for Web development? How do you think Generator might streamline your process? Share with us in the comments section!