Human-Computer Interaction Guide
Human-Computer Interaction Guide
We don't care?
We don't possess common sense?
We don't have the time?
We still don't know what really makes good design?
Definition of HCI:
Goals:
1 .A basic goal of HCI is to improve the interactions between users and computers by making
computers more usable and receptive to the user's needs.
2. A long term goal of HCI is to design systems that minimize the barrier between the human's
cognitive model of what they want to accomplish and the computer's understanding of the user's
task
User interface, design is a subset of a field of study called human-computer interaction (HCI).
Human-computer interaction is the study, planning, and design of how people and computers
work together so that a person's needs are satisfied in the most effective way.
HCI designers must consider a variety of factors: What people want and expect, physical
limitations and abilities people possess, How information processing systems work, What people
find enjoyable and attractive. Technical characteristics and limitations of the computer hardware
and software must also be considered.
The user interface is the part of a computer and its software that people can see, hear, touch, talk
to, or otherwise understand or direct. The user interface has essentially two components: input
and output.
Input is how a person communicates his / her needs to the computer. Some common input
components are the keyboard, mouse, trackball, one's finger, and one's voice.
Output is how the computer conveys the results of its computations and requirements to the user.
Today, the most common computer output mechanism is the display screen, followed by
mechanisms that take advantage of a person's auditory capabilities: voice and sound.
The use of the human senses of smell and touch output in interface design still remain largely
unexplored.
Proper interface design will provide a mix of well-designed input and output mechanisms that
satisfy the user's needs, capabilities, and limitations in the most effective way possible.
With today's technology and tools, and our motivation to create really effective and us-able
interfaces and screens, why do we continue to produce systems that are inefficient and confusing
or, at worst, just plain unusable? Is it because:
We don't care?
We don't possess common sense?
We don't have the time?
We still don't know what really makes good design?
But we never seem to have time to find out what makes good de-sign, nor to properly
apply it.
After all, many of us have other things to do in addition to designing interfaces and screens. So
we take our best shot given the workload and time constraints imposed upon us.
The result, too often, is woefully inadequate. Interface and screen design were really a matter of
common sense, we developers would have been producing almost identical screens for
representing the real world.
While developers have been designing screens since a cathode ray tube display was first attached
to a computer, more widespread interest in the application of good design principles to screens
did not begin to emerge until the early 1970s, when IBM in-troduced its 3270 cathode ray tube
text-based terminal.
A 1970s screen often resembled the one pictured in. It usually consisted of many fields (more
than are illustrated here) with very cryptic and often unintelligible captions.
It was visually cluttered, and often possessed a command field that challenged the user to
remember what had to be keyed into it.
Ambiguous messages often required referral to a manual to interpret. Effectively using this kind
of screen required a great deal of practice and patience.
Most early screens were mono-chromatic, typically presenting green text on black backgrounds
The Xerox systems, Altus and STAR, introduced the mouse and pointing and selecting as the primary
human-computer communication method.
The user simply pointed at the screen, using the mouse as an intermediary.
These systems also introduced the graphical user interface as we know it a new concept was born,
revolutionizing the human-computer interface.
Popularity of graphics
It is assumed that a per-son is already familiar with the objects and actions in his or her
environment of interest.
The system simply replicates them and portrays them on a different medium, the screen.
A person has the power to access and modify these objects, among which are windows.
A person is allowed to work in a familiar environment and in a familiar way, focusing on the
data, not the application and tools.
The physical organization of the system, which most often is unfamiliar, is hidden from view and
is not a distraction.
Like one's desktop, objects are continuously visible. Reminders of actions to be performed are also
obvious, labeled buttons replacing complex syntax and command names.
Cursor action and motion occurs in physically obvious and natural ways. One problem in direct
manipulation, however, is that there is no direct anal-ogy on the desk for all necessary windowing
operations.
A piece of paper on one's desk maintains a constant size, never shrinking or growing. Windows can do
both. Solving this problem required embedding a control panel, a familiar concept to most people, in a
window's border. This control panel is manipulated, not the window itself.
Actions are rapid and incremental with visible display of results; the results of actions are immediately
displayed visually on the screen in their new and current form.
Auditory feedback may also be provided. The impact of a previous action is quickly seen, and the
evolution of tasks is continuous and effortless.
The concept of direct manipulation actually preceded the first graphical system. The earliest full screen
text editor’s possessed similar character-is tics.
Screens of text resembling a piece of paper on one's desk could be created (ex-tension of real world) and
then reviewed in their entirety (continuous visibility).
Editing or restructuring could be easily accomplished (through rapid incremental ac-tions) and the results
immediately seen.
Indirect Manipulation: In practice, direct manipulation of all screen objects and actions may not be
feasible because of the following
The operation may be difficult to conceptualize in the graphical system. The graphics capability of the
system may be limited. The amount of space available for placing manipulation controls in the window
border may be limited. When this occurs, indirect manipulation is provided.
Indirect manipulation substitutes words and text, such as pull-down or pop-up menus, for symbols, and
substitutes typing for pointing. Most window systems are a combination of both direct and indirect
manipulation.
A menu may be accessed by pointing at a menu icon and then se-letting it (direct manipulation). The
menu itself, however, is a textual list of operations (indirect manipulation). When an operation is selected
from the list, by pointing or typing, the system executes it as a command.
GRAPHICAL SYSTEMS
Advantages :
Disadvantages:
Characteristics of the Graphical User Interface: A graphical system possesses a set of defining
concepts. Included are sophisticated visual presentation, pick-and-click interaction, a restricted set of
interface options, visualization, object orientation, extensive use of a person's recognition memory, and
concurrent performance of functions.
Visual presentation is the visual aspect of the interface. It is what people see on the screen. The
sophistication of a graphical system permits displaying lines, including drawings and icons. It also
permits the displaying of a variety of character fonts, including different sizes and styles. The display of
16 million or more colors is possible on some screens. Graphics also permit animation and the
presentation of photograph and motion video. The meaningful interface elements visually presented to the
user in a graphical System include, windows (primary, secondary, or dialog boxes), menus (menu bar,
pull down, pop-up, cascading), icons to represent objects such as programs or files, assorted screen-based
controls (text boxes, list boxes, combination boxes, settings, scroll bar and buttons), and a mouse pointer
and cursor.
pick-and-click
The primary mechanism for performing this pick-and-click is most often the mouse and its buttons. The
user moves the mouse pointer to the relevant element (pick) and the action is signaled (click). Pointing
allows rapid selection and feedback. The hand and mind seem to work smoothly and efficiently together.
The secondary mechanism for performing these selection actions is the keyboard most systems permit
pick-and-click to be performed using the keyboard as well.
Visualization:
Visualization is a cognitive process that allows people to understand. Information that is difficult to
perceive, because it is either too voluminous or too abstract Presenting specialized graphic portrayals
facilitates visualization. The best visualization method for an activity depends on what People are trying
to learn from the data. The goal is not necessarily to reproduce a really graphical image, but to produce
one that conveys the most relevant information. Effective visualizations can facilitate mental insights,
increase productivity, and for faster and more accurate use of data.
Object Orientation:
A graphical system consists of objects and actions. Objects are what people see on screen. They are
manipulated as a single unit. Objects can be composed of sub objects. For example, an object may be a
document. The document's sub objects may be a paragraph, sentence, word, and letter.
A collection is the simplest relationship-the objects sharing a common aspect. A collection might be the
result of a query or a multiple selection of objects. Operations can be applied to a collection of objects. A
constraint is a stronger object relationship.
A composite exists when the relationship between objects becomes so significant that the aggregation
itself can be identified as an object. Examples include a range of cells organized into a spreadsheet, or a
collection of words organized46 into a paragraph.
A container is an object in which other objects exist. Examples include text in a document or documents
in a folder. A container often influences the behavior of its con-tent. It may add or suppress certain
properties or operations of objects placed within it, control access to its content, or control access to kinds
of objects it will accept. These relationships help define an object's type. Similar traits and behaviors exist
in objects of the same object type.
Another important object characteristic is persistence. Persistence is the maintenance of a state once it is
established. An object's state (for example, window size, cursor location, scroll position, and so on)
should always be automatically preserved when the user changes it.
Graphic systems may do two or more things at one time. Multiple programs may run simultaneously.
When a system is not busy on a primary task, it may process back-ground tasks (cooperative
multitasking).
When applications are running as truly separate tasks, the system may divide the processing power into
time slices and allocate portions to each application.
Data may also be transferred between programs. It may be temporarily stored on a "clipboard" for later
transfer or be automatically swapped between programs.
Web interface design is essentially the design of navigation and the presentation of information. It is
about content, not data. Proper interface design is largely a matter of properly balancing the structure and
relationships of menus, content, and other linked documents or graphics. The design goal is to build a
hierarchy of menus and pages that feels natural, is well structured, is easy to use, and is truthful. The
Web is a navigation environment where people move between pages of information, not an application
environment. It is also a graphically rich environment. Web interface design is difficult for a number of
reasons. First, its underlying design language, HTML, was never intended for creating screens to be used
by the general population. Its scope of users was expected to be technical.
HTML was limited in objects and interaction styles and did not provide a means for presenting
information in the most effective way for people. Next, browser navigation retreated to the pre-GUI era.
This era was characterized by a "command" field whose contents had to be learned, and a navigational
organization and structure that lay hidden beneath a mostly dark and blank screen
While the introduction of the graphical user interface revolutionized the user interface, the Web has
revolutionized computing. It allows millions of people scattered across the globe to communicate, access
information, publish, and be heard.
It allows people to control much of the display and the rendering of Web pages. Aspects such as
typography and colors can be changed, graphics turned off, and decisions made whether or not to transmit
certain data over non secure channels or whether to accept or refuse cookies. Web usage has reflected this
popularity.
The number of Internet hosts has risen dramatically: In 1984, hosts online exceeded 1,000; in 1987,
10,000; in 1989, 100,000, in 1990, 300,000; in 1992 hosts exceeded one million. Commercialization of
the Internet saw even greater expansion of the growth rate.
Slow download times, confusing navigation, confusing page organization, disturbing animation, or other
un-desirable site features often results in user abandonment of the site for others with a more agreeable
interface. People are quick to vote with their mouse, and these warnings should not go unheeded.
An interface must really be just an extension of a person. This means that the system and its software
must reflect a person's capabilities and respond to his or her specific needs.
It should be useful, accomplishing some business objectives faster and more efficiently than the
previously used method or tool did. It must also be easy to learn, for people want to do, not learn to do.
Finally, the system must be easy and fun to use, evoking a sense of pleasure and accomplishment not
tedium and frustration. The interface itself should serve as both a connector and a separator:
A connector in that it ties the user to the power of the computer, and a separator in that it minimizes the
possibility of the participants damaging one another. While the damage the user inflicts on the computer
tends to be physical (a frustrated pounding of the keyboard), the damage caused by the computer is more
psychological.
Throughout the history of the human-computer interface, various researchers and writers have attempted
to define a set of general principles of interface design. What follows is a compilation of these principles.
They reflect not only what we know today, but also what we think we know today. Many are based on
research, others on the collective thinking of behaviorists working with user interfaces.
These principles will continue to evolve, expand, and be refined as our experience with Gills and the Web
increases
General Principles:
They are fundamental to the design and implementation of all effective interfaces, GUI and Web. These
principles are general characteristics of the interface, and they apply to all aspects.
The compilation is presented alphabetically, and the ordering is not intended to imply degree of
importance.
Aesthetically Pleasing:
Provide visual appeal by following these presentation and graphic design principles:
Provide meaningful contrast between screen elements.
Create groupings.
Align screen elements and groups.
Provide three-dimensional representation.
Use color and graphics effectively and simply.
Clarity:
The interface should be visually, conceptually, and linguistically clear, including Visual elements
Functions
Metaphors
Words and Text
Compatibility:
Configurability
Comprehensibility:
Consistency:
Control:
Directness:
Flexibility:
A system must be sensitive to the differing needs of its users, enabling a level and type of
performance based upon: Each user's knowledge and skills.
Each user's experience.
Each user's personal preference.
Each user's habits.
The conditions at that moment
Efficiency:
Familiarity:
Employ familiar concepts and use a language that is familiar to the user.
Keep the interface natural, mimicking the user's behavior patterns.
Use real-world metaphors.
Forgiveness:
Predictability:
The user should be able to anticipate the natural progression of each task. Provide distinct and
recognizable screen elements.
Provide clues to the result of an action to be performed.
All expectations should be fulfilled uniformly and completely.
Recovery:
A system should permit: Commands or actions to be abolished or reversed. Immediate return to a certain
point if difficulties arise. Ensure that users never lose their work as a result of: An error on their part.
Hardware, software, or communication problems
Responsiveness:
.Transparency:
Permit the user to focus on the task or job, without concern for the mechanics of the interface.
Workings and reminders of workings inside the computer should be invisible to the user.
Simplicity:
DESIGN PROCESS
Human interaction with computers
Psychological
Confusion:
Annoyance:
Roadblocks that prevent a task being completed, or a need from being satisfied, promptly and
efficiently lead to annoyance.
Inconsistencies in design, slow computer reaction times, difficulties in quickly finding
information, out-dated information, and visual screen distractions are a few of the many things
that may annoy users.
Frustration:
Panic or stress:
Unexpectedly long delays during times of severe or unusual pres-sure may introduce panic or
stress.
Some typical causes are unavailable systems or long response times when the user is operating
under a deadline or dealing with an irate customer.
Boredom:
Boredom results from improper computer pacing (slow response times or long download times) or overly
simplistic jobs.
The system is rejected and other information sources are relied upon. These sources must, of
course, be available and the user must have the discretion to perform the rejection.
In business systems this is a common reaction of managerial and professional personnel. With the
Web, almost all users can exercise this option.
Only a portion of the system's capabilities are used, usually those operations that are easiest to
perform or that provide the most benefits. Historically, this has been the most common user
reaction to most computer systems.
Modification of the task: The task is changed to match the capabilities of the system. This is a
prevalent reaction when the tools are rigid and the problem is unstructured, as in scientific problem
solving.
Compensatory activity: Additional actions are performed to compensate for system inadequacies. A
common example is the manual reformatting of information to match the structure required by the
computer. This is a reaction common to workers whose discretion is limited, such as clerical personnel.
Misuse of the system: The rules are bent to shortcut operational difficulties. This requires significant
knowledge of the system and may affect system integrity.
Direct programming:
The system is reprogrammed by its user to meet specific needs. This is a typical response of the
sophisticated worker. These physical responses also greatly diminish user efficiency and effectiveness.
They force the user to rely upon other information sources, to fail to use a system's complete capabilities,
or to perform time-consuming "work-around" actions.
Importance in design is
perception,
memory,
visual acuity,
foveal and peripheral vision,
sensory storage,
information processing,
learning, skill, and
Individual differences.
Perception
Proximity
Similarity
Matching patterns
Succinctness
Closure
Unity
Continuity
Balance
Expectancies
Context
Memory:
Memory is not the most stable of human attributes, as anyone who has forgotten why they walked into a
room, or forgotten a very important birthday, can attest.
Mental Models:
Movement Control :
Once data has been perceived and an appropriate action decided upon, a response must be made; in many
cases the response is a movement. In computer systems, movements include such activities as pressing
keyboard keys, moving the screen pointer by pushing a mouse or rotating a trackball, or clicking a mouse
button
The implications in screen design are: – Provide large objects for important functions. – Take advantage
of the "pinning" actions of the sides, top, bottom, and corners of the screen.
Learning:
Learning, as has been said, is the process of encoding in long-term memory information that is contained
in short-term memory. It is a complex process requiring some effort on our part. Our ability to learn is
important-it clearly differentiates people from machines. Given enough time people can improve the
performance in almost any task. Too often, however, designers use our learning ability as an excuse to
justify complex design. A design developed to minimize human learning time can greatly accelerate
human performance. People prefer to stick with what they know, and they prefer to jump in and get
started. Unproductive time spent learning is something frequently avoided.
Skill:
The goal of human performance is to perform skillfully. To do so requires linking in-puts and
responses into a sequence of action. The essence of skill is performance of actions or movements
in the correct time sequence with adequate precision. It is characterized by consistency and
economy of effort. Economy of effort is achieved by establishing a work pace that represents
optimum efficiency.
It is accomplished by in-creasing mastery of the system through such things as progressive
learning of short-cuts, increased speed, and easier access to information or data. Skills are
hierarchical in nature, and many basic skills may be integrated to form increasingly complex
ones. Lower-order skills tend to become routine and may drop out of consciousness.
System and screen design must permit development of increasingly skillful performance.
Individual Differences:
In reality, there is no average user. A complicating but very advantageous human characteristic is that
we all differ-in looks, feelings, motor abilities, intellectual abilities, learning abilities and speed, and so
on. In a keyboard data entry task.
For example, the best typists will probably be twice as fast as the poorest and make 10 times fewer errors.
Human considerations
The knowledge possessed by a person, and the experiences undergone, shape the design of the interface
in many ways. The following kinds of knowledge and experiences should be identified.
System Experience - High, moderate, or low knowledge of a particular system and its methods of
interaction
Application Experience - High, moderate, or low knowledge of similar systems
JOB/TASK/NEED
PSYCHOLOCICAL CHARACTERISTICS:
The speed at which people can perform using various communication methods has been studied by a
number of researchers.
Reading:
The average adult, reading English prose in the United States, has a reading speed in the order of
250-300 words per minute.
Proof reading text on paper has been found to occur at about 200 words per minute, on a
computer monitor, about 180 words per minute.
One technique that has dramatically increased reading speeds is called Rapid Serial Visual
Presentation, or RSVP.
In this technique single words are presented one at a time in the center of a screen. New words
continually replace old words at a rate set by the reader.
For a sample of people whose paper document reading speed was 342 words per minute? (With a
speed range of 143 to 540 words per minute.)
Single words were presented on a screen in sets at a speed sequentially varying ranging from 600
to 1,600 words per minute. After each set a comprehension test was administered Prose text -
250-300 words per minute.
Proof reading text on paper - 200 words per minute. Proofreading text on a monitor - 180 words
per minute.
Speaking to a computer:
150-160 words per minute.
After recognition corrections: 105 words per minute.
Keying
Typewriter
Fast typist: 150 words per minute and higher Average typist: 60-70 words per minute Computer
Transcription 33 words per minute
Composition: 19 words per minute
Two finger typists Memorized text: 37 words per minute
Copying text: 27 words per minute
Hand printing Memorized text: 31 words per minute.
Copying text: 22 words per minute.
SCREEN DESIGNING
All elements of a screen must have meaning to users and serve a purpose in per-forming tasks or
fulfilling needs. If an element does not have meaning, do not include it on the screen because it is noise.
Visual clarity is achieved when the display elements are organized and presented in meaningful
and understandable ways.
A clear and clean organization makes it easier to recognize screen’s essential elements and to
ignore its secondary information when appropriate.
Consistency
Reflect a person’s experiences, work conventions, and cultural conventions Provide internal
consistency. Observe the same conventions and rules for all aspects of an interface screen, and all
applications or web site screens, including:
Divide information into units that are logical, meaningful and sensible.
Organize by interrelationships between data or information.
Provide an ordering of screen units of elements depending on priority.
Possible ordering schemes include
Conventional
Sequence of use
Frequency of use
Function
Importance
General to specific
Form groups that cover all possibilities.
Ensure that information is visible.
Ensure that only information relative to task is presented on screen.
Organizational scheme is to minimize number of information variables
Provide an obvious starting point in the screen’s upper left corner. Eyeball fixation studies
indicate that in looking at displays of information, usually one’s eyes move first to the upper-left center of
the display, and then quickly move through the display in a clockwise direction.
Streveler and Wasserman (1984) found that visual targets located in the upper-left quadrant of a
screen were found fastest and those located in the lower-right quadrant took longest to find. Provide an
obvious starting point in the upper-left corner of the screen.
This is near the location where visual scanning begins and will permit a left-to-right, top-to-
bottom reading of information or text as is common in Western cultures.
Aligning elements
Grouping elements
Use of line borders
Through focus and emphasis, sequentially, direct attention to items that are
1. Critical
2. Important
3. Secondary
4. Peripheral
locate command button at the end of the tabbing order sequence, when groups of related
information must be broken and displayed on separate screens, provide breaks at logical
or natural points in the information flow.
Most product style guides recommend a left to right orientation. Our earliest display
screens reflected this left to right entry orientation.
Top to bottom orientation is also recommended for presenting displays of read only
information that must be scanned.
Balance
Symmetry
Regularity
Predictability
Sequentiality
Economy
Unity
proportion
Simplicity
Grouping
Balance Create screen balance by providing an equal weight of screen elements, left and right, top and
bottom.
Symmetry Create symmetry by replicating elements left and right of the screen centerline.
Regularity Create regularity by establishing standard and consistently spaced horizontal and vertical
alignment points. Also, use similar element sizes, shapes, colors, and spacing.
Sequentiality Provide Sequentiality by arranging elements to guide the eye through the screen in an
obvious, logical, rhythmic, and efficient manner.
Economy Provide economy by using as few styles, display techniques, and colors as possible.
Unity Create unity by: — Using similar sizes, shapes, or colors for related information. — Leaving less
space between elements of a screen than the space left at the margins.
Proportion Create windows and groupings of data or text with aesthetically pleasing proportions.
Simplicity (Complexity)
Higher brightness
Reverse polarity
Larger and distinctive font
Underlining
Blinking
Line rulings
Contrasting colors
Larger size
Positioning
Isolation
Distinctiveness
White space
Screen design
Must be compatible with the capabilities of the system
System power
Screen size
Screen resolution
Display colors
Other display features
Screen design must be compatible with the capabilities of the
Platform compatibility
Development and implementation
Platform style guide
Browser
Compatibility
Monitor size and resolution
Fonts
Color
Bandwidth
Version other considerations
Downloading Currency Page
Printing
Maintainability
WINDOWS
A window is an area of the screen that contains a particular view of some area of the computer or some
portion of a person’s dialog with the computer
Window Characteristics
Components of a Window
Frame
Title Bar
Title Bar Icon
Menu Bar
Status Bar
Scroll Bar
Split Box
Tool Bar
Command Area
Work Area
Size Grip
Window sizing Buttons
Window Operations
Prepared by DR A.Sudhir Babu
Primary Window
Secondary Windows
– A dependent secondary
• It can only be displayed from a command on the interface of its primary window
– A independent secondary
Modal window
– Will not permit interaction with another window until the current dialog is completed
– Remain displayed until the appropriate action is taken after which it is removed
– Modal dialog boxes typically request critical information or actions
Modeless window
Device-based controls, often called input devices, are the mechanisms through which people
communicate their desires to the system. Identify the characteristics and capabilities of device- based
control
• Trackball
• Joystick
• Graphic tablet
• Light pen
• Touch screen
• Voice
• Mouse
• Keyboard
Trackball
• Advantages
– Direct relationship between hand and pointer movement in terms of direction and speed
• Disadvantages
Joystick
• Advantages
– Direct relationship between hand and pointer movement in terms of direction and speed
• Disadvantage
• Description
• Advantages
Direct relationship between hand and pointer movement in terms of direction and speed
• Disadvantage
• Advantages
– Direct relationship between hand and pointer movement in terms of direction and speed
• Disadvantage
Light Pen
• Description
• Advantage
– Direct relationship between hand and pointer movement in terms of direction, distance, and speed –
Movement is direct, in the same plane as screen
Disadvantage
Voice
• Description
• Advantage
• Disadvantage
Mouse
• Advantage
– Direct relationship between hand and pointer movement in terms of direction, distance, and speed
• Disadvantage
Screen Based controls, often simply called controls and sometimes called widgets. By definition, they are
graphic objects that represent the properties or operations of other objects.
A control may:
Identify the characteristics and capabilities of the various screen-based controls, including:
– Buttons.
– Text entry/read-only controls.
– Selection controls.
– Combination entry/selection controls.
– Specialized operable controls.
– Custom controls
– Presentation controls.
– Web controls.
– Select the proper controls for the user and tasks
.Buttons:
Purpose:
– To start actions.
– To change properties.
– To display a pop-up menu.
Advantages:
Disadvantages:
■Proper usage: Use for frequently used actions that are specific to a window. To cause something to
happen immediately. To display another window. To display a menu of options. To set a mode or
property value.
– Use buttons to move between multi-page forms, not scroll bars Label buttons Next and Previous.
– Highlight the button in some visually distinctive manner when the point is resting on it and the button
is available for selection
– For entry boxes Place a colon (:) immediately following the caption
– For single fields, caption can be located in front of upper-left corner of the box
– For multiple fields, position the caption upper left of the box For read-only boxes
– If the data field is long or about the same length, center the caption above the displayed text box
– If the data is alphanumeric, short, or quite variable in length, left-justify the caption above the
displayed
– If the data field is numeric and variable in length, right-justify the caption above the displayed
Selection Controls
A selection control presents on the screen all the possible alternatives, conditions, or choices that may
exist for an entity, property, or value. The relevant item or items are selected from those displayed.
– Radio Buttons
– Check Boxes
– Palettes
– List Boxes
– List View Controls
– Drop-down/Pop-up List Boxes
Description:
Choice descriptions.
Check Boxes
When an option is selected, a mark (X) appears within the square box, or the box is highlighted in some
other manner Otherwise the square is unselected or empty (off)
Each box can be switched on or off independently used alone or grouped in sets
Palettes:
List Boxes:
A permanently displayed box-shaped control containing a list of attributes or objects from which
A single line field followed by two small, vertically arranged buttons (pointing up and pointing down
arrow)
Advantages:
Disadvantages:
Slider:
UNIT-5
Components
– Icons are most often used to represent objects and actions with which users can interact
– Icons may stand alone on a desktop or in a window, or be grouped together in a toolbar
– A secondary use of a icon is to reinforce important information, a warning icon in a dialog message
box
Characteristics of Icons
Syntactic refers to an icon’s physical structure Shape, Color, Size Similar shapes and colors can be used
to classify a group of related icons
Semantics is the icon’s meaning what does it refer – a file, a waste basket, or some other objects?
Pragmatics is how the icons are physically produced and depicted Is the screen resolution sufficient to
illustrate?
– Familiar
– Clarity
– Simple
– Consistent
– Directness of the meaning
– Efficient
– Discriminable
– from others
Also consider the Context in which the icon is used Expectancies of users Complexity of task
Choosing Icons
– A Successful Icon
– Looks different from all other icons
– Is obvious what it does or represents
– Is recognizable when no larger than 16 pixels square
– Look as good in black and white as in color
Size
Creating Images
Drawing Images
Multimedia
Images
Color Uses
Color in Context
– Color chosen to organize information or data on a screen must aid the transfer of information from
the display to the user, Some examples of using color code
INTERACTION DEVICES
, image and video displays, drivers
Keyboard Layouts
Dvorak layout
– 1920
– reduces finger travel distances by at least one order of magnitude
– Acceptance has been slow despite the dedicated efforts of some devotees
– it takes about 1 week of regular typing to make the switch, but most users have been unwilling to
invest the effort
Keys
Function keys
– users must either remember each key's function, identify them from the screen's display, or use a
template over the keys in order to identify them properly
– can reduce number of keystrokes and errors
– Meaning of each key can change with each application
– Placement on keyboard can affect efficient use
– Special-purpose displays often embed function keys in monitor bezel
– lights next to keys used to indicate availability of the function, or on/off status – typically simply
labeled F1, F2, etc, though some may also have meaningful labels, such as CUT, COPY, etc.
– Frequent movement between keyboard home position and mouse or function keys can be disruptive
to use
– Alternative is to use closer keys (e.g. ALT or CTRL) and one letter to indicate special Function
Pointing Devices
Select:
Position:
Direction may simply rotate a symbol on the screen, indicate a direction of motion for a space ship, or
control the operation of a robot arm.
Path:
Quantify:
Text:
• Lightpen
–enabled users to point to a spot on a screen and to perform a select, position, or other task
–incorporates a button for the user to press when the cursor is resting on the desired spot on the screen
–lightpen has three disadvantages: users' hands obscured part of the screen, users had to remove their
hands from the keyboard, and users had to pick up the lightpen
• Touch screen
– Users need practice in dictation and seem to do best with speech input when preparing standard
reports.
– Continuous speech-recognition systems also enable automatic scanning and retrieval from radio
or television programs, court proceedings, lectures, or telephone calls for specific words or topics
Speech generation is a successful technology with widespread application in consumer products and on
telephones.
When algorithms are used to generate the sound(synthesis),the intonation may sound robot-like and
distracting. The quality of the sound can be improved when phonemes, words and phrases from digitized
human speech can be smoothly integrated into meaningful sentences.
Text-to-speech utilities like the built-in Microsoft Windows Narrator can be used to read passages of text
in web browsers and word processors.
When the environment is too brightly lit, too poorly lit, subject to severe vibration, or otherwise
unsuitable for visual displays.
The display has become the primary source of feedback to the user from the computer
– The display has many important features, including:
• Physical dimensions (usually the diagonal dimension and depth)
• Resolution (the number of pixels available)
• Number of available colors, color correctness
• Luminance, contrast, and glare
• Power consumption
• Refresh rates (sufficient to allow animation and video)
• Cost
• Reliability
Simultaneity
• Large displays
– Informational wall displays
– Interactive wall displays