ART 320: Design for New Media

Thursday, October 06, 2005

Reading 4-due Oct 11th

Language of Vision, Ellen Lupton
Street Signs and Breadcrumbs, Steve Krug and Roger Black

BRING BOTH READINGS PRINTED OUT TO CLASS AND BE PREPARED TO DISCUSS YOUR BLOG RESPONSES WITH THE CLASS-CONSIDER PRINTING THEM OUT AS WELL.

Language of Vision
Bring in an image that you feel exemplifies what Lupton refers to as “perception at the expense of interpretation.” Be prepared to discuss your reasons for bringing this particular image to class.

Street Signs and Bread Crumbs
Select a website that you use to find information and/or make a purchase. Discuss how the site design either aids in its usability or impedes on it based on:
-Primary navigation
-Lower level navigation
-Utilities
-Visual hierarchy of the page
-Breadcrumbs
-choice of appropriate color
-overall page layout
-choice of images

What is successful? What could be improved?
Be prepared to show your site to the class and discuss its features.

12 Comments:

At 4:54 PM, Anonymous Anonymous said...

1-An example of an image that illustrates “perception at the expense of interpretation” is the sign for drinking fountain which depicts the face over the top of a stream of water. People who have no idea what this sign means may think that it is a face washer, or something to that effect. The stream of water coming out doesn’t particularly look like how the water looks in a real fountain, so that is probably one of the main reasons that this image could be misinterpreted by some.

2-A sight that I and many others use to buy things is E-Bay. This site has to be well organized since so many people utilize it for whatever their various needs may be. The primary navigation is easily visible at the top of the page (buy, sell, My E-bay, etc), and there are categories on the standard left-side of the page. There is also a search box at the top of the page, which addresses the needs of “search-dominant users”. The utilities are easily seen at the top of the page, and as one navigates through the site, “breadcrumbs” are visible above each page’s title area, which doubly reinforces letting us know where we are in the site. As one browses each category, local navigational tools are found which drastically narrow down each subject several times. This is very helpful to those who don’t just go right for the “search box”, and may have a vague idea of what they are searching for, but may just want to peruse a certain category. The pages are easily navigatable overall, and the use of images only seems to aid the information provided. It is a well organized sight, and even someone who is web-illiterate could find their way through it.

 
At 6:46 PM, Anonymous Anonymous said...

A website that I use to find information and purchase is the Apple website. Ever since I thought of buying a mac, I did research on this website and looked up prices and what-not. The tabs at the top of the webpage are used to navagate your way through the site. It also has a search option located near the bottom of the page. The tabs at the top of the page along with the subtitles under the tabs are the utilities that help make it easier to make your way around the website. The visual hierarchy of the page is the Apple logo located throughout the website. It can be seen on every page and it becomes recognizable in this way. Breadcrumbs are delt with with the option to view your cart if you plan on buying anything at any time and also if you are searching for something there is a way to get back to the list. The tabs on the top of the site also offer a way to get back to where you want to be just by taking you to the different areas within the site. The color scheme is very plain and clean just like the Apple image. When we think mac we think: sleek, smooth, clean, powerful, and sometimes fun. The website offers this look with the color pallet and the way it is designed. Colors begin to be introduced when newer products such as the new colored ipods come into the picture. As for the images offered on the site, Apple offers images of all their products they sell including the off-brands. They also offer visual tours of their products to get a look at what you plan on purchasing. I think this is one of the most successful things this site has to offer along with a help in chosing what is right for you. I really don't think much of anything needs to be improved on this site.

 
At 7:41 PM, Anonymous Anonymous said...

tag

 
At 8:12 PM, Anonymous Anonymous said...

picture

"perception at the expense of interpretation"

Without knowing the title, and without interpreting the format and symbolism, one would may perceive this image as a busy coffee shop. By knowing the title is "The Wait", however, one may interpret the image as a feeling of everything revolving around time, around a point in time that you are waiting for.

I find most of my information on Google.
The primary navigation is simple, type in what you want to search for, and search in the specific area (news, images, web...etc).

The secondary navigation isn't as helpful though. In order to find what you actually want, it can take a very long time. Most people do not know how to properly search, like using quotes to find more specific results, and can therefore spend hours looking at every page google provides.

