user interface design 2 constructing an interface for an atm
Post on 20-Dec-2015
227 views
TRANSCRIPT
User Interface Design 2
Constructing an Interface for an ATM
User interface metaphors
• dialogue metaphor• direct manipulation (event-driven, GUI)
metaphor
• What dialogue does a user have with an ATM machine?
How do we incorporate User Interface Design Guidelines in the dialogue?
• Consistency – always do things in the way that people expect and follow the same pattern
e.g. Lodge and Withdraw money• Appropriate User Support- help people if you think
they’ll need it – what does appropriate mean here?• Adequate Feedback- let them know when they’ve
done something, when the machine is doing something.
• Minimal User Input: ATM where you type in the amount vs ATM with fixed amounts to be selected.
1. Structured UI Design: Stages
1. Requirements gathering 1) determine the types of user, frequency of use,
task experience level, computing skills etc.
The user of the ATM will be a reasonably frequent user who does not necessarily have computing skills.
– Determine task characteristics – How complex is the task?– Break down into component parts– Identify the goal, context, task
environment
Example
Authorised card
Enter card Check if authorised
Withdraw Show balance
O
O
Select transaction
*
LogoutLodge O O
ATM
Error message
Check pin
O
Valid pin
O O
Error message
OO
*
Example
Request amount
Enter amount
Lodge
User Confirm User CancelO
O
Disable buttons
Process transaction
Enable buttons
2. Interface design • allocate elements of task to user/system• determine communication requirements,• design interface elements to support
communication.
UML activity diagram -allocating tasks to system and user
Source: IBM Rational http://www.ibm.com/developerworks/rational/library/769.html
• determine communication requirements- how do user and system collaborate to do the tasks.?
• design interface elements to support communication.
In a GUI:• Buttons, listboxes, labels, message boxes etc.
Example UI class diagramAtm_UI
Lodge:buttonWithdraw:buttonCancel:buttonLogout:buttonConfirm:buttonDataEntry:textboxMessages:label
Lodge_click()Withdraw_Click()Cancel_Click()Confirm_click()Logout_Click()Disable()Enable()
Identify interface elements
State Machine diagram for the User Interface- States can correspond to Screens.
No card-Request
Finding ac
Valid AC
Invalid AC
Amount request
Transaction Confirmed/
Cancel clicked()Cleartxt and enable
Confirm clicked()
[account found]enable
[lodge /withdraw clicked]disable
Logout_clicked()
enable
• Event action tables can be used to specify how interface elements can react to events in different states- exampleState Event Action Next State
0 Disable buttons except confirmClear textboxDisplay welcome message and request acno
1
1 Confirm click Find account 1
1 Account found Enable buttons 2
3. Interface evaluation – develop prototypes and test on users.
• Usability criteria: Learnability, Throughput, Flexibility, Attitude
• Scheiderman’s golden rules• Disability standards
Ethnographic Approaches
• Qualitative assessment of task situation where the designer works very closely with the user in their work context.
• Observing• Listening• Asking questions• Interviews E.g. Participative design
• What would this involve for an ATM?
Scenario-based Approaches
• Step-by step descriptions of user actions showing how users can achieve a goal
• Can use textual narrative or storyboards.
• Draw a storyboard for a visit to an ATM- including screen designs.
• Write a set of scenarios.
• Check that you’ve taken the principles of UI design into account: consistency, feedback, closure, error-handling, easy reversal of actions, let user control, easy to use – minimise memorisation
• Could you use this to build a prototype?
Usability Criteria• Learnability - time and effort needed • Throughput of the expert user• Flexibility – ability to handle changes to tasks and the
environment in which they operate.• Attitude – how positive does the user feel as a result of
his/her experience with the package? • ISO definition of Usability : degree to which users can
achieve specific goals in a particular environment ; effectively, efficiently, comfortably and in an acceptable manner