Creating a full Flash Web site

posted: 04-01-06
author: PrimeVector
website: http://www.free-webmaster-resource.com
views: 353224
comments: 118
total pages: 8
page jump: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8

Check the finished full Flash Web site.
Download FlashMX2004 Source Files

Creating a full Flash Web site

I frequently visit a lot of forums all over the world and i often notice questions about how to create a Flash Web site, and more specifically a "Full Flash Web Site"! This is not as hard as you might think it is, so today i will show you how to accomplish this for yourself and perhaps help you on your way as a Flash developer.

This tutorial is written for the users that are new to Flash but aren't afraid to learn some new things. You will learn everything you will need to setup your first Full Macromedia Flash Web site, and not just some static looking HTML like page. I want to show all of you that you don't have to be some wizzard to get some nice things going in Flash. This tutorial was not meant to create the best flash site out there, but its to get acquainted to "how to make a full Flash web site" yourself if you are new to this topic.

So what will we create?

We will create a full Macromedia Flash Web site that promotes a (what i personally find) great product called Internet Business Promoter. This is a piece of software i bought some time ago and which totally blew me away. It optimizes websites for the Search Engines to get a top 10 position for a keyword you define... its like having a search engine optimization expert on your shoulder!

I thought it would be a good idea to use it in this tutorial because this way you will see how you could build an affiliate related site yourself that contains links to a product you promote. One thing i must state though... NEVER EVER promote a product you don't own and tried yourself. If you would do that you would hurt yourself by telling just a bunch of lies. When ever i promote a program or service fully.. i bought it myself so i can judge it honestly.

We wil build a Flash site that uses a few nice transitions between pages ... because else we could have just created a HTML Web site for this. We will use these great tweening abilities get our transitions going. Like elastically tweening an object etc... If you don't have them installed please refer to their tutorials and information to install it and then just follow along in this tutorial to see them in effect. I use them always, and i hate to think back to the days where you had to setup and onEnterFrame for each little movement!

We will not make it a fullscreen percentage based Flash site because that would be a good topic for another tutorial. We will create a main Flash file called main.fla .. and rendered it is main.swf ... this swf will be placed in a html container in the end when we publish our website to our webserver.

Because this is a small site we won't be setting up a different swf for each section, but we keep it inside one main swf. We don't need to overcomplicate things at this moment. Also for a small site its isnt needed to place every little things inside a different swf. This only slows down the production process because you need to switch from Flash file to Flash file all the time. When the site contains more data it might be wise to start thinking about dividing it up into seperate swf's but for this tutorials purpose i left it out. We will use frames and frame labels to get our sections going.

We wil create these sections for the site:
1) Home
2) Tools
3) Links
4) Contact

Lets begin our journey!

Open up FlashMX2004 or Flash8 and select file>new, and create a new Flash document and save it as "main". Select modify>document and make it 650x500px with a 30 fps framerate and a light grey (#eeeeee) background. Then create 7 layers and name them like i did in the picture below.


On your Labels layer go to frame 1 in press "F6" to insert a new frame. Then in the left lower part of your screen, you will find the properties, where you can setup a frame name. Give this frame as name "home". Check the picture if you dont understand!


Still on the Labels layer, go to frame 5 and press "F6" again to insert a new frame. Name this frame "tools". Then create "links" on frame 10 and "contact" on frame 15. It should be looking something like this now:


On the next page we will continue our journey into the full Flash websites! :)

page jump: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8