Week 6 | Human Perception & Simplicity

http://theeyecolour.com/

There are 3 Main Principle of Human Perception I learned in class.

• Chunking - the element of perception and memory. Simplify(divide) information for easy storage.
• Visual Variables- encoding data and drawing. 2 ways, selectivity and associativity.
• Gestalt Principles of Grouping - proximity, similarity, continuity, closure, area, symmetry.

http://lssacademy.com/2009/04/28/simplicity/

Simplicity

It is minimizing a design, which involves elimination. Simplicity is the thing that I always do when I design. I find it much better than complex stuff. I normally do web designing, and I find that most of my clients loves my work, that are simple and minimal. Simplicity is simply beauty in my opinion. 

Graphic design guidelines
Simplicity, Contrast, Alignment, Balance, White space. (Not only do I learn this in Interaction Studies class, but I also learn this in Visual Communication Class and also Computer Graphics class) As a web designer, this guideline is an essential to me. Without it, my design would definitely suck. There are also some other things to consider in web design, like readability, accessibility and others.

http://www.experientia.com/blog/category/play/page/2/

UCD
Stands for User Centered System 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. User-centered design can be characterized as a multi-stage problem solving process that not only requires designers to analyze and foresee how users are likely to use a product, but also to test the validity of their assumptions with regards to user behaviour in real world tests with actual users."- Wikipedia

Difficulties of UCD
It does not always satisfy customers and it involves designers and customers. It can also involve in a misunderstanding.

Article can also be seen on my other blog : http://wanabrar.com/fcm/
Wan Mohd Abrar Bin Wan Mohd Sharif
1102700593

Week 5 | Graphic Design

http://www.sundewsolutions.com/services_webdesign_solutions_graphics_print_media_design.php

Graphic design is is something that got to do with typography, graphic and also communication that conveys meaning in the design of  graphics, logos, newsletters ,brochures, signs, posters, and any other type of visual communication. Symbols can also be called a graphic design.

http://www.flickr.com/photos/43441685@N04/

To get a better understanding of the basics of graphic design we have to know the basics by studying the element and principle of design, so that we can communicate with the one who views our artwork effectively. To have a meaning in an artwork is a must. The artwork has to communicate between the one who views it, or else our graphic design fails.

http://nkeo.deviantart.com/art/The-Dopeshow-74345123

Nowadays, artist depends on desktop publishing softwares like Adobe Photoshop, Illustrator, CorelDraw, Freehand and other software. This desktop publishing softwares provides the designer the essential tools for them to make all their graphics into what they desire. The meaning of graphic design can change over-time as more technology and innovation occurs.

Article can also be seen on my other blog http://wanabrar.com/fcm/
Wan Mohd Abrar Bin Wan Mohd Sharif
1102700593

15th november 2011 lecture

This week lecture was by Mr Radzi Bedu and mainly about Graphics Design


What is Graphics Designs?

Graphic design is a creative process, most often involving a client and a designer and usually completed in conjunction with producers of form of drawing, illustration, typefaces and painting. It's about communicating with others or targeted audiences. To deliver information or advertising. We as the graphics designers have to persuade the targeted audiences to accept your message or to set a trend, also to tell stories or history.

examples of graphics designs.

• photograph
• computer generated image
• typefaces
• movie credits
• computer screen
• TV ads
• gum wrappers
• billboard
• T-shirts
• magazines

Graphics designs informs, persuade, organize, stimulate, locates, identifies attract attention and provide pleasure.From ancient times, people use graphics design to communicate, just like Egyptian. they drawn every history of their pharaoh on the pyramid walls, to tell us their history and they do exist in this world.

Graphics design is something we need, or else how we going to communicate properly??


Raja Abdul Azim
1102702076

15th november 2011 lecture

This week Miss Edina invited Mr Radzi Bedu to gave us lecture about graphics designs.

What is Graphics Designs?

Graphics designs is an art of combining pictures, words, drawing together to communicate with others.
graphics design exist around us, for example photograph - computer - generated image (also in letter forms) - they also create various types of typefaces - found in movie credit - TV ads - magazines - computer screens - don't forget the humble gum wrapper - huge things like billboard - T-shirts - etc

