Finished Home Page / Evaluation

All of the buttons play an animation and a sound effect when they are moused over. 
Looking at it on it's own, I've realised it isn't clear that they are all stories. So I think it could have benefited from some text in the middle, maybe a speech bubble saying choose a story or putting the word stories on the logo like on Jim's.
However I am happy with how the buttons turned out. The sound effects I couldn't find on Garage Band I had to make with my sister's and my voice and cereal. The ghost woooo is my sister with an echo added in audacity, the frog's ribbet is just me, the cake one I made by crunching a shreddie and the eggs cracking were from crushing a cornflake.


I think that children would enjoy scrubbing over all the buttons to hear all the sound effects played over each other, and the circular layout is perfect for this! I did think about having the buttons all moving around bertie, ferris wheel style, but then I thought it would be a bit too much with the animations and sound effects all going on. The background animations I did use are quite subtle  so as not to distract from the buttons.

Story HTML page

Here is one.

If I had some more time I would improve this as it is pretty plain. The back to home button was done at the last minute and therefore rather basic. But it is animated and it works. I would not change the background colour though, because I think it is important that all the focus is on the actual stories. A simple footer would have been good for navigation between stories without having to go back to home.

Overall

I am very pleased with my project on a whole.  I am glad that I was able to make changes after the critique including adding a start page, credits and extra interactivity to improve the story.

Making the Home page

On my homepage I will have one SWF containing 12 buttons, one for each story.
The buttons are going to animate on hover and then have a get URL action to link to their story HTML pages. I looked on cbeebies again at the buttons they have along the top:

These buttons animate on hover for about a second and a half. There is no down state because as soon as they are clicked they load the page they link to.
There's also a voiceover when they are hovered over that tells children what the button goes to if they can't read the writing.

My buttons will be similar to these but instead of a voiceover I will have a sound effect. Here's my buttons so far:

I'd like to have a big picture of  Bertie's head in the middle with his eyes following the cursor but that might be a bit too ambitious.

The background will probably be an island/beach/ scene.

Interactivity

Something I noticed when I did my research, and something that was mentioned during my crit was the idea of having more interactivity than just clicking on the next or back buttons.

From Cbeebies

I already had the scene where you have to find the X spot where the treasure is buried:

 but now I've made some more scenes with interactive buttons that work in the same way. The new button objects link to the next scene but the next button can still be used instead.

Because there's no voice over for the instructions, I put in an arrow so that children who can't read can still understand what they have to do. And a glow on hover to make it obvious

During Voiceover

After Voiceover

On Hover

I did this by extending the timeline on all the layers until the voiceover ended and then added in actionscript to prevent it from looping. Then I made a new layer called 'clickon' which has the instruction at the top, the arrow and the clue/map/X as a button. This layer only appears after Marie's mum has finished reading.

Sound Effects

I decided it would be fun to have sound effects that play as you mouse over objects. To make Pecky squawk I put invisible buttons over him in some scenes with a nice big hit state and the sound effect in the over state.

Ticking clock

Crit

After showing my work to the class and the client these are the things I need to change:

• Slow down Percy's waving in scene 2
• Put in a start screen so that it doesn't just jump into the story
• Change Bertie's 'bored' expression in scene 2
• Add in credits

I could also add in some extra interactivity like 'click on Percy to follow him' or 'roll over Pecky to make him squawk' if I have time and it would also be good to make the next button flash when it's time for the next scene.

Splash Screen:

I thought this page needed some island music but when i put some in (off garage band) it made the next scene seem really boring so I might just have that music over the credits.

Beastly Burney

There are only 3 characters in my story; Bertie, Percy and Pecky and all of them are already illustrated. However in the 5th scene in the museum they find "a map that leads to the long lost loot of 'Beastly Burney', the scariest pirate that ever lived on Treasure Island!"
So I decided I could make a statue of Beastly Burney to put in the museum.

Also at the end of the story ***PLOT SPOILER*** it turns out that "Beastly Burney was not the scary pirate we thought he was"
So I might have him winking and smiling at the audience at the very end.

Flying

When Bertie and Percy decide to go looking for treasure I thought Pecky (the parrot) should fly round their heads in excitement!

To do this I made 2 movie clips for Pecky, one flying left to right in front of their heads, and one left to right behind their heads.

Then inside the pecky movie clip I made some wings so he could fly properly

The wings are just motion tweens that rotate from the axis on his arm/wing pit

...Interface

During the story, Bertie and Percy find 3 clues leading to their treasure. For these scenes I was going to just have the text of the clue on a plain background, with just the buttons and no text box at the bottom:

But then I decided that this was too boring and I added in a background:

The font I used is called Booter. I am using it for all the clues and the text on the treasure map.

I picked Booter (bottom one) from all those fonts above because it was pirate-ey but not too 'Pirates of the Caribbean' (top left)

The gradient mesh on the map isn't quite in keeping with the rest of the Bertie The Pirate graphics, but I thought that It was ok to use it just this once, because it looks more like a real map and is a lot nicer than the   first version I did: