Once you're done you'll need to have two flattened versions of your layout, with the background intact on both--one with all of your options in their normal state, one with all of them in their rollover state. This is essential for preserving the layout; because of the soft-edged effects used and the images behind the buttons, just exporting transparent GIFs won't really work. We need to preserve the background as part of our buttons (something that would be much harder to do using tables/DHTML).
Flash Animation 22: Flash for Web Design: GUI Design
By Adrien-Luc Sanders, About.com Guide
For each of the buttons in the layout, I need to make a rollover state--so I've duplicated each one, and then applied a gradient and a colored glow to it. This is all done on separate layers; because not everyone uses Photoshop as religiously as I do, I won't do a step-by-step breakdown of this. The basic steps towards getting this ready for Flash will suffice.
Prev
- Introduction
- Rollover States
- Creating Graphic Files for Button States
- Setting Up Your Website in Flash
- Importing Your Layout Files
- Adding Your Layout Base
- Positioning Your Button Graphics
- Making a Symbol of Your Graphics
- Switching Out Button States
- Conclusion
Explore Animation
Must Reads
About.com Special Features
Holiday Central
What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >
Family Tech Center
Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >
©2009 About.com, a part of The New York Times Company.
All rights reserved.