Scribd
Upload
29 views40 pages

Basics of User Interface Design

The document discusses direct manipulation interfaces and their benefits. It provides examples of direct manipulation like dragging and dropping items. It also discusses concepts like information presentation and designing effective error messages.

Uploaded by

mrckkannada
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
29 views40 pages

Basics of User Interface Design

The document discusses direct manipulation interfaces and their benefits. It provides examples of direct manipulation like dragging and dropping items. It also discusses concepts like information presentation and designing effective error messages.

Uploaded by

mrckkannada
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 40

Direct Manipulation Interface

A direct manipulation interface allows a user to directly act on a set


of objects (instruments) in the interface.

Example:
Dragging a document to the trash.
Changing the size of a triangle by interacting with a visual
representation of a triangle.
Inserting characters in a document by pointing to where they should
go (with a mouse/cursor/insertion point) and then typing.
“Dialing” a phone number by pushing numbers on a keypad.
Playing a song using controls like a physical tape deck or CD/DVD
player.
Benefits:

While interacting with DM interfaces, users feel as if they


are interacting with the domain rather than with the
interface, so they focus on the task rather than on the
technology.

There is a feeling of direct involvement with a world of task


objects rather than communication with an intermediary.
Analyzing an Analogy
Real World Common DM Interface
Language

Object to be discarded Grammatical Object Icon of object to be


discarded
Move hand to object Move to object location Move pointer to object

Pick up object with hand Acquire object Click to acquire object

Waste basket Waste Basket location Waste basket icon

Move to waste basket Move to waste basket Drag to waste basket icon
location

Release object from Release object Release button to discard


hand object
Colour Displays

• Colour adds an extra dimension to an interface and can


help the user understand complex information structures
• Can be used to highlight exceptional events

• Common mistakes in the use of colour in interface design


include:
– The use of colour to communicate meaning

– Over-use of colour in the display


Colour Usage Guidelines
• Don't use too many colours
• Use colour coding to support use tasks
• Allow users to control colour coding
• Design for monochrome then add colour
• Use colour coding consistently
• Avoid colour pairings which clash
• Use colour change to show status change
• Be aware that colour displays are usually lower resolution
Information Presentation

• Information presentation is concerned with presenting


system information to system users.

• The information may be presented directly (e.g. text in a


word processor) or may be transformed in some way for
presentation (e.g. in some graphical form).

• The Model-View-Controller approach is a way of


supporting multiple presentations of data.
Information Presentation

Information to Presentation
be displayed software

Display
Information Presentation

• Static information
– Initialised at the beginning of a session. It does not
change during the session.
– May be either numeric or textual.
• Dynamic information
– Changes during a session and the changes must be
communicated to the system user.
– May be either numeric or textual.
Information Display Factors
• Is the user interested in precise information or
data relationships?
• How quickly do information values change?
Must the change be indicated immediately?
• Must the user take some action in response to
a change?
• Is there a direct manipulation interface?
• Is the information textual or numeric? Are relative
values important?
Error Messages

• Error message design is critically important.


Poor error messages can mean that a user rejects
rather than accepts a system.
• Messages should be polite, concise, consistent
and constructive.
• The background and experience of users should
be the determining factor in message design.
Design Factors in Message Wording
Context The user guidance system should be aware of what the user is
doing and should adjust the output message to the current
context.
Experience As users become familiar with a system they become irritated
by long, ‘meaningful’ messages. However, beginners find it
difficult to understand short terse statements of the problem.
The user guidance system should provide bothtypes of message
and allow the user to control message conciseness.
Skill level Messages should be tailored to the user’s skills as well as their
experience. Messages for the different classes of user may be
expressed in different ways depending onthe terminology which
is familiar to the reader.
Style Messages should be positive rather than negative. They should
use the active rather than the passive mode of address. They
should never be insulting or try to be funny.
Culture Wherever possible, the designer of messages should be familiar
with the culture of the country where the system is sold. There
are distinct cultural differences between Europe, Asia and
America. A suitable message for one culture might be
unacceptable in another.
Component Based Graphical User
Interface Design
Device Independent
Network Independent
UID
Evaluation
*****

You might also like