interaction styles 1

Interaction Styles 1

Command languages

Fall 2007 PSYCH / CS 6750 2

Agenda

Command languagesAdvantages, disadvantagesDesign guidelines

WIMPAdvantages, disadvantagesDesign guidelines


Dialog Styles

1. Command languages 2. Menus3. WIMP - Window, Icon, Menu, Pointer

4. Direct manipulation5. Speech/Natural language6. Gesture, pen, VR


1. Command Languages

Earliest UI interaction paradigms(after punch cards gave way to interaction)

ExamplesMS-DOS shellUNIX shelldBaseGPSS


Command Line Attributes

Work primarily by recall, not recognition

Heavy memory loadLittle or nothing is visibleso…

Poor choice for novicesbut...


Command Line Advantages

Advantages for expertsSpeed, conciseness

% ls (hard to beat)Can express actions beyond a limited setFlags, piping one command to another

Repetition, extensibilityScripting, macros

Easier implementation, less overheadAbstraction, wild cards

Power


Command Line Dangers

With added power, comes added responsibility and dangerUNIX

•% rm -r *•Deletes every file that you have, and you can’t get them back


Command Line Reflection

Command languages are often maligned(for good reason)

But increased functionality can win out over bad UI (e.g., UNIX)Try to get bothAvoid excess functionality (comes at cost)


Command Line Design Goals

ConsistencySyntaxOrderEtc.

Good naming and abbreviations

Doing your homework in design can help alleviate some of the negatives

Fall 2007 PSYCH / CS 6750 10

Consistency: Syntax

Pick a consistent syntax strategyUNIX fails here because commands were developed by lots of different people at different organizations•No guidelines provided

Simple command list•e.g, vi, minimize keystrokes

Commands plus arguments•realistic, can provide keyword parameters

•% cp from=foo to=bar

Fall 2007 PSYCH / CS 6750 11

Syntax & Order Choices

English: SVO subject verb object“Bill deletes the file”

CL: S is assumed to be youIs VO or OV better?“delete file” vs. “file delete”

V dO iO vs. V iO dO -- Which is better??% print file calvin% lpr -Pcalvin file

Fall 2007 PSYCH / CS 6750 12

Ordering

Keep ordering consistentVO seems to be the most naturalTypically need to pick where options go

Example% ln -s file1 file2 (how to remember?)

Think of % cp file1 file2 for parallel command

Or “make a link of the symbolic type, pointing to file1, and called file2”

Fall 2007 PSYCH / CS 6750 13

Consistency: Terminology

Same concept expressed with same optionsUseful to provide symmetric (congruent) pairings•forward/backward•next/prev•control/meta

Fall 2007 PSYCH / CS 6750 14

Example

vi text editorw - forward wordb - backward word

Wouldn’t ‘f’ be better for forward?‘f’ already used

How about ‘fw’ and ‘bw’?Extra keystrokes

Fall 2007 PSYCH / CS 6750 15

Abbreviations...

Fall 2007 PSYCH / CS 6750 16

Abbreviations

Abbrevs. allow for faster actionsExpert performance begins to be dominated by motor times such as # of keystrokes

Not good idea for novices(Allow but don’t require)

Fall 2007 PSYCH / CS 6750 17

Picking Good Abbreviations

StrategiesSimple truncation (works best, but conflicts)

Vowel drop plus truncation (avoid conflicts)

First and last lettersFirst letters of words in a phraseStandard abbrev from other contexts

•qty, rm, bldgPhonics

•Xqt

Fall 2007 PSYCH / CS 6750 18

Abbreviation Guidelines

Use single primary rule (with single fallback for conflicts)Use fallback rule as little as possibleMark use of fallback in documentation

Let user know primary and secondary rules

Truncation is good but generates conflicts

Don’t use abbrevs. in system output


Menus

Fall 2007 PSYCH / CS 6750 20

Menus

Many different typespop-uppull-downradio buttonspie buttonshierarchies

Fall 2007 PSYCH / CS 6750 21

Menus

Key advantages:1 keystroke or mouse operation vs. many

No memorization of commandsLimited input set

Organization strategiesCreate groups of logically similar items

Cover all possibilitiesEnsure that items are non-overlapping

Keep wording concise, understandable

Fall 2007 PSYCH / CS 6750 22

Presentation SequenceLists of related items, shown in order

Use natural order if availableTime

•e.g. Breakfast, Lunch, DinnerNumeric ordering

