Note - 04 - Dimensions of Interface Variability

7/25/2019 Note - 04 - Dimensions of Interface Variability

1/120

Human Computer Interaction

Dimensions of Interface Variability


2/120

Direct Manipulation &

Virtual Environments

PART 1


3/120

Introduction

Positive feelings associated with good userinterfaces:

Mastery of the interface

Competence in performing tasks

Ease in learning the system originally and in assimilatingadvanced features

Confidence in the capacity to retain mastery over time

Enjoyment in using the system

Eagerness to show the system off to novices

Desire to explore more powerful aspects of the system


4/120

Examples of

Direct-Manipulation Systems

Command line vs. display editors and word processors Training times with display editors are much less than line editors

Line editors are generally more flexible and powerful

The advances of WYSIWYG word processors:

Display a full page of text

Display of the document in the form that it will appear when the finalprinting is done

Show cursor action

Control cursor motion through physically obvious and intuitively

natural means Use of labeled icon for actions

Display of the results of an action immediately

Provide rapid response and display

Offer easily reversible actions


5/120

Examples of

Direct-Manipulation Systems: WYSIWYG

word processing


6/120

Examples of

Direct-Manipulation Systems (cont.)

Technologies that derive from the word processor:

Integration

Desktop publication software Slide-presentation software

Hypermedia environments

Improved macro facilities

Spell checker and thesaurus

Grammar checkers


7/120

Examples of


The VisiCalc spreadsheet and its descendants

VisiCalc users delighted in watching the program propagate

changes across the screen.

In some cases, spatial representations provide a better model

of reality

Successful spatial data-management systems depend on

choosing appropriate:

Icons

Graphical representations

Natural and comprehensible data layouts


8/120

Examples of

Direct-Manipulation Systems (cont.):

spreadsheet


9/120

Examples of

Direct-Manipulation Systems (cont.)spatial data management


10/120

Examples of


Video games

Nintendo Wii, Sony PlayStation, and Microsoft Xbox

Field of action is visual and compelling

Commands are physical actions whose results are immediately shown on

the screen

No syntax to remember

Most games continuously display a score

Direct manipulation in SimSity

Second Life virtual world Spore

Myst well received

DOOM and Quake controversial


11/120

Examples of


Guitar Hero video game


12/120

Examples of


Computer-aided design Computer-aided design (CAD) use direct manipulation

Manipulate the object of interest

Generate alternatives easily

Explain the impact

Problem solving by analogy to the real-world

Office automation Xerox Star was a pioneer with sophisticated formatting

Apple Lisa System

Rapid and continuous graphical interaction

Microsoft Windows is a descendant


13/120

Continuing Evolution of

Direct-Manipulation SystemsDirect-Manipulation interfaces are being used in a wide range of applications,

e.g. management dashboard for a retail store


14/120

Continuing evolution of



15/120

Discussion of

Direct Manipulation

Problems with direct manipulation

Spatial or visual representations can be too spread out

High-level flowcharts and database-schema can become

confusing Designs may force valuable information off of the screen

Users must learn the graphical representations

The visual representation may be misleading

Typing commands with the keyboard may be faster


16/120

Principles of

Direct Manipulation

1. Continuous representations of the objects and

actions of interest with meaningful visual

metaphors.

2. Physical actions or presses of labeled buttons,instead of complex syntax.

3. Rapid, incremental, reversible actions whose effects

on the objects of interest are visible immediately.


17/120

Interface-Building Tools

Visual Thinking and Icons The visual nature of computers can challenge the first

generation of hackers

An icon is an image, picture, or symbol representing a

concept Icon-specific guidelines Represent the object or action in a familiar manner

Limit the number of different icons

Make icons stand out from the background

Consider three-dimensional icons Ensure a selected icon is visible from unselected icons

Design the movement animation

Add detailed information

Explore combinations of icons to create new objects or actions


18/120

3D Interfaces

