Specification and Design of User Interface Software - PowerPoint PPT Presentation


PPT – Specification and Design of User Interface Software PowerPoint presentation | free to download - id: 3b9e76-ZTI5Y


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation

Specification and Design of User Interface Software


Specification and Design of User Interface Software Presentation to CS577a University of Southern California Dr. Barry Boehm Steven M. Jacobs September 20, 2000 – PowerPoint PPT presentation

Number of Views:220
Avg rating:3.0/5.0
Slides: 49
Provided by: sunsetUsc
Learn more at: http://sunset.usc.edu


Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: Specification and Design of User Interface Software

Specification and Design of User Interface
Presentation to CS577a University of Southern
California Dr. Barry Boehm
Steven M. Jacobs September 20, 2000
Steven M. Jacobs M.S.C.S. from UCLA, B.A. in Math
from Monmouth University (N.J.) Steven M. Jacobs
is an Engineering Center Manager at TRW Systems
Information Technology Group in Carson,
California. Prior to this role, he was Director
of Software Development at Beckman Instruments,
developing computerized clinical systems. Prior
to joining Beckman, Mr. Jacobs managed the Human
Machine Interface (HMI) Systems Department at TRW
in Redondo Beach, California. He managed a group
of engineers developing user interface and
applications software for various government
applications. Mr. Jacobs has chaired two
workshops and a panel session at ACM SIGCHI CHI
conferences. He has been a lecturer at both the
USC Department of Computer Science and UCLA
Extension developing courses in user interface
design. He is a member of the Editorial Board of
ACM Interactions magazine. He has authored over
20 publications on software engineering and user
interface related topics.
Steven M. Jacobs TRW M/S DH6/2774 1800 Glenn
Curtiss Street Carson, CA 90746 Voice (310)
764.3400 steve.jacobs_at_trw.com
User Interface Software Development
Practical Lessons Learned
Theoretical Advances
Products, Tools, and Standards
You Can Call It Human Machine Interface
(HMI) Or - MMI (Man Machine
Interface) - CHI (Computer Human
Interaction) - HCI (Human Computer
Interaction) - USI (User System
Interface) - UI (User Interface) - SMI (Soldier
Machine Interface) - HCC (Human Computer
Communication) - OI (Operator Interface)
Definition of Human Machine Interface
All aspects of system design that affect system
use S. Smith
My Definition of Human Machine Interface
The Development of a Human Beings Interaction
with a Computer System Multi-Disciplinary - Sy
stems Engineering - System Architecture - HMI
Software Design and Development - Human Factors
Engineering - Cognitive Science - Artificial
Intelligence - Others, e.g. Expert
HMI Multi-Phase (All Phases of the software
life-cycle) - Proposal - Requirement - Desig
n - Code - Integrate and Test - Install and
Train - Operate and Maintain
Problem Statement
The role of the human in HMI is shifting from
doing a specific task to monitoring, analysis,
decision support and directing
As designers strive to build more powerful
hardware and software systems, the risk is that
the complexity will overwhelm the humans who use
them. IEEE Spectrum
Problems with User Interfaces
User Interface accounts for a large portion of
life-cycle costs - application algorithms -
40 - dialogue management - 40 - presentation
- 20 UI development is extremely labor
intensive UIs require frequent and extensive
modifications due to not understanding all
interactions until the system is completely
developed Modifications to UI are difficult to
make when the UI and the application are tightly
interwoven Difficult to take advantage of new
I/O technologies if they do not match the current
Motivation for Increased Interest in Human
Computer Interaction
Use of computers in life critical
systems - Intensive care/operating
room - Reactor/air traffic control/utilities - P
olice/fire dispatching Need for high volume
commercial systems - Banking/insurance/reservatio
ns/credit card - Inventory control/sales/billing
Use by a diverse population with limited
training - Office automation and word
processing - Home/personal/educational
computing Opportunity to enhance human
intellect - Programmer/artist workstation - Deci
sion support/expert systems - Information
retrieval - Simulations
Reducing UI Problems
Separate concern of user interface
specification and execution from rest of system
concerns - separate the algorithmic portion of a
system from the interactive portion - allow for
independent development of the application and
UI Provide an integrated set of tools which
support incremental specification and execution
of the interface Use a good UI design process
An Overview of User Interface Development
Problems of User Interface Development Diversit
y of Users Diversity of Applications Changin
g Technology An Iterative Lifecycle Design I
mplementation Evaluation Meshed with the
Software Development Lifecycle
User Interface Development Process
Task Analysis Standards Guidelines Experience Psyc
hology and Human Factors
Formal Models
Usage Data
User Interface Design
Input Task Analysis Psychology and Human
Factors Principles, Guidelines, Standards,
Rules Input and Output Technology Dialogue
Types Enhanced/Adaptive Interaction Prototyp
ing Evaluation of Existing Systems Output De
sign Specification
User Interface Implementation
Fundamental Concepts Independence and
Reusability Ease of Use Topics Interaction
Dialogue Types Interaction Libraries Dialogu
e Control Structure Models User Interface
Management Systems User Guidance
User Interface Evaluation
Types of Evaluation Empirical
Evaluation Theoretical/Predictive Evaluation
Models Empirical Evaluation Measurement of
Success (Validity Reliability) - Operational
Definitions - Scales of Measurement
User Interface Evaluation (Contd)
Collecting Data (Experimental Design and
Sampling) - Expert Commentary, Peer/Customer
Review - Video/Audio Protocols - Survey
Questionnaires - Program Instrumentation Anal
yzing User Interface Data - Descriptive/Inferent
ial Statistics and Graphs - Evaluating
Empirical Results
Key User Interface Concepts
Mental/Conceptual Models Efficient Access
to Resources Need for Evaluation Iterative
Design Cycle Design/Implementation
Tradeoffs Levels of User Knowledge/Experience
Application/Device Independent
Tools Consistency
Interactive Systems Lifecycle (Shneiderman)
1. Collect Information 2. Define Requirements
and Semantics 3. Design Syntax and Support
Facilities 4. Specify Physical
Devices 5. Develop Software 6. Integrate System
and Disseminate to Users 7. Nurture the User
Community 8. Prepare Evolutionary Plan
Participatory Design and Evolutionary Refinement
Based on User Feedback
Interactive Systems Lifecycle
1. Collect Information - Organize the design
team - Obtain management and customer
participation - Conduct interviews with
users - Submit written questionnaires to
users - Perform detailed task and task
frequency analysis - Read professional and
academic literature - Speak with designers and
users of similar systems - Estimate
development, training, usage, maintenance
costs - Prepare a schedule with observable
milestones and reviews - Design the testing
Interactive Systems Lifecycle (Continued)
2. Define requirements and semantics - Define
high-level goals and middle-level
requirements - Consider task flow sequencing
alternatives - Organize tasks into transaction
units - Create task objects and
actions - Create computer objects and
actions - Determine reliability and
availability needs - Specify security, privacy,
and integrity constraints - Create guidelines
document - Obtain management and customer
agreement on goals, requirements, and
semantic design
Interactive Systems Lifecycle (Continued)
3. Design syntax and support facilities - Compar
e alternative display formats - Create syntax
for operations - Design informative feedback
for each operation - Develop error
diagnostics - Specify system response times and
display rates - Plan user aids, help
facilities, and tutorials - Write user and
reference manuals - Review, evaluate, and
revise design specifications - Carry out
paper-and-pencil pilot tests or field studies
with an online mock-up or prototype.
Interactive Systems Lifecycle (Continued)
4. Specify physical devices - Choose hard- or
softcopy devices - Specify keyboard
layout - Select audio, graphics, or peripheral
devices - Establish requirements for
communications lines - Consider work
environment noise, lighting, table space,
etc. - Carry out further pilot tests and revise
Interactive Systems Lifecycle (Continued)
5. Develop software - Use dialog management
tools where available - Produce top-down
modular design - Emphasize modifiability and
maintainability - Ensure reliability and
security - Enable user and system performance
monitoring - Provide adequate system
documentation - Conduct thorough software test
with realistic usage load
Interactive Systems Lifecycle (Continued)
6. Integrate system and disseminate to
users - Assure user involvement at every
stage - Conduct acceptance tests and fine tune
the system - Field test printed manuals, online
help, and tutorials - Implement a training
subsystem or simulator - Provide adequate
training and consultation for users - Follow
phased approach to dissemination and provide time
and resources to make modest revisions in
response to user feedback
Interactive Systems Lifecycle (Continued)
7. Nurture the user community - Provide
on-site or telephone consultants - Offer
on-line consultant - Develop on line
suggestion box - Perform interviews with
users - Make user news and bulletin board
available on-line - Publish newsletter for
users - Organize group meetings - Respond
to user suggestions for improvements - Conduct
subjective and objective evaluations of the
current system and proposed improvements. -
Monitor usage frequencies and patterns - Track
user error frequencies.
Interactive Systems Lifecycle (Concluded)
8. Prepare evolutionary plan - Design for easy
repair and refinement - Measure user
performance regularly - Improve error
handling - Carry out experiments to assess
suggested changes - Sample feedback from users
by questionnaires and interviews - Schedule
revisions regularly and inform users in advance
Spiral Model of the Software Process (B. Boehm)
Star Life Cycle Model (R. Hartson and D. Hix)
  • An iterative, evaluation-centered life cycle for
    human computer interaction development