Although I have no used the utilities much on the home page, it seems that Google has efficient utilities. The only two i use, would be the web and images search options. If someone were searching for news articles, however, it is efficient to have the news utility available. Also helpful, are the preferences and language utilities, allowing the user to determine what language to search in, and what pages will result in that language.

Visual hierarcy I will base on the search results page. To have the sponsored links available at the top of the page is good, however, most of the time i find my search does not involve them. Secondly, to have more listed on the right seems illogical, considering I tend to ignore them. Most of these tend to be purchasing options, and when searching Google I don't usually want to purchase something. Therefore, instead of having these available to everyone, there should be an option. If I am doing research and want factual information as opposed to blogs and fan sites, the factual sites should be listed on the right, instead of purchasing options.

The only breadcrumb that I recognized was the fact that the word you are searching still appears in the search box, so that if you want to modify it, you don't repeat yourself. It also shows the history of your recent searches. When using the images search option, though, the images will have a web address associated with it, and when you click the image, it will bring you to that site. At the top of the page, the google images logo will be present, informing you that you started there, that this was the image you found, and the page is where the image is located. You can also see the full size image, and the site that the original context is on, is linked.

Google isn't very colorful, but it isn't designed for that. It's not distracting, and there isn't too much to get confused by. It's straight forward.

Page layout is good. Again, this depends on how well you are at online researching. The page results are organized the best they can be according to your search terminology. What I like most about the layout is the option to change your search at the beginning and end of the page, to avoid scrolling back to the top of the page.

There are no images when using the web search option. When you search for images, however, the images appear. This is very helpful, considering people name their images in ways significant to them, and not to you. Something you search for as an image may be named something that you are searching, but is not what you want.

 
At 9:11 PM, Anonymous Anonymous said...

Language of Vision
"Perception at the expense of interpretation."
The image shows a white square inside a bigger black square. If viewed without any context, people could interpret this as a black empty frame, or white tile on a black background, etc. However, when we see the sign on tape recorder for example, we will then perceive it as a stop button.


Street Signs and Bread Crumbs
I chose the Target website for the discussion.
The primary level navigation is well-organized. The design follows the basic web convention with the shop ID located on the top left corner, a horizontal navigational bar located just right below it with the different sections in form of a rollover button and the subsection as a dropdown menu that appears only when you rollover the button of a section. It has a search function that can easily be found as it is located strategically below the target logo and right below the horizontal navigational bar.
The only thing that is probably different was the vertical local navigational bar located on the left hand side of the page.
The first part of the bar was the highlight of the week instead of the local navigational bar which at first I found slightly confusing but later on come to realize that the main page was pretty long and having the local navigational bar not right after the search engine was probably a good choice.
On the bottom of the page they have different sections of service links.
The page content section was divided into different subsections. They have quite a number of advertisements which can be quite distracting. I also think that the information are actually very well-organized, but the different kind of browsing option they give the visitors can be redundant and even overwhelming at times.

The lower level navigation was similarly organized. The header and the footer of the page were consistent so we know that we are still on Target website. The local navigational bar, however, is now showing the navigation that that current level.

The utilities are listed on the top right corner of the page (shopping cart, my account, help). Below that was another group of utilities such as the gift registries, gift card, wish list, etc. I think this is a great solution to the problem of having more than 5 utilities.

Target website has 2 different kinds of breadcrumbs. The first one was the hierarchical breadcrumb. The other one only appears when we are viewing a particular item in a section called ‘Recently Viewed Items’ showing us the picture and the link (a.k.a the name of the item) to the items we viewed previously.

The color used in the website is very appropriate. It uses a lot of red just like the logo color, especially on parts to be emphasized and it is accompanied by a more subdued grey.

The layout was well organized, clean and simple. Things that belong together are grouped together in their own section, inside a rounded-corner square box. Almost every subsection has their own subtitle, appropriately emphasized.

In the content section, Target uses a lot of images as a visual indicator which was very effective to reduce the impression of being such a wordy website, especially when everything in the navigational bar is text.

 
At 9:59 PM, Anonymous Anonymous said...