Graphics design exist since the ancient times, animals or activities were drawn on the cave walls, to show their history, and develop from walls to different neon light billboard on the 21st century.

Graphics designs informs, persuade, organize, stimulate, locates, identifies attract attention and provide pleasure.

Anis Diyana
1102701461

15th November Lecture

The lecture this week was given by Mr Radzi Bedu, a VR lecturer invited by ous very own lecturer Miss Edina. The lecture covered topics and information on what graphic design is all about and how is it effective to the users.

Graphic design existed way long ago in the stone ages (2500BC) that was evidently shown by the drawings on the stone wall of caves. Pictures were the way cavemen communicated with eachother other than making silly noises. It was a way to tell their story and elaborate how they see things at that time. Up until now that form of drawings/ illustration and the ideology behind it has become an important role in the advertising industry.

For instance, if you want to sell something, amuse or persuade someone in a product, explaining a complicated system or demonstrating a process. In other words, you have a message you want to communicate. How do you send  it?

You could tell people one by one or broadcast by radio or loudspeaker which is verbal communication. But if you use any visual medium at all-if you make a poster, a business logo, a magazine ad, or an album cover or any printout, you are using a form of visual communication, that called graphic design.

Designers are the link between the client and the audience. A client is often too close to the message to understand a variety of ways in which it can be presented. 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).

The main responsibility of a designer's job is to present the information in a way that is both accessible and memorable that is the key of success.

Zul Fadzli Selamat

1101110580

Week 5 - 15th November

A lecture regarding Graphic Design by Mr. Radzi Bedu

Want it or not, graphic design is a part of our life. It happens to everyone and everyday.It is the art of combining image, pictures and communication.

Graphic design informs persuade, organizes, stimulate, locates, identify, attract attention and also provides pleasure. Now if you have all this, you will have a real successful graphic design. At times, you will have to do the contrast method in graphic designing. Putting something ugly in contrast in order to make the other thing look good. For instance, a fat girl and a slim girl, the fat girl will actually make the slim girl look better if they walk together as compared if the slim girl walks alone. When designing, we also must know our target audience, buy the right people and use the right method. It is all about identifying.

In the communication world, especially in advertising, there is a bridge that connects an attender with the receiver . Medium Communication. This medium must be clear in order the message is delivered successfully and right. Various ways are there for us to send message such as verbal communication (whisper, shout, announce), textual and others. Textual communication are often seen in posters, news, books, newspapers and others. Verbal communication often used in radios. Drawing, painting and illustration also works well with communication.

We should appreciate the forms of communication that exist and how we communicate nowadays. If wee look at the history, 2500BC, communication are mainly through sign language and body language only. Their history at design, everything only under one domain which means no graphic. They deal everything solely on communication. So compare what you have now and those people have back then.

Post by,

Muhammad Syahmi Abd Aziz

1102700197

November 7th 2011 Lecture

This week lecture is about 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.

for example 

• doors are for.....
• door knob are for ......
• windows are for .....

The perceived affordance an object (or interface element) is determined by factors including:context: the environment or process in which the element is displayed; culture: the influence of societal ‘norms’ on the individual’s understanding and use of a object; instinct: an unconscious association, often linked to phsical characteristics, for example, the size of an object in relation to the human form; mental model: the user’s understanding and expectations of interaction with the object.
Affordance Manipulation
To create something that cannot be avoid. like keyboard, without it, we can't use the computer.

Be a little bit clever or use the forcing function

• Lock in -  can't quit certain application until something is done.
• Lock out  - can't open certain application until certain action is taken to open it.
• Interlock - combine the element of Lock in and Lock out , most common forcing function mechanism.

Conclusion

• All design are persuasive
• profitable to client and profitable to the user.
• without user. your interface can't work

Raja Abdul Azim
1102702076

7th November 2011 Lecture

The first thing that lecturer talk about is about "customer always king".
always ask the user how to satisfy them because without them, your interface is nothing.

