Images I have created for my Double page spread

I have used a camera off the web and edited it so that it has a printscreen of the robin cam footage.


This is the Tv listings for a whole day. There is also a +1 of these using different colour but practically the same.

Design ideas for listings magazine

These are the design ideas I have for my magazine.

• To keep the consistant green from my website.
• To include pictures of my cats from the video on the website.
• To have footprints all over.
• To keep the theme of the page original so the layout on the right page is completely different to a normal TV magazine.
• To add some comedy to it to make it family friendly.
• Have the listings on the right page.

Research for TV listings Double Page Spread

Looking at all the different TV magazines I have found that there arent any recent channel launches that I can refer to. However in the magazines, they contain a stucture of having a main picture/ story at the top - usually a celebrity, a caption depending on the formality of the magazine and some text or pictures crossing the fold in the magazine. As my target audience is the family, I have decided to make the double page less formal so it is fun and entertaining to look at for everyone.

I looked at What's on Tv and Tv listings magazine. Above is what I noted from them. My real feels about this will be in my evaluation.

The finished product of my website

How I made my gallery page

My gallery is a collection of photos taken at the London Zoo. The pictures may not be amazing quality but I wanted to show my skills in using Java/Javascript embedded in a website as used in the BBC3 website. To make this work, I had to resize the photos twice, once to create thumbnails for the gallery page and again to create sensible sized photos for the display. I used a java applet called Lightbox, a free applet. On a Lightbox-enabled page, a user can click an image to have it magnified in a Lightbox window, which resizes itself according to the size of the image using a gliding animation. Lightbox determines which images will be shown in the modal window through the XHTML "rel" attribute, which is used on an [a] element wrapped around the [img src="" /] element. Lightbox also provides a way to attach captions to images and to run a slide show, which can be navigated using the arrow keys. This worked very well indeed.

How I made my video into a flash video

First of all, I shot the various elements with a camcorder. I roped in members of my family to appear. I then downloaded all the recordings and edited them together in a package called Movie X4 by Serif. This produced a finished video in .AVI format. The next stage was to get the video onto the webpage which was not as easy as I thought. AVI format is not suitable because of it's size so I knew that I needed to convert it to a compressed format, preferably one that could be 'streamed' such as Flash. Streaming would enable the video to play almost immedeately which is important as viewers don't want to wait. Firstly, I tried various free file format convertors from the web but none really achieved the result that I wanted. I then turned to Adobe Flash where I was able to convert my .AVI file to Flash format with the associated support files. I was then able to insert this into my web page where it would play in a window as soon as the viewer pressed the 'play' button. I chose not to have it play automatically as this gets annoying and I also decided not to have it automatically repeat. Furthermore I deliberately omitted the 'full screen' option as this would degrade the quality of the video.

Finishing touches

My website is now finished at http://www.octaveblue.co.uk/AnimalEarth

To finish off my website, I have now created a video of my cats to the song of "whats new pussycat" to advertise the programme 'cat borstal'. I have used really short clips to make the video entertaining and I have slowed down parts and sped them up to give the video an exciting visual effect. This contributes towards the success of my website as the audience will have a better reason to stay online along with the bird cams and the gallery. I am going to edit this video a tiny bit more; adding more effects to make it look more interesting. I am also going to redo the voiceover at the end and increase the volume of it. I will then convert this into flash and put it on my website.

This is the video below

Decision to add a gallery page

As in a lot of places; especially in schools the games page is blocked on the internet. This means that my third page will not be accessible from the internet. I have come to a decision that I should make the gallery false link into an actual link to a range of animal pictures which can open into a professional picture viewer. I am then going to delete the hyperlink of the games page so only three pages are linked.

Making every page look professional

I am adding in text and pictures in the big spaces on the bird cam page and the schedule page.

I have also decided that I am going to remove all the adverts on the robin cam page and insert another cam to go next to it. It will then be a bird came oage with a robin cam and a blue tit cam.

finishing stages of design

I have got to a point where I have decided to upload my website so far to the internet so you can see how it works. The address is

http://www.octaveblue.co.uk/AnimalEarth

If the homepage has a video from google videos on it; I have just put it on there to show how a video will complete it. I will film my own video when the whole design of this website has been completed.

The best broswer to view this site on is Mozilla Firefox because Internet Explorer inserts and removes the odd space in dreamweaver documents that aren't fully encrypted. However google chrom and safari are suitable to view this as well.