1. “People ignore design that ignores people.”
— Frank Chimero, Designer and Illustrator
STACKON SEMINAR SERIES
Kevin Mathew Sunny
Interaction Design Principles

2. 2
USER INTERFACE
/ˈjuːzə(r) ˌɪntə(r)ˈfeɪs/
the means by which the user
and a computer system
interact, in particular the use of
input devices and software.

3. 3
PUNCHED CARDS CLI GUI

4. AUGMENTED
REALITY

5. 5
“Most people make the mistake of thinking design is
what it looks like. People think it’s this veneer – that the
designers are handed this box and told, ‘Make it look
good!’ That’s not what we think the design is. It’s not
just what it looks like and feels like. The design is how it
works.”
STEVE JOBS

6. Create the content and functions of products that
are useful, easy to use, user-friendly, technically
feasible, and of commercial interest.
Basic Interaction Design Principles
IxD

7. CONSISTEN
T
MEANINGF
UL
SENSIBLE
MAKE THINGS VISIBLE
Relations between users intentions,
required actions and results.
REMIND
The user of what can be done and
how to do it.
The designer should be aware
of the users mental model.
Most of users are operating the
interface just based on their
instinct. In short, when they
encounter a button, they will
think this button will be
triggered to meet their needs.
But if this button get triggered in
some other operation rather
than user's expectation, it must
be a bad design.
MENTAL MODELS

8. The most basic principle of interaction design is to meet the user's needs. To determine the user’s
requirements is a product manager's basic work, there are many ways and tools to help us identify the
user's needs. For examples, observing user behavior, analyzing data, building user scenarios, and more.
MEET THE USERS NEEDS
When creating user experiences,
its not so much about doing what
users expect. Instead, its about
creating a design that clearly
meets their needs at the instant
they need it.

9. CONSISTENCY
It requires that within the
same or familiar functions and
scenes, to use the consistent
performance, operation, and
feeling in a (or a category)
product.

10. USE SIMPLE LANGUAGE
Users are not a designer or a
developer, most of them do not
understand the design concept and
development process, the language
and text of the product must be easy
to understand and very close to
general user's thoughts. However, we
need to think users are busy people
instead of not smart people. So we
have to optimize some functions for
middle-class users.

11. Correct operating parts
must stand out obviously
and can convey the correct
information to users. Also,
the user can operate the
interface based on his/her
life experience and instinct,
no extra learning.
INTUTIVE DESIGN

12. Provide feedback
The "communication" between people and machines is essentially
the process of information transmission. The process of
Information send out and get back will form an effective
interaction and mutual understanding. So the timely effective
feedback and explanation are particularly important.
Allow user making mistakes
When the user operates the interface, the mistakes that they
made must be allowed. Because this may not user's fault but a
design problem. And when the user is making a mistake, it should
provide effective information to guide him to the right operation
path. We need to avoid the error-prone situation, or check and
confirm the options before the actual action prompts to the user..

13. 13
Interaction design is "user-centered design", user
experience plays the most important role in it. To grasp
some interaction design foundation knowledge is
important, but the greatest part is to let the user
operate and master the product easily, also, interact
with it, establish the basic cognitive ability of the
product, so that the product's operating mode can meet
the design intent.
TAKE-AWAY

14. 14
Keep the interface simple
The best interfaces are almost
invisible to the user. They avoid
unnecessary elements and are clear
in the language they use on labels
and in messaging.
Create consistency and
use common UI elements
By using common elements in your
UI, users feel more comfortable and
are able to get things done more
quickly. It is also important to create
patterns in language, layout and
design throughout the site to help
facilitate efficiency. Once a user
learns how to do something, they
should be able to transfer that skill to
other parts of the site.
Be purposeful in page layout
Consider the spatial relationships
between items on the page and
structure the page based on
importance. Careful placement of
items can help draw attention to the
most important pieces of
information and can aid scanning and
readability.

15. 15
Strategically use color and
texture
You can direct attention toward or
redirect attention away from items
using color, light, contrast, and
texture to your advantage.
Use typography to create
hierarchy and clarity.
Carefully consider how you use
typeface. Different sizes, fonts, and
arrangement of the text to help
increase scanability, legibility and
readability.

16. 16
Make sure that the system
communicates what’s
happening.
Always inform your users of location,
actions, changes in state, or errors.
The use of various UI elements to
communicate status and, if
necessary, next steps can reduce
frustration for your user.
Think about the defaults.
By carefully thinking about and
anticipating the goals people bring to
your site, you can create defaults
that reduce the burden on the user.
This becomes particularly important
when it comes to form design where
you might have an opportunity to
have some fields pre-chosen or filled
out.

17. 17
Psychology plays a big part in
a user’s experience with an
application. By
understanding how our
designs are perceived, we
can make adjustments so
that the apps we create are
more effective in achieving
the goals of the user.
The Psychology Principles
Every UI/UX Designer Needs to Know

18. Von Restorff Effect
The Von Restorff effect (also known as the
isolation effect) predicts that when multiple
similar objects are present, the one that
differs from the rest is most likely to be
remembered!
“When multiple similar objects are present, the one that differs from the rest is most likely to be remembered!”

19. Serial Position Effect
The Serial Position Effect is the propensity of a
user to best remember the first and last items
in a series.

20. Cognitive load
Cognitive load refers to the total amount of
mental effort being used in a person’s working
memory. To put it simply, it is the amount of
thought you need to exercise in order to
complete a specific task.
“Cognitive load is the amount of thought you need to exercise in order to complete a specific task. It’s easier for users
to learn something new if they can discern it to a pattern from something they understand”

21. Hick’s Law
Hick’s Law describes that the time it takes for
a person to make a decision depends on the
choices available to him or her. So if the
number of choices increases, the time to
make a decision increases logarithmically.

22. Law of Proximity
Law of proximity is part of the Gestalt Laws of
Perceptual Organization, and it states that
objects that are near, or proximate to each
other, tend to be grouped together. To put it
in simpler terms, our brain can easily
associate objects close to each other, better
than it does objects that are spaced far apart.
This clustering occurs because humans have a
natural tendency to organise and group things
together.
“The Law of Proximity states that objects that are near, or proximate to each other, tend to be grouped together”

23. THANK YOU
QUESTIONS?