Animated Backgrounds with glitter tiles
 |
Level: Intermediate Tools used: Path shapes, Align/Center, Edit/Fill, Effects/Simple/Quick Tile Additional files needed: Simple Filter (get it here), Glitter Tiles (you can get them here) |
 |
Animated backgrounds can be very busy for a website, but
if used with a table over the top of it, it can really dress up your page!!! 1. Start with a white 100 x 100 canvas. Using the path tool, leaf 1 (or you can use whatever you wish!) draw your shape 60 x 80 in 3D (if using a different shape, your dimensions may differ). Right click, Align, center both. |
 |
3. With shape still selected, add any preset you wish. I'm using Jeaney's texture preset, brilliant green (perfect for this, don't you think, Jeaney??). I wanted the shape to be darker, so I went to Brightness/Contrast button and click the bottom right square 2 or 3 times. I also added a shadow for more depth; right click, go to shadow and use the 5th button. Leave at default settings. |
|
3. Now, duplicate this tile 2 times (for a total of 3
tiles) by using Ctrl-D. Line your tiles up so that you can see which
one you are working with.
Open your glitter tile - when the box comes up, click open each as new document. |
 Before using Simple
filter
|
4. Right click on the 1st glitter frame. Copy. Now
you can close that particular glitter frame. Select the background
ONLY in
the 1st frame and go to Edit/Fill/Image. Click the radio button for
clipboard and then ok.
Merge all (in that frame only). Go to Effects/Simple/Quick Tile. Use defaults and click ok. Now you can save this tile on your desktop as 1. Continue these same steps for the other two tiles. Remember to close out the glitter frame each time you click Copy so that you do not confuse it with another glitter tile. When completed, you should have on your desktop 1, 2, and 3 (ignore the 4 and 5 on my example...LOL) |
|
5. At the top right of your PI screen, click Switch
and go into GIF 5. Go through the Animation Wizard and select your 3
files on the desktop in reverse order (3, 2, 1) and change the time delay to
12. Now you can preview! If you like what you have, go to File
and Optimization Wizard, select defaults all the way through and save as
to name your
tile!
That's ONE way to do this....so sit tight and we'll do it completely different now! |
|
|
6. Lets make the path shape animated!! Again, open a new canvas, same size as before, only this time, use a colored background. |
|
|
7. After making your shape (this time make it 2D and
color doesn't matter), duplicate it 2 times. Now open your glitter
tile (as before) but this time, select your path shape, right click, convert
to image, then Edit/Fill. Use the same methods as above. Add a shadow to the shape, but this time make shadow size 110; I find it gives it better depth. Continue as instructed in 4 - 5 above - |
 |
Your finished background with a different touch!!! |
 |
There you have it, easy animated backgrounds!!!
Here are a couple more I have done using these methods. WARNING: These are HIGHLY addictive!!! ;-) |
After using Quick Tile 
I hope you enjoyed this tut!
|
When you have completed the tut, feel free to
download the award to your site. Please do NOT link back to the award!
This is on the honor system.