1 Reply Latest reply on Aug 26, 2010 7:45 PM by Michael L Hale

    Exporting Layers to PNG and Create Coordinate Document

    adrianglopez

      I'm a Blu-Ray designer and am trying to save time saving out my project for coding. I used to work in CS2, where I'd create graphics in Photoshop and then take my project into ImageReady and create PNG slices. I would then write down the PNG coordinates on an Excel document. Now with Image Ready gone, I know that I can Export Layers to Files (PNG) in CS4, which is great, but I don't get the coordinates. Is there a way to edit the existing script to include all the png coordinates to a text document or an excel document?

        • 1. Re: Exporting Layers to PNG and Create Coordinate Document
          Michael L Hale Level 5

          As long as you are still willing to create slices you can get an html file that has the coordinates. Open the save for web dialog and choose Edit Output Settings from the dialog's fly-out menu. There set the top dropdown to slices then check Generate CSS in the slice output section. This only has to be done once unless you change the settings again.

           

          Now when you save for web make sure you select HTML and Images from the dropdown. It will make files of your slices and a html file that has the css in the head section. The coordinates will look something like this...

           

          #id300x250-Comp-03 {
              position:absolute;
              left:21px;
              top:43px;
              width:73px;
              height:67px;
          }

           

          If you wanted you could create a script to parse the html and extract the coordinates to a csv file.