this week lecture is mainly about 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.

we must design to suit the user so that the user love to use our interface. we have to make sure that our interface can communicate well with our user. the user can understand the design and did not frustrate while try to get use to it.


The perceived affordance an object (or interface element) is determined by factors including:

• context: the environment or process in which the element is displayed;
• culture: the influence of societal ‘norms’ on the individual’s understanding and use of a object;
• instinct: an unconscious association, often linked to phsical characteristics, for example, the size of an object in relation to the human form;
• mental model: the user’s understanding and expectations of interaction with the object.

Affordance Manipulation
To create something that cannot be avoid. like keyboard, without it, we can't use the computer.

Forcing function

• Lock in
• Lock out
• Interlock

summary
All design are persuasive
profitable to client and profitable to the user.
without user. your interface can't work

Anis Diyana Ahmad
1102701461

Week 4 | Affordance

http://convevo.wordpress.com/2010/10/29/the-customer-is-king/

Customer Is The King!
The community is in charge. Why do we forget that? "From matching customers to products, we need to match products to customers" - Seth Godin. What do customers want? Customers experience, cost reduction and most probably revenue generation. The rise of the customer community as well as the shunt in the performance of those who organised the system has created customer power. The customers is now ahead of the business. Nowadays, customers are the one who lead the product, customers determines the direction of a product/services. The day the company takes control of a product is gone forever.

http://haneeninterior.blog.com/2010/02/01/affordance-of-the-space/

Affordance
In the world of design, the term "affordance" has taken on a life far beyond the original meaning. The original definition is as below :

"The word "affordance" was originally invented by the perceptual psychologist J. J. Gibson (1977, 1979) to refer to the actionable properties between
the world and an actor (a person or animal). To Gibson, affordances are a relationship. They are a part of nature: they do not have to be visible,
known, or desirable. Some affordances are yet to be discovered. Some are dangerous. I suspect that none of us know all the affordances of even
everyday objects." - jnd.org

We have to make a product to suits the user and the purpose is to suits the need and desires of our customer. A good affordance design of an object is that it is able to communicate with the user the way it is suppose to be.

Perceiving Affordance

Perceiving is another type of affordance. It is in which is based on  users and how they perceive the affordance to use the object. Some factors to determine it is base on, context, culture(society),  instinct and mental models.

Forcing Functions:

A forcing function is an aspect of a design that prevents the user from taking an action without consciously considering information relevant to that action. It forces conscious attention upon something ("bringing to conciousness") and thus deliberately disrupts the efficient or automatised performance of a task. - Interaction-Design.org

1. Lock in - can't quit certain application until something is done.
2. Lock out - can't open certain application until certain action is taken to open it. 
3. Interlock - combine the element of Lock in and Lock out , most common forcing function mechanism.

In conclusion we can conclude that all design is somehow related to affordance. Everything that is affordance can bring advantages to the community not only the customers but also the users. We might be a designer but remember that we are users too. And always remember that customer is the king!

Written by Wan Mohd Abrar Bin Wan Mohd Sharif (1102700593)

Week 4 - 7th November Lecture

This week's lecture was all about Affordance..

The concept of affordance is the quality of an object. it is something that makes one choose the object over a certain reason or purposes.

As a designer, in the context of creating and designing an object in the aspect of affordance, we should take into account what should be included in the product and how it is made to suit the user. We must design to satisfy people's need. A good affordance design of an object is that it is able to communicate with the user the way it is suppose to be. For example, as we look at it, we know the purpose of the object and how to use it. But an affordance of an object does not change, even if the user doesn't like it. it is the way it is!

Elements of perceived affordance;
take a mouse for instance*
1. Context - Where? ( A mouse is at a computer)
2. Culture - Society ( Something to do with computer, pointer )
3. Instinct - Unconscious act ( feel like grabbing it )
4. Mental Models - Expectations ( to control the screen )

Affordance Manipulation;
Ability to create something that the user can't avoid of using it. Eg, we must use a mouse in order to control a computer.

