Human Computer Interaction
Lecturer: Gokhan GUMUS
Dhose the design really affect?
Look at the given pictures and think about what sort
of view do you want to see? And explain why?
Lecturer: Gokhan GUMUS
Is Being Structured Enough?
Is it really enough to be structured, for making the
presentation, short, summarized and clear enough?
Look at the given picture and pick one of them and tell
the reason about why didyou pick that option...
Lecturer: Gokhan GUMUS
Is Being Structured Enough?
Is it really enough to be structured, for making the
presentation, short, summarized and clear enough?
Look at the given picture and pick one of them and tell
the reason about why didyou pick that option...
The difference was because of obeying (or not) some
of the design rules what we had discussed before (gestalt
rules)
Lecturer: Gokhan GUMUS
Long or Short numbers
When you want to enter a date into the system which
design do you prefere?
Lecturer: Gokhan GUMUS
Long or Short numbers
When you want to fill a form about credit card
information or mobile phone which design do you prefere?
Lecturer: Gokhan GUMUS
Structure the text...
In case if you want to give/take some information
from a text, Which way do you prefere?
Lecturer: Gokhan GUMUS
So What?...
We have discussed 5 different conditions... So what do
you understand in the frame of HCI ?
Lecturer: Gokhan GUMUS
So What?...
In very simple, we can say that; “We seek and use
visual structure”.
But being structured is not enough, we should also
obey the design rules, such as gestalt rules.
Lecturer: Gokhan GUMUS
We have limited sight
You can develop the best design, but it will be
meaningless if there is no ......
Lecturer: Gokhan GUMUS
We have limited sight
Human color perception has both strengths and
limitations. Many of those strengths and limitations are
relevant to user interface design:
• Our vision is optimized to detect contrasts (edges), not
absolute brightness.
• Our ability to distinguish colors depends on how colors
are presented.
• Some people have color-blindness.
• The user’s display and the viewing conditions affect
color perception.
Lecturer: Gokhan GUMUS
We have limited sight
Vision is optimized to detect contrasts (edges), not
absolute brightness
Now you will see two circles, Tell me what are their
difference?
Lecturer: Gokhan GUMUS
We have limited sight
Vision is optimized to detect contrasts (edges), not
absolute brightness
Look at place “A” and “B”, tell the
differences...
Lecturer: Gokhan GUMUS
We have limited sight
Ability to distinguish colors depends on how colors
are presented;
Paleness: The paler (less saturated) two colors are,
the harder it is to tell them apart
Lecturer: Gokhan GUMUS
We have limited sight
Ability to distinguish colors depends on how colors
are presented;
Color patch size: The smaller or thinner objects are,
the harder it is to distinguish their colors. Text is often thin,
so the exact color of text is often hard to determine.
Lecturer: Gokhan GUMUS
We have limited sight
Ability to distinguish colors depends on how colors
are presented;
Separation: The more separated color patches are, the
more difficult it is to distinguish their colors, especially if the
separation is great enough to require eye motion between
patches
Lecturer: Gokhan GUMUS
We have limited sight
Ability to distinguish colors depends on how colors
are presented;
Lecturer: Gokhan GUMUS
We have limited sight
Colorblindness;
1) Try to find a circle, star, and/or square on the
Demonstration Card
Lecturer: Gokhan GUMUS
We have limited sight
Colorblindness;
2) Try and find a circle, star, and/or square in 3
seconds.
Lecturer: Gokhan GUMUS
We have limited sight
Colorblindness;
3) Try and find a circle, star, and/or square in 3
seconds.
Lecturer: Gokhan GUMUS
We have limited sight
Colorblindness;
4) Try and find a dog, boat, balloon, or car (as shown
in the below demonstration card) on Card 3 seconds.
Lecturer: Gokhan GUMUS
We have limited sight
Colorblindness;
Answers;
1) a circle, star, and square
2) yellow square and a "faint" brown circle
3) yellow circle and a "faint" brown square.
4) a "faint" brown boat.
Lecturer: Gokhan GUMUS
We have limited sight
External factors that influence the ability to distinguish
colors;
Variation among color displays: Computer displays
vary in how they display colors, depending on their
technologies, driver software, or color settings. Even
monitors of the same model with the same settings may
display colors slightly differently. Something that looks
yellow on one display may look beige on another. Colors that
are clearly different on one may look the same on another.
Lecturer: Gokhan GUMUS
We have limited sight
External factors that influence the ability to distinguish
colors;
Grayscale displays: Although most displays these days
are color, there are devices, especially small hand-held ones,
with grayscale displays. Grayscale display can make areas of
different colors look the same.
Lecturer: Gokhan GUMUS
We have limited sight
External factors that influence the ability to distinguish
colors;
Display angle: Some computer displays, particularly
LCD ones, work much better when viewed straight on than
when viewed from an angle. When LCD displays are viewed
at an angle, colors—and color differences—often are
altered.
Lecturer: Gokhan GUMUS
We have limited sight
External factors that influence the ability to distinguish
colors;
Ambient illumination: Strong light on a display
washes out colors before it washes out light and dark areas,
reducing color displays to grayscale ones, as anyone who has
tried to use a bank ATM in direct sunlight knows. In offices,
glare and venetian blind shadows can mask color
differences.
Lecturer: Gokhan GUMUS
We have limited sight
Guidelines For Using Colors;
1. Distinguish colors by saturation and brightness as
well as hue. (tip: If you can’t distinguish the colors when they are
rendered in grays, they aren’t different enough. )
2. Use distinctive colors. (red, green, blue, black,
white... )
3. Avoid color pairs that color-blind people cannot
distinguish.
4. Use color redundantly with other cues.
5. Separate strong opponent colors.
Lecturer: Gokhan GUMUS