•e.g. Point sizes for fontSize

•e.g. USA > Georgia > Fulton Co. > Atlanta

Other ChoicesAlphabetical; Group related itemsFrequently used first; Most important first

Fall 2007 PSYCH / CS 6750 23

Presentation Sequence

User studiesNovices: alpha > functional > random

Experts: categorization

How would you do it in general?

Fall 2007 PSYCH / CS 6750 24

Example: YaST

Fall 2007 PSYCH / CS 6750 25

Example: YaST


WIMP

Fall 2007 PSYCH / CS 6750 27

WIMP

Focus: Menus, Buttons, Forms

Predominant interface paradigm now (with some direct manipulation added)

Advantages:?


Direct manipulation

Fall 2006 PSYCH / CS 6750 29

Agenda

Direct manipulationDefinitionAdvantages & disadvantagesAnother characterization

Fall 2006 PSYCH / CS 6750 30

Dialog Design

1. Command language2. Menus3. WIMP4. Direct manipulation5. Pen, gesture, VE6. Speech, audio

Fall 2006 PSYCH / CS 6750 31

Direct Manipulation Essence

Representation of reality that can be manipulated

The user is able to apply intellect directly to the task

The tool itself seems to disappear

Fall 2006 PSYCH / CS 6750 32

Direct Manipulation Details

1) Continuous visibility of the objects and actions of interest

2) Rapid incremental actions whose effect is immediately noticeable

3) Reversibility of all actions to encourage experimentation

4) Syntactic correctness of all actions—every action is syntactically legal

5) Replacement of command language syntax by direct manipulation of object of interest (physical actions, buttons, etc.)

Fall 2006 PSYCH / CS 6750 33

Direct Manipulation Examples

WYSIWYG editors and word processors

VISICALC - 1st electronic spreadsheet

CADDesktop metaphorVideo games…drag and drop

Fall 2006 PSYCH / CS 6750 34

DM

Fall 2006 PSYCH / CS 6750 35

DM Advantages

Easier to learn & remember, particularly for novices

Direct WYSIWYGFlexible, easily reversible actions helps reduce anxiety in users

Fall 2006 PSYCH / CS 6750 36

DM Advantages

Provides context & instant visual feedback so user can tell if objectives are being achieved

Exploits human use of visual spatial cues

Limits types of errors that can be made

Fall 2006 PSYCH / CS 6750 37

DM Problems

Screen space intensive (info not very dense) (does this always apply?)

Need to learn meaning of components of visual representation

Visual representation may be misleading

Mouse ops may be slower than typingNot self-explanatory (no prompts)

…but wait a minute…(?)

Fall 2006 PSYCH / CS 6750 38

DM Problems

Not good atRepetition, scriptingHistory-keeping (harder)Certain tasks (Change all italics to bold)

Abstract elements (variables)Macros harder

Fall 2006 PSYCH / CS 6750 39

More Psychological View

What is directness? (not always done well)

Related to two things:Distance“Gulfs” between user’s goals & system image

Engagement

Hutchins, Hollan, Norman ‘86

Fall 2006 PSYCH / CS 6750 40

Distance: Two “Gulfs”Gulf of execution

Distance between user’s goals and means of achieving them in system• Does the system allow the user to do what the user wants to do?

Gulf of evaluation Amount of effort person must expend to interpret system state and judge if intention was achieved• Can user perceive if progressing favorably?

Goals System

Execution

Evaluation

Fall 2006 PSYCH / CS 6750 41

Directness and Distance

Two typesSemantic - Relation between what user wants to express and what is available in interface•Can I say what I want (concisely)?

Articulatory - Relation between meanings of expressions and their physical form(s)•Is the way to perform an action expected and clear (appropriate)?

Fall 2006 PSYCH / CS 6750 42

Engagement

Feeling that you are directly manipulating the objects of interest

Promoted byUnobtrusive interface Minimizing gulfs of execution and evaluation

Appropriately responsive system

Fall 2006 PSYCH / CS 6750 43

Ultimately...

In end, must characterize direct manipulation by feeling of directness and illusion of manipulating objects at hand

Fall 2006 PSYCH / CS 6750 44

Example: CAD

Fall 2006 PSYCH / CS 6750 45

Example: Photoshop

interaction styles 1

Documents

costpsych cs

vrpsych cs

barpsych cs

file2psych cs

backpsych cs

negativespsych cs

command languagespsych

dont requirepsych cs