Thursday, November 11, 2010

An affordance ?

I researched something about object that teacher ask us.
and then I've got some idea between person to object.
this is called an affordance..

An affordance is a quality of an object, or an environment, that allows an individual to perform an action

"action possibilities"

“Affordance” is a term used by perceptual psychologists. Affordance is what an object suggests to us. For example, if you see a bench, you might think to sit down on it, or to lie down on it. Some doors have a panel on once side, and a handle on the other. If you see the panel, you think to push it. If you see the handle, you think to pull it. Perceptual psychologists use the phrase “object affordance” to talk about how objects make us think to use them. Perceptual psychologists ask, “What is it about this object that makes people want to use it this way?” The object must talk to us with some sort of language. If we can understand this language, then we can make tools that tell us how to use them!

These pictures are an example of affordance in our life.


toilet roll allows us to put some pens.

two same shape of tables make me to put together like to see one table.

In any places I can find the hole and some people put their cigarette on it.


And someone throw cigarette on the street that effect to people to put cigarette to be seen as a line.







affordance allows us to look at something and intuitively understand how to interact with it.For example,when we see a small button next to a door, we know we should push it with a finger. Convention tells us it will make a sound, notifying the homeowner that someone is at the door. This concept transfers to the virtual environment: when we see a 3D-shaped button on a web page, we understand that we are supposed to “push” it with a mouse-click.




Examples of Perceived Affordance in Website Buttons:



In order to visually communicate that a button is clickable and will enable the site visitor to take action, it is necessary to use design to visually separate, distinguish and illuminate a function. As demonstrated above, Amazon.com uses many design elements to generate high perceived
affordance of their Add to Shopping Cart button,





including use of: Strongly contrasting yellow button color Only use of that yellow color on the page Heavy outline border around button Round strongly contrasting icon of shopping basket Text in button Add to Shopping Cart Larger font for button text Elongated shape, round on left side, squared on right side Gradient fill in top of button to visually mimic 3-D shape Dark blue background color for surrounding box





Another example is eBay, which creates a high perceived affordance of the Buy It Now button. For eBay, the Buy It Now button uses multiple design elements to effectively communicate perceived affordance:
















Strongly contrasting blue button color Only use of that blue button color on the page Largest sized button on page Text in button the Buy It Now Larger font for button text Strong contrasting colors, white text on blue background Dark gray background color for surrounding box











No comments:

Post a Comment