Thursday, February 12, 2009

Blog 3: Motion and Web Design

Motion Design

Point, Line and Plane: AT&T-04
Point is used, as a way of conveying depth is this video. The points are used effectively to create abstract computer mouse’s. They are also used very effectively in creating a room by skewing and changing the sizes of the dots, by doing this perspective is achieved. The lines act as a directional tool, guiding us through the ad. Planes are used as television screens, acting as transitional elements.

Rhythm and Balance: ESPN-01
The elements within this piece seem to follow the rule-of-thirds, which make this a well balanced work overall. The pacing of the music coincides with content of the work, by making you think there will be this great crescendo when the athlete completes their task, but are left disappointed.

Scale: Aero-01
Scale plays a huge role in this piece. All of the dots range in size from the most minuscule to ones that take up a good portion of the screen. By having these dots range in size this creates a sense of depth for the face. If the face were to be created out of all dots of equal size the piece wouldn’t have nearly the same effect.

Texture: TeleText-03
In this ad it is all about the texture, all of which is created by letters. The size, proximity, colors, and juxtaposition of all of the letters is key to the texture. By grouping the letters closer together you create harder lines. Some really beautiful transitions occur in this piece by focus large amounts of text together, creating this large mass that is undistinguishable and then morphing into something else.

Web Design

Point, Line, Plane: http://erraticwisdom.com/

Point is used throughout this site as a background grid, with two sizes of dots comprising of the grid segments. Planes are used at the top of the page, acting as these puzzle pieces. They also act as backdrops for the text to reside on. Some of the lines on this site are implied, such as those that are implied on the grid. Lines are used to create separation of the puzzle pieces at the top of the page, as well as separating the top and bottom of the page.

Rhythm and Balance: http://www.electriclead.co.uk/
The main elements on the page (links, telephone, images, body text) are all placed in respect to balance. The images on the page are predominately placed to the right of the page, while the body text takes up the left, making the page well balanced. The main image has great rhythm and movement that seems to tie everything together.

Scale: http://www.biggs-gilmore.com/
Scale is used beautifully in this piece by having your mouse change the perspective of the environment. By changing the perspective some of the images become smaller, others become bigger, and the lines within the background either move closer or become farther away based on their scale.

Texture: http://bfish.free.fr/
This site has really simple, yet beautiful texture. The simple gradations, from black to gray, create this inkblot shaped texture. The kerning and letting of the text on this site also add their own texture.

Point, Line, Plane, etc...

POINT, LINE AND PLANE

Web
http://www.monoblock.tv/
I like this site because it is fun. It shows good use of both line and plane that are used in a fashion that is isn't seen too often. The whole image consists of lines (all of the same thickness) and these lines make up small images and by grouping all of the images tightly together it creates a kind of plane. This plane seems fairly flat and continuous, that is because of the use of a single color and the even spread of white space across it.
http://www.toucouleur.fr/
There seems to be point line and plane everywhere you look in this site. The main elements are the lines that meander across the page. By using multiples of this red line that all follow the same path it creates a plane, but when you think about it it's still only a grouping of lines. The images in the background on both the left and the right of the page use both points and lines to create a delicate texture that kind of fades into the background. I also like how the site title 'toucouleur' uses lines and planes as well and helps unify the whole site.

Motion
http://www.youtube.com/watch?v=u46eaeAfeqw
I am a big stop motion fan, so for point, line and plane I chose a piece that was made for Minilogue. It is all done on a white board and concentrates a lot on the line. I like the idea of how lines can turn into planes and then into completely different planes and then maybe back into lines and then again into something completely different. This is a fun and interesting use of line in a motion piece.

RHYTHM AND BALANCE

Web
http://blogsolid.com/
I think this site has a lovely sense of rhythm and balance. The 3 repeated center boxes are the main focus on the page and act as a grounding point. The 3 swirly vine like things around the page give the site its natural and fluid feel while drawing your eye in to the boxes in the center. There is strong but subtle repetition in this site which gives it a very unified feeling. There;s the repetition of the 3 boxes which are all the same size and same layout, there's the 3 swirly things, the same speech bubble logo inside the boxes, and the logo for blogsolid is the same shape repeated 3 times and fitted together like a puzzle.
http://www.strawpollnow.com/
This site, which I'm not going to say a lot about, shows good use of balance in a page design. The page is framed by a horizon line along the bottom and has a strong defining site title at the top. The information on the page is organized into 3 columns, with the outer columns being the same size - creating an even balance for the columns.

Motion
http://www.youtube.com/watch?v=CLy0Cm8Pp_M
The is the opening title sequence for Hard Candy. I feel that this motion piece handles balance and rhythm very well. The rhythm is constant: smooth and clean and ties in with the dream-like music. The red square that we follow through the piece shows balance in each frame that it is in. Each time it stops, it works with the elements around it to create a perfect still image. White space and negative space is handled well and at no point does any element look out of place.

TEXTURE

