IBook navigation menu

For my navigation I want to have a table with objects on them, each object will be clickable and will take you to a certain page within the IBook.

I started by photographing all the items i wanted to include on this "table".

First of all a started to take photos of the entire scene as a whole as i thought that this would get me the most realistic look. However the images came out bad, only certain parts that i had focused on were in focus and the lighting meant that the objects were not clear enough.

I re-did the scene on a table in better light, however I got the same problem with the previous attempt where only certain parts were in focus.

In the end I decided to create the scene up with separate images, this way i could individually change the colour of each object as well as get each individual object in focus.

After cutting out each image, apply curves to each object and adding drop shadows to each object i got this.
Im really pleased how it came out, all the objects look a lot better.

IBook keynote idea

Keynote idea.

As you can embed keynote into IBooks author i though you might be able to create a interactive slideshow that takes you to a point within one image, similar to the widget within IBooks, however this way i could also have audio/video within the widget. This was my idea (Test images).

Each click ont he button would take you to a new place on the big image where there would be video/audio content.

Although this works great when exported and tested within a browser and keynote, on the IPad the transitions are temperamental as well as hyperlinks, this creates a very unusable widget.

IBook navigation / Content ideas

Flow chart

The intro video will introduce the IBook and auto played when the book is open from the Ibook app.

There is a table of contents which Is like a main navigation available from any page by a two finger pinch gesture.

For my secondary navigation menu I want to use a double page spread and have it like a table in which all these WW2 and RAF items are placed. I really liked the double page spreads in the Aircraft book I had looked at previously. I want each item to be clickable and which takes you to a specific page.

German planes: I want this page to feature the German planes that were used in the second world war.

Air defence: I want this page to feature information/images on air defence used in the war.

Kenley location: For this page I want to include a google map which shows where Kenley airfield is.

Kenley airfield: For this page I want to have information on the airfield.

Kenley airfield: For this page I want to have further information on the airfield.

My Great Grandad: For this page I want information/pictures of my Great Grandfather

RAF Planes: For this page I want to include information and pictures of RAF planes.

Letter page: I want to have letters that talk about things during the war etc. With an audio track.

Interview page: I want to have my interviews on this page.

Final page: Credits final image etc.

Visual research

Visual research to devise the look and feel.

I want to go for a skeuomorphism look, so having real objects/textures within the ibook design. These are some images/styles that i would/could possibly include in my IBook to devise this feel.

Combing these images i want to create a style similar to this:

Story ideas

The one story that I have had from the near beginning is my Great Grandad in the second World War as a hurricane pilot. I have tried to be open minded about other stories so that I did not concentrate my research on a specific area.

A quick summary of stories I could potentially use:

1: GGD flipped his training aircraft during training.
2: GGD crash landed during the battle of Britain (Could not fly after this)
3: My Dad used to play at Kenley airfield when he was younger (GGD was based at Kenley)

I dont feel like I have any other stories that I would want to do instead of these stories. I enjoy reading up about the war too so I think this would be an ideal story to go with.

1: During his training to become a Hurricane pilot my Great Grandad (Peter Skinner) managed to flip the bi-plane he was training on when he came in for landing. As he was quite far through the training he was able to continue on and pass the training.

2: On the 18th of August during the battle of Britain my Great Grandad crash landed when he was shot at by german aircraft attacking Kenley aerodrome, He crash landed in Kent but his injuries meant he could not fly again.

3: My Dad (Chris Skinner) used to go to Kenley aerodrome when he was younger, He used to dig up the shrapnel left by the aircraft after testing their guns against sand barriers.

Research into animation used in a documentary

Animated documentary "Faith"

Looking at animation used in documentary, I have come across this wonderful piece that tells you of the story of his grandfather.

The first scene is a zoom out of a book, with the narration over the top, the movement is slow but works so well with the narration and visual design. I like how the depth of field works too here, everything but the book is out of focus.

The page turn looks very realistic and reveals items within the book which is also animated. I would like to mimic this effect as i think it would be a good way to introduce the book.

