Designing & Exporting GUI Icons

[Merlinski]

Hiya folks,

It's been a while since I've been around here, but I've got a scenario I wonder if someone might be able to help with, so here goes - thanks in advance for your input...

I design icons for various things, most recently for the Playstation 3 operating system (cross media bar) but the same applies to all.

I basically have one big page where I design all my icons to keep continuity, I then select each one and export, usually a transparent alpha PNG file.

The question is, because a program or GUI might have 50 or more icons exporting each and every one manually takes time and patience. Is there any way using Xara, or any other method outside of Xara, that would enable me to block export all of them in one go, say if I had them in specific coordinates and they could be named automatically and logically?

Maybe there is a process for this after exporting one single alpha PNG?

Any help or ideas to this would be very much appreciated.

Cheers and Merry Christmas,

Chris.

[gwpriester]

Hi Chris

I'm not sure if I understand what you are trying to do.

I have a page of icons that I draw from when I am creating my tutorials. But because every tutorial is different, there is no way I could automate the process. I just have the page loaded and then us Ctrl Tab to toggle from the tutorial to the buttons, menus, icons page, grab an icon, Ctrl Tab back to the tutorial and paste the element.

About the only thing I can think that might work is for you to put each icon on a separate layer, then Export as PNG with the each layer as a separate file option. Would that work?

Gary

[raynerj1]

I haven't tried this, but it just came to mind. The export to web page slice wizard just might do what he needs done. It can do .gif, jpg and pngs... Here is the text from the xara help file...

Image slicing
Large, complex graphics for web pages can produce large files, which take a long time to download over the internet. You can reduce this problem by "slicing" the image into sections, which can download separately.

Another use of slicing is optimization. For example if you have a photo on a plain flat color background, you can optimize the graphic by exporting just the high detail area (photo) as a JPEG or 256-color GIF and the other areas as, say, a 2-color GIF. This minimizes the amount of data to download.

To slice an image:

Named objects control slicing so give the part of the image to go on its separate slice-for example, the photo-a name. Use the Name gallery or the Create New Names icon on the Selector tool InfoBar. (For more complicated images you might want to name more objects.)
In the Name gallery choose the export options for the slice. Click Exports from the drop down menu, then click on the file type next to the named image, set your export options as you wish for that slice and click Apply.
For more on the Name gallery refer to Chapter Document Handling.
Export the graphic in slices
You do not need to specify how to slice the image as Xara Xtreme Pro does this automatically from the information in the Name gallery.

Select the complete image including any slices
Select File > Export image in slices.
Select the file format (this will apply to all areas of the image other than your slice).
The file name is the HTML file that contains the HTML code for the sliced image. You can change the file name if required.
Click Save.
Select the required save options (these will apply to all areas of the image other than your slice).
Click Export to save the sliced image.
To prevent specific named objects from slicing:

In the drop-down list in the Name gallery select Slices.
Names with a check beside them slice the graphic-if necessary, unselect any check boxes.


Maybe this just might work if you group your icons and then name em... Only played with the image slicer once or twice myself.

[DanDaBear]

If you give each object a unique name using the "Create Name" button you can export in a batch from the name gallery and the files will be saved with the names you give them. You can do this as you create and name each icon. Open the Name Gallery and on the FIRST named item click on the little arrow to the right of the black GIF rectangle and select/create the destination folder for the exported files and hit apply. All subsequent icons will be saved to this folder. as you name all your icons click on the black square to the right (that usually says "GIF") and select your export settings and hit apply. When you are ready to export, select all the names in the gallery (select the first, Shift select the last) and hit the 'Export' button in the name gallery. This is gleened from Xhris' Name Gallery tutorial.

DanDaBear

[Merlinski]

Ooh ooh ooh! There's some interesting methods to try out thanks!

I'll let you know how I get on with this, as if I can find the best way for this - it could just change the way I work forever.

lol - You have to love Xara, there seems always to be a solution to a problem.

Well, unless your problem is importing SVG files of course - was this ever resolved?

[handrawn]

Well, unless your problem is importing SVG files of course - was this ever resolved?

if you have inkscape you can open svg save as pdf and open that in xara xtreme pro

[raynerj1]

Hey steve,

Isn't inkscape freeware or resonably priced ware? Not like other bloated, too expensive software that shall go unmentioned...

[handrawn]

is true John, is free
www.inkscape.org

[Merlinski]

Yeah I have inkscape already.

By the time I'd figured that out I'd already redrawn the objects I needed, but hey it's a good util none-the-less.

[tellurian]

After trying out a ton of Icon editors I wasn't satisfied with, I finally found THE icon editor. It has all the features you could ever dream of, a great GUI, and works perfectly well with Xtreme: just copypaste your drawing into it, and it will ask if you want it pasted as Metafile or Bitmap.

So if you need an icon editor, check out this one. It cost $50, but it's a bargain for that price, IMO.

http://www.iconempire.com/iconcraft/index.htm

Edit:

I just discovered that they have an almost identical program, IconLover, on their other website, and for the same price. Why they have done this I don't know, but it looks as if IconLover is being updated more often and has a few more features.

http://www.aha-soft.com/iconlover/index.htm



Rich