Task/ Functional/ User Analyses
Requirements/ Specifications
Conceptual/ Formal Detailed Design
Software Production
Rapid Prototyping
User Interface Engineering
UI engineering is the result of trends shaping
the UI practice the software explosion, the
communications explosion, the media explosion,
the usability explosion. The challenge is to
integrate user interface engineering process
within the development process User
Interface Development Phase Software
Engineering User task analysis Requirements
Analysis Application Design Human vs.
machine Requirements Allocation Hardware vs.
Software Dialogue design Preliminary
Design Architectural Design Screen
design Detailed Design Logical
Design Coding Implementation Coding Usability
Lab Implementation Testing Unit Integration
Testing Contextual Observance System
Testing System Testing Human Performance Optimiza
tion Machine Performance
User Interface Life Cycle Models
  • There are a number of user interface
    engineering life-cycle models
  • No right answer/no perfect model
  • Whether you follow Shneiderman model, user
    interface engineering, user interface development
    as part of the Spiral Model, etc., there is no
    right answer how to integrate the user interface
    development into the software development
  • Most user interface development methodologies
    are evaluation centered and iterative
  • When to stop and when to start is unclear
  • Differences require tailoring for your application

Internet User Interfaces
Web site design is only part of the Internet
picture (Intranet technologies) There are
many separate courses and books on web site
design, e.g. Designing Large Scale Web Sites,
by D. Sano, Creating Killer Web Sites, by
David Siegel, Web Weaving, by C. Steadman,
et al. There are web site bulletin board forums
for people to compare. e.g. http//www.highfive.
com http//www.killersites.com One forum
evaluates site design by degree of difficulty,
execution and esthetics. Determining website
usability, examining style and design maturity,
etc. is growing., e.g. http//useableweb.com Som
e have usability tested and spent significant
effort creating a web site style. They developed
a web site style guide and enforce it, e.g. as
Sun did http//www.sun.com/sun-on-net/uidesign
There are many other style guides, e.g.
Internet User Interfaces (Contd)
Need to understand supporting graphics and
rendering technologies Need to understand
multimedia impact on UI Need to usability test
web site design as you do any UI Web site
design is more than composing good HTML, although
that is important. An HTML Authors Board site
has good HTML style suggestions. There is lots
of material on good HTML, Java (de facto Internet
standard) writing, etc. Interactions paper on
Heuristic Evaluation of a WWW prototype by J.
Nielsen of Sun. Growing corporate interest in
intranets and related technology
Internet User Interfaces (Contd)
Here are some web site guidelines Site
tourists you cannot control the user Loyal
visitors you almost want to say Please bookmark
me Avoid frames People will not hang
around if they see the site is not maintained
current. Web users are impatient. Reduce
scrolling, especially at the home page Avoid
animation unless it has a purpose, like showing
how a games is played. Do not design it for VPs
or to match the organization. The information
architecture should mirror the user tasks.
There should be a strong, consistent web design
within a companys web pages. A site needs to
make clear what it is supposed to do and how it
is organized. Always have search on web
page. Dont match other media, e.g. brochures,
TV ad, and push that onto the web page. Do the
web first.
Internet User Interfaces (Contd)
Link wisely, not everything. Also, dont just
say click here without a highlight or
reference. Tell people where you are. Provide
navigation buttons and/or site maps. On-line
survey forms need smooth interaction, clear
button, easy to back up and correct, pull down
choices, etc. Strong metaphor can be over
cute, e.g. graphic of SW Airlines reservation
desk on web page Spend a moment on URL
design Reference Jakob Nielsen, Sun
Microsystems, http//www.useit.com
Multimedia UI Guidance
  • Multimedia is non-linear, not best for all UI
  • It, too, requires a disciplined approach, using
    storyboarding prototyping of still images, full
    motion, voice I/O integration with pointing
    devices (data glove, eye tracker, mouse, etc.)
  • Benefits
  • A document with video, audio, text and graphics
    to enhance interest and attention, e.g.
  • Used with other applications, e.g. you are
    here kiosk at the shopping mall, electronic
    scoreboards, GroupWare (collaborative computing,
    also called computer supported cooperative work)
  • Not for
  • Traditional novels, motion pictures, etc. where
    the emphasis or tempo of what is presented is
  • Concise documents
  • Equipment availability issue
  • Critical instructions, e.g. paper documentation
    describing how to fix your multimedia computer