Pure 3D interfaces have strong utility in some contexts, e.g.,medical, product design. In other situations, moreconstrained interaction may actually be preferable to simplifyinteractions.

Enhanced interfaces, better than reality, can help reducethe limitations of the real-world, e.g., providing simultaneousviews.

Avatars in multiplayer 3-D worlds

First person games


19/120

3D Interfaces (cont.)


20/120

3D Interfaces (cont.)Features for effective 3D

Use occlusion, shadows, perspective, and other 3D techniques

carefully.

Minimize the number of navigation steps for users to accomplish

their tasks.

Keep text readable. Avoid unnecessary visual clutter, distraction, contrast shifts, and

reflections.

Simplify user movement.

Prevent errors.

Simplify object movement

Organize groups of items in aligned structures to allow rapid visual

search.

Enable users to construct visual groups to support spatial recall.


21/120


Guidelines for inclusion of enhanced 3D features:

Provide overviews so users can see the big picture

Allow teleoperation

Offer X-ray vision so users can see into or beyond objects.

Provide history keeping

Permit rich user actions on objects

Enable remote collaboration

Give users control over explanatory text and let usersselect for details on demand.

Offer tools to select, mark, and measure.


22/120


Guidelines for inclusion of enhanced 3D features(cont.):

Implement dynamic queries to rapidly filter out unneededitems.

Support semantic zooming and movement

Enable landmarks to show themselves even at a distance

Allow multiple coordinated views

Develop novel 3D icons to represent concepts that are

more recognizable and memorable.


23/120

Teleoperation

Two parents: direct manipulation in personal computersand process control in complex environments

Physical operation is remote

Complicating factors in the architecture of remote

environments: Time delays

transmission delays

operation delays

Incomplete feedback Feedback from multiple sources

Unanticipated interferences


24/120

Virtual and

Augmented Reality

Virtual reality breaks the physical limitations of space and

allow users to act as though they were somewhere else

Augmented reality shows the real world with an overlay of

additional overlay Situational awareness shows information about the real world

that surrounds you by tracking your movements in a computer

model

Augmented reality is an important variant Enables users to see the real world with an overlay of

additional interaction.


25/120

Virtual and

Augmented Reality (cont.)

Successful virtual environments depend on thesmooth integration of:

Visual Display

Head position sensing

Hand-position sensing

Force feedback

Sound input and output

Other sensations

Cooperative and competitive virtual reality


26/120

Impact of this

technology in our everyday lives


27/120

Menu, Form & Dialogue Box

PART 2


28/120

Task-Related

Organization

"The primary goal for menu, form fill-in, and

dialog-box designers is to create a sensible,

comprehensible, memorable, and convenientorganization relevant to the user's task."


29/120

Single Menus

Binary Menus

Mnemonic letters

Radio Buttons

Button Choice

3. What is your marital status?o Single

o Married

o Widowed/divorced/separated


30/120

Single Menus (cont.)

Multiple-item Menus

Multiple-selection menus or check boxes


31/120


Pull-down, pop-up, and toolbar menus Pull-down menus

Always available to the user by making selections on atop menu bar

Pull-down menus (cont.) Key board shortcuts

E.g., Ctrl-C important to support expert userefficiency

Toolbars, iconic menus, and palletes

Offers actions on a displayed object Pop-up menus

Appear on a display in response to a check or tapwith a pointing device.


32/120



33/120


To see updates from friends, photos and feeds, the Zumobi Ziibii interface

