Chapter 2

THE DESIGN
PROCESS

Prepared by Mdm PYTan

 LEARNING OUTCOME:

• Explain the concept of user interface design to

elevate technical complexity for usable
product that accepted by user. (C3, PLO2)

Prepared by Mdm PYTan

Software Engineering & Basics
Design Of Interaction

Prepared by Mdm PYTan

 Interaction Design
• Is the professional discipline that defines the
behavior of interactive products and how
products communicate their functionality to
the people who use them.
• Good interaction design makes products
ranging from computer software to clock
radios to cars more useful, usable and
desirable.

Prepared by Mdm PYTan

 Interaction Design
• Designing interactive products to support
people in their everyday lives.
• Creating user experience that enhance and
extend the way people work, communicate
and interact.

Prepared by Mdm PYTan

 Four basic activities
There are four basic activities in
Interaction Design:
1. Identifying needs and establishing
requirements
2. Developing alternative designs
3. Building interactive versions of the
designs
4. Evaluating designs
 Three key characteristics
Three key characteristics permeate these
four activities:
1. Focus on users early in the design
and evaluation of the artifact
2. Identify, document and agree
specific usability and user experience
goals
3. Iteration is inevitable. Designers
never get it right first time
 Software Engineering and Interaction
Design Basics
• Software Engineering and design process
relate to interactive system design
• The Software Engineering life cycle aims to
structure design in order to increase the
reliability of the design process
Software Development process

Prepared by Mdm PYTan

 The software life cycle
• Software engineering
– provides the structure for applying techniques to develop
software systems
• The software life cycle
– An attempt to identify the activities that occur in software
development
– These activities must be ordered in time in any development
project and appropriate techniques must be adopted to carry
them.
• In the development of a software product,
– consider two main parties: the customer who requires the use
of the product and the designer who must provide the product
Prepared by Mdm PYTan
 The software lifecycle

• Software engineering is the discipline for

understanding the software design process, or
life cycle

• Designing for usability occurs at all stages of

the life cycle, not as a single isolated activity

Prepared by Mdm PYTan

 Software Lifecycle models
•Show how activities are related to each
other
•Lifecycle models are:
—management tools
—simplified versions of reality
•Many lifecycle models exist, for example:
—from software engineering: waterfall,
spiral, JAD/RAD, Microsoft
—from HCI: Star, usability engineering
•A simple interaction design model
 Waterfall Model
• Early, simple model
– Do the phases shown before, in order
– Complete one phase before moving on to the next
– Produce a document that defines what to do at the start
of each phase
– At end of each stage, a document or other work-product
is produced: requirements doc, design doc, code, etc.
– Little or no iteration (going back to previous phase)
• The order of phases/stages is generally “right”,
but…
– Following the waterfall precisely is not effective in real
development practice.
Waterfall Model

Prepared by Mdm PYTan

 Activities in the life cycle
• Requirements specification
• begins at the start of product development
• eliciting information from the customer about the work
environment, or domain, in which the final product will function.
• It concentrates on what the system is supposed to do.
• Architectural design
• concentrate on how the system provides the services expected
from the requirement specification.
• performs high-level decomposition of the system into
components.
• determining which components provide which services.
• describe the interdependencies between separate components
and the sharing of resources that will arise between components.
Prepared by Mdm PYTan
 Continue
• Detailed design
• For immediate integration, the designer must provide a
sufficiently detailed description so that they may be
implemented in some programming language.
• A refinement of the component description provided by the
architectural design.
• Coding and unit testing
• The detailed design for a component of the system should be
implemented in some executable programming language.
• After coding, the component can be tested to verify that it
performs correctly, according to some test criteria.

Prepared by Mdm PYTan

 Continue
• Integration and accepting testing
• Once enough components have been implemented and individually
tested, they must be integrated as described in the architectural design.
• Further testing is done to ensure correct behavior and acceptable use of
any shared resources.
• perform some acceptance testing with the customers to ensure that the
system meets their requirements.
• after acceptance of the integrated system that the product is finally
released to the customer.
• Maintenance
• Maintenance involves the correction of errors in the system which is
discovered after release and the revision of the system services to satisfy
requirements that were not realized during previous development.
• Therefore, maintenance provides feedback to all of the other activities in
the life cycle.
Prepared by Mdm PYTan
 Flaws of the Waterfall
• Need iteration and feedback
– Things change (especially requirements)
– Change late requires change in earlier results
– Often need to do something multiple times, in stages
• As described, it’s very rigid
– Not realistic to freeze results after each phase
• The model does not emphasize important issues
– Risk management
– Prototyping
– Quality
 The Spiral Model
