Week 5 - by Alice Low Soo Ying

What is Graphic Design?

Good design makes a difference in our world. Whether it’s communicating a social ideal, helping a business attract clients, motivating people to join an organization, enabling citizens to vote for the candidate of their choice, or simply helping travelers find their way through a busy airport, good design means connection.

Graphic design is a creative process – most often involving a client and a designer and usually completed in conjunction with producers of form (i.e., printers, programmers, signmakers, etc.) – undertaken in order to convey a specific message (or messages) to a targeted audience. The term "graphic design" can also refer to a number of artistic and professional disciplines that focus on visual communication and presentation. The field as a whole is also often referred to as Visual Communication or Communication Design. Various methods are used to create and combine words, symbols, and images to create a visual representation of ideas and messages. A graphic designer may use typography, visual arts and page layout techniques to produce the final result. Graphic design often refers to both the process (designing) by which the communication is created and the products (designs) which are generated.

Common uses of graphic design include identity (logos and branding), web sites, publications (magazines, newspapers, and books), advertisements and product packaging. For example, a product package might include a logo or other artwork, organized text and pure design elements such as shapes and color which unify the piece. Composition is one of the most important features of graphic design, especially when using pre-existing materials or diverse elements.

Image-based design

Designers develop images to represent the ideas their clients want to communicate. Images can be incredibly powerful and compelling tools of communication, conveying not only information but also moods and emotions. People respond to images instinctively based on their personalities, associations, and previous experience. For example, you know that a chili pepper is hot, and this knowledge in combination with the image creates a visual pun.

Type-based design

In some cases, designers rely on words to convey a message, but they use words differently from the ways writers do. To designers, what the words look like is as important as their meaning. The visual forms, whether typography (communication designed by means of the printed word) or handmade lettering, perform many communication functions. They can arrest your attention on a poster, identify the product name on a package or a truck, and present running text as the typography in a book does. Designers are experts at presenting information in a visual form in print or on film, packaging, or signs.

Image and type

Designers often combine images and typography to communicate a client's message to an audience. They explore the creative possibilities presented by words (typography) and images (photography, illustration, and fine art). It is up to the designer not only to find or create appropriate letterforms and images but also to establish the best balance between them.

Symbols, logos and logotypes

Symbols and logos are special, highly condensed information forms or identifiers. Symbols are abstract representation of a particular idea or identity. The CBS “eye” and the active “television” are symbolic forms, which we learn to recognize as representing a particular concept or company. Logotypes are corporate identifications based on a special typographical word treatment. Some identifiers are hybrid, or combinations of symbol and logotype. In order to create these identifiers, the designer must have a clear vision of the corporation or idea to be represented and of the audience to which the message is directed.

Graphic design have the ability to publish anything that is written and there is a difference in layout, compared to that of the printed paper. Not only that, it also can help people to connect with their audience and reach their business goals.

Week 4 - by Tang Yook Meng

Creator of Affordances - James Jerome Gibson

The concept of an affordance was coined by the perceptual American psychologist, J.J. Gibson (1904-1979). Gibson defined an "affordance" as the quality of an object, or an environment, that allows an individual to perform an action. According to his theory, perception of the environment inevitably leads to some course of action. Affordances, or clues in the environment that indicate possibilities for action, are perceived in a direct, immediate way with no sensory processing. Examples include: buttons for pushing, knobs for turning, handles for pulling, levers for sliding, etc.

Gibson’s affordance is independent of the actor's ability to perceive it. A door can have the affordance of 'open-ability' (its affordance relative to the actor) but can be hidden, camouflaged or likewise (the information specifying its affordance are not available to the actor). On the other hand, when both the affordance (the door can be opened by the actor) and the information in the environment that specifies the affordance (the door is visible, has a handle etc.) are present, a state of direct perception is reached. The environment thus affords many potential actions to the active observer. For Gibson, the affordance resides outside the observer; it is in the environment, but only potentially, for it depends on the relationship between the environment and an active observer.

