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
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
Build Your Own Website
Step-by-step advice on how to do everything from choosing a Web host to promoting your content. More >
Connect Your Home Computers
Easy ways to connect two computers for networking purposes. More >
©2009 About.com, a part of The New York Times Company.
All rights reserved.