Category Archives: Website Review

Looking at http://www.unfortunateeventsmovie.com

Posted on December 3, 2008 by sophiemagnante

My favourite part of this website was the audience interaction that they had decided to use. During your whole visit to the site there is a counter at the top which counts how many eyes you have collected. As you navigate through the site you realise they are hidden on various pages, which then convinces the user to continue looking through the website to find the eyes, but also reading more information about the film making it very good advertising. Some people find this kind of thing boring and don’t bother with it so they have also incorporated rewards to encourage even them to join in and collect the eyes and in turn navigate through the whole site.

<!–[if gte mso 9]> Normal 0 false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 <![endif]–><!–[if gte mso 9]> <![endif]–> <!–[if gte mso 10]> /* Style Definitions */ table.MsoNormalTable {mso-style-name:”Table Normal”; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:”"; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0cm; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:”Calibri”,”sans-serif”; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:”Times New Roman”; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin;} <![endif]–>On the homepage there are many objects that move, some when you hover over them but some just periodically which makes it more visually interesting and the user is then drawn to certain areas on the website. I like how plain the homepage is and like the Scooby Doo site there is little information so it makes the user have to navigate through the site to find what they want and on the way may come across other things too.

There are three main menus on this site and all of them expand up from the bottom to create intricate and interesting lists for the user to navigate through. I feel this makes it more likely for people to stay interested and want to explore various parts of the site as it’s so unpredictable and every page your taken to is completely different. It also makes navigating through the site as everything is organised into sections and grouped together in an easy to find manner.

<!–[if gte mso 9]> Normal 0 false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 <![endif]–><!–[if gte mso 9]> <![endif]–> <!–[if gte mso 10]> /* Style Definitions */ table.MsoNormalTable {mso-style-name:”Table Normal”; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:”"; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0cm; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:”Calibri”,”sans-serif”; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:”Times New Roman”; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin;} <![endif]–>This is the first website I’ve analysed which has used music constantly throughout the persons visit. It changes on certain pages to create different moods and atmospheres but is generally the same style to express how the movie is. This website for a film and I think it does a very good job of informing the users about various aspects of it.

Interactive Narrative: Looking at http://www.cartoonnetwork.co.uk/microsites/scooby/index.jsp

Posted on December 3, 2008 by sophiemagnante

Spatial Awareness:

This website follows quite a linear structure which makes it appear a lot neater and organised so that the user believes it will be easy to navigate around; a very important aspect for a website aimed at children. The menu is to the left with a large space to the right where there is an image that is constantly moving. This movement attracts the user and draws them to look at this area but the movement gets repetitive quite quickly due to the fact it’s on a loop, so they are then almost forced to look through the menu and navigate through the site.

Use of Media-text, Animation, Video, Stills and Audio:

I particularly liked the use of images as links on this website and thought it was very appropriate to make it more visual as it would be aimed at children. At the top of the screen is a reel of images from various cartoons which scroll constantly along the top. After you click on them and the new page loads they are then scrolling in the opposite direction to add variety and make the screen look slightly different. I think the use of having a constant scrolling motion is very visually effective and draws the user’s eyes to that area. They are then more likely to click on one of the links because there’s a time limit before it reaches the edge and disappears. However, they haven’t taken complete control of this section as there are arrows to either side of the reel so that the user can navigate through as well. There are also images used for the links to games and when you hover over the image, the name of the game appears underneath where it says “Choose a Game” in this still. This is also a very clever method of making people explore the site and no information is given away on the homepage and they have to actively explore and navigate through the site to find what it is they’re looking for. When you hover over the menu down the left hand side images appear out each side as well to make it more interesting and make the user want to look around the site more and see what happens when they hover over different objects.

Audience Interaction:

Similarly to the Secret Garden Party website, once the links are clicked on a translucent square appears in the middle of the screen so that the background and homepage can still be seen, encouraging the user to continue exploring the site. I think is a very good technique and would quite like to use this idea in my own interactive narrative to keep the page interesting and the user constantly wanting to move on and explore more. There is also a menu option within the link displayed so the user feels that they have a bit control over the website and can choose which area within that section of the website to look at.

Genre Archetype:

This is an Entertainment website for a TV Programme.

Interactive Narrative: Looking at http://www.secretgardenparty.com/2008

Posted on December 3, 2008 by sophiemagnante

<!–[if !mso]> v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} <![endif]–><!–[if gte mso 9]> Normal 0 false false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 <![endif]–><!–[if gte mso 9]> <![endif]–> <!–[if gte mso 10]> /* Style Definitions */ table.MsoNormalTable {mso-style-name:”Table Normal”; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:”"; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0cm; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:”Calibri”,”sans-serif”; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:”Times New Roman”; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin;} <![endif]–><!–[if gte mso 9]> <![endif]–><!–[if gte mso 9]> <![endif]–>

<!–[if gte vml 1]> <![endif]–><!–[if !vml]–>Spatial Awareness:

I particularly like this website because when you move your mouse to either the left or right hand side of the page it scrolls around gradually doing a 360˚ revolution of the surrounding area. This makes the user feel part of the website and more involved than usual as they can choose which section of the background to stop and look at. I noticed when scrolling from side to side the website uses several layers in a very interesting way. The background is made up of a few layers and as you move around certain parts move faster than others. This makes it more realistic for whoever is using it as the angle then changes for various objects as it would do if you were actually standing in this place. They use another layer which includes stationary objects like links, the logo and the dates. I feel they have done this to give each view a similarity so the user feels comfortable to explore knowing that there will always be links for them to navigate through as well.

Use of Media-text, Animation, Video, Stills and Audio:

This websites use of animation is really interesting and unexpectedly new features appear on the page all the time. At the time I took this still there was a dragonfly near the centre and if you look at the rest of my photos it’s not there as it simply just passed through. I think this intrigues the user to keep looking and as the new objects just pass through the screen, the user will want to stay on the website to see what else happens and what new things appear. As it’s always changing it may convince them to revisit the website and see what happens that time as well. This website also uses animation, audio and images with the various links on the page. None of the links are obvious and require the user to hover over them and these sets off a new action. I think this is good method of making people navigate through the website because they not only wondering what information they can find out but they’re looking for where the link to this information is and what will happen when they find the link. Another way they’re making the user navigate through the site is making the mouse image change when you’re scrolling around the scene causing them to see all the areas of the site rather than just the first part.<!–[if gte mso 9]> Normal 0 false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 <![endif]–><!–[if gte mso 9]> <![endif]–> <!–[if gte mso 10]> /* Style Definitions */ table.MsoNormalTable {mso-style-name:”Table Normal”; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:”"; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0cm; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:”Calibri”,”sans-serif”; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:”Times New Roman”; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin;} <![endif]–>

Audience Interaction:

The links on the page set off various animations, audio and images which I’ve already spoken about and these encourage the user to keep investigating the site so they find all the information and pages. Once the links are clicked on they appear in the middle of the page in a translucent space so that the user can still see what’s happening in the background but are also not too distracted by it. I feel this method also keeps the viewer interested in the other areas of the website as they can still it around the edges of the translucent space. This way, once they’ve finished reading the information they have chosen to look at they are more likely to continue to look around the site rather than if it was a plain background, as they may have forgotten about the main website page. Each link has a menu list down the side where the user can decide which area of that topic they want to read about. It also has links to various other websites so that they can choose which parts of the site they like and read more about it on different websites too.<!–[if gte mso 9]> Normal 0 false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 <![endif]–><!–[if gte mso 9]> <![endif]–> <!–[if gte mso 10]> /* Style Definitions */ table.MsoNormalTable {mso-style-name:”Table Normal”; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:”"; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:10.0pt; mso-para-margin-left:0cm; line-height:115%; mso-pagination:widow-orphan; font-size:11.0pt; font-family:”Calibri”,”sans-serif”; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:”Times New Roman”; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin;} <![endif]–>

Genre Archetype:

This website is for a Music Festival.

Sophie Magnante

Category Archives: Website Review

Looking at http://www.unfortunateeventsmovie.com

Interactive Narrative: Looking at http://www.cartoonnetwork.co.uk/microsites/scooby/index.jsp

Interactive Narrative: Looking at http://www.secretgardenparty.com/2008

Categories

Twitter Updates

Follow “Sophie Magnante”