Gibson's Affordances

• Action possibilities in the environment in relation to the action capabilities of an actor
• Independent of the actor's experience, knowledge, culture, or ability to perceive
• Existence is binary - an affordance exists or it does not exist.
  

PERCEIVED AFFORDANCE

In design, designer care much more about what the user perceives than what is actually true, whether the user perceives that some action is possible.

· In product design, physical objects can be both real and perceived affordances, and the two need not be the same.

· In graphical, screen-based interfaces, all that the designer has available is control over perceived affordances.

The computer system, affords pointing, touching, looking, and clicking on every pixel of the display screen. Most of this affordance is of no value. Thus, if the display does not have a touch-sensitive screen, the screen still affords touching, but it has no result on the computer system.

However, the affordance still has impact: it is useful in multiple-person communication, and it helps aid the sale of screen-cleaning tissues and fluids. All screens afford touching: only some detect the touch and are capable of responding. But the affordance of touch-ability is the same in all cases. Touch sensitive screens often make their affordance visibly perceivable by displaying a cursor under the pointing spot. The cursor is not an affordance; it is visual feedback.

Consequently:

1. All design is persuasive.

2. Profitable to the client.

3. Persuasive technology is about persuading, although they aim to make more money.

4. The world needs persuasive technology.

http://www.jnd.org/dn.mss/affordances_and_design.

http://www.newworldencyclopedia.org/entry/J._J._Gibson#Affordances

http://www.interaction-design.org/encyclopedia/affordances.html

Week 4 - by Yau Fen Nie

AFFORDANCEs

"The customer is KING, King is always right, King never bargains."

Sometimes we have to decide : Affordance; Perceived Affordance; Forcing Function; Defaults; Implanting Behaviours; Persuasive Technology.

Affordance created by the psychologist J.J.Gibson, refers to the qualities of the physical world that suggest the possibility of interaction relative to the ability of an actor(person or animal) to interact. An affordance is a quality of an object, or an environment, which allows an individual to perform an action. Human affordances are perceivable potential actions that a person can do with an object. In terms of HCI, icons, folders, and buttons afford mouse-clicking, scrollbars afford sliding a button to view information off-screen, and drop-down menus show the user a list of options from which to choose. Similarly, pleasant sounds are used to indicate when a task has completed, signaling that the user may continue with the next step in a process. Examples of this are notifications of calendar events, new emails, and the completion of a file transfer.

The Point of affordances iss when affordances are taken advantage of, the user knows what to do just by looking; no picture, label, or instruction needed.

Affordances in GUI's :

-important concept

-buttons drawn as 3D shapes appear to "stick out" and afford pushing

-sliders and scroll bars afford dragging.

Refrences :

Lecture's notes

http://www.usabilityfirst.com/usability-methods/hci-design-approaches/

http://web.sfc.keio.ac.jp/~masanao/affordance/gibson.gif

Week 4 - by Lee Chen Yau

In week 4, lecturer teach us about affordance. From Wikipedia, an affordance is a quality of an object, or an environment, which allows an individual to perform an action. According to Norman (1988) an affordance is the design aspect of an object which suggest how the object should be used; a visual clue to its function and use.

Affordance Examples from Norman:
- Plates (on doors) are for pushing.
- Knobs are for turning.
- Slots are for inserting things into.
- Balls are for throwing or bouncing.
“When affordances are taken advantage of, the user knows what to do just by looking; no picture, label, or instruction needed.”


Nowadays there are a lot of design with intent means designing specific affordances and constraints to guide users. For example using forcing function- design a system so that the right behaviour must occur before the user can take the next step.

There are three types of forcing function: lock in, lock out and interlock.
Lock in: User cannot exit an operation until a certain condition is met.
Lock out: Makes starting some operations difficult.
Interlock: Combines elements of lock-ins and lock-outs.