Forcing Functions;
1. Look-in - Can't quit certain application until something is done to it.
2. Look-out - Can't open certain application until certain action is taken before opening it.
3. Inter-lock - The combination of both Look-in and Look-out.

How do affordance apply to robot?
Affordance is applied on robots through how it is applied to our daily basis. it must be designed and made so that it can benefit our life, and in the same time it must be user friendly. Something that we can easily use, something that is not TOTALLY new to the user.

How does a robot dog know what to do with a ball?
This plays with both affordance of the robot dog and the affordance of the ball. A dog is designed so that it can recognize the structure and the properties of the ball. every robot has it's own "brain", so the elements of affordance in the robot dog will suit the robot's design so that it is able to perform action. on the other hand, the affordance of the ball must be designed and make it look like a ball. if a ball is designed with a different criteria and properties, the robot dog might not recognize it and treat it as something else and not a ball.

In conclusion, all design regarding affordance must be persuasive and able to function as expected. If the object produced is in line with affordance, then it will benefit the user and profit for the client.

Post by,
Muhammad Syahmi Abd Aziz
1102700197

Week 4 - Affordance

Affordance is a quality of an object, or an environment, that allows an individual to perform an action.It is believe that a broader view of affordances is needed which encompasses social and cultural aspects of our everyday life.

Points given by the lecturer’s slide are as below

• ·         Doors are for …………
• ·         Door knobs are for ……….
• ·         Windows are for …………..

The term affordance can also refer to the perceived and actual properties of the thing, primarily those fundamental properties that determine just how the thing could possibly be used. Affordances provide strong clues to the operations of things. Plates 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 without any picture, label, or instruction.

A forcing function is a constraint where the user "is forced" to complete a task based on a limited, paired down set of features or controls.

Forcing functions help streamline, simplify or minimize how a user interacts with a design. Designers benefit from this interaction design technique by reducing navigation redundancy, task effort and the complexity.

When should it be used?

When you want to: 

• Constrain a user interaction
• Speed up or re-direct a task
• Limit an interaction   
• Eliminate confusion
• Simplify a design
• Protect users from danger or hazards

One person's affordance is another's 'mess' (mindmaps) or one person's affordance (lists) is another person's uninformative and inflexible limit. Affordances are more than opportunities, they create new niches in the social ecology, which add opportunities and constraints, sometimes in surprising ways. Each new process and tool in a particular area of social interaction potentially interacts with, builds on, or displaces, the affordances which have been developed 'around' previous processes and tools.

“Customers are always king” mentioned by the lecturer which in meaning to the quotation is that customers are the ones to be satisfied and without the ‘kings’ the designer’s interlace can’t work.

Zul Fadzli Selamat

1101110580

1st November 2011 lecture

This is what i understand about 1st November lecture.

the problem is the connection between human being and interfaces, and problems between it.Designer try to create more human-like interface to make sure human being didn't frustrate when interact with it.

from what i understand from this lecture;

a few things are related from the topic,  such as the input and output, affective aspects of HCI (human computer interaction)

for example, 

the affective way to interact;

by using more natural and human-like color, icon, sounds and graphics elements.

don't use one word as an error message, such as ERROR, INVALID. it will cause human to frustrate.

Anis Diyana 

1102701461

Week 3 | User Based Interaction

Problems with HCI

There are a lot of problems when we are using a computer. One of the example could be when we are about to open a file and an error suddenly pops up. Showing the errors with some error codes does not solve the problem. This makes the user getting irritated and frustrated when using an interface. To solve this problem developers should actually link or tell us on how we can fix/prevent this error. Doing so will mostly make it easier for users to know and understand what they have done wrong. Telling us an error, doesn't really help. Giving us solutions to solve/fix the error is a good way to satisfy the user.

What to avoid in an error message :

1. Avoid using UPPERCASE letters.

2. Avoid using sound warning

3. Lastly, avoid using the word INVALID, FATAL, and BAD.

What should be included in an error message :

1. Solutions to solve the problem.

2. Message should not be vague and must be precise.

3. Message which tells the user that it is the computer's fault helps the user fell happy.

