Scribd
Upload
268 views

Balancing Function and Fashion

This document discusses strategies for effective human-computer interaction, including how to design error messages, non-anthropomorphic interfaces, displays, and windows. It recommends that error messages be specific, provide constructive guidance, and use a positive tone. For displays, it suggests meaningful grouping of information and use of spacing, boxes, and highlighting. Window design should allow multiple windows with coordination of scrolling, browsing, and dependent window opening/closing. Color can also be used strategically in interfaces.

Uploaded by

Fernand Torres Layug
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
268 views

Balancing Function and Fashion

This document discusses strategies for effective human-computer interaction, including how to design error messages, non-anthropomorphic interfaces, displays, and windows. It recommends that error messages be specific, provide constructive guidance, and use a positive tone. For displays, it suggests meaningful grouping of information and use of spacing, boxes, and highlighting. Window design should allow multiple windows with coordination of scrolling, browsing, and dependent window opening/closing. Color can also be used strategically in interfaces.

Uploaded by

Fernand Torres Layug
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 41

BALANCING FUNCTION AND FASHION

STRATEGIES FOR EFFECTIVE HUMAN-COMPUTER INTERACTION


Fernand T. Layug, MIT, MTA, MOS, MCE, ACA
IT Head / Dean
Santa Rita College of Pampanga

College Faculty
FERNAND T.
Angeles University Foundation LAYUG
Assistant Treasurer
PSITE Region III SOMEONE@EXAMPLE.COM
ISSUES
Error Message

Non-anthropomorphic design

Hybrid

Window Design

Color
ERROR MESSAGES

Phrasing of error messages or diagnostic warnings is critical


Avoid (especially when dealing with novices)
 imperious tone that condemns user
 messages that are too generic (e.g. WHAT? or SYNTAX ERROR)
 messages that are too obscure (e.g. FAC RJCT 004004400400)
ERROR MESSAGES
ERROR MESSAGES
ERROR MESSAGES
ERROR MESSAGES

Recommendations for preparing error messages


Specificity
Constructive guidance and positive tone
User-centered style
Appropriate physical format
ERROR MESSAGES
ERROR MESSAGES

SPECIFICITY
 Be as specific and precise as possible
 Poor Better

 SYNTAX ERROR Unmatched left parenthesis


 Type first letter: Send, Read, or
ILLEGAL ENTRY
Drop
 INVALID DATA  Days range from 1 to 31
 File names must begin with a
 BAD FILE NAME
letter
ERROR MESSAGES

SPECIFICITY
 Be as specific and precise as possible
ERROR MESSAGES

SPECIFICITY
 Be as specific and precise as possible
ERROR MESSAGES

Constructive Guidance and Positive Tone


 Poor Better

 Run-Time error ‘-2147469 (800405):


Virtual memory space consumed. Close
Method ‘Private Profile String’ of
some programs and retry.
object ‘System’ failed.

Resource Conflict Bus: 00 Device: 03  Remove your compact flash card and
Function: 01 restart
 Your password was not recognized.
 Network connection refused.
Please retype.
 Drop-off date must come after pickup
 Bad date.
date.
ERROR MESSAGES

Constructive Guidance and Positive Tone


ERROR MESSAGES

User-centered phrasing
Suggests that the user controls the interface
Be courteous to users
USER SHOULD HAVE CONTROL OVER THE
AMOUNT OF INFORMATION

Short description

Description with example

Full Detail
ERROR MESSAGES
ERROR MESSAGES

Appropriate physical format


Use uppercase-only messages for brief, serious warnings
Avoid code numbers
Choose the best location messages
Audio signals useful for getting attention, but can be
embarrassing
NON-ANTHROPOMORPHIC
DESIGN
NON-ANTHROPOMORPHIC DESIGN

Anthropomorphism
Attributing human/animal qualities to non-living things
Intelligence, autonomy, free will, … in computers.
Appealing to some people; but can deceive, confuse, and
mislead people
Clarify differences between people and computers
• Anthropomorphic interfaces
may distract users
• Clippet character was intended
to provide help suggestions
• Amused some, but annoyed
many
• Disruptive interference
NON-ANTHROPOMORPHIC DESIGN

Guidelines
Be cautious in presenting computers as people.
Interfaces should neither compliment nor condemn
Use cartoon characters in games or children’s software, but
usually not elsewhere
Do not use “I” pronouns when the computer responds to
human actions
Use “you” to guide users, or just state facts
NON-ANTHROPOMORPHIC DESIGN

Example 1:
“I will begin the lesson when you press RETURN”
“You can begin the lesson by pressing RETURN”
“To begin the lesson, press RETURN”
Example 2:
“Welcome to Thrifty Car Rentals. I’m Emily, let me help you
reserve your car. In what city will you need a car?”
DISPLAY DESIGN
DISPLAY DESIGN

Provide all the necessary data in proper sequence


Meaningful groupings
Groups can be surrounded by blank spaces or boxes
Related item can be indicated by high lighting,
background shading, color or special fonts
DISPLAY DESIGN

Field Layout
Blank spaces and separate lines
Labels are helpful
Distinguish labels from data with case
If boxes are available they can be used to make a more
appealing display, but they consume screen space
Specify the date format for international audiences
DISPLAY DESIGN

28
DISPLAY DESIGN

29
DISPLAY DESIGN

m ay more
is
Th sume
con ce 
spa
30
WINDOW DESIGN
WINDOW DESIGN

Multiple windows offers users sufficient information


and flexibility
Reduce Window housekeeping actions
Can apply direct manipulation strategy to window
actions
Advance users who work on multiple task can switch
among collections of windows call workspaces or
WINDOW DESIGN

Coordination
Is a task concept that describes how information objects
change based on user actions
Important coordination
Synchronized scrolling
Hierarchical browsing
Opening/closing of dependent windows
Saving/opening of window state
WINDOW DESIGN

Synchronized scrolling
The scroll bar of one window is coupled to another scroll bar,
and action on one scroll bar causes the other to scroll the
associated window
Useful for comparing
WINDOW DESIGN

Hierarchical browsing
Examples: Windows Explorer, Outlook and many email clients
WINDOW DESIGN

Opening/closing of depended windows


Opening a window may cause automatic simultaneous
opening of dependent windows
Closing of the children windows is also automatic with the
closing of the parent
WINDOW DESIGN

Saving/opening of window state


Save the current state of the display, with all windows and
their contents
WINDOW DESIGN

Image browsing
A two-dimensional cousin hierarchical browsing
COLOR

Image browsing
A two-dimensional cousin hierarchical browsing
COMPETITIVE LANDSCAPE
THANK YOU
SOMEONE@EXAMPLE.COM

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy