The Xara Trompe L'Oeil Room Page 1
HOME
1
2
3
4
5
6
7
8
9
10
11
12

In this tutorial, we will to create a radar screen effect, which is what I started out to do when I created the XaraXone animated title graphic. Except at that time, I was unable to figure out how to do it.

Of course once you figure it out it's easy. The hard part is figuring it out. And I have done the hard part for you.

The elements we will create include: a see-through mask, with the graphics removed, some text, a rotating circle mask, which we will see behind the mask, and all of which we will place over a green background. When we have done this, we will export the elements in the Flash .swf file format and do the animation in Flash.

When the circle mask rotates under the cut out mask, the effect of a scanning radar screen is achieved.

If we place the animation on a web page with the same color background as the mask, the animation will appear to be floating on the page.

As always, we will be working in Pixels. If you have forgotten how to do this, open the Page Options dialog (right click on an empty portion of the screen and select Page Options). In the Units tabbed section, select Pixels from the drop down list, and set the Color Units: to 0-255. (You mostly use Percentage when working with CMYK colors).

In the Grid and Ruler tabbed section set the Major Spacing: to 100pix (key it in exactly like this with no spaces) and the Number of Subdivisions: to 10 .

If you do not see your screen rulers, go to the Window pull down menu and select Bars > Rulers.

Because Flash uses the Macintosh 72 dpi for its screen resolution, and Xara uses the Windows 96 dpi screen resolution, we need to make sure both programs are reading from the same page, or screen as it were. We need to adjust the scaling option to accommodate for this difference.

Open the Scaling tabbed section in the Page Options dialog. Check the Use Scale Factor: check box. In the Drawing: box enter 96pix, in the Real World: box enter 72pix. Press OK to exit the dialog and apply these settings. (I question whether 72 pix (Macintosh screen resolution) is real world, but I quibble).

Right click on an empty section of the screen and select Snap to Grid from the pop up menu.

Select the Rectangle Tool and holding down the Ctrl key (to constrain the rectangle to a square) drag a 200 pixel square.

Set the fill color to none by clicking the small cross hatched-filled square that is just to the left of the screen palette.

Right click on an empty section of the screen and once again select Snap to Grid from the pop up menu to disable the feature.

Select the Ellipse Tool and holding down the Ctrl key (to constrain the ellipse to a circle) drag a 175 pixel circle. Set the line weight to 1.5 points (select this from the Set Line Width drop down list on the Infobar at the top of the screen).

Draw a second circle, 30 pixels in diameter and change the line weight to 1.5 points. (There are 72 points to an inch). Set the fills to none.