Sunday, January 30, 2011

Presentation 2 Ken Burn Effect


I. Please watch Cheryl Ho’s video (a previous year student’s work):
http://www.youtube.com/watch?v=cULOFcZ93Ug

· Point out the part(s) that applies Ken Burns Effect.
_The part where she introduced the NUS staircases
_The part where she introduced eating places in NUS such as Munchie Monkey and Subway
_The part of the word “stress”
_The part where she stared at a pile of books
_The part where she was reading her course packs
_The part where she was chatting with her friends

· Which part(s) of using Ken Burn Effect you think are (is) good?
_The part where she looked up the staircase is good because it matched what she was speaking “ I always find myself looking UP a…”
_The parts where she held the characters of the words such as STRESS, SECOND etc are not good because the character was small while the panning was so fast.

· Evaluate this video from other aspects (sound, photo, script, transition and so on). Which are (is) good and which can to be improved?
_The sound is good. It is neither so sad nor so cheerful
_The photos make a good illustration of what she was speaking. However the characters for the words such as “stairs” are quite small so this affect readability
_The script is good and meaningful. She tried to emphasize though studying in NUS was challenging, she would look at it in a positive way

2. Different video transition effects in Adobe Premiere CS5
_3D motion
_ Dissolve
_ Iris
_ Page Peel
_Slide
_Wipe

Dissolve, Wipe and Slide effects are used when you want to emphasize or add a special effect to a scene change. Use 3D motion for 3D objects, for example you may want to make the object rotate.


3. Define what are “pan, tiltup, tiltdown, zoom, close up; extreme closeup; wideangle; highangle; fisheye, and telephoto” and their use
_Pan Right or Pan Left: Rotate camera to right or left. This can be used to follow a subject who is moving across the set or to move between a shot of a subject on one side to a shot of a subject on the other side.




_Zoom in: Move camera closer (or use the zoom) to go from an establishing shot to a wide shot or from a medium shot to a close up. Can help provide action or movement to a static scene. Often used to follow an establishing shot and bring the audience into the scene.

_Zoom out: Move camera away (or use the zoom) to go from close up to medium, medium to wide, or wide to extreme long shots. Often used to close a scene or end a film. Lets the audience know they are leaving that scene. Can also be used going from close up to medium to show how subjects are pulling away from each other.





_Tilt shift and Van Gogh pictures: The technique makes them look like 3D pictures. So beautiful

_ Tilt Up: Tip the camera up on the tripod. Used to show change in point of view. Usually used between shots to get a different point of view on the subject.

_Tilt Down: Tip the camera down on the tripod. Used to show change in point of view. Usually used between shots to get a different point of view on the subject.



_Close up: The subject or object is larger in the frame. Useful when you are trying to capture a small detail of the action.
Extreme close-up: Focus on the emotions on the face of the subject, or a particular detail on the object


_Dolly Zoom:





Monday, January 24, 2011

Draft of Website-Week 3

Draft of website: Homepage
Version 1

Version 2: I add some colors to the website such as Yellow or Green




The Layout of the website is as follows: 

I will create a table in HTML and to put the images and texts inside. The design of the website will be created by CSS



Saturday, January 15, 2011

NM3208 Presentation 1 - Website Design

1. 3 websites that I like best:

__ Dara's Garden: http://www.darasgarden.com/
__ Media Boom: http://mediaboom.com/index.htm
__ Belvedere Inc.: http://belvedereinc.net/index.php

a. Dara's Garden: http://www.darasgarden.com/


This beautiful website applies design principles such as balance, harmony, contrast, color scheme, Gestalt and so on.

Colors used are blue, green, and light brown, black and white. It follows the cool color scheme, which eases the eyes and retains visitors, since it is so comfortable and peaceful to look at. It is noticeable that blue and green are most favorite colors to most people. Different values and intensity of the same colors are applied, which helps bring variation and variety to the website. This color scheme reminds me of the scenery of green trees and soil under a blue sky in a cool and windy day. Limited color palette when used properly can create the feeling of organization and sophistication (William and Tollett, 2006).

Layout: The website has a balance between graphic and text. There is also a good contrast between the background and the texts or pictures, for example black texts on white or grey background so it is very easy to read. The principle of Repetition is applied when there is the same background and consistent graphics in every page. There is also a good way of using of grids. Texts are aligned left so it is well organized and easy to read.

Gestalt: Principle of totality is applied throughout the website. All the graphics and texts seem to harmonize in color, texture and shape. There is a hierarchy of texts. The headings and titles are bigger and have different colors. Text belongs to an idea is grouped together. Rule of symmetry is also used in the website between the right and the left, the top and bottom.

CSS: The Dara's Garden website uses external CSS from a file:

link href="/css/main.css" rel="stylesheet" type="text/css" /


__ Media Boom: http://mediaboom.com/index.htm


Similarly, this website applies design principles such as balance, harmony, contrast, color scheme, Gestalt and so on. It also uses sounds and animation to attract visitors and encourages interaction.

Colors used are mostly warm colors such as red, brown, pink, orange, yellow and so on. Some cool colors such as blue and green are also used. Different values and intensity of the same colors are applied, which helps bring variation and variety to the website. The website has an antique look. It seems formal and academic with graphics such as books and maps.

Layout: The website has a balance between graphic and text. There is also a good contrast between the background and the texts or pictures, for example black texts on light orange background so it is very easy to read. The principle of Repetition is applied when there is the same background and consistent graphics in every page. There is also a good way of using of grids. Texts are aligned left so it is well organized and easy to read.

Gestalt: Similar to the Dara's Garden website, Gestalt's principles are applied throughout the website. All the graphics and texts seem to harmonize in color, texture and shape. There is a hierarchy of texts. The headings and titles are bigger and have different colors. Text belongs to an idea is grouped together. Rule of symmetry is also used in the website between the right and the left, the top and bottom.

CSS: The Media Boom website uses internal CSS:

Similarly, this website applies design principles such as balance, harmony, contrast, color scheme, Gestalt and so on. Principle of Repetition can be seen clearly in this website as the same blue and green colors are used repetitively throughout the webpage.

Colors: Analogous colors such as blue and green are used. Unlike the two previous websites, the same value and intensity of blue and green are used, so the website can catch the attention of visitors by applying the principle of repetition quite well. Overall, the color combination makes the website comfortable and easy to look at.

Layout: The website has a balance between graphic and text. There is also a good contrast between the background and the texts or pictures, for example white texts on dark background. There is also a good way of using of grids. Texts are aligned left so it is well organized and easy to read.

Gestalt: Similar to the Dara's Garden website, Gestalt's principles are applied throughout the website. All the graphics and texts seem to harmonize in color, texture and shape. There is a hierarchy of texts. The headings and titles are bigger and have different colors. Text belongs to an idea is grouped together. Rule of symmetry is also used in the website between the right and the left, the top and bottom.

CSS: The Belvedere Inc. website uses external CSS:



2. What are the advantages of using CSS?

_ Easy to create a website using CSS. If we use HTML for the design of the website, we need to set the font, size, color and style for every element on a page. So we have to type the same code over and over again. If we use CSS, we only need to specify the details once for a group of similar elements that have a similar design, thus this saves time.
_CSS also has a larger array of attribute than HTML so it helps us code a more beautiful website.

_CSS makes the website easier for maintenance. If you want to change the style of a group of element, you only need to change the CSS code. This saves you from the problem of editing every element directly if you use HTML for the design job. Also, it helps ensure that you achieve consistency throughout the site.
_Most browsers cache CSS style sheet so the loading of page using CSS is faster.