Next we are going to make a bar. Make a new image with the dimensions 620x10 pixels, with a white canvas. We want the bar to be about 600 pixels wide, and no deeper than 10 pixels or it will look ugly and heavy. But the precise dimensions of the bar are not critical. The dimensions of our background image will keep it near enough.

Select the path tool. The colour is unimportant, but the mode must be path. Click on the Edit button on the toolbar and select Rounded Rectangle. Draw the rounded rectangle on the background image, as close to the top and bottom edges as you can get. There can be a small space at either end of the bar. It will look like the illustration below.

Change the mode from path to selection. The line you have drawn will change to a selection marquee.

Select the standard selection tool, and make sure that the fixed size box is not checked. Click on the rose texture to make it the current image, and click the copy button. Click on the bar image to make it the current one. Use Edit/Paste/Into Selection. The rose texture will appear in the bar, with a small cross which shows that you can move the texture around. Pull it to the left of the bar, where it will fill about half of it. Left click to fix it in position. Use Edit/Paste/Into Selection again, and put the rose texture at the other end of the bar. If there is a gap in between, repeat the paste and cover the gap.

Now use Edit/Convert Object Type/From Image to Path. Select the path tool, and change the mode to 3d round. The bar will become rounded, but the colour will now be a little paler than the original rose texture.

To restore the depth of colour, use Format/Brightness & Contrast. Do not use the thumbnails, but set the parameters at the right of the Brightness & Contrast dialogue box to the values shown in the illustration on the left, and click OK.

Use Edit/Selection/Merge All. The bar is now finished, and can be saved. Because of its rounded ends, however closely we crop it, there will always be small amounts of background left, so it must be saved as a gif. Use Web/Smart Saver, select Gif and make the background transparent before you save it.

It is a serviceable bar as it stands, but would be more attractive if it had a single rose at one end. To do this, we need to cut one rose from the rose texture.

Click on the rose texture to make it current and choose one rose to cut. Zoom to 2x and use the sliders to bring the rose you want to the centre of the window.

Use the Lassoo selection tool and draw a line all round the rose. Click once every time you change direction and move in very small steps, but be careful not to double click until you have completely surrounded the rose, or the selection will close and you will have to start again. When the rose is surrounded, double click and the line will change to a selection marquee. Change to the standard selection tool so that you do not start to make selections every time you click on an image to make it current.

Use Edit/Selection/Convert to Object. Open the Options box on the tool bar and make sure that Preserve Base Image is checked. Now place the cursor within the selection, click and drag it outside the rose texture window. It will appear in a window of its own, still surrounded by a selection marquee. Do not deselect it, but make sure it is the current image.

Use Effect/Blur & Sharpen/Sharpen and click on the top left thumbnail, and then OK.

There will be a narrow white border around the rose, which will be impossible to remove by making it transparent, because it has too many shades of white in it. We have to remove it now.

Use Edit/Selection/Merge All. Use the magic wand selection tool and click in a corner of the single rose image, on the white background, which will select the background.

Use Edit/Selection/Invert to select the rose.

Use Edit/Selection/Expand & Shrink. In the dialogue box, select shrink and set the value at 2 and the shape at circle. Click OK.

Use Edit/Selection/Convert to Object. Drag the selected portion outside the box to become another new copy, which will be the one we use.

At this stage, you can save the single rose in .ufo (Ulead File for Objects) format so that if you wish to use it to decorate, buttons, text, or anything else on your page it is available. Alternatively, you can save it in the Web Library in the Object Libraries using Edit/Object/Copy to Object Library.

Make a new image 700x100 pixels with a white canvas. If you do not still have bar.gif on your worktop, open it again and make it the current image. Copy it to the clipboard. Make the new canvas the current image and use the paste button or Edit/Paste/As an Object to place the bar in the new image. Move it to about 3/4 of the way down the canvas.

Click and drag the rose image onto the canvas, and place it on the bar, and your new bar will now look like this.

Use Edit/Selection/Merge All, then crop the image as close as you can and Use Web/Smart Saver to save the new bar as bar2.gif with the background white made transparent.

You now have the basic items you need to put together a co-ordinated web set, and you know how to make more if you need them. The final page of the tutorial is a sample of a web page made with these items.