-
Export Illustrator Layers & Elements to a Spreadsheet
Here’s a tricky one.
I’m putting together a mock-up for an AJAX website using layers and shapes to build buttons and menu items.
I’d love to be able to export all of the layers into a text file containing: layer/element name and the x,y,w,h values for each. That way I could hand over a spreadsheet with mock-up images to a web developer to use for pixel accurate placement.
Anyone out there have any ideas (hacky or otherwise)?
Thanks a lot.
Joe Truesdell
Technical Director
http://www.globalmechanic.com -
4 Replies
-
I don’t have the answer for this, but I might consider looking into Illustrator Scripts.
Here’s a guy who has some nice ones…
https://vectips.com/tricks/10-free-and-extremely-useful-illustrator-scripts/Honestly, I’m not sure if scripting will allow you to do something like write a text file, or if there even might be a way to extract the layers data from the AI file as a TEXT file, but it’s an area to explore.
If you do find a solution for this, please let us know.
Vince
*Please remember to Rate our replies or check Solution if solved. If you get a good idea from the post, consider clicking the Kudos option.
-
Thanks Vince,
Found some very useful scripts from your link.
Nothing that addresses this but I’ll keep looking around and post any solutions that I find.Joe Truesdell
Technical Director
http://www.globalmechanic.com -
Hey Everybody,
I just thought I’d share what I ended up doing to solve this workflow idea I had. It may end up being helpful for graphic designers that would like to produce XML code from Illustrator layer information to pass off to web coders.
- Design ALL web elements in Illustrator
- Download a copy of Adobe Catalyst Currently in free beta period.
- Open Catalyst and create a new project by importing your Illustrator file.
- After import, goto: Window> Switch to Code workspace
- Copy all of the code to a new text file.
- Send the Illustrator file and Code containing Text file to web developer.
With these 2 files the web developer can re-build everything in DHTML with x,y w,h values that match the elements in your Illustrator mock-up.
Excellent.
I hope that helps.
Joe Truesdell
Technical Director
globalmechanic.com -
April 2012 Update:
The above steps will only get you the top-left corner coordinates of any given shape…the same coordinates one can get by saving the file out as an SVG. After having done a thorough internet search, I conclude that there is no way (at present) to export the CENTER coordinates of layers from an illustrator file. I may write something myself…or I may just go in and transcribe the coordinates by hand. If I write a script, I’ll post back here.
Happy hunting, internet future-persons.
Reply to this Discussion! Login or Sign Up