Fifth Lecture: User Centered Design

What is User Centered Design?
User Centered Design (UCD) is a design philosophy and a process in which the needs, wants and limitations of end users of a product are given extensive attention at each stage of the design process (from: Wikipedia). It means the UCD is a process for designer to study and analyse user's needs for and problem solving on designing something that will fulfill and how likely the users will like the product.

What is Simplicity?
Simplicity is not simple.
Simplicity are something are other than simple but simple. It make something look simple but it has complicated means behind the simple-look cover. It has its quality of being simple that make it different than just simple. Just like some of the logo designs, may be it looks simple, but actually it has many meaning behind it. So, simplicity make things not simple but simple. It is not just simple or simplistic.

There is several Human Perception that will affects a human's likes.
And they are:
Chunking
In psycology, Chunking is a phenomenon whereby individuals group responses when performing a memory task (from: Wikipedia) The elements of perception + memory are equal to chunks. Presentation of information is simplified by dividing it up. Just like if there is a group of 26 alphabets that arranged randomly, it is most likely harder for us to memorize part of them. But when they are divided into groups, people will be easier to memorize them group by group. By dividing the elements, human are easier to memorize and recall.

Which do you think you can recall easier?

Contrast
Contrast is a difference in visual properties that makes something in an object occurs to be stand out better than other elements of the object. Most likely it often can be seen in photography or images. Contrast is irregularities in design that communicates information and makes elements stand out. These occurs mostly when we watching on an object that has complementary colors. Not just colors, some others elements like the size also can be contrast.

Flower in photography often use contrast technique to stand out the flower.

Visual Variables
Visual Variables are used for communication by encoding data and drawing distinctions between visual elements. There are 2 ways that visual variables work on perception, one of it is selectivity and another one is associativity.
Selectivity
It is degree to which a single value can be selected from the entire visual field. Which means from the entire part of an object, there will be a single part that will most attracting the user's attention. Mostly the selectivity used the position, size, orientation, hue, value, texture to perform and attract the attention at the certain part. Example like the picture shown, all the attraction will be focus on the eel that out of the net but not those eel in the net, that was because it is different than the others.

Associativity
Associativity is opposite of selectivity. It make easy to ignore the variable and let it all blend in to one another. Just like the whole object doesn't have anything that will constantly attract your attention but the whole object are look blending together and doesn't have any focusing part. Like the picture shown below, may be the colors are different but the object of all the picture are blend together and there does not say which of the picture are more likely attracted your attention because all of them are even.

There is some graphic design guidelines,
The design must have:
1. Simplicity but not simplistic
2. Good contrast
3. Good control of white space
4. Balance
5. Alignment

By, Yee Kuang Hooi.
Hiccarus Lesselion, 1102702258.

User Centered Design

What is SImplicity?
Simplicity is the state, quality, or an instance of being simple.

Huaman Perception
Chunking
A term reffering the process of taking individual units of information and group them into larger units.
Most common example of chinking are phone numbers.
It often a useful tool when memorizing large amounts of information.
By saperating disparate individual elements into larger blocks, information become easier to retain and recall.

Contrast
To show the unlikeness on comparison with something else. Differences along a visual dimension (size or color)
Contrast is irregularities in design that:-
-Communicates information
-Make elements stand out

Visual Variables
Visual Variables are used for communication by encoding data + drawing distinctions between elements.
Two ways that visual variable work on perception:-
-Selectivity
-Associativity

Selectivity

A person will select a single value out of the whole visual field.
Put it in simple way, on a visual field which part attract the viewer the most, using position, size, orientations, hue, value and texture.

Associativity

Assiociativity is opposite from selectivity, a picture/ photo apply assiociativity, meaning that the picture, subject, colour, position all blend together. Another definition is very hard to spot where the subject is...

Week 6 - User Centred Design

What is simplicity?
Simplicity is about do or show something simple but not simply, simplicity is also  something that easy to understand in contrast or something complicated. Simplicity is not something simple. For designer designing simplicity is a process of elimination and forces designer to have a good reason for everything because they have to explain how does the product works with the design. "If you cant explain it simply, you don't understand well enough" Albert Einstein

Chunking
Chunking is a type of memorizing, in psychology is phenomenon whereby individuals group responses when performing a memory task. The chunking is the combination of perception and memory. This method is to let people more easy to memorizing the subject.
For example,
4 3 3 4 9 6 5 9 3 5 7 5 7 3 7 5 8 6 7
433 496 593 575 375 867

Contrast
Contrast is a person or thing showing the differences when compared with another. Contrast is to make element stand out.The use of opposing elements, such as colors, forms, or lines, in a design an intensified the effect in a work of art. The difference in brightness between the light and dark areas of a picture, such as a photograph or video image.

