Survey of user interface systems, with emphasis on responsive and adaptive strategies to accommodate cross-platform deployment across multiple devices such as desktops and mobile devices. Demonstration of the use of tool kits for designing user interfaces. Additional topics include human factors, design standards, and visual languages. Students participate in a project involving the design and implementation of user interface systems. This course is offered as both CSE 333 and ISE 333.
Prerequisite
CSE 214 or CSE 260; CSE or ISE major
Course Outcomes
An ability to develop high-quality user interfaces for desktop, web-based, and mobile interactive systems
An understanding of guidelines, principles, and theories of user interface design
Working understanding of major interaction styles such as direct manipulation, command and natural languages, interaction devices, and collaboration
An ability to develop user interfaces using industry-standard software platforms including Windows, Java, and various web programming techniques
An understanding of usability issues
Textbook
Designing the User Interface:Strategies for Effective Human-Computer Interaction by Shneiderman & Plaisant; Addison Wesley (ISBN # 978-0321537355)
Core Java Vol 1-Fundamentals, 8th ed. by Horstmann & Cornell; Prentice Hall (ISBN # 978-0132354769)
Core Java Vol 1-Advanced Features, 8th ed. by Horstmann & Cornell; Prentice Hall (ISBN # 978-0132354790)
Major Topics Covered in Course
Usability of Interactive Systems
Guidelines, Principles, and Theories
AWT & Swing
Graphic Programming
Font, Color, and Images
Event Handling
Direct Manipulation
Menu Selection, Form Fill-in, and Dialog Boxes
Layout Management
Model-View-Controller Design Pattern
Swing Components
Command and Natural Language
Interaction Devices
Collaboration
Balancing Function and Fashion
Web Interface
Mobile and Handheld Interfaces
Tablet Interface
Information Search and Visualization
Laboratory Projects
ome sample projects are listed here:
Design and develop a simple GUI which allows users to draw several types of UML diagrams such as use case diagrams and class diagrams. The interface should allow users to enter text to label the diagram components, and provide buttons, pull-down and pop-up menus so that users can control the behavior of components in the diagrams. This project focuses on graphic programming, event handling, layout management, and using various user interface components. It can be a project of 3-4 weeks or be broken down into two smaller assignments, each for 1.5-2 weeks.
Design and develop a simple HTML browser. A "File" menu should allow users to "Open" a local HTML file and "Exit" the program. A tool bar with 4 buttons, namely, "Back", "Forward", "Reload", and "Home", should be implemented to support basic navigation. A combo box is used for the user to enter URL's, which maintains a list of 10 URL's that the user has entered most recently. For extra credits, a "History" button and a "Favorites" menu should be implemented. Also, the program can be extended to allow for managing multiple browser windows. Therefore, two more menu items, namely, "New" and "Close", should be added into the "File" menu. This project focuses on using various user interface components, handling events, sophisticated layout management, and using appropriate data structure such as link lists and trees. This can be a project of 2-3 weeks.
Design and develop a simple file browser which is similar to Microsoft Windows Explorer. This browser should include a menu bar which contains a "File" menu with possible menu items such as "New Folder", "Delete", "Rename", and "Close"; and a "View" menu with possible menu items such as "Icons", "Details", "Sort by Name", "Sort by Size", and "Sort by Date". Also included in the browser is a toolbar which includes buttons such as "Back", "Forward", "Up", and "Home"; and an address box which shows the full path of the currently selected item (either a file or a directory). The browser window should be split into a left pane and a right pane. The left pane presents the hierarchical structure of the files and directories. The right pane shows details of files and subdirectories inside the selected directory. This project focuses on using various user interface components, handling events, sophisticated layout management, and using data structures such as trees and tables. This project is also a good practice of the Model-View-Controller design pattern. It can be a project of 2-3 weeks.