I have to agree with "the real chris". He has said everything I wanted to say about Google. Hopefully this won't sound like too much of a repeat. Google is the first search engine that I go to when I have any doubts about facts or if I need to find a good list of materials etc. As soon as one opens the page www.google.com, he is greeted with a fairly good sized google logo that changes with the season or holiday to give it some character. The rest of the page, however, is incredibly crisp, clear, and centered leaving the viewer with no question on where to start. Each method of searching comes with a definition just incase there may be minor confusion. The page opens and begins the user on a web search where one can type in any inquiry. But there are also other options such as Images, where one can look up strictly images, Groups, where its blog like quality enlist simple inquiries on any topic one can think of, News, where one would find information ranging from local to global, Froogle, where one can easliy shop, and much more. These are all methods of primary navigation. The color choices are easy to understand as they allow the user to know whether they have clicked on a link, introducing this as the lower level of navigation. Once a topic has been established in say, the web search engine, all of the link options that appear below are the heirarchical methods, which make up the page layout, it depends on how broad of a topic the user chooses to determine how many related links may appear. The utilities remain at the bottom of the page once a search has been initiated with such links as "About Google", "Search Tips", and "Dissatisfied? Help us improve". These are usually the last things users would inquire about, therefore justifying the placement at the bottom after a search has been initiated. The breadcrumbs are unique, because under the last link for that particular page the word "google" is there with a variant of "o's". These "o's" determine how many pages of links the user conjured up for his or her topic. I agree with chris that when the "o's" are clicked on, they remain the same color, thus making it difficult to know which pages have been visited.

 
At 11:02 PM, Anonymous Anonymous said...

One of the main websites that many of my friends and I use for online shopping is Zappos. The reason is because of how straight forward the main page is when you want to search for any specific Item. An example of this would be if you want to search for boots you have the option of typing in any brand, style, or color to find a variety of options left for you. The style of the site can first be percieved as loud, but that is only because there is so much colorful text only to pursuade the viewer to purchase more. The background color is white and the only actual graphics are shoes and bags in full color. There are no human beings in it to distract the viewer from main purpose of the site. The top of the main page of the site lists categories such as shoes, handbags, mens, womens, brands, on sale, kids. This is the primary navigation of the site and it is found at the top of each page of the site during navigation. This is very blatent, yet on the home page the categories begin to be separated because of how many different options that they are offering. This is why the site is unique, because there are so many different ways of finding more styles and brands on each page. There way of dealing with breadcrumbs is by separating there main navigational categories out on the bottom and top of each page, and at the end of a selection more categories pertaning specifically to the prior selection are listed. This can be helpful because then people dont have to keep going back to the main page to chose another category or brand. This is a simple navigational system that I can see is helpful.

 
At 11:04 PM, Anonymous Anonymous said...

One of the main websites that many of my friends and I use for online shopping is Zappos. The reason is because of how straight forward the main page is when you want to search for any specific Item. An example of this would be if you want to search for boots you have the option of typing in any brand, style, or color to find a variety of options left for you. The style of the site can first be percieved as loud, but that is only because there is so much colorful text only to pursuade the viewer to purchase more. The background color is white and the only actual graphics are shoes and bags in full color. There are no human beings in it to distract the viewer from main purpose of the site. The top of the main page of the site lists categories such as shoes, handbags, mens, womens, brands, on sale, kids. This is the primary navigation of the site and it is found at the top of each page of the site during navigation. This is very blatent, yet on the home page the categories begin to be separated because of how many different options that they are offering. This is why the site is unique, because there are so many different ways of finding more styles and brands on each page. There way of dealing with breadcrumbs is by separating there main navigational categories out on the bottom and top of each page, and at the end of a selection more categories pertaning specifically to the prior selection are listed. This can be helpful because then people dont have to keep going back to the main page to chose another category or brand. This is a simple navigational system that I can see is helpful.

 
At 7:21 AM, Anonymous Anonymous said...

I chose comedycentral.com for my website to find information about new comics, tv show schedules, and any humerous memorbilia. The primary navigation is well located, toward the top of the page in a bold impact print with a list of what the website has to offer. The tv schedule is right at the top of the homepage for the nights shows so a viewer wouldn't have to search for a schedule, its right there. There is not much of a visual hierarchy in this web site. Mostly everything is relatively the same size and bright color. The bright colors are appropriate for this website since it is a humorus tv station/website, the colors add a funny playful vibe. The overall page layout is well spaced and balanced with many images spread evenly throughout the page. The images are of shows and famous comedians on the tv station pretty much. The page gets the point across of what it represents and what kind of personality it holds which is very successful, but the hierarchy could be improved by change in scale and color, and less clutter of too many images and advertisments.

 
At 7:32 AM, Anonymous Anonymous said...

