User Testing

With my site nearing completion I got in contact with Miss Snow at Croxby Primary School to arrange a day I could go in and test the site on the children and show the teachers what I had done since the last time I was there. They said I could go in on March 12th between 1.20 and 2.20pm and show it to Mrs Harris's class which is also my nephews class. I got stickers made to hand out to the children to promote my site and I got myself a t shirt printed to promote my site.

So I went into the school and presented my site to the teacher and the class and explained to them what the site was. I then got the children involved by getting them to play the games and asking them to show me why the pieces went on the jigsaws by getting up and pointing where the pieces should fit. We then played the quiz and I showed them the word search and asked them to find some of the words which they did. Once I had shown them the site Me and their teacher handed out the stickers I had brought in for them before they went and sat at a computer to have ago on the site themselves. Whilst the children were playing on the site I asked Miss Harris and Miss Snow if they would fill out the user testing form I had printed out for them to fill in. On the form I had wrote questions for them to answer regarding the usability of the website.

Mrs Harris put the following answers to the following questions

Is the website fit for purpose of promoting the Olympics to Primary School Children?

Yes very useful for promoting the olympics to children of this age.

Does the navigation work ie Home, Venues buttons?

Yes

Do all the links work ie the Venues buttons?

Yes

Is the website easy to use?

Children seemed to be able to find the games quite easily

Are the games to hard or easy for the children?

The jigsaws are suitable for children in reception the quiz and word search would be suitable for year 2 children

What could be improved if anything?

Maybe more games and if they could colour in the alligator online, children of this age would really enjoy that. We really enjoyed the website thank you

Miss Snow put the following answers to the following questions

Is the website fit for purpose of promoting the Olympics to Primary School Children?

Yes, some of the website appeals to younger children and some would appeal to older children

Does the navigation work ie Home, Venues buttons?

Yes, everything works well

Do all the links work ie the Venues buttons?

Yes, all links are working

Is the website easy to use?

Yes it is easy to navigate and all text and images are clear

Are the games to hard or easy for the children?

I think some of the games are harder for younger children but will be fine for older primary age children

What could be improved if anything?

Nothing, I think its a great website

The feedback I got from the class and the teachers was good and they all liked the website. I received an email the day after from Miss Snow saying how much they liked the site and Mrs Harris said all of her class really enjoyed trying the website. Miss Snow also said she had added the site onto the school weblinks so that when the children have any spare time in ICT they can choose what they go on, they have a free choice to go on Olympics For Kids if they wish. So I was happy that they liked it and I will now go away and see if I can found a tutorial to create a live paint like Mrs Harris suggested to replace the static print out pictures.

Back and Next buttons

After looking at the CBeebies site and other children's sites I noticed they use back and next buttons to help the children navigate the pages so I decided to add them to my site. I created back and next buttons in the shape of arrows and added them to my site. Below is the code I added in the action script for the Home page for the next button.

function onNextbutton1Click(e:MouseEvent):void

{

gotoAndStop("Venues");

}

nextbutton1.addEventListener(MouseEvent.CLICK, onNextbutton1Click);

So with this code added when the children click on the arrow with next on it at the bottom of the screen it will take them to the Venues page. Then when they are on the Venues page they can click another next arrow which uses the same code as above apart from

the gotoAndStop changes to:

gotoAndStop("Games");

On the Venues page I added a back arrow which uses the same code as the next arrow apart from it tells the user to go back.

function onBackbutton1Click(e:MouseEvent):void

{

gotoAndStop("Home");

}

backbutton1.addEventListener(MouseEvent.CLICK, onBackbutton1Click);

I added back and next buttons on the Venues, Games pages and then back buttons on each of the Venue pages and on the Colour In page. Below is a screenshot of one of the pages:

Creating the print outs on the Colour In page

I wanted the children to be able to print out a picture of Ali the Aligator for them to colour in. So I searched online for a tutorial on how to add a print button and found one and followed that. I made outline drawings of the him standing and playing basketball in Adobe Illustrator. I then imported the outline drawings in flash and saved them as movie clips and called them mc_printContent01 and mc_printContent02. I then created two print buttons and added them underneath the two outline drawings. Then I added the following code in my actionscript layer for the Colour In page to enable the children to print out their own picture.

print_button1.addEventListener(MouseEvent.CLICK, onPrintButton1);

function onPrintButton1(evt:MouseEvent) {

var printJob:PrintJob = new PrintJob();

if (printJob.start()) {

if (mc_printContent01.width>printJob.pageWidth) {

mc_printContent01.width=printJob.pageWidth;

mc_printContent01.scaleY=mc_printContent01.scaleX;

}

printJob.addPage(mc_printContent01);

printJob.send();

}

}

print_button2.addEventListener(MouseEvent.CLICK, onPrintButton2);

function onPrintButton2(evt:MouseEvent) {

var printJob:PrintJob = new PrintJob();

if (printJob.start()) {

if (mc_printContent02.width>printJob.pageWidth) {

mc_printContent02.width=printJob.pageWidth;

mc_printContent02.scaleY=mc_printContent02.scaleX;

}

printJob.addPage(mc_printContent02);

printJob.send();

}

}

So once this code was added the children could print out their own outline drawing of Ali to colour in by clicking on the print out buttons as per screenshot below.

Adding music and sound effects to the site

I wanted to add some background music to the home page so I looked in Google for royalty free music and came across a site called stockmusic.com. On this site I found some olympic music and in particular a piece of music called Victorious which I thought would be good to use on my home page. I also found sound effects on this site that I could use when the user hovered or clicked on my illustrations of Ali participating in one of the sports. So I purchased 4 sound effects and the Victorious music from this site to add to my site. To add the music and sound effects to my site was similar to how I added the voice overs to the site. Below is the code to add the Victorious music to my homepage and to stop it playing on the other pages.

stop();

var homeSound1:homeSound = new homeSound();

var venuesSound1:venuesSound = new venuesSound();

var gamesSound1:gamesSound = new gamesSound();

var colourinSound1:colourinSound = new colourinSound();

var victorious1:victoriousSound = new victoriousSound();

var sc:SoundChannel;

var isPlaying1:Boolean = true;

if (isPlaying1 == true)

{

sc = victorious1.play();

var videoVolumeTransform:SoundTransform = new SoundTransform();

videoVolumeTransform.volume = 0.20;

sc.soundTransform = videoVolumeTransform;

}

Then so it only played on the Home page I added the following bit of code to all the other pages.

sc.stop();

Adding this code meant the Victorious music would only play on the Home page.

To add the sound effects to the pictures of Ali participating in the sports I added the following code and then for each of the pictures I changed the name of the sound effect. The code below is for the track and field sound effect:

stop()

sc.stop();

var homeSound2:stadiumSound = new stadiumSound();

var venuesSound2:venuesSound = new venuesSound();

var gamesSound2:gamesSound = new gamesSound();

var colourinSound2:colourinSound = new colourinSound();

var trackandfieldSound2:trackandfieldSound = new trackandfieldSound();

trackandfieldpic.addEventListener(MouseEvent.ROLL_OVER, onTrackandfieldPic);

function onTrackandfieldPic(e:MouseEvent):void

{

trackandfieldSound2.play();

}

Adding this code meant when the user hovered over the pictures on each of the venues pages a sound effect would play relating to that sport.