1. Technology
You can opt-out at any time. Please refer to our privacy policy for contact information.

Flash Animation 24: Flash for Web Design: Creating a Thumbnail Gallery


1 of 9

Introduction and Creating Content
Flash Animation 24: Flash for Web Design: Creating a Thumbnail Gallery
Now that we've made the content pages for our web pages, we're going to make actual content to go in them. To start off, we'll do something simple: make a thumbnail gallery using image buttons that, when clicked, use Javascript to open new windows containing HTML content.

While this may seem more like web programming than animation, it's still essential to understanding web design in Flash--and the amusing thing is that when you think about it, it is a form of animation. What else is our Flash web page but a four-frame animation that we control the playback on by moving between frames using buttons?

But don’t worry, we won't get too deep into the Javascript coding. I'll give you some easy-editing copy-paste code once we get down to it, and a simple breakdown of where you need to edit, and why. Before we get too far ahead of ourselves, we need to get our content ready for Flash.

To start off with, I've selected several images to go on my "Portfolio" page, which is where I’m going to display my gallery. For each of those images I made a smaller thumbnail--a miniature preview of the image that the user can click on to view the full-size image. Thumbnails are convenient for web design because they're small in size but still show enough of the image to let the user decide what they're interested in clicking on without using tons and tons of bandwidth.

I've used Photoshop to make my thumbnails, but you can use any image editor that you're comfortable with.

©2014 About.com. All rights reserved.