GCSE Website Project

I will also have to include VBScripts and JAVA Scripts in the HTML page, these will be activated by the Flash movie that is being housed by the page.

Once I have completed the whole website I will put forward a questionnaire to Mr Wells the head of the school website who I hope will complete it and comment on the good content and the not so good content.

From the whole website I hope to achieve an easy to use, understand and navigate through website. That is useful to students at the school now, future students, parents of present and future students, and people that are interested in the way the school works, is run and interested in just general information about the school.

The links on my site will navigate through it as shown in the table below.

Main Page

School Partners Subjects Students Charity Sports Productions

All the different Subject homepages Different Sporting Events

Different Productions

Information pages Students Pages

Design

To re-design the school website I need to examine the current site and take it essential features and colours. I first look at the attractiveness of the opening page and decided to keep the design of the main frame of the site and just change the navigational and title frames, I had to also make the website easy to understand and navigate through as described in my Analysis. I then drew a few designs. (Figure 1.1, and 1.2)

I liked the idea of blue background but I didn't quite know what shade to use so I printed out some different shades of blue and I like the red and white logo so I added the red and white on top of the blue to see how the colours looked together, I also likes and the idea of the pictures next to the links. I then thought that I could make the buttons in Macromedia Flash 4 to save on download times and to enhance the buttons, which in flash can have a mouse over and mouse down picture so the button can look like a real button not just a word in fancy writing.

I then drew up two more designs including these extra features that I had decided to add. (Figure 1.3 and 1.4)

I then look at my designs and thought that it could be a good idea to do the whole site in Flash and then insert the movie in to a HTML file.

I then drew up a final design, which was to be created completely in Flash. (Figure 1.5)

Implementation

I did the whole site in Macromedia Flash 4 which included a lot of programming I did the site like a desktop of a computer and this included separate instance movies within the main movie and these each contained and different page of the site.

So I created a function that made the instant movies visible and invisible depending on the button that was clicked.

First all the instance movie visible must be turned invisible so the function "turn_invisible" is run this is activated when the button is clicked.

Begin Tell Target ("/home")

Set Property ("", Visibility) = "0"

End Tell Target

Begin Tell Target ("/school")

Set Property ("", Visibility) = "0"

End Tell Target

Begin Tell Target ("/diary")

Set Property ("", Visibility) = "0"

End Tell Target

Begin Tell Target ("/subjects")

Set Property ("", Visibility) = "0"

End Tell Target

Begin Tell Target ("/students")

Set Property ("", Visibility) = "0"

End Tell Target

Begin Tell Target ("/partners")

Set Property ("", Visibility) = "0"

End Tell Target

Go to and Stop (1)

Once all the movies are invisible the instance movie that the user want to see will become visible this is done the following function.

Begin Tell Target ("/home")

Go to and Play (1)

Set Property ("", Visibility) = "1"

End Tell Target

Begin Tell Target ("/information")

Go to and Play (7)

End Tell Target

Stop

When the pages change the information window also change to give the user information on the page that they are visiting and if they put their mouse pointer over a link the windows will display the outcome of the link. This was done but splitting the information box in to two instance movies and then when the use put their mouse over a link it changes the frame in the lower instance movie of the information movie and the displays the information.

This was very easy I had to use the Roll over and Roll out function the roll over function means that it when the mouse pointer is one top of the button the procedure between the On and End On which in this case makes the instance movie display the "Medway" frame which says "Medway Council Website" and when the mouse is rolled off the button the other procedure is run which make the instance movie show a blank frame.

On (Roll Over)

Begin Tell Target ("/information2")

Go to and Play ("Medway")

End Tell Target

End On

On (Roll Out)

Begin Tell Target ("/information2")

Go to and Play ("blank")

End Tell Target

End On

This is a screenshot of the subject page there is a list of all the different subjects which when clicked run a JAVA Script in the HTML source which opens up a new browser with no toolbar which looks more professional and a lot quicker than loading toolbars and the navigational buttons.

The JAVA Script used is very simple.

<script language="JavaScript">

Function InformationTechnology()

{

window.open("...\subjects\IT.htm","","top=100,left=100,width=310,height=260,buttons=no,scrollbars=no,location=no,menubar=no,resizable=yes,status=no,directories=no,toolbar=no");

}

</script>

I also created a loading scene for my flash movie, which was very simple I want it so that if the movie were already loaded it would skip the loading screen. So I went on the Internet and look for some sites that could help me. I then found a example movie I could use to help me so I found the programming that I could use.

If (_framesloaded >= _totalframes)

Go to and Play (Scene 1, 1)

End If

Once to whole movie was finished I had to create a HTML page to insert the movie into I did this using Microsoft Notepad.

<html>

<head>

<title>Welcome to RMGS Website</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>

<body bgcolor="#999999" leftmargin="0" topmargin="0" marginwidth="0" marginheight="00">

<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">

<tr>

<td>

<div align="center"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="760" height="420">

<param name=movie value="schoollayout.swf">

<param name=quality value=high>

<embed src="schoollayout.swf" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="760" height="420">

</embed>

</object></div>

</td>

</tr>

</table>

<script language="JavaScript">

Function InformationTechnology()

{

window.open("...\subjects\IT.htm","","top=100,left=100,width=310,height=260,buttons=no,scrollbars=no,location=no,menubar=no,resizable=yes,status=no,directories=no,toolbar=no");

}

Function ModernLanguages()

{

window.open("...\subjects\ML.htm","","top=100,left=100,width=310,height=260,buttons=no,scrollbars=no,location=no,menubar=no,resizable=yes,status=no,directories=no,toolbar=no");

}

Function English()

{

window.open("...\subjects\english.htm","","top=100,left=100,width=310,height=260,buttons=no,scrollbars=no,location=no,menubar=no,resizable=yes,status=no,directories=no,toolbar=no");

}

</script>

</body>

</html>

Analysis

I am really happy with my final website because it included all the criteria that I have set for the website to get the maximum effect of the site. I have made the buttons into icon, which are large and can be understood easily the colour I think work very well with each other and the idea of using a windows layout for the website was very different. I think that the site was a great success the only problem I have at the moment is that the icons I have used are copyrighted and would be illegal to upload so if this site was to be uploaded I would have to get some free icon, or make some of my own. The website is good apart from when the browsing computer has a funny resolution it will look different and to the extremes the user might not be able to read the text.

Another problem with uploading the site and replacing the current site is that the site requires a Macromedia Flash Plug-in, which some older systems might not have and would take about 4 minutes to download, also if the computer is very slow the animations may be very slow and not as effective as they are intended to be.

Kris Bullen Page 1 of 3 28/04/07