Web
http://www.cameronmoll.com/portfolio/
I like the texture in this site a lot. It gives the site it's warm earthy traditional kind of feel. This is a site for graphic designer Cameron Moll and I believe it is effective at obtaining clients. It is soothing and inviting and reminds me of hand made paper and other traditional crafts. I believe that clients will like the feeling that this site gives them and will be more likely to choose this designer because of it.
http://bfish.free.fr/
This site is all about the texture. It is one big gray scale paint or ink stain that serves as the background to the site. From what I could tell by looking at the about section of this site (which is all in French) the site seems to be for some kind of artist or web designer. Textures say a lot about the site and so from the use of this paint splatter we should have already presumed that this is a site for some kind of artist. The use of black and white may suggest that he is old fashioned and the haphazard feeling the site conveys may say a lot about the artist as well.
http://www.kulturbanause.de/
I'm not going to go into detail on this site, I just really liked the cracked texture it uses and wanted to point it out.

Motion
http://mmbase.submarinechannel.com/titlesequences/video.jsp?video=32669
This is the title sequence for the film Lucio. The film is about a famous money and document forger, and so this motion piece uses a lot of paper textures in it. They are just simple paper textures, but they help set the movie's theme. A lot of the backgrounds are also magnified which provides an interesting composition and creates another different texture.

SCALE

Web
http://www.trinta.art.br/
I think this site shows use of scale very well. The huge number 30s contrast the much smaller type in the page. We can see especially in the lower laft that the large 30s are on the verge of being transformed into a design element that sinks into the background. I like this use of scale because it takes ordinary things like recognizable numbers and scales them up and uses them in a way that they would not normally be used.
http://cayena.es/
The scale in this site is obvious. Very large type is placed on an image of a cayenne pepper that is highly zoomed in so that the pepper appears huge. The type and the image work well together and provide a powerful opening image for the site. The site is effective at using small type as well which appears at the top of the page without distracting from the larger image.

Motion
http://www.youtube.com/watch?v=R1NnyE6DDnQ
I chose a coca cola commercial for my scale piece. Scale is obviously a large part of the commercial because it has the coke bottle portrayed as being huge, when we are used to it being much smaller. The interaction between all of the tiny characters and the large bottle is fun to watch and gives the viewer a whole new perspective on the product.

blog III

Rhythm and balance
This video I found I think shows a remarkable style of rhythm and balance. http://www.youtube.com/watch?v=A08HQP_SlOA
The way the paint explosions are conducted with the music and the way it just all sinks together is amazing.

Scale
This next site I thought was scaled well. The images are large enough that they stand out but yet they do not dominate the whole page. Every thing seems to have its space.
http://www.epitaph.com/


Texture
This site has many different textures that are very pleasing to the eye.
http://www.texturewarehouse.com/gallery/


Point and line
I feel this video I fond shows good point and line. The type starts and ends on the same plan and our eyes are always centered to the screen
http://www.youtube.com/watch?v=TOPJ90FRZHI

Motion & Web: Blog 3

Texture

Motion: http://www.youtube.com/watch?v=P5zfJXbrBUo&feature=related
- This is quite an amazing little short tying rhythm to texture movements. The textures grow/expand and contract. The creator is quite away of the use of space when moving the textures in and out of the scenes.

Web: http://www.juxtinteractive.com/
- Juxt's web site creates a common grunge texture and theme persistent through the design of their site. All of the elements tie very well together especially with some of the images they use as overlays or integrations with the textures they use.

Point, Line, Plane

Motion: http://www.youtube.com/watch?v=Be6jlCuMvVQ
- This particular music video contains many instances of point perspective and line movements to create a flow. In addition to these basic elements some use of planes as doorways to videos of the artist singing are used. This also contains good use of rhythm to tie the movements to the music.

Web: http://www.colorsmagazine.com/victims/
- While looking through the sites listed on the left recently I remembered Colors design for their name. When looking at the magazine's page again the recent volume on Victims has very nice use of line for dividing their main page about their current issue. The image placed in the background acts as a plane behind said lines to exemplify them from just basic lines.

Scale

Motion: http://www.youtube.com/watch?v=uG2tV-X5NiQ&feature=related
- This motion piece created in After Effects was inspired by Jackson Pollock's paintings. The emphasis on scale comes into play as we maneuver into the paint itself as if it was a living breathing entity.

Web: http://www.mountaindew.com/
Mt. Dew's site usually has interesting attempts to make unique web pages. While usually they are nothing that amazing I found that the types of scale they use for navigation in this current rendition interesting. Instead of standard links they scale the page to be housed partially underneath the main page or page options.

Rhythm and Balance

Motion: http://www.youtube.com/watch?v=F99IuKUCAc4
- In addition to great typography this music video by Mika also hold great rhythm and balance in the form of not only shape but color use. The rhythm of object, character and text movement coincides with the music seamlessly. The balance of color used during the different scenes of the music video is very nicely done because of the color choice of harmonious similar colors in most instances and throwing in a contrast or more neon color now and then to keep the piece lively and energetic.

Web: http://www.stylecraft.com.au/
- The website has a nice sense of balance. The design houses the images of the company’s creations on the left and balances it with the links and information on the right hand side. The two aspects feel as if they counter weigh each other.

