Evaluation

After doing my research on good and bad web banners I noticed that good banners usually have simple design as because there is not enough space for a lot of detail and because of this and copyright I decided to abandon my first idea for  web banner which was using google's satellite photos to zoom in to college. I developed my second idea by using mind map and created banner using bitmap and vector graphics.
I am pretty happy with the result but there could be some improvements like more interactivity and different colours.

Final design

Finished web banner

Mind map for college banner

College banner

The original idea for my college banner was to take a few images from Google Earth satelite each one closer and closer to college so it would zoom in to to college after someone presses on banner and then a button would appear which could be pressed for more info.

http://imageshack.us/photo/my-images/638/satelite1.jpg/
http://imageshack.us/photo/my-images/827/satelite2.jpg/
http://imageshack.us/photo/my-images/849/satelite3.jpg/

 I decided not to go with this idea instead I decided to make my banner based on words "Learn to Express Yourself". To show creativity in people that they can express I drew a head with colourful brain.

Then created a tween so that the head would slide in from the left words "Learn to express yourself" would appear and disappear

 and then head would slide to the right revealing college's name written in colourful letters and a button looking like paint splash which can be pressed for more info.

 also the background of banner looks like paper and it leaves the impression that  college name and paint splashes appears on paper.

After I made sure that all the features in the banner works as intended I linked (more info) button to college website by using this code:

import flash.ui.Mouse;

import flash.net.URLRequest;

button.addEventListener(MouseEvent.CLICK, onMouse);

function onMouse(e:MouseEvent):void

{

var request:URLRequest=new URLRequest("www.plymouthart.ac.uk");

navigateToURL(request,"_blank");

Web banner research

Web banners are the main advertising form on the internet and almost all websites have them. Banners can have interaction, animation or it can be just a picture. Here are  most commonly used sizes for banners:

I did researched alot of banners and here are a few example of web banners:

This is a web 2.0 banner for telecommunications service provider who advertises phones they sell. This web banner is interactive and has two arrows which shows different phones you can buy. 

I think this is nicely designed banner because white/grey gradient background nicely fits with black and white phones that are being advertised.

This is basic web 1.0 style banner for online encyclopedia Wikipedia. I think that this banner perfectly represents website and what's it about without any interaction or "in face" animations.

These two banners in my opinion are not good but decent. First one advertises video game but for this kind of size banner it has too much detail in it.

Second one advertises game reviewer videos. Everything would be fine with this banner except there are too much empty space above and below the name of the video series.

And here is a few banners that are poorly made or just annoying.

This banner is basicly a looping video recording and if you hold your mouse on it longer than 2 seconds full screen video will start playing which is quite annoying.

This web banner is for pizzeria which is having karaoke evening.

The problem with this banner is that it has too much text on it and  because of it its hard to see the background image even though it doesn't look good either.

Flash scoring system

I opened flash file which I created while following motion tween demo. The goal of this demo is to create scoring system so that  score would go up by 1 every time you click on shape.
First I created another layer for actions. Gave instance name to shape and created Classic Dynamic text box in the same layer as where all the actions going to be and gave it instance name. Then entered this code to actions layer:
var score:Number =0

score+=1
scoreText.text="SCORE "+String(score)
trace("SCORE " +score)

aaa.addEventListener(MouseEvent.CLICK, fl_ClickToHide);

function fl_ClickToHide(event:MouseEvent):void
{
score+=1
scoreText.text="SCORE "+String(score)
trace("SCORE " +score)

}

And now every time you press on square shape score goes up by 1.

Adobe Flash-motion tween

In actionscript3 we created a closed line with pen tool and a shape on other layer.

Then made a converted a shape to movieclip and gave it an instance name. Then right clicked on shape layer and created classic motion guide and it created another layer after that I selected closed line layer and dragged it in newly created layer. Then extended animation by creating key frames on each layer at 60 frame and moved. Then created classic tweens for shape layer so that shape would move in circles following closed line.