The TIP Sheet

READER TIP: Malcolm Laurie offers this advice for Slicing an Image in Xara.

Initial setup: Before beginning the slicing, a few options need to be set up for best results. These settings will ensure your cutting areas are set exactly to cut on a whole pixel, rather than halfway through one, which can result in unwanted anti-aliasing on the cut edges when exported.

Set up your page (in Utilities > Options) with a grid and ruler spacing of 1pix for the Major Spacing, and Number of Subdivisions set to 1. Page Units should be set to Pixels.

Before starting your slicing, enable Snap to Grid.

Note that if you have an existing graphic you wish to slice which has different page settings, you can still use it, but be sure to adjust these options before commencing the slicing.

It is best to make a new layer specifically to hold the slice areas, above the rest of the graphics.

It is easiest now to set up the rectangle tool with no border, and transparency set to 50%, with a strong colour selected. On the new layer, draw boxes over the graphic which will define the areas to be sliced.

These areas can be defined by allowing for parts which will be buttons, header areas, and parts which are logos. Because of the grid options, each box can be drawn butted exactly up to each other, leaving no gaps, and no overlaps. Once you have completed these boxes, the graphic should be completely covered.

When you are making up these slicing boxes, it is important to know roughly how you will create the relevant HTML tables which enclose them. Try for a simple layout whenever possible.

The benefit of using these boxes is that you can select and use them to export selected areas ­ and with the use of multiple layers for your original graphic, you can define several states for button rollovers for example, or several wording variations for headers for your pages.

Now, how do you use these slicing boxes to export the graphic areas underneath?  Select all the boxes and make their transparency 0. Now you can't see them, but they still can be selected. By selecting each of them in turn you can use the export function to output GIFs or JPEGs for the areas visible directly underneath a box. If you get lost, you can turn on the transparency a little bit to see where the boxes are, but make sure to set it back to 0 for each one you are exporting, otherwise you will get a slight shading on the export.

The image map image

The slicing rectangles have been filled purple and 50% transparency applied.

The slicing rectangles are placed on a new Layer. New layers can be added if the button slices are going to be used for JavaScrip rollover effects.

Editor's TIP: As Malcom has instructed Exporting the invisible rectangle (but not the objects beneath) selects whatever is beneath the rectangle. But only if the Transparency option is not selected in the GIF Export dialog..

File Association TIP: Having trouble opening a file because Windows doesn't know what application to use? Find the file in the Explorer and select it.

Hold down the Shift key and right click on the file name. A pop-up menu will appear saying Open File With...

Browse to the application you wish to use to open the file and locate the executable (.EXE) file.



Reader's TIP: Christine Farrelly has this suggestion for creating cool 3D frames using the Quick Shapes Tool:

"I have just been using Xara's Quick Shapes Tool to create some different 'frames' for Photopaint. Create a white shape on a black background and export as a JPEG file into the Coreldraw/Photopaint - Custom-Frames directory.

The frame is a white quick shape star with 20 points, rounded, cloned and enlarged twice with just the outline in white. I applied the frame in green then changed the fill of the outer section to a green radial fill before applying 'The Boss' 3D filter.

The possibilities for different frames - created in seconds with Xara - are endless."

 

Joel Schilling suggested this TIP after trying to create the checkerboard in this month's Xara Tutorial.

Let's say your checks are 40 pixels. Set the X (horizontal) Duplication Distance to 40pix and the Y (vertical) distance to 0pix.

Select the square and press Ctrl D to add the next square. Repeat until you have enough squares.

For the columns, switch the settings.


    Got TIPs?
    If you have a Xara Tip, or a non-Xara everyday Tip, help your editor out and send it along. CLICK HERE to go to the TIPs HotLine.