Visual Variables
visual variables are used for communication by encoding date and drawing. There there are 2 ways that visual variables work on perception
-selectivity
-associativity

Selectivity
A good designer will select a better single value from the entire visual field. Visual field is to make it more attractive and get most attention from the audience by using position, size, orientation, hue, value and texture.

Associativity
Associativity is the opposite of selectivity.a picture with associate is a picture that blend image, object, colour and placement all together. In another words, the object is very hard to stand out.

User Centred Design

According to Wikipedia, User-centred design is a design philosophy and a process in which the needs, wants, and limitations of end users of a product are given extensive attention at each stage of the design process. A good design is not always satisfied customer because only customer know what they need and what they really want it. A design is a collaboration between designer and customer because designer is design for the customer so designer have to know and understand what the customer  need and what they really want with the design of the product.If the information from user is wrong,then the system will suffer. Designer have do more research of the information and different which is the correct or wrong information from the customer. Sometime designer will misunderstand the information from the customer,so one of the easiest way to prevent designer received wrong  information from customer is to have a good communication with customer.

Week 6: User Centre Design

Simplicity

Well for me simplicity can be either good or bad. For example, a designer is designing a logo, website, artwork and much more cannot apply simplicity in it, because design required simple not simply, the outcome of simply will be a bad design, but for simple design is a good design, "Simple but not Simply".

But simplicity fro designing also can be good as well, simplicity is a process of elimination, simplicity forces you to have a good reason for everything, "Simplicity is not Simple".

"If you cant explain it simply, you don't understand well enough" Albert Einstein

Chunking

Chunking is psychological term, in psychology, is a phenomenon whereby individual groups perform a memory task. Chunking also can be define as method of memorizing.

Example:

2 7 4 7 9 3 2 1 6 8 3 3 6 8 2 3 4 0 7 4 6

274 793 216 833 682 340 746 

Visual Variable: Selectivity

A person will select a single value out of the whole visual field.

Put it in simple way, on a visual field which part attract the viewer the most, using position, size, orientations, hue, value and texture.

Example:

Which part of the picture attract you the most?

Is it the sun that you see first?

Assiociativity

Assiociativity is opposite from selectivity, a picture/ photo apply assiociativity, meaning that the picture, subject, colour, position all blend together. Another definition is very hard to spot where the subject is...

Example:

Pattern

Can you find the cat in this picture?

Forth Lecture: Graphic Design

Now, we are learning about graphic design which has been taught by Mr. Radzi Bedu.
What is Graphic Design?

Graphic Design is defined as the art or profession of visual communication that combines images, words, and ideas to convey information to an audience. It can be work with drawn, painted, photographed or computer-generated images (pictures), but they also design the letter forms that make up various typefaces found in movie credits and TV ads; in books, magazines, and menus; and even a computer screen.

What is Graphic Design for?
Graphic Design is designed for visual communication and presentation.

The Graphic Design communicate with the audience with just the graphic in the form of picture, painting, photograph and so on. It also brings the meanings and message through the media to audience.

So, Graphic Design can be seen often in advertising and poster.

A great Graphic Design can successfully bring the message to audience even without their notices.

Normally, graphic design arranges info visually using typography and illustration in such a way that it successfully tasks the concept to visual look. Here some example of Graphic Design.\

By, Yee Kuang Hooi.

Hiccarus Lesselion, 1102702258.

Week 5: Graphic Design

First thing first, what is Graphic?
Graphic is a visual presentation art form on a surface, paper, canvas, computer screen and so on.
Example, drawing, photographs, line arts, typography and so on.

Now, what is graphic design?
Graphic design require a designer with a creative brain to create an art called graphic design. Graphic design can be a photograph, combination of graphic and typography, and most importantly they are mostly created by computer software.

A graphic design shows a lot of thing, "A picture worth a thousand words" yes its true. Through a graphic design contains emotions, feeling, story, message and much more. Designer create this graphic design mostly is for music album, movie poster and advertisement.

Example:

Graphic with Typo

Typography

Photograph with graphic

Pure Typography

Pure Graphic Design

by: Koh Soo Hong

      1102700466

Graphic Design

What Graphic Design mean ?

Graphic design which include text and illustration which are creatively compose together to create a art form. The whole field involve in Visual Communication that art or design communicate with client such as in the form of icon, symbol and index. Graphic Design also can bring the mean of designer communicate to a client or a product to communicate with a user through its visual design.

Every designer of a graphic art aim to their target audience and target market, to them their design are mainly attract to the own interest user and not overall user as now the market getting wider and wider.

Week 5- Graphic Design by Tai Qiu Xian

