Collaboration and Sequence Diagrams and Graphical User Interfaces

1
Collaboration and Sequence Diagrams
andGraphical User Interfaces

• Session 7
• LBSC 790 / INFM 718B
• Building the Human-Computer Interface

2
Agenda

• Project deliverables
• Collaboration and Sequence Diagrams
• Human-Computer Communications
• Graphical User Interfaces
• Wrap-up
• Change in homework due date
• Feedback stop/start/continue

3
Project deliverables

• Project description
• due 10/19
• Specification 1
• due 10/26
• See me after class if
• You dont have a team yet
• Your team hasnt sent your 2 sentences

4
Rapid prototyping process
Start
Identify needs/ establish requirements
Refine Design Specification
Evaluate
Build Prototype
Final specification
Exemplifies a user-centered design approach
5
Modeling the system

• Capturing the big picture
• Designing the object structure
• Class diagram (entity-relationship diagram)
• Object diagram (used to show examples)
• Represent object interactions for a scenario
• Represent event-object interactions

6
Bills Budget Flight Finder
7
FlightFinder Class Diagram
1..9
1
1..

Route
Leg
Flight
Sequence of

Sequence of
addLeg(lLeg) summary()String
-seats integer -departureTime
Time -arrivalTimeTime parse(sString) summary()
String
-flightNumberString parse(sString)


Displayed in

Flies between
Contains
0..1
Uses
GUI
Airfield
Schedule
1
1
search(pParam) display(rRoute)
-nameString -icaoIdentifierString4
-updatedTime -sourceURL parse(fFile)
2
1
1
Travel between
1
Map
Location
AircraftType
Displayed in
2
Displayed in
draw(rRoute)
-latitudedouble -longitudedouble -timeZoneTimeZ
one distanceTo(lLocation)
-nameString -speedint flightTime(oLocation,
dLocation)
1
1
Timeline
draw(rRoute)
8
FlightFinder Object Diagram
1st
1Route
2nd
NV514Flight
Leg

-flightNumberNV514
-seats34 -departureTime1600Z -arrivalTime1900Z
Leg
AF302Flight
LambertAirfield
GUI
-seats3 -departureTime1200Z -arrivalTime1400Z
-flightNumberAF302
-nameLambert Field -icaoIdentifierKSTL

O
AndrewsAirfield
LAXAirfield
Sep26Schedule
-nameAndrews AFB -icaoIdentifierKADW
-nameLA Intl Airport -icaoIdentifierKBLV
D
Map
-updatedSep 26/1200Z -sourcehttp//www
O

DCLocation
ScottAirfield
D
-latitude38-48N -longitude076-51W -timeZoneEAST
ERN
-nameScott AFB -icaoIdentifierKBLV
O
C-9BAircraftType
Timeline
-nameC-9B -speed450 knots
LALocation
Key O Origin D Destination
-latitude33-57N -longitude118-24W -timeZonePACI
FIC
D
9
Collaboration Diagram
3getText()
1Route
NV514Flight
firstLeg
2getText()
7getText()
4getText()
1getText()
5getText()
6getText()
8getText()
secondLeg
AF302Flight
LambertAirfield
GUI
10getText()
11getText()
9getText()
14plot(rRoute)
AndrewsAirfield
LAXAirfield
Sep26Schedule
Map
12getLatLong()
ScottAirfield
15plot(rRoute)
DCLocation
C-9BAircraftType
Timeline
13getLatLong()
LALocation
Scenario First route selected
10
Sequence Diagram
GUI
allAirfields
nearAirfields
andrewsAirfield
firstLeg
findNear(dept)Airfields
return near
nextAirfield()Airfield
return andrews
nextLeg()Leg
return first
getDestination()Airfield
return scott
findNear(scott)Airfields
return near
Continue depth-first search, pruning unsuccessful
routes after 9 legs
11
(No Transcript)
12
Interaction Styles

• Language-based interfaces
• Command line interfaces
• Interactive voice response systems
• Graphical User Interfaces (GUI)
• Virtual Reality (VR)
• Ubiquitous computing

13
Human-Computer Communication
Human
Mental Models
Sight Sound
System
Task
Hands Voice
Software Models
Keyboard Mouse
Task
User
Display Speaker
Computer
14
Mental Models

• How the user thinks the machine works
• What actions can be taken?
• What results are expected from an action?
• How should system output be interpreted?
• Mental models exist at many levels
• Hardware/operating system/network
• Application programs
• Information resources

15
WIMP Interfaces

• Windows
• Spatial context
• Icons
• Direct manipulation
• Menus
• Hierarchy
• Pointing devices
• Spatial interaction

16
GUI Components

• Windows (and panels)
• Resize, drag, iconify, scroll, destroy
• Selectors
• Menu bars, pulldown lists
• Buttons
• Labeled buttons, radio buttons, checkboxes
• Icons
• Text, images

17
Java Swing

• Swing High-level abstract operations
• Containers
• Components
• Layout managers
• Relative positioning
• Low-level operations for detailed control
• Absolute positioning
• Drawing (Graphics)

18
Swing Controls

• JButton
• JToggleButton
• JRadioButton
• JCheckBox
• JList
• JMenuBar, JMenu, JMenuItem
• JComboBox (pop up menu)
• JTree
• JSlider
• JTextField, JTextArea

19
Display Elements

• JLabel
• Icon
• JProgressBar
• setToolTipText()

20
Swing application structure

• Create top-level container
• JFrame mainWindow new JFrame()
• Create and add components
• JPanel newPane new JPanel()
• mainWindow.setContentPane(newPane)
• Arrange (layout) components
• Handle events
• Make visible

21
Java Event Model

• Create a GUI object
• JButton swapButton new JButton(swap)
• Create an inner class to handle the event
• implements the appropriate listener
  interface(s)
• class swapHandler implements actionListener
• Create appropriate listener methods in that class
• actionPerformed()
• Register the class containing the event listener
• swapButton.addActionListener(swapHandler)

22
Java Event Model

• Create a GUI object
• JButton swapButton new JButton(swap)
• Register the class containing the event listener
• swapButton.addActionListener(swapHandler)
• Create a method to handle the event
• implements the appropriate listener
  interface(s)
• class E5b implements ActionListener
• Create appropriate listener methods in the class
• actionPerformed()

23
Standard Swing Listeners

• ActionListener
• ComponentListener
• size, position, visibility
• FocusListener
• gain or lose keyboard input
• KeyListener
• keyboard input
• MouseListener
• mouse clicks and window entry/exit
• MouseMotionListener
• cursor position

24
(No Transcript)
25
Coming up

• Homework 3
• Will post Friday evening
• Graded due 10/26
• Added optional exercise
• Project description due 10/19
• Next week
• Java display components
• Algorithms
• Reading on reserve in EPSL

26
Stop / Start / Continue

• Please write one thing that you would like me or
  us to
• Stop doing
• Start doing
• Continue doing
• in class