4. Provide context sensitive help

Affective User Interface

1. Simple - Simple is of course the best way to make an affective interface design. Simple design are easy to remember and easy to learn. Simple is pleasing to our eyes and makes our eyes relax while doing our work.

2. User-Controlled - The user, not the computer, initiates and controls all actions.

3. Clear - A clear interface makes information obvious and makes a user friendly interface.

4. Forgiving - Human makes mistakes, the interface should provide solutions/answers to the problem that the user has.

5. Consistent - A consistent interface allows users to apply previously learned knowledge to new tasks. Effective applications are both consistent within themselves and consistent with one another.

6. Direct - Users must see the visible cause-and-effect relationship between the actions they take and the objects on the screen. This allows users to feel that they are in charge of the computer's activities.

Done by : Wan Mohd Abrar Bin Wan Mohd Sharif
ID : 1102700593

1st november - Week 3

Today we were given a lecture on the problems with HCI, Interactivity of human with computer. 

The Problem

The means by which humans interact with computers continues to evolve rapidly. Human–computer interaction is affected by the forces shaping the nature of future computing. These forces include:

§  Decreasing hardware costs leading to larger memory and faster systems

§  Miniaturization of hardware leading to portability

§  Reduction in power requirements leading to portability

§  New display technologies leading to the packaging of computational devices in new forms

§  Specialized hardware leading to new functions

§  Increased development of network communication and distributed computing

§  Increasingly widespread use of computers, especially by people who are outside of the computing profession

§  Increasing innovation in input techniques (i.e., voice, pen), combined with lowering cost, leading to rapid computerization by people previously left out of the "computer revolution."

§  Wider social concerns leading to improved access to computers by currently disadvantaged groups

Attention to human-machine interaction is important, because poorly designed human-machine interfaces can lead to many unexpected problems but what is appropriate ?

Zul Fadzli Selamat

1101110580

Week 3 - 1st November Lecture

As what i understand from today's lecture, it is about ;
Problems with HCI, Interactivity of human with computer.

Problem is that mixing the human context with the computer context. now that;s is a problem due to human is classified as organic with emotions and others. On the other hand, computer falls under the electronic category which consist of datas.

so here are the things that are related to the topic that were lectured today,

1.Gimmicks that affect the usability of an interface;
people are usually prepared to put up with certain aspect of interface while they are visiting to some websites or doing some thing related to computers. one in a while or at first this can be interesting, but as time goes on, this can end up with irritation and frustration.

2. what people like and what people prefer;
problems usually came up with the interface when some people prefer a dialog box (for example) to be in the square form and some people prefer it to be rounded or shaped. So how to solve this problem? Survey had been done and  it turned out that most people prefer the square box are more preferred as it is more simple and easier to see.

3. avoid this in error messages;
-  Avoid using the word FATAL, INVALID, and BAD.
- Avoid using sound warning.
- Avoid using UPPERCASE

4. include this in error message;
- Message should be precise rather than vague
- Provide context sensitive help
- Be gentle in warnings and error, state that it's computer's fault. ( will make the user happy )

5. toys are made for motivation?
toys such as the pocket pokemon were designed to motivate the young children in some ways which i don't know how. but the deal here is that the toys are a interactive method of motivating and it is designed to replace the current method of  motivation, non interactive. this concept is a concept of Anthropomorphism (a human characteristic to inanimate objects used in HCI). which one is better? you choose, different people different perspective and preference.

6. Visual Characteristic ;
this is a special case as usually it gives the user to feel involved with the computers or the HCI objects. but at times it can also irritate the user.

-What user expects;
when something went wrong with your computer, which will you choose?
a. Now Mr.X , that's not right. You can do better than that. Try again
b. Incorrect. Try Again.

or when something is wrong with the computer

a. Sorry guys, there is some problem with this outdated web site, they just don't know technology well
b. internal server error

so which will be your choice? it is all about how we interact with the HCI objects and vice versa that makes something interesting or boring. Design the interactive well!

Post by;
Muhammad Syahmi Abd Aziz
1102700197