1. Computing & Technology

Discuss in my forum

Flash Animation 22: Flash for Web Design: GUI Design

By , About.com Guide

2 of 10

Rollover States
Flash Animation 22: Flash for Web Design: GUI Design
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.

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).

©2012 About.com. All rights reserved.

A part of The New York Times Company.