Graphical User Interface Development Trends and
  • PC tools
  • Bundled with other products, e.g. Visual Basic
    with Access
  • Data base interface (open data base connectivity)
  • Event-driven, object-oriented, client-server,
  • Examples VB/Visual C, Powersofts Power
    Builder, Apples HyperCard, Netscape tools
  • X-Windows Unix workstation tools
  • Driven by consortia X/Open, MOTIF, Common
    Desktop Environment (CDE)
  • Examples HP UIM/X, Aonix (Alsys/Thompson/
    Telesoft) TeleUse user interface management
    systems and tools such as Builder Xcessory

Graphical User Interface Development Trends and
Tools (concluded)
  • Multiple platforms
  • Java and tool suites related to Java
  • Many of the tools vendors are porting their tools
    to various platforms
  • Miscellaneous GUI tools
  • Tcl/Tk, GUI/screen builders and scripting
  • Information visualization tools
  • Human operator performance monitoring and
    analysis tools
  • Graphics (2D vs. 3D, VRML, etc.)
  • Brad Myers from Carnegie Mellon has an excellent
    on-line list of GUI tools
  • http//www.cs.cmu.edu/afs/cs/user/bam/www/toolnam

CHI 98
Annual Conference for the ACM Special Interest
Group on Computer Human Interaction
Why CHI?
  • CHI is not just any computer conference
  • - They have a conscience
  • - They are a multi-disciplinary community
  • computer scientists
  • software engineers
  • webmasters
  • applied behavioral psychologists
  • human factors people
  • graphics designers
  • usability engineers
  • systems engineers
  • educators/trainers
  • application domain experts needing help
    building a good HCI, e.g., health
  • - Very international

