Prototype

This is our prototype. It's like a sketch how our website will be looking, but the look and feel is almost the same. Tri drew the background and stuff, I did the animation part and the transitions for our website. It took us several days to discuss, draw and animate things. Please give us some useful comments. Thanks.

Link to download

Spore website

Spore is a website of Will Wright, the creator of The Sims. It was created to promote an online game, in which there are several phases through the development of civilization and technology. There are also a series of characters, based on each period of phase. I think the idea is based on the development of human being, as you can see, each phase is designed according to a specific point of time in human history.

Some screenshots of creatures

First, what makes me impressed is an outstanding and funky piece of intro animation flash at the very beginning. The intro is short, but totally gives the audiences some ideas about the style and the characters throughout the game, as well as the missions for each phase. Secondly, we all can see there are blocks of text, therefore it must apply CSS style in Flash into their website. So instead of using Flash to contain the text, CSS style in Flash will help the later work and change much more easily. The site architecture is very plain. There are only 3 pages for the whole website, not including the external links. However, its purpose is to give the users some information about the game as well as the screenshots and stuff. So that's enough for it.

Some screenshots of The Space Phases

** Note: we'll consider whether we'll make use of CSS style in Flash to make it more easy to change.

Flash Preloader

Some coding for Flash Preloader:

A simple preloader:
Smart Webby

A preloader with feedback:
Best Flash V2.2

Advanced preloader in a separate movieclip:
Sitepoint

Code To Load The External SWF File

Since our project will be done totally in Flash and there're a lot of swf movies and stuff, we should think about a better way to manage all the files properly. It's hard to mix all the swf together, I've found the below coding to combine all the small swf files:

var mcl:MovieClipLoader = new MovieClipLoader();

var mclL:Object = new Object();

mclL.onLoadInit = function() {
loader._visible = false;
loader.percent.text = "";
}

mcl.addListener(mclL);

mcl.loadClip("swf1.swf",holder);

Using CSS Style in Flash

The below coding is used for using CSS style in Flash. Instead of having a large block of text using the same font, color, and style, we can easily use CSS to define custom text properties without having to break our text into multiple text fields.