1)Lupton refers to interpretation as images which can speak differently, to people in different cultures, times, or places (understood more or less clearly, or even have various meanings). She refers to "perception" as images which can be percieved and understood by a wide range of people in different time, spaces, and cultures. This reminds me of our readings about universal symbols, becaause they are meant to be understood by the masses.

I was going to bring one of the symbols that we learned about last week, but I wanted to come up with something different. I have two images because I could not decide, and I'm really not sure if eitehr one is a good example. One is the peace sign. As far as I know this symbol is universally understood by many people in different places over time. I also brought in a picture of Mickey Mouse, because I know he is on eof the most recognized figures through out the world in the 20th century.

I don't know if these are right because they might not have been understood before the 20th century though?

2) The website that I use the most, ( besides the usual search engines like google, or UB websites) is IMDB.com, the internet movie database. I was reluctant to use this as an example because the author spoke about it, but he did not go into as much detail so I think it will be okay.

The Primary Navigation is excellent. The page begins with clearly stated Logos, and a search box as the first thing you see in the top left corner. The main Page changes and offers different movie news, trailers, and links every day. Tabs reside at the top of the page in order to direct you into the most important sections.
Lower-level Navigation includes a PLETHORA of information depending on which page you are on, and provides up to 30 or more links that relate to what your looking for.
Utilities are easy to see, organized, and presented in the style that they should be underneath the main tabs.
The Visual Heirarchy is great. You can easily tell which sections are most important or popular.
I actually think Breadcrumbs is the one aspect that is missing from this sight, and based on one of the main function of IMDB, they would probably be extremely interesting and usueful. This page is often used to navigate between different contributors of various films. You can see who worked with who, what was that actors name you forgot, how many movies any of these people made. It is an endless cycle of links between movies and people, and lists are constantly presented so that you can come up with relationships. Breadcrumbs would be a great way to show you the path you've through all of those people/movies to find the information your looking for.
Appropriate color seems okay. The site is decorated in blue and yellow with "film" graphic borders. I think it's nice and plain but stlll bright enough to keep attention.
Overall, each page layout is very clear and offers more information in one place than I think i've ever seen. Almost every word or phrase is a link!
Choice of images is pretty fucntional because they are going to show you a movie cover or personal picture of whatever they are talking about. This is very useful and explanatory also. The only other images are ads, but they do not overwhelm the site like some others.

 
At 8:46 AM, Anonymous Anonymous said...

The website that i chose is ofoto. Compared to other photo websites that are available, i find this website to be the best and easiest one to use. The site is not very busy and makes it easy for anyone to set up an account and put their pictures on. Its also very easy to order your pictues also. When you sign onto your account there are tabs at the top to view certain options. It is very easy to choose which album you want to view by just clicking on the albums posted. Their are options to order or edit pictures in the albums and its made easy to back when you need to. When you click on a photo you can click right to the next or you can click on the link that brings you back to the whole album. I feel the colors are appropriate. It is a grey background with a white box in the middle. This white box has the albums and options on them. The options are yellow and orange so they easily stand out.

 
At 9:24 AM, Blogger Mr. Dubuque said...

The primary navigation of Tokyoplastic is to move you around a white background with just a single or multiple animated object on display which becomes your only button for you to click on. The diffenent levels of navi. are equiped equipped with 1 to 2 sub levels which makes it easier if you become lost to get back to the main page. But, to get back the main page there is a small figure that allows you to move backward. There many different utilites that go into depth on the different plastic toys and items that they sell. The Visual hierarchy is the japanesse main flag with becomes quite a effective icon for you to explore around, its mostly hidden at times but pops up here and again after clicking on certain buttons. The color is clear white background with mostly red, and black for the figures and items. The layout is unbelievable effective and memorizing at times with the incredible flash work. It's mostly just fun to watch all the crazy animation and play with them. There isn't really any images execpt for the toy part which is a link off from that page.

 

Post a Comment

<< Home