Reference:
Lecturer's notes
http://en.wikipedia.org/wiki/Affordance
http://www.cs.cmu.edu/afs/cs/academic/class/15494-s08/lectures/affordances.pdf

Week 4 - by Alice Low Soo Ying

Lecture for this week is about affordance. Affordance is a term created by the perceptual psychologist J. J. Gibson to refer to the qualities of the physical world that suggest the possibility of interaction relative to the ability of an actor (person or animal) to interact. 

McGrenere and Ho presented three fundamental properties of an affordance as defined by Gibson:

• An affordance exists relative to the action capabilities of a particular actor.

• The existence of an affordance is independent of the actor’s ability to perceive it (emphasis added).

• An affordance does not change as the needs and goals of the actor change.

For example, the affordance of a branch as ‘a nice place to sit’ are dependent on:

• the qualities of the branch: how much weight it supports, how high of the ground it is.

• the capabilities of the actor: how much they weigh, ability to climb.

Based on the original definition and fundamental properties, affordance, in relation to interface design, relates more to (physical) input devices: mouse, keyboard, and stylus. When discussing the qualities of a graphical user interface, the preferred term is perceived affordance.

Perceived Affordance

• context: [where] the environment or process in which the element is displayed;

• culture: [society] the influence of societal ‘norms’ on the individual’s understanding and use of a object;

• instinct: [unconscious] an unconscious association, often linked to physical characteristics, for example, the size of an object in relation to the human form;

• mental model: [expectations] the user’s understanding and expectations of interaction with the object.

Forcing Functions

• Lock in: User cannot exit an operation until a certain condition is met.

• Lock out: Makes starting some operations difficult.

• Interlock: Combines elements of lock-ins and lock-outs.

In conclusion, affordances reflect the possible relationships among actors and objects: they are properties of the world. Designers can invent new real and perceived affordances, but they cannot so readily change established social conventions.

References:
http://www.motive.co.nz/glossary/perceived-affordance.php
http://architectures.danlockton.co.uk/category/forcing-functions/

Week 4 - by Leng Cheok Kuan

This week we learn about affordance. What is affordance? According to Wikipedia, An affordance is a quality of an object, or an environment, which allows an individual to perform an action. For example, a knob affords twisting, and perhaps pushing, while a cord affords pulling. Affordance is create by the psychologist J.J Gibson which refers to the qualities of the physical world that suggest the possibility of interaction relative to the ability of an actor ( person/animal) to interact.

Affordance in novel objects

How do you turn on shower?
How you know how to open?

The shower has its own structure, the layout and others.

Good Affordances:
Doors (knob- changing affordances)
- Shape of the door knob.

How do affordances apply to robotics?

- Robots must be able to deal with unfamiliar objects.
- Recognizing affordances can lead them to effective strategies
for interacting with objects.

Humans needs ways of instructing robots.
– Language for describing object interactions would be helpful.
– This is the language in which affordances are described

week 3 - by Leng Cheok Kuan

This week lecture talk about the problem of HCI and context of human and computer.
Human of information processing is about memory, perception, motor skills and problem solving. Other than that, language, communication and interaction are the aspects of language which are syntax, pragmatics, body language and others. The ergonomics, health, furniture, lighting, design for disabled are the relationship to environment. Hardware, software are the input and output devices. The basic software is architecture and technique for interacting with human and interaction style.

Expressive Interfaces
The expressive interface is color, icons, sound, graphical element + animation to make interface appealing. For example, building a relationship between the user and machine , to making it more natural and human-like.

Error Messages

“The application world has unexpectedly quit due to a type 2 error.”
Why not instead:
“The application has expectedly quit due to poor coding in the operating system”
The second error message is feeling like friendlier.

Supporting Anthropomorphism

Reeves and Naas (1996) found that computers that _atter + praise
users in education software program have positive impacts.

“Your question makes an important and useful distinction. Great job!”

Students were more willing to continue with exercises with this kind of feedback.