TME2413/TMI2113/TMN2223/TMS2833/TMT2673

Object-Oriented Software Development

Lecture 11:
Object-Oriented Design
View Layer: Designing Interface Objects
Ref: B.Bruegge A.H. Dutoit, 2010
Ali Bahrami, 1999.

1
11-Dec-20 1
Goals

 Identifying View Classes

 Designing Interface Objects

Chapter 12 Slide 2
Designing View Layer Classes

The view layer classes are responsible for two major aspects of the
applications:
 Input-Responding to user interaction
 Output-Displaying business objects

Chapter 12 Slide 3
Designing View Layer Classes

 Design of the view layer classes are divided into the following
activities:
I. Macro Level UI Design Process- Identifying View
Layer Objects.
II. Micro Level UI Design Activities.
III. Usability and User Satisfaction Testing.
IV. Refine and Iterate.

Chapter 12 Slide 4
View Layer Macro Level
1. For Every Class Identified
1.1 Determine If the Class Interacts With Human Actor:
If yes, do next step otherwise move to next class.
1.1.1 Identified the View (Interface) Objects for The Class.
1.1.2 Define Relationships Among the View (Interface) Objects.

2. Iterate and refine.

Chapter 12 Slide 5
View Layer Micro Level

1. For Every Interface Object Identified in

the Macro UI Design Process.
1.1 Apply Micro Level UI Design Rules and Corollaries to
Develop the UI.

2. Iterate and refine.

Chapter 12 Slide 6
UI Design Rules

 Rule 1- Making the Interface Simple

 Rule 2- Making the Interface Transparent and Natural
 Rule 3- Allowing Users to Be in Control of the Software

Chapter 12 Slide 7
UI Design Rule 1
 Making the interface simple: application of corollary
2.
 Making something simple requires a good deal of work
and code.

Chapter 12 Slide 8
Making The Interface Simple(Con’t)

 Every additional feature potentially affects performance, complexity,

stability, maintenance, and support costs of an application.

Chapter 12 Slide 9
UI Design Rule 1 (Con’t)
 A design problem is harder to fix after the release of a product
because users may adapt, or even become dependent on, a
peculiarity in the design.

Chapter 12 Slide 10
Good vs Bad Design

11

by Jamie Freeman - message.co.uk

Bad Design

Bad design can be dangerous!

12
UI Design Rule 2
 Making the interface transparent and Natural: application of
corollary 4.
 Corollary 4 implies that there should be strong mapping between
the user's view of doing things and UI classes.

Chapter 12 Slide 13
Making The Interface Natural
 The user interface should be intuitive so users can anticipate what to
do next by applying their previous knowledge of doing tasks without a
computer.
 E.g., After entering all details users expect to save it, the design
should make menu/button <Save> available.

Chapter 12 Slide 14
Using Metaphors
 Metaphor is a type of analogy that achieve its effects
via association, comparison.
 Analogy is a cognitive process of transferring
information or meaning from a particular subject
(source) to another subject (the target).
 Metaphors can assist the users to transfer their
previous knowledge from their work environment to
your application interface.
 For example, forms that users are accustomed to
seeing.

Chapter 12 Slide 15
UI Design Rule 3
 Allowing users to be in control of the software: application of
corollary 1.
 Users should always feel in control of the software, rather than
feeling controlled by the software.

Chapter 12 Slide 16
Allowing Users Control of the
Software
 Some of the ways to put users in control are:
 Making the interface forgiving.
 Making the interface visual.
 Providing immediate feedback.
 Avoiding Modes.
 Making the interface consistent.

Chapter 12 Slide 17
Making the Interface Forgiving
 Users should be able to back up or undo their previous
action.
 They should be able to explore without fear of causing
an irreversible mistake.

Chapter 12 Slide 18
Making the Interface Visual
 You should make your interface highly visual
so users can see, rather than recall, how to
proceed.
 Whenever possible,
provide users with a list
of items from which they
can choose.

Is this visual?

Chapter 12 Slide 19
Providing Immediate Feedback

 Users should never press a key or select an action

without receiving immediate visual feedback, audible
feedback, or both.

Not this sort of

feedback!

Chapter 12 Slide 20
Avoiding Modes
 Users are in a mode whenever they must cancel what they are doing
before they can do something else.
 Modes force users to focus on the way an application works, instead
of on the task they want to complete.

Chapter 12 Slide 21
 Can Modes be useful?
Yes, however:
 You should make modes an exception and limit their use.
 Whenever users are in a mode, you should make it obvious by
providing good visual cues.
 The method for ending the mode should be easy to learn and
remember.

Can you think of a function in e-wallet

that needs to change mode?

Chapter 12 Slide 22
Making the Interface Consistent

 User Interfaces should be consistent

throughout the applications.
 For example, keeping button locations
consistent make users feel in control.

How do you feel if someone re-

arranged the icons of the apps on
the main UI of your phone?

Chapter 12 Slide 23
Summary
 The main goal of UI is to display and obtain information
you need in an accessible, efficient manner.
 The design of your software's interface, more than
anything else, affects how a user interacts and
therefore experiences your application.
 UI must provide users with the information they need
and clearly tell them what they need to successfully
complete a task.
 A well-designed UI has visual appeal that motivates users
to use your application.
 UI should use limited screen space efficiently.

Chapter 12 Slide 24
Summary (Con’t)
 Designing View layer classes consists of the following
steps:
I. Macro Level UI Design Process- Identifying View Layer
Objects
II. Micro Level UI Design Activities
II.1 Designing the View Layer Objects by applying Design
Axioms and corollaries .
II. 2 Prototyping the View Layer Interface.
III. Usability and User Satisfaction Testing
IV. Refine and Iterate

Chapter 12 Slide 25