I like how the book has been placed on this background surrounded by lots of other objects. I t makes the scene more interesting and visually feels more real.

The book also spins around in 3D and becomes this pop out styled book with animated objects, the transition works really well.

The added clouds in the foreground and distance really enforce the 3d look.

Research into interactive documentary narrative

Storming Juno interactive documentary.

Stormig Juno is an interactive documentary for the web. It shows, images, video interviews within the documentary in which you navigate to by an interesting 360° menu.

The video starts with an intro video telling you what the story is about and what is to come if you progress further into the interactive piece.
I really like this intro video as they have used this central mask to pinpoint what the stories are about, there is not too much going on but you feel really engaged in just this small area.

For the intro video they have used a narrator who tells you what the interactive documentary is about, I really like this idea and will want to include it my intro video. It gives a clear idea on what the piece is about but remains engaging at the same time. The video is not that long only about 30 seconds.

Once the intro video has finished you come to this splash page, this page interacts with the mouse. When you move the mouse over the image it moves slightly back and fourth as well as adding to the interactivity.

The way you navigate from page to page is amazing, it's as if you are set within the scene, you can navigate around 360°. The scene is also set in 3d, there are layers on which the the closer things are on layers closer to you and ones which are further away.

I think that it would have been made like this where each layer is 360°, the closer the object the closet it is to the center.

Around the scene there are dots in which you can click and which take you to a specific scene. I think that you may miss content this way as you can easily miss the points to click and possibly forget which ones you have clicked. However the points are quite obvious but do not detract from the scene. I quite like this idea as you can have more information in a smaller area.

If you click on the points you are taken through the scene and weave in and out of objects, It would have been easy just to create in instant jump however, the designer has thought about it and made it more interesting for getting from one scene to another.

The page that appears after you have clicked on the points takes you to interviews with the people who are to do with the button you clicked. It has a similar style to the splash page where you could move the mouse and the page would respond. The broken tile effect works well with the video content. If you were just to have videos sat on top in standard rectangles it would deter from the visual style and not work as well as it does here.

When the videos are hovered over a green halo appears around them as well as more information. Having information appear before you may click on the video can give you an insight to what the video is about as well as introducing the person in the video.

Some of the videos feature images that come up as they are talking, this gives the audience something else to look at while listening, it can also be used to show exactly what the person is talking about.

The videos use multiple framing's of the people who are being interviewed, usually when there is more emotion the camera is zoomed in more and the person is larger in the frame. 

For the video interviews extra options are available from looking at their biography to more photos and turing subtitles on and off.

A small touch is the back button, when rolled over the image changes and makes a noise, its i nice added touch.

I find this interactive documentary a very useful piece of research, i like all the little features like the moving back button and having a large image in which there are points to click which take you somewhere else. Also the way that the menu has been created by clicking on certain events/objects.

Animation Research

For my animation I want to try some 3D objects within After effects, I have found that you can export models from google SketchUp and import them into photoshop and then into after effects (cs5.5) ae cs6 does not support photoshop 3D images anymore.

I really like this animation, the movement is really simple but so effective and really works with the imagery. The transitions used also look as if it is an animated story board that comes to life through the animation. Being able to draw would be a very key element in a animation like this, but i really like how they have animated it, like the small added touch of a bounce when the fire place and plant flies it. (26 seconds in)

Going back to using 3d models I quite like the use 3d planes. Once I have decided on my story completely I will be able to go more into looking how to create something like this:

The person who created this used Cinema 4D and after effects, I have used C4D before but would like to use it again, the movement would be quite simple to replicate and with the cameras in C4D i could easily add some panning shots etc.

A video i saw IMedia was one on video copilots site where the camera would start out above a street and zoom out to reveal the entire earth. This is something that i could see working for something like a map.

For my animation i want to use more photos/3d rather than trying to draw something, I want to go for more of a realistic look and feel which will tie into the skeuomorphism look I am wanting to use.