Wednesday, 22 June 2011

Concepts

This was the first web banner I made before the others. I decided to use the other one as it looked more professional and it was interactive.

My first, unused web banner - http://www.swfcabin.com/open/1308752602

Tuesday, 21 June 2011

Evaluation

My web banner was made in flash using action script 2. I started off by researching other web banners so I could gather ideas to create my own. After researching I started making the web banner. I Created my background in photoshop as well as several other components such as my text, which appears on each screen, the button icons and the screens. I used a downloaded font to create the text and i also found the font of the Plymouth College of Art logo and used that at the end of my animation.

I then took all these into flash and started building my animation. I made it so that it starts automatically, as I though movement would attract the audience.I made the screens move into the stage from the top and the bottom of the banner until the all met in the middle. I then made it so it plays through to a certain point, where all screens have displayed a word each of the course. I then added button which appears under the first screen. I made it so if it was pressed it would change the text on the screen above, then a second button appears under the next screen. Once all the buttons have been pressed the screens would spell out 'Plymouth College of Art' and a link saying 'find out more' on the fifth screen which navigates you to the course page on the website.

Once I had done this I done some beta testing to find out if its easy to use, clear and easy to understand and a good use of graphics to represent the course. After doing this, I found that the original text that I used was not easy to read and looked too messy as well as hard on the eye. After this I went back into photoshop and made my first few pieces of text the same colour, size and font. I then replaced the old text with the new and it made a big improvement.

If I were to do this again I would keep the text simple, as I found out it makes it easier to read and more attractive rather than different fonts of all sizes and colours. Also I would use a new layout, perhaps from top to bottom rather than left to right, so it could fit onto the side of a webpage as well whereas at the moment it would only fit on top or the bottom of a web page. If I were to do this then the monitors would come in from the left and the right of the canvas until they met in the middle.

This is my original web banner - http://www.swfcabin.com/open/1308666942

This is my improved and final web banner - http://www.swfcabin.com/open/1308743853

Beta Testing

The question I will ask for my beta testing are;
1 - Was it simple to navigate through the web banner?
2 - Is the text easy to read?
3 - Is the web banner appealing and attractive?
4 - Do you think the components used within the banner are appropriate for the course?

Feedback;
1 - Yes, the buttons made it easy to navigate through.
2 - No, they could be easier as the were hard on the eye.
3 - There are too many colours used.
4 - Yes they represent the course.


I originally had my web banner with the text which posp up on each screen as a different font, size and colour. After several people commenting on my banner, I came to the conclusion that I need to change the words so that they are all the same size colour and font size.













After taking these comments on board I then edited my web banner and created this version. I think it is better than the previous one as it is now easier on the eye and better to read.

Wednesday, 15 June 2011

Final Web Banner

I made this web banner in flash, action script 2. I started off by making several images in photoshop such as the monitors which traced and then added my own screen to them, the background, and all of the text and buttons.

First of all I placed my background image into flash and then added my five screens. I wanted them to come onto the stage at the same time as soon as the banner is played. I made two come in from the top and three from the bottom until the all met in the middle. I used a classic tween for this.




I then wanted each word of the course, interactive media with game arts, to appear one at a time until it says the name of the course, one word on each screen. To do this I made each word appear after a certain amount of key frames until the whole course name was there.



I then added a button which i made earlier so that when pressed it would change that screen word to a different word, until each button had been pressed and the screens spelt out Plymouth College Of Art. every time a button was pressed it would move under then next screen so you can press that one to change the next screen. On the fifth  screen I made a link appear saying find out more, once pressed it would take you the courses web page. Also i made the button a roll over so when the mouse rolled over it the button would turn blue instead of green.



At the end I made a blue button stay underneath the final screen which if pressed it would take you back to the point where you can press the buttons again to change the screen names again.



Originally I had this idea of having each word in a different colour, size and font on each screen. I changed it because I thought it looked too messy and unprofessional, so I changed them so they were all the same font, colour and size.

Wednesday, 18 May 2011

Evaluation

