Main Points

  • Full Flash Test Site Designing a complete Flash website, it's pretty simple but the pieces are all there, and can be reused later.
  • Earth Chronicle Logo Our first significant Flash project, the animated EC logo.
  • First Flash Animation Our earliest Flash experiment, a simple animation to learn the Flash interface and publishing.

Here's our work with Flash animations and more advanced applications using actionscript.

Full Flash Test Site

One possibility when I started on a basic Flash course was that I would wind up with a number of pages and .swf projects on Flash. In the end, I was able to condense them into one complete flash website design. My final project was to stitch all the SWF files together as one complete Flash website, so here it is.

I've now updated the flash site because of our unpleasant discoveries about font legal issues. All fonts used are ones we can legally display on the website. Thank you to George Douros's website of public domain Unicode fonts. I highly recommend installing them.

[chroniclemaster1, 2009/09/09]

The homepage shows off our previous exploit, the transparent background animated Earth Chronicle logo. It also has a music button which unfortunately also means you have to listen to our crummy public domain music clip. Wish there was something decent. However, this establishes a tool for us to incorporate music into the website with Flash.

Snowman is a much more sophisticated Flash animation than anything we had attempted before. In execution, that's all the Globe is as well, a basic interactive animation which responds to buttons. However, you can see how it's the beginning of a full Flash geography application. The only thing wanting *cough* *cough* is a better understanding of Actionscript.

Slideshow and Video are two fully developed Flash applications, simple but well executed. While the accompanying vector graphics and buttons could certainly use an upgrade, the UIs are simple and elegantly usable. The slideshow does exactly what you'd expect with a simple but powerful Actionscript program. The slideshow is built as an independent component so that by swapping out images, it's easy to create whole new slideshows without having to execute all the programming again. The video is incorporated as an embedded video so that I could provide the text commentary in sync with the video and audio, something not possible if I'd executed this in the more popular streaming video format. I studied streaming as well and appreciate that in most cases it's a better choice; YouTube and other sites even autoconvert what comes out of your camera / camcorder so that you don't need to have Flash to produce flash video. However in this case, embedded video allowed me the option to go for the joke. ;)

This was the first cool project we initiated in any technology. It's also the first piece of Earth Chronicle that was created really the way we wanted it. Our Flash prowess has increased, but I've never had a temptation to go back and mess with this.

  1. SpinningEarth1 Here's my first attempt to realize a long held dream of having a spinning version of the logo. I found a tutorial on creating a rotating Earth and adapted it for use with my public domain graphics. They look prettier anyway. ;)

    [chroniclemaster1, 2007/01/18]

  2. SpinningEarthLogo Got it. There's a big green C behind it and everything and turned the background color black since Flash doesn't seem to want to set the background transparent. However, the graphics are oversize. They fit the height of the map I've got, so by the time I got the green C frame around it I had a 500 pixel square stage.

    [chroniclemaster1, 2007/01/19]

  3. SpinningEarthSmall It didn't take too long to shrink everything down to 350 pixel square so I can place it in the same table cell as the graphic. I briefly resized it in Flash but of course that left the small globe with the exact same file size as the larger. I just had to go home to resize the .jpg I'm using in the animation and then plop it in here. So far all my files are designed in Flash and the .html file is just a complicated excuse to call the .swf file. I still need to master what code needs to go where to insert this into a different webpage. I also need to succeed in placing a <noflash> tag or whatever I need so that the .swf file comes up if they have flash and an image if they don't.

    [chroniclemaster1, 2007/01/19]

  4. SpinningEarthTransparentSmallBackground I was able to put a transparent background on the logo so it can lay over any color background. Since the logo is light colored, I just need to put a black border all the way around it to provide contrast if its on a light colored background. I'm also trying to make it switch to the .jpg logo if flash is not available. This technique uses a CSS background image. It will have to line up precisely, or go back to the animation with the black background to hide it though; and the .jpg HAS a black background. I have no solution for that other than to bite and use a .png instead. And I'm not sure I want to do that.

    [chroniclemaster1, 2007/01/19]

  5. FlashIndex I've got the Flash file inserted into the homepage. I think it will look even sexier at Earth Chronicle than it does on the Beta site. I'm using the overflow method. Now I just can't get the thing to center properly, and IE won't pull up the picture if the flash can't be found.

    [chroniclemaster1, 2007/01/19]

    Sadly, throughout testing this never really worked. The image has been removed so the flash can sit unhindered.

    [chroniclemaster1, 2007/07/17]

First Flash Animation

  1. Lightning Demo "5" - Here's a side project for a client reworked as an Earth Chronicle ad. I am still trying to understand why the word Earth Chronicle won't wrap onto a second line. So far setting the textbox size won't force it as it seems to for all the other text, and it doesn't respond to carriage returns. Frustrating. I'm also trying to get the text to run from bits included in the HTML so that a content manager can adjust text on the site without having to know Flash or even having the program. All good ideas with respect for best practices.

[chroniclemaster1, 2007/01/19]

This has been updated to Lightning Demo 6 because of our unpleasant discoveries about public domain fonts. So this is indeed Lightning Demo 5, but the fonts have been updated to ones we can legally display on the website. We managed to locate public domain fonts at George Douros's Unicode font website. I highly recommend installing them.

[chroniclemaster1, 2009/09/09]