(http://www.zumobi.com) allows users to choose between two styles of presentation.

On the left is a static list of text/image items with a gestural swipe used to control

paging, and on the right is a dynamic scrolling ticker (called River) which

horizontally scrolls titles and images across the screen.


34/120



35/120


Menus for long lists Scrolling menus, combo boxes, and fisheye menus

Scrolling menus display the first portion of the menuand an additional menu item, typically an arrow thatleads to the next set of items in the menu sequence.

Combo boxes combine a scrolling menu with a text-entry filed.

Fisheye menus display all of the menu items on thescreen at once, but show only items near the cursor atfull size.


36/120


Menus for long lists (cont.)

Sliders and alphasliders

When items consist of ranges or numerical

values, a slider is a natural choice to allow the

selection of a value.

The alphaslider uses multiple levels of

granularity in moving the slider thumb and

therefore can support tens or hundreds ofthousand of items.


37/120


Menus for long lists (cont.)

Two-dimensional menus

Fast and vast two-dimensional menus give users a

good overview of the choices, reduce the number of

required actions, and allow rapid selection.


38/120



39/120


Embedded menus and hotlinks

Embedded menus are an alternative to explicit menus

It is natural to allow users reading about people, events,

and places to retrieve detailed information by selecting

menus in context.


40/120



41/120

Combination of

Multiple Menus

Linear menu sequences and simultaneous menus

Linear

Guide the user through complex decision-making

process.

E.g. cue cards or "Wizards"

Effective for novice users performing simple tasks

Simultaneous

Present multiple active menus at the same time andallows users to enter choices in any order


42/120

Combination of

Multiple Menus (cont.)

Tree-structured menus

Designers can form categories of similar items to create a

tree structure

E.g., fonts, size style, spacing

Fast retrieved if natural and comprehensive

Use terminology from the task domain

Expanding menus maintain the full context of each choice

E.g., Windows Explorer


43/120

Combination of

Multiple Menus (cont.)

Menu Maps

Menu maps can help users stay oriented in a large menutree

Effective for providing overviews to minimize userdisorientation.

Acyclic and Cyclic Networks

Useful for

social relationships transportation routing

scientific-journal citations

Can cause confusion and disorientation.


44/120

Content Organization

Task-related grouping in tree organization

Create groups of logically similar items

Form groups that cover all possibilities

Make sure that items are nonoverlapping Use familiar terminology, but ensure that items are distinct

from one another


45/120

Content Organization (cont.)

Item Presentation Sequence The order of items in the menu is important, and should

take natural sequence into account when possible:

Time

Numeric ordering Physical properties

When cases have no task-related orderings, the designermust choose from such possibilities as:

Alphabetic sequence of terms

Grouping of related items Most frequently used items first

Most important items first.


46/120


Adaptive menus in Microsoft Office.

A font-selection menu lists the

recently used fonts near the top ofthe menu (as well as in the full list),

making it easier to quickly select

the popular fonts.


47/120


Menu layout


48/120


Menu layout (cont.)

Titles

For single menus, use a simple descriptive title.

For tree-structured menus, use the exact same words in

the higher-level menu items as in the titles for the nextlower-level menu.

E.g. if a menu item is called Business and FinancialServices, the next screen should have that phrase asits title.


49/120


Menu layout

Titles (cont.)

Phrasing of menu items

Use familiar and consistent terminology

Ensure that items are distinct from one another

Use consistent and concise phrasing

Bring the keyword to the left


50/120


Menu layout (cont.)

Graphic layout and design

Constraints

screen width and length

display rate

character set

highlighting techniques


51/120


Menu layout (cont.)

Establish guidelines for consistency of at least these

menu components:

Titles

Item placement

Instructions

Error messages

Status reports


52/120


Menu layout (cont.)

Techniques

Indentation

Upper/lower case characters

Symbols such as * or - to create separators or outlines

Position markers

Cascading or walking menus

Magic lens


53/120

Fast Movement Through Menus

Keyboard shortcuts

Supports expert use

Can make translation to a foreign language more difficult

Bookmarks in browsers

User configured toolbars

D E i h M F


54/120

Data Entry with Menus: Form

Fill-in, Dialog Boxes, and Alternatives

Form Fill-in

Appropriate when many fields of data must be entered:

Full complement of information is visible to user.

Display resembles familiar paper forms. Few instructions are required for many types of entries.

Users must be familiar with:

Keyboards

Use of TAB key or mouse to move the cursor

Error correction methods

Field-label meanings

Permissible field contents

Use of the ENTER and/or RETURN key.

D E i h M F


55/120



D t E t ith M F


56/120



D t E t ith M F


57/120

Format-specific field

Coded fields

Telephone numbers

Social-security numbers

Times

Dates

Dollar amounts (or other currency)



D t E t ith M F


58/120

Dialog Boxes

Combination of menu and form fill-in techniques.

Internal layout guidelines:

Meaningful title, consistent style

Top-left to bottom-right sequencing

Clustering and emphasis

Consistent layouts (margins, grid, white space, lines, boxes)

Consistent terminology, fonts, capitalization, justification

Standard buttons (OK, Cancel) Error prevention by direct manipulation



D t E t ith M F


59/120

Dialog Boxes (cont.)

External Relationship

Smooth appearance and disappearance

Distinguishable but small boundary

Size small enough to reduce overlap problems

Display close to appropriate items

No overlap of required items Easy to make disappear

Clear how to complete/cancel



D t E t ith M F


60/120

Novel design combining menus and direct manipulation

Pie menus (example here)

Control menus

Marking menus

Flow menus

Toolglass



Audio Menus and


61/120

Audio Menus and

Menus for Small Displays

Menu systems in small displays and situations where handsand eyes are busy are a challenge.

Audio menus Verbal prompts and option descriptions

Input is normally verbal or keypad

Not persistent, like a visual display, so memorization isrequired.

Request users can avoid listening to options

Audio Menus and


62/120

Audio Menus and

Menus for Small Displays (cont.)

Menu for small displays

E.g., entertainment, communication services

Learnability is a key issue

Hardware buttons

Navigation, select

Expect interactions

Tap interface GPS and radio frequency identification provides same

automatic input

Audio Menus and


63/120

Audio Menus and


Telephone menus use soft keys to present context-dependent menu items. The

convention used here is to consistently place selections on the left side and back

or exit options on the right side. Hard buttons control the connect and disconnect

functions. Dedicated buttons facilitate scrolling through lists. The current position in

the list is indicated on the right side of the screen.

Audio Menus and


64/120

Audio Menus and


The Zumobi interface (http://www.zumobi.com) on a mobile phone starts with

four tiles using a two-level zoom interaction to see the tile details (left side).

The user can specify which tiles are in their zoomspace. Then, when they

become more familiar with the interface, they can add up to a total of 16 tiles

using a three-level zoom interaction to smoothly go between overview, zone

view, and detail view (right side). The application accommodates thumb use on

touchscreens, numeric key pads for zone-based zooming, 4-way D-Pads, and even

thumb-roller controllers.


65/120

Command & Natural Languages

PART 3

Basic Goals


66/120

Basic Goals

of Language Design

Precision

Compactness

Ease in writing and reading Speed in learning

Simplicity to reduce errors

Ease of retention over time

Higher Level


67/120

Higher-Level

Goals of Language Design

Close correspondence between reality and the

notation

Convenience in carrying out manipulations relevant

to user's tasks

Compatibility with existing notations

Flexibility to accommodate novice and expert users

Expressiveness to encourage creativity

Visual appeal

Functionality to


68/120

Functionality to

Support Users Tasks

Users do wide range of work:

text editing

electronic mail financial management

airline or hotel reservations

inventory manufacturing process control

gaming

Functionality to


69/120

Functionality to

Support Users Tasks (cont.)

Designers should

determine functionality of the system by studying users' task domain

create a list of task actions and objects

abstract this list into a set of interface actions and objects

represent low-level interface syntax

create a table of user communities and tasks, with expected use frequency

determine hierarchy of importance of user communities (i.e. prime users)

evaluate destructive actions (e.g. deleting objects) to ensure reversibility

identify error conditions and prepare error messages

allow shortcuts for expert users, such as macros and customizing system

parameters


70/120

Command-Organization


71/120

Command-Organization

Strategies

A unifying interface concept or metaphor aids learning

problem solving

retention

Designers often err by choosing a metaphor closer to machinedomain than to the user's task domain.

Simple command set Each command is chosen to carry out a single task. The number of

commands match the number of tasks. For small number of tasks, this can produce a system easy to learn and

use.

E.g. the vi editor of Unix.

Command plus


72/120

Command plus

arguments/options

Command plus arguments

Follow each command by one or more arguments that indicate objects to bemanipulated, e.g. COPY FILEA, FILEB

DELETE FILEA

PRINT FILEA, FILEB, FILEC Keyword labels for arguments are helpful for some users, e.g. COPY FROM=FILEA

TO=FILEB.

Commands may also have options to indicate special cases, e.g.: PRINT/3,HQ FILEA

PRINT (3, HQ) FILEA

PRINT FILEA -3, HQ

to produce 3 copies of FILEA on the printer in the headquarters building.

Error rates and the need for extensive training increase with the number ofpossible options.


73/120

Benefits of Structure

Human learning, problem solving, and memory are greatly facilitated bymeaningful structure.

Beneficial for task concepts

computer concepts

syntactic details of command languages

Consistent Argument Ordering

Inconsistent order of arguments Consistent order of argumentsSEARCHfile no, message id SEARCH message id, file no

TRIM message id, segment sizeTRIM message id, segment size

REPLACE message id, code no REPLACE message id, code no

INVERT group size, message id INVERT message id, group size

Hierarchical


74/120

Hierarchical

command structure

The full set ofcommands is

organized into a

tree structure

5x3x4 = 60 taskswith 5 command

names and 1 rule of

formation

Action Object Destination

CREATE File File

DISPLAY Process Local printer

REMOVE Directory Screen

COPY Remote

printer

MOVE


75/120

Symbols vs. Keywords

Command structure affects performance

Symbol Editor Keyword Editor

FIND:/TOOTH/;-1 BACKWARD TO "TOOTH"

LIST;10 LIST 10 LINES

RS:/KO/,/OK/;* CHANGE ALL "KO" TO "OK"


76/120

Naming & Abbreviations

There is often a lack of consistency or obvious strategy for constructionof command abbreviations.

Specificity Versus Generality

Infrequent, discriminating words insert delete

Frequent, discriminating words add remove

Infrequent, nondiscriminating words amble perceive

Frequent, nondiscriminating words walk view

General words (frequent, nondiscriminating) alter correct

Nondiscriminating nonwords (nonsense) GAC MIK

Discriminating nonwords (icons) abc-adbc abc-ab

Six Potential


77/120

Six Potential

Abbreviation Strategies

1. Simple truncation: The first, second, third, etc. letters of each

command.

2. Vowel drop with simple truncation: Eliminate vowels and use some of

what remains.

3. First and last letter: Since the first and last letters are highly visible,

use them.

4. First letter of each word in a phrase: Use with a hierarchical design

plan.

5. Standard abbreviations from other contexts: Use familiarabbreviations.

6. Phonics: Focus attention on the sound.

Guidelines for


78/120

Guidelines for

using Abbreviations

Ehrenreich and Porcu (1982) offer this set of guidelines:

A simple primary rule should be used to generate abbreviations for most items; a simple

secondary rule should be used for those items where there is a conflict.

Abbreviations generated by the secondary rule should have a marker (for example, anasterisk) incorporated in them.

The number of words abbreviated by the secondary rule should be kept to a minimum.

Users should be familiar with the rules used to generate abbreviations.

Truncation should be used because it is an easy rule for users to comprehend and

remember. However, when it produces a large number of identical abbreviations for

different words, adjustments must be found. Fixed-length abbreviations should be used in preference to variable-length ones.

Abbreviations should not be designed to incorporate endings (ING, ED, S).

Unless there is a critical space problem, abbreviations should not be used in messages

generated by the computer and read by the user.

Command-language


79/120

Command language

Guidelines

Natural Language


80/120

Natural Language

in Computing

Natural-language interaction

Natural-language queries and question answering

Text-database searching Natural-language text generation

Adventure games and instructional systems

Natural Language


81/120

Natural Language

in Education

CognitiveTutor traces student progress in mastering skills and

concepts, then assigns individually tuned problems

Communicating with students via Natural Language


82/120

Interaction Devices

PART 4

K b d L


83/120

Keyboard Layouts

QWERTY layout 1870 Christopher Latham Sholes

good mechanical design and a clever placement of the letters that sloweddown the users enough that key jamming was infrequent

put frequently used letter pairs far apart, thereby increasing finger traveldistances

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

K b d L


84/120

Keyboard Layouts

K b d L ( )


85/120

Keyboard Layouts (cont.)

ABCDE style 26 letters of the alphabet laid out in alphabetical order

nontypists will find it easier to locate the keys

Additional keyboard issues IBM PC keyboard was widely criticized because of the

placement of a few keys

backslash key where most typists expect SHIFT key

placement of several special characters near the ENTER key

Number pad layout

wrist and hand placement

K b d L t ( t )


86/120


Keys 1/2 inch square keys

1/4 inch spacing between keys

slight concave surface

matte finish to reduce glare finger slippage

40- to 125-gram force to activate 3 to 5 millimeters displacement

tactile and audible feedback important

certain keys should be larger (e.g. ENTER, SHIFT, CTRL)

some keys require state indicator, such as lowered position or lightindicator (e.g. CAPS LOCK)

key labels should be large, meaningful, permanent

some "home" keys may have additional features, such as deeper cavityor small raised dot, to help user locate their fingers properly (caution -no standard for this)

K b d L t ( t )


87/120


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

K b d L t ( t )


88/120


Cursor movement keys up, down, left, right

some keyboards also provide diagonals

best layout is natural positions

inverted-T positioning allows users to place their middlethree fingers in a way that reduces hand and fingermovement

cross arrangement better for novices than linear or box

typically include typamatic (auto-repeat) feature

important for form-fillin and direct manipulation other movements may be performed with other keys, such

as TAB, ENTER, HOME, etc.

K b d L t ( t )


89/120


Keyboard and keypads for small devices

Wireless or foldable keyboards

Virtual keyboards

Cloth keyboards

Soft keys

Pens and touchscreens

K b d L t ( t )


90/120


The popular RIM Blackberry (http://www.blackberry.com) shown here on the left

demonstrated that many people could use a reduced-size keyboard on a regular basis;

users typically type with one finger or with both thumbs. The Nokia device in the middle

shows that non-English-speaking countries may use different keyboard layouts (here, a

French AZERTY keyboard). On the right, a larger keyboard uses the longer dimension of

the device and can be slid back into the device when not needed (http://www.nokia.com).

K b d L t ( t )


91/120


Dasher predicts probable characters and words as users make their selections

in a continuous two-dimensional stream of choices

Other text entry methods


92/120

Other text entry methods

The virtual keyboard of

the Apple iPhone gainsprecision by allowing finger

repositioning and then

activates on lift-off

Other text


93/120

entry methods (cont.)

Another method is to handwrite on a touch sensitive

surface, typically with a stylus using Graffiti on the Palm devices

Pointing Devices


94/120

Pointing Devices

Pointing devices are applicable in six types of interaction tasks:

1. Select: user chooses from a set of items.

used for traditional menu selection, identification of a file in a directory, or marking of a part in an automobiledesign.

2. Position: user chooses a point in a one-, two-, three-, or higher-dimensional space

used to create a drawing, to place a new window, or to drag a block of text in a figure.

3. Orient:

user chooses a direction in a two-, three-, or higher-dimensional space. 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.

4. Path: user rapidly performs a series of position and orient operations.

may be realized as a curving line in a drawing program, the instructions for a cloth cutting machine, or the route ona map.

5. Quantify: user specifies a numeric value.

usually a one-dimensional selection of integer or real values to set parameters, such as the page number in adocument, the velocity of a ship, or the amplitude of a sound.

6. Text: user enters, moves, and edits text in a two-dimensional space. The

pointing device indicates the location of an insertion, deletion, or change.

more elaborate tasks, such as centering; margin setting; font sizes; highlighting, such as boldface or underscore;and page layout.

Pointing Devices


95/120

Pointing Devices

Direct-Control


96/120

Pointing Devices

Lightpen enabled users to point to a spot on a screen and to

perform a select, position, or other task

it allows direct control by pointing to a spot on the

display 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 theirhands from the keyboard, and users had to pick up thelightpen

Direct-Control


97/120

Pointing Devices (cont.)

Touchscreen

allows direct control touches on the screen using a finger

early designs were rightly criticized for causing fatigue, hand-

obscuring-the-screen, hand-off-keyboard, imprecise pointing, and the

eventual smudging of the display lift-off strategy enables users to point at a single pixel

the users touch the surface

then see a cursor that they can drag around on the display

when the users are satisfied with the position, they lift their fingers off

the display to activate

can produce varied displays to suit the task

are fabricated integrally with display surfaces

Direct-control


98/120

pointing devices (cont.)

Tablet PCs and Mobile Devices:

Natural to point on the LCD surface

Stylus

Keep context in view

Pick up & put down stylus

Gestures and handwriting recognition

Indirect


99/120

Pointing Devices

mouse the hand rests in a comfortable position, buttons

on the mouse are easily pressed, even longmotions can be rapid, and positioning can beprecise

trackball

usually implemented as a rotating ball 1 to 6inches in diameter that moves a cursor

joystick are appealing for tracking purposes

graphics tablet a touch-sensitive surface separate from the

screen

touchpad built-in near the keyboard offers the convenience

and precision of a touchscreen while keeping theuser's hand off the display surface

Comparison of


100/120

Pointing Devices Human-factors variables

speed of motion for short and long distances

accuracy of positioning

error rates

learning time

user satisfaction

Other variables

cost

durability

space requirements weight

left- versus right-hand use

likelihood to cause repetitive-strain injury

compatibility with other systems

Comparison of


101/120

Pointing Devices (cont.)

Some results

direct pointing devices faster, but less accurate

graphics tablets are appealing when user can remain with device for long periods

without switching to keyboard

mouse is faster than isometric joystick

for tasks that mix typing and pointing, cursor keys a faster and are preferred by users toa mouse

muscular strain is low for cursor keys

Fitts' Law

Index of difficulty = log2 (2D / W)

Time to point = C1 + C2 (index of difficulty)

C1 and C2 and constants that depend on the device

Index of difficulty is log2 (2*8/1) = log2(16) = 4 bits

A three-component equation was thus more suited for the high-precision pointing task:

Time for precision pointing = C1 + C2 (index of difficulty) + C3 log2 (C4 / W)

Novel Devices


102/120

Novel Devices

1. Foot controls

2. Eye-tracking

3. Multiple-degrees-of-freedom devices

4. DataGlove

5. Haptic feedback6. Bimanual input

7. Ubiquitous computing and tangible user interfaces

8. Handheld devices

9. Smart pens10. Table top touch screens

11. Game controllers

Novel Devices (cont.)


103/120

( )

Speech and


104/120

Auditory Interfaces

Speech recognition still does not match thefantasy of science fiction:

demands of user's working memory background noise problematic

variations in user speech performance impactseffectiveness

most useful in specific applications, such as tobenefit handicapped users

Speech and


105/120

Auditory Interfaces (cont.)

Speech and


106/120


Discrete word recognition recognize individual words spoken by a specific person; can work with 90- to 98-

percent reliability for 20 to 200 word vocabularies

Speaker-dependent training, in which the user repeats the full vocabulary once ortwice

Speaker-independent systems are beginning to be reliable enough for certaincommercial applications

been successful in enabling bedridden, paralyzed, or otherwise disabled people

also useful in applications with at least one of the following conditions: speaker's hands are occupied

mobility is required

speaker's eyes are occupied

harsh or cramped conditions preclude use of keyboard

voice-controlled editor versus keyboard editor lower task-completion rate

lower error rate

use can disrupt problem solving

Speech and


107/120


Continuous-speech recognition Not generally available:

difficulty in recognizing boundaries between spoken words

normal speech patterns blur boundaries

many potentially useful applications if perfected

Speech store and forward Voice mail users can

receive messages

replay messages

reply to caller

forward messages to other users, delete messages archive messages

Systems are low cost and reliable.

Speech and


108/120


Voice information systems Stored speech commonly used to provide information about tourist

sites, government services, after-hours messages for organizations

Low cost

Voice prompts Deep and complex menus frustrating

Slow pace of voice output, ephemeral nature of speech, scanningand searching problems

Voice mail

Handheld voice recorders

Audio books

Instructional systems

Speech and


109/120


Speech generation Michaelis and Wiggins (1982) suggest that speech generation is

"frequently preferable" under these circumstances:

The message is simple.

The message is short.

The message will not be referred to later.

The message deals with events in time.

The message requires an immediate response.

The visual channels of communication are overloaded.

The environment is too brightly lit, too poorly lit, subject to severevibration, or otherwise unsuitable for transmission of visualinformation.

The user must be free to move around.

The user is subjected to high G forces or anoxia

Speech and


110/120


Audio tones, audiolization, and music

Sound feedback can be important:

to confirm actions

offer warning

for visually-impaired users

music used to provide mood context, e.g. in games

can provide unique opportunities for user, e.g. with

simulating various musical instruments

Displays Small and Large


111/120

Displays Small and Large

The display has become the primary source offeedback to the user from the computer The display has many important features, including:

Physical dimensions (usually the diagonal dimension anddepth)

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

Displays Small and Large (cont.)


112/120

Displays Small and Large (cont.)

Usage characteristics distinguish displays:

Portability

Privacy

Saliency

Ubiquity

Simultaneity

Display technology


113/120

Display technology

Monochrome displays are adequate, and are attractive because of their lower cost

RGB shadow-mask displays small dots of red, green, and blue phosphors packed closely

Raster-scan cathode-ray tube (CRT)

electron beam sweeping out lines of dots to form letters refresh rates 30 to 70 per second

Liquid-crystal displays (LCDs) voltage changes influence the polarization of tiny capsules of liquid crystals

flicker-free

size of the capsules limits the resolution

Plasma panel

rows of horizontal wires are slightly separated from vertical wires by small glass-enclosedcapsules of neon-based gases

Light-emitting diodes (LEDs) certain diodes emit light when a voltage is applied

arrays of these small diodes can be assembled to display characters

Display technology (cont.)


114/120

Display technology (cont.)

Electronic ink

Paper like resolution

Tiny capsules with negatively and positivelycharged particles

Braille displays

Pins provide output for the blind

Displays Large and Small (cont.)


115/120


Large displays

Informational wall

displays Interactive wall

displays

Multiple desktop

displays



116/120


Heads-up and helmet mounted displays

A heads-up display can, for instance, project

information on a partially silvered widescreen of

an airplane or car

A helmet/head mounted display (HMD) moves

the image with the user

3D images

Mobile Device Displays


117/120

Mobile Device Displays

Currently mobile devices used forbrief tasks, except for game playing

Optimize for repetitive tasks

Custom designs to take advantageof every pixel

DataLens allows compact overviews

Web browsing difficult

Okay for linear reading, but making

comparisons can be difficult

Animation, image, and video


118/120

Animation, image, and video

Accelerated graphics hardware More information shared and downloaded on the

web

Scanning of images and OCR

Digital video

CD-ROMs and DVDs

Compression and decompression through MPEG

Computer-based video conferencing

Reference


119/120

Reference

Shneiderman, B. andPlaisant, C. (2004).

Designing the User

Interface. 5th Edition,Pearson.


120/120

Documents

Note - 04 - Dimensions of Interface Variability