Graphic design is the art of visual communication that combines with picture, image, text and ideas to communicate message or information to an audience. A graphic designer is the one who manage all the arrangement and use element on different type of media. The common uses of graphic design include poster, magazine, newspaper, product package, website, photography,computer generate image, TV ads, menu, logo, typeface and T-shirt design. Graphic designer is to make thing look good and clearer and to make the produce more attractive.

Graphic design is a part of our daily life because that will always interact in our life such as newspaper and magazine. A good graphic design that should be communicate the idea or message very clean to the audience and the design does not make audience confuse. Even the design is just a picture, it able to bring out the idea to the audience.

Graphic design can show or explains the product behind of the story.For example, when we see the design, we understand the product that what the designer want to bring out just with some text and picture. Sometimes it can be either use image or text to represent a product to the audience. Graphic design brings image or text is look special or not ordinary that it will gets a lot of attention and great impression from the audience. Although an image can represent a thousand of words but sometime text can help audience more understand the design content.

A graphic designer should understands the material and target audience of the product. Some of the designer  will came out creative design is based on their experience and their research. There have a million type of the typeface in the world, designer have to choose suitable typeface for their product to make the product look special and attractive. Graphic designer is very important because they job is to change the world to more creative, colourful and much more interesting.

Some example of the graphic design

Week 4: Affordance

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. The term is used in a variety of fields: perceptual psychology, cognitive psychology, environmental psychology, industrial design, human-computer interaction (HCI), interaction design, instructional design and artificial intelligence. wikipedia definition http://en.wikipedia.org/wiki/Affordance


Basically affordance is a visual perception  of an individual, and this visual perception trigger an individual to perform an expected action. For example,  button of numbers of a calculator, hammer, a bag and more, these tools need not any instruction for user to read or understand in order to use the tool. The direction of understanding its function of a tool, is very straight forward/ direct perception and easy to use.

Affordance apply on variation of application, such as industrial design, human-computer interaction, interaction design and much more.
This is some example of simple yet useful and easy to understand tools:

Button of the calculator, especially the number, direct perception.

Hammer, a tool of holding and hitting.

Not all affordance are true/ function-able, it called false affordance, the best example is placebo button, basically is an useless button, you can push it but there are no effect/ outsome by pushing the button.

Affordance