After looking at several web banners on the internet, I gathered some good ideas for my own. many of the web banners had bright and vibrant colours to catch the audiences attention. They also had a lot of interactivity or some animated movement in one way or another, again to keep the audience interested and interacting with them to lead them to the website. There were also a few web banners which were quite basic with very few colours and not that interesting so they didn't really appeal to me.

For my web banner that I am creating, I have decided to make the colours vibrant and fairly basic so that it stands out from the web page.  I will have an interactive animation within the banner involving LCD monitors.. I thought of the idea of having monitors as a main part of my banner as its advertising a media and game course, therefore the majority of course is based on a computer. I want to create an animation which has five LCD monitors, each displaying a different word for the course 'Interactive Media With game Arts'. Each word will appear one after another. There will be a button underneath each screen which once pressed it will change the word that appears on the screen. Once all of the buttons have been pressed it will say 'Plymouth College of Art' and on the fifth screen there will be a button saying 'find out more' and once clicked it navigates you to the course page on the Plymouth College of Art website. I also intend to add a button at the end, when all the buttons have been pressed so you can go back and press them all again if you wish.


I intend for my web banner to look like this;

This it what it would look like once each button has been pressed;


The button underneath the fifth monitor is the one which would take you back if you wanted to press them all again, like in the first image.

Wednesday, 11 May 2011

Guide Tween In Flash

To start with i created a curvy line which meets at the end so its a loop. I then, on a new layer, created a new shape to follow this loop. With this shape i went on to convert it into a movie clip and changed the instance name to target. I then created a classic motion tween on a new layer and then dragged my layer with my loop on , onto this layer. After that i dragged my shape over part of the loop until it latched on then i added a key frame on frame 35, then 70, then 100. I then moved the shape onto a different part of the loop on each of these new keyframes and then added a classic tween to the frames in-between.

After this the shape would follow this loop constantly. I then clicked on my shape and added some action script.


movieClip_1.addEventListener(MouseEvent.CLICK, fl_ClickToHide);

function fl_ClickToHide(event:MouseEvent):void
{
trace("HIT")
}

this script above would make it so when you click this shape which is continuously moving around this loop, something could happen but io would need more action script to make that something happen.



Second Lesson

The action script below is to add a scoreing system to a game in flash. Everytime the objes=cct is clicked, the score will increase by 1 point.


var score:Number =0


target.addEventListener(MouseEvent.CLICK, fl_ClickToHide);


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

trace("SCORE")
}


The only problem was that the score would not appear until the object was clicked. To fix this i had to add the line ' scoreText.text="SCORE "+String(score) ' which was used previously and copy it under the variable

Tuesday, 10 May 2011

Web Banner Research

 For this prohect we will be creating a web abnner of our own to promote the current course. Online there are a whole variety of web banners. here are of a few of my findings.


This is a web banner for specsavers. I found it on the msn home page. I chose to show this one because it was saying info about there glasses and then 2 pairs of glasses came on to banner from different angles and started to rotate slightly, as if it was showing us the glasses without holding them in your hand.

I also came across this web banner. I found it on a games website and it stood out to me as it had a conveyor belt on the banner with items which a woman might have in there hand bag with a piece of text to the side saying 'tick the thing you keep in your handbag'. As the conveyor belt carried on with these items, packets of a new special K product started coming across. This is a good way of suggesting you should have them in your hand bag.

This banner I thought was quite simple which didn't impress me much. it uses a maximum of 3 colours which doesn't really make it stand out. There was no animated, interactive part to it which didn't really keep me involved with the banner.

I found this web banner of very.co.uk within my hotmail page. I thought it was pretty boring as it was just this, an image of a woman. It uses a low amount of simple colours which makes it less attention grabbing . It also had a little icon at the bottom so you can close the add if you din't want it there which i thought was the only good bit.


In most web banners, there are several things needed to make it good, understandable and attractive. What i mean by this is they need a simple but effective message, like in the Specsavers banner it has the logo which look like a pair of glasses so you automatically know that its a glasses based company. Also they can't be to cluttered like with the Xbox banner. It looks like they have tried to get all the info into one tiny space and it looks to messy in my opinion. A good point would be that most people now what the logo and game is so they know what to expect if they clicked on it. this is quite important as brand identity as people know that its a big deal or issue.