How CHI 98 was Structured
  • Parallel Tracks of
  • - Tutorials
  • - Workshops
  • - Papers/panels
  • - Poster presentations
  • - Exhibits
  • - Demonstrations
  • - Special interest groups
  • - Proceedings
  • - Video
  • Opening/closing plenary (all hands) sessions

CHI Conscience
  • From the opening and closing plenaries
  • - CHI community has a responsibility to make
    computers more usable
  • - It is our responsibility as computing
    professionals to not alienate (with bad UI
    design) end users.
  • - Rather, we should empower them and make the
    computer a tool and assistant for their work
  • Develop usable, user-tailored systems that
    improve quality of life

CHI Conscience (concluded)
  • Examples
  • Front-ends to large databases (e.g., Library of
    Congress Web Page) that aid (speed) the
    researcher in finding what they are looking for
  • Medical information systems that aid the health
    professional and administrative support functions
    to improve patient care
  • Providing computer access for the physically
    challenged with the use of new I/O technologies
  • Purple Moon (video software for 8-12 year old
  • Persuasion session (role UI plays in
  • CHI kids (CHI 98 is family friendly)

  • Web design and Usability
  • Jakob Nielsen, Suns Chief Engineer of UI
  • Web design not equal to UI design
  • Provided examples of web pages that work and
    dont work
  • Intranets
  • Navigation schemes
  • Information Visualization
  • - Ben Shneiderman, U. of Marylands HCI research
  • Provided methods and examples for graphically
    depicting information architectures
    (databases) and provided visual, data mining
    technologies to structure screens to help

Tutorials (concluded)
  • Use of Java in UI design
  • - Three Java professionals (users) not from
    Sun or related vendor
  • - They founded a Java Competency Center in
    Europe to focus and share Java experience as
    the language evolves
  • - Provided frank, honest assessment of the
    state of Java development
  • - Provided examples of things that could be
    done with Java

  • Publishers
  • Related societies, e.g., Computer Support
    Cooperative Work (GroupWare), Intelligent UI
    (IUI 99 was in Redondo Beach)
  • Usability consultants who perform usability
    studies or train your team how to do so.
    Usability is the scientific experimentation by a
    system developer to measure the ease of use of an
    end-user performing their tasks. It is also used
    to road test a product and obtain market

Conference Thrusts
  • Internet/web usage/design (technical and social
  • Medical systems
  • Entertainment business
  • 2D and 3D, graphics applications
  • Baby face UI (smaller than Palm Pilot)
  • Virtual reality
  • Collaborative work
  • I/O technologies and applications
  • Education
  • History (e.g., inventor of mouse)

  • There is a lot of stuff out there (e.g., on the
    web) to help us build our systems better
  • Check out Interactions Magazine from ACM
  • See me for questions related to HCI

  • Jakob Neilsens web site (Sun Microsystems)
  • http//www.useit.com
  • Keith Instones web site
  • http//www.usableweb.com
  • On-line HCI bibliography project (Gary Perlman -
    Ohio State)
  • http//www.hcibib.org/
  • Brad Myers HCI links (Carnegie Mellon
  • http//pecan.srv.cs.cmu.edu/afs/cs/user/hcii/www
  • Ben Shneidermans Human Computer Interaction Lab
    (U. of Maryland)
  • http//www.cs.umd.edu/projects/hcil/
  • CSCI 588 Web Page
  • http//www-scf.usc.edu/csci588
About PowerShow.com