blog #3 motion

Plot, Line, Plane:
Tetley "Red" Advertisement
http://motionographer.com/tetley-red/

This advertisement uses a different sort of line rather than just that of a drawn line. I thought it was very inventive to use the deep colored "lines" that come out of tea leaves as it diffuses into the water. They use it to draw out these "exotic" things that we think of when we think of Africa, such as giant trees and elephants, and it also helps give out the idea that the tea brews deeply, with much color and flavor, that these lines possess.

Rhythm, Balance:
Fleet Foxes Mykonos
http://vimeo.com/3089176

This music video uses cardboard pieces in order to create objects such as birds, etc, to help give a rhythm to the song that is played. Much of the pacing follows the soft drum beat in the background which helps keep with a certain pace to the video, along with it much of the shapes are repeated and often have a reflection which interacts with itself and help give a balance to its counterpart.

Scale:
Guinness Music Machine
http://www.youtube.com/watch?v=E63MgKAi8EE

This is an older commercial which portrays the begining of a guinness as a bunch of little men who turn out to be the head on a guiness. This uses scale well because at first you see the commercial as being a bunch of guys getting cannoned into drums and you wouldn't initially think guiness. The area around it uses the dark brown area and the guys are dressed in tan which represents the foam on the guinness. Soon though it scales out to normal size and you are revealed with the guiness being served.

Texture:
Dexter Intro Reel
http://www.youtube.com/watch?v=W_Nmek2IDfE

When I thought of texture in a motion piece, first thought was from Showtimes series Dexter, about a serial killer, who kills only other serial killers. The concept behind the opening credits in my opinion is brilliant, by using extreme close-ups on someones normal morning routine and using the texture, of eggs, squeezed grapefruit etc, create these wonderfully grotesque textures which mimic a less gruesome look of what could be left after a murder.

Shapes and Lines and Dots, Oh My!

Dot, Line, Point

www.psyop.tv/aero - Motion
I really love this company that we found in another class of mine the other day, they have amazing colors and use of shapes. This is a really good example of dots used to create a picture in motion. Really this piece I think is such a great gathering or texture, dots and rhythm, the way thing everything comes together.

http://www.tiptopland.com/ - Website
The use of line in this website is very nice, though sometimes the dots can be a bit distracting, I think the lines are very bold and eyecatching.


Rhythm and Balance

www.psyop.tv/nokia - Motion
The rhythm in this is really subtle but it really stuck with me when I watched it, the way the music flows and the people along with it and as it picks up in speed so does the rhythm in the motion.


http://rareformbranding.com/ - Website
I think this website has a really nice balance between the imagery and the text, it's not too overpowering but your eyes flow really nicely throughout and your eyes seem to fall exactly where they want you too.


Scale


www.psyop.tv/mtvhd - Motion
This is the first piece I saw with this company and it really made me fall in love with them, the way they use the scale of the objects to transition through to new settings was really fluid and done with such amazing skill, you focus in on the birds throughout the entire commercial which keep changing in size and scale.


http://www.kvarch.com/ - Website
The scale used to navigate throughout this website is really amazing and keeps the users attention, its a really nice way to show off your work I think.



Texture


www.psyop.tv/smithnephew- Motion
The texture used in this commercial is just really beautiful as they slowly create each character and where there movement is being focused on, how you can see the yellow path that follows each one, I love how fluid the texture is I think it really matches the feeling of the brand and commercial.

http://www.davebarnes.com/
- Website
I love the texture effect in this website, it gives off the look of cutouts and it all really compliments each other really well.

blog #3 websites

Plot, Line, Plane:
Website: http://acko.net/

Although this site is pretty standard set up with scroll downs to most recent news, the banner, and headlines use Plane and Line very well as well as color to create a depth of field. I found this site to various diagonals to create a sense of weighty 3 dimensional line. The navigation bar on terms of aesthetic as well as the entire site has a lot of appeal, and looks very slick.


Rhythm, Balance:

Website: http://music.vodafone.com/

This site I found to have incredible balance and interactivity. The most apparent balance and rhythm is from the color Using almost a muted color scheme but contrasting that with some brighter colors, and using very simplistic shapes which you can throw around and have them effect the other. Very fun little site.


Scale:
Website: http://www.designbyhumans.com

This is a pretty cool t-shirt company which sells shirts designed by people. First off though the way they place each page is very unique in the way you navigate through the pages which brings you to see each new shirt in the foreground someone wearing it and re-emphasis' it by placing the same image on the t-shirt in the background. Personally I thought the design of the pages in advertising the shirt was a very nice way to emphasize the "art" on the shirt whereas many other sites its very hard to tell whats even on the shirt.


Texture:
Website: http://www.happyingreenville.com/

This website I found to be a playful for St Francis Health. It used a light childish soundtrack but more importantly it told a story of a town in the way of using child-like drawings and simple pencil textures. I thought this was an incredible site by advertising a hospital which is usually associated with sickness, and trying to make it seem a lot less stressful by using this cheerful adaptation to help its patients.