Crs 140
Building Graphical User Interfaces with Java

Designing effective user interfaces is a difficult task that is rarely covered in programming and application development courses. On this course an attempt is made to distill the best of what is currently known in this area, and to tie this knowledge in with effective programming techniques

Here we try to pull together a number of disciplines - cognitive psychology, interactive system design using Statecharts, rapid application and design techniques, graph visualisation, diagram design and virtual reality techniques - in the context of Swing, Java 2D and Java 3D.

Course Outline

Human Computer Interaction and Cognitive Psychology

  • How we perceive things
  • The seven plus or minus two rule
  • Colour perception
  • Design rules - simplicity, predictability, consistency
  • Examples of good, bad and ugly interfaces

Overview of Swing, Java2D and Java3D

  • Pluggable Look and Feels
  • Lightweight vs. heavyweight components
  • Overview of the various packages and class hierarchies
  • The Model View Controller architecture

Statecharts and their use in interface design

  • Event driven programming
  • Finite State Machines
  • Limitations of Finite State Machines
  • Extending Finite State Machines - conditional transitions, guards
  • Concurrent and nested state machines
  • Using statecharts to model user interface functionality

Swing Components

  • GridBagLayout and BoxLayout layout management
  • Actions and Containers
  • Change Events
  • The JComponent base class
  • Labels and Icons
  • Buttons - check boxes, radio buttons and button groups
  • Scroll bars, sliders and progress bars
  • List and Combo boxes
  • Panels and panes
  • Dialogs and option panes
  • Splitter panes, scroll panes, tabbed panes
  • Layout managers
  • Chooser dialogs - File chooser, Color chooser
  • Borders, menus and toolbars
  • Tables and Trees
  • Text components

Text and Documents

  • Document model and events
  • Styled documents
  • Carets, highlighters and keymaps
  • Text views
  • Editor kits and text actions

Touchy Feely Things

  • Accessibility
  • Look and feel

Displaying Information

  • Diagram Design
  • Graph Drawing
  • Pictorial display of data
  • Effective use of hypertext links

Graphics

  • Overview of basic geometry for 2D graphics programming
  • Overview of Java 2D
  • Overview of basic geometry for 3D graphics programming
  • Overview of Java 3D
  • Using Virtual Reality to navigate through data

Intended Audience

Attendees are expected to be experienced Java programmers, who will be developing graphical front ends for business, medical, design and control applications. The course is also suitable as a starting point for animators and games programmers who will be working in a Java environment (e.g. developing games and animated cartoons for mobile phone users), and who wish to, or need to know how to do things at the low level.

A willingness on the part of the attendees to absorb the cognitive psychology aspects of user interface development is considered necessary, and an appreciation of the need to involve users in interface design and evaluation.

Key Skills

  • Develop an awarenes of the cognitive aspects of user interface design
  • Gain familiarity with the functionality provided by Swing, Java2D and Java3D both at the design level and the programming level
  • Learn about important techniques for data visualisation and diagram design
  • Be able to develop applications that support rich document and diagram editing and creation features

Practical Work

For each section we have tried to develop both programmer oriented and designer oriented exercises. As well as the core exercises there will be a number of (semi-structured) challenges, some of which can be attempted on the course, others being intended to be worked on after the course.

The course uses Linux/Solaris workstations, the Sun Java SDK, and the Emacs JDE (If needed the course can use JBuilder or Websphere)

  • Evaluating user interfaces
  • Simple psychology experiments to demonstrate aspects of human sensory information processing
  • Exploration of color - how it is displayed, and how what is seen depends on lighting conditions
  • Describing interfaces and user interactions with them via Statecharts
  • Creating templatised document processing applications
  • Developing 2D and 3D data visualisation applications
  • Examining some of the implementation techniques used in Star Office, and the ways in which extensions to Star Office may be developed in Java