• Important features
– Risk analysis and other management are explicitly
shown in the model at each stage
– Prototyping and iterative development “fit” in this
model
– Repetition of activities clearly in model
• Suggests that alternatives can be explored
The Spiral Model
Features of the Spiral Process Model
• Each cycle around the spiral can be like a phase
• Each cycle has four stages
1. Determine objectives, constraints (i.e. plan!)
2. Identify and manage risks. Explore alternatives as part
of risk management
3. Develop and verify next stage or level of the product
• Depending on the spiral, “Product” might be a requirements
document, a high-level design, code, etc.
4. Review results and plan for next stage
• May include getting client/customer feedback
 Is the Spiral Model the Answer?
• For some situations, yes. (There is no one answer.)
• Original study that analyzed the spiral model says:
– Intended for internal development of large systems
• “Internal”: developers and clients in same organization
– Intended for large-scale systems where cost of not doing risk
management is high
• But, the spiral model is important
– Historically
– And as an illustration of many desired features of a software
development process
 A Lifecycle for RAD
(Rapid Applications
Project set-up
Development)
JAD workshops

Iterative design
and build

Engineer and
test final prototype

Implementation
review
 The Star lifecycle model
•Suggested by Hartson and Hix

•Important features:
—Evaluation at the center of activities
—No particular ordering of activities.
—Development may start in any one
—Derived from empirical studies of
interface designers
Star Lifecycle “model”
Usability engineering lifecycle model
•Reported by Deborah Mayhew
•Important features:
—Holistic view of usability engineering
—Provides links to software
engineering approaches, e.g. OOSE
—Stages of identifying requirements,
designing, evaluating, prototyping
—Can be scaled down for small projects
—Uses a style guide to capture a set of
usability goals
 How HCI fits into software development
process

• Relevant within all the activities of the

software life cycle
• Software engineering for interactive system
design is not simply a matter of adding one
more activity that slots in nicely with the
existing activities in the life cycle
How Software Engineering and Design Process
relate to interactive system design?

• The software engineering life cycle aims to

structure design in order to increase the
reliability of the design process
• It is essential to augment the standard life
cycle in order to address issues of HCI
Concept In Design Process

Prepared by Mdm PYTan

 LEARNING OUTCOME:

• Explain the concept of user interface design to

elevate technical complexity for usable
product that accepted by user. (C3, PLO2)

Prepared by Mdm PYTan

 Concept
• There are TWO main concept in Design
Process:
– Usability engineering
– Iterative design
 Usability engineering
• The ultimate test of a product’s usability is based
on measurements of users’ experience with it.
• Focus on the actual user interface is
understandable
• The important features if usability engineering is
the inclusion of a usability specification, forming
part of the requirements specification, that
concentrates on features of the user-system
interaction which contribute to the usability of
the product
 Usability engineering
• The ultimate test of usability based on measurement of user
experience
• Usability engineering demands that specific usability
measures be made explicit as requirements
• Usability specification
– usability attribute/principle
– measuring concept
– measuring method
– now level/ worst case/ planned level/ best case
• Problems
– usability specification requires level of detail that may not be
– possible early in design satisfying a usability specification
– does not necessarily satisfy usability

Prepared by Mdm PYTan

Usability Problem Example:
Poor Organization/Layout
Usability Problem Example:
Product Not Self-evident
 Usability engineering
• Example of a usability specifications for the
design of a control panel for a video cassette
recorder
 Iterative design
• Iterative design practices work to incorporate
crucial customer feedback early in the design
process to inform critical decisions which
affect usability
 Iterative design
• The requirements for an interactive system
cannot be completely specified from the
beginning of the life cycle
• The only way to be sure about some features
of the potential design is to build them and
test them out on real users
• The design can then be modified to correct
any false assumptions that were revealed in
the testing
• There are three main approaches to prototyping:
• 1. Throw-away
The prototype is built and tested. The design knowledge gained from this
exercise is used to build the final product, but the actual prototype is
discarded.
• 2. Incremental
The final product is partitioned into independent and smaller
components. The final product is then released as a series of products,
each subsequent release including one more component.
• 3. Evolutionary
Here the prototype is not discarded and serves as the basis for the next
iteration of design.
• Management Issues : time, planning, non-functional features,
contracts
Prepared by Mdm PYTan
• Technique prototype:
– Storyboard : need not be computer-based can be
animated
– Limited functionality simulations : some part of
system functionality provided by designers tools
like HyperCard are common for these
Wizard of Oz technique
– Warning about iterative design
 Group Discussion
• Explain the advantages and disadvantages of
three different types of prototypes:
1. throw-away
2. incremental
3. evolutionary
• Present Your Findings
Thank You

Prepared by Mdm PYTan