What is Affordance ?
According to the dictionary (http://dictionary.reference.com) affordance bring the meaning of a visual clue to the function of an object. The properties of affordance are exist to the action capabilities of a particular actor. Example of affordance are door knot which we automatic will twist it or unlock the door, a chair is to let us seat on it and many more which affordance told us what we see there a clue/direct clue for user to know how does it function.


How affordance apply to robotic ?

Honda ASIMO Robot

This robot are program to resemble human being that able to walk in manner. "ASIMO" is a further evolved version of P3 in an endearing people-friendly size which enables it to actually perform tasks within the realm of a human living environment. It also walks in a smooth fashion which closely resembles that of a human being. The range of movement of its arms has been significantly increased and it can now be operated by a new portable controller for improved ease of operation. Robot now are apply with the sense of humour which will one day replace human as human vs robot.

Robot dogs know what to do with the ball is because it had been program by its programmer where when they saw a ball the know immediately how and what to do with the ball just like a baby which started to learn new stuff, parents teach them patiently and they finally know how to craw, stand and walk.

Everything are start from how it design and how we take it. Is either a easy way or a complicated way this is how an action capabilities to a particular actor.

Third Lecture: Affordance

Customer is the one will buy the products from the seller, so it is important to have customer for anyone who selling the product. Especially the bigger companies and industries, they need constant customer to support their own company or industry. And that's how it makes the customer's need become priority.

              Customer now are very intelligent and picky, they do not same like old time. They are more picky and have better expectation than the old time before. In the old time, most of the people doesn't care about what the product is made or either should they buy it. They will just buy it as long as they will use it. But now, customer request for more better quality of the product that could satisfy their needs. Customer's need are priority, and they are a King right now, every seller have to make something that could satisfy their needs and expectation only they will buy it, they are always right and never bargains. Every company have to follow the needs of the customer to make the product that would satisfy their need, this has made that many products has produced in better quality and could fulfill customer needs.

              Affordance is a quality of an object, or an environment, which allows an individual to perform an action. According to the psychologist J.J. Gibson, affordance refers to the qualities of the physical  world that suggest the possibily of interaction relative to the ability of an actor (person or animal) to interact.The term has further evolved for use in the context of HCI as indicating the easy discoverability of possible actions (from wikipedia).

              For example, people will turning a knob, sitting on chair, hold pencil, turn switched so others. These are the normal reaction when a person was react or interact with certain item. It is happening unconsciously, people will automatically turning a knob but not hitting it, sitting on a chair but not turning it and holding a pencil but not to sit on it.

Isn't it will be weird when you are thinking to sit on a bomb?

              

               Affordance is example like a branch, the affordance of branch as "a nice place to sit" depends on the quality and material made of the branch and the capability of the actor. The point of affordance is have different design but still can function normally when a person or actor was interacting with it, which is the actor can still know how to use a product even there is no any instruction given or guide. Just like door knob, originally people use round door knob to turn it to open the door. But someone change it into a handle, but people still know how to react with the handle and open the door and it has make some people who might have difficulty to use it more easily. So, that is a good example of Affordance. Other than door knob, there is others object have good affordance design too.

Handle type 

Door Knob

Even there is different type of electric switches, but we still know how to interact with it in proper way.
This is a good affordance design which can satisfy the customer on design and 
do not change the goal of the actor change. 

              Besides the Affordance, there is a perceived affordance. It refers to perceived properties of the object that suggest you how to use it. They suggesting to customer how to use their product properly. The Perceived Affordance consist of 4 elements which is context, culture, instinct and mental models. 

              Lastly, why must we have affordances in design? This is because it helps to guide the user how to use your product and do not make your customer frustrated when they are confusing on using your product. When the things can explain itself, it has a good affordance. The most important is persuasive technologies, persuading the user to buy your product. You must have a good persuasion to attract your customer to buy your product in the design. A good affordance of product could have a good persuasion on customer, because it gives the reason for a customer to buy them.

by: Yee Kuang Hooi
Hiccarus Lesslion. 1102702258 

Week 4 - Affordance By Tai Qiu Xian

Customer is the one who buy product or demand a product from another person or a company. Customer is the king nowadays and they are always right, they buy a product or demand that they are needed from a company. They have so many choices, so supplier have to promote the product to the customer to let customer know what produce is suitable for them.  We can never bargain with the customer because only customers know what they need and what makes them feel comfortable when they use the product.

Sometimes customer demand something from a company, they need to go through some procedure such as design department, programming department, business department and several departments.

The picture above is show about customers ask or need something from the company but end up they received something totally different if his needs are not clearly state. This is a time consuming process but it is better than delivering a completely different thing.

An affordance is a quality of an object, or an environment, which allows an individual to perform an action. For example knobs are for turning, balls are for throwing or bouncing and chairs are for sitting on. The affordance of a branch as “a nice place to sit “depend on the qualities of the branch such as the shape and the material of the product. Besides that, it also depends on the capabilities of the person and actor such as the size of the body.

The properties of affordance is when a product or a design with no instruction but the user still know how to use it very well without thinking of it, for example the button is design to click, the door knots  is design to grip and turn to open it. Rubber handle fits on doorknob to allow easier opening by people with gripping difficulties. A good door knots is have to be suitable the shape of the hand and the average height of the arm.

Why we should have affordance in design, it is because affordance in design is like a guide users, when a design without affordance user will be very confuse and it is very difficult to use.

In conclusion, a good design requires affordance and persuasion, when a design is with good affordance the design itself will persuade the customer  without any outer source and the customer themselves will persuade others to get the same product.

Problem between human and computer

Human
 Human, humane may refer to that which is, or shouldbe, characteristic of human beings. In thus describingcharacteristics, human may refer to good and bad traits of aperson alike (human kindness; human weakness). When emphasisis placed upon the latter, human is thought of as contrasted to divine: To err is human, to forgive divine. He was only human.Humane (the original spelling of human, and since 1700 restricted inmeaning) takes into account only the nobler or gentler aspects ofpeople and is often contrasted to their more ignoble or brutishaspect. A humane person is benevolent in treating fellow humansor helpless animals; the word once had also connotations ofcourtesy and refinement (hence, the application of humane tothose branches of learning intended to refine the mind).

Computer

1.	a.  digital computer analog computer See also hybrid computera device, usually electronic, that processes data according toa set of instructions. The digital computer stores data indiscrete units and performs arithmetical and logical operationsat very high speed. The analog computer has no memory and isslower than the digital computer but has a continuous ratherthan a discrete input. The hybrid computer combines some ofthe advantages of digital and analog computers
	b.  (as modifier): computer technology Related: cyber-
2.	a person who computes or calculates

(http://dictionary.reference.com)

Problem

When human first invent computer there always human control computer system but sooner technologies grow, computer have taken human daily life. Most of the heavy work are being taken place by computer and it help faster the produce of product to over come the growing of human and their needs.

But sadly, computer also will breaks down like human and it also infect human health when ones pay more time on sitting in front of a computer for long hours. Can't blame the computers because of technologies keep bring up and always have new and fresh item on market now a day