08 Five Essential Principles of Interaction Design

Reading list
• Lynda.com. 2015. Interaction Design Fundamentals with David Hogue

· Consistency


It goes unnoticed in both behavior and appearance for users.  Designers have to make sure elements (button, tap, icon) of a website or a app are the same, to create visual harmony(colour, layout), and in user behavior, to keep the flow of whole system(navigation, menu, layer, information architecture) is logical.

Example: Pinterest

When a user finds a picture that he likes, he can click it. Then this picture will appear on a new layer on the original web page without other pictures.

Clicking black area to go back main page.He can find relevant picture on the new layer by scrolling down, and click new picture. Again, clicking black area to go back main page.

· Perceivability


Operation that people have already known in real world. Extract from physical objects, not only visually, but also acoustically and tactilely.

Example: Instagram


Camera, More, Like, Comment and share button are extracted from daily life. User can understand these button quickly and easily (multiple sense).

· Learnability


User could learn and remember by interacting only few times. Basically, people are able to transfer what they’ve learnt quickly and easily.

Example: OS pages/numbers/keynote

Because of same operation interface of pages, numbers and keynotes, user can
easily set up their work.


· Predicatability


Accurate expectations about what will happen before the interaction has occurred.

Example: IOS photoPredictability.PNG

Showing the consequence of this behavior, so that user can decide carefully. And bold blue “cancel” can reduce the rate of wrong operation.
P.S I think this example can also present Perceivability, since people regards red as a warning.

· Feedback


Figure out condition but not interrupt user experience.

Bad Example: AmazonFeedback

It will not remind user’s mistakes until clicking Create your Amazon account, which is a late feedback to user.

Good Example: Argos
Feedback 2

Argos gives a good example because of proper warning. When finish typing, it will show whether user make mistake or not.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s