2. Objectives
• Distinguish between different types of computer users
and design considerations for each.
• Identify several important human engineering factors
and guidelines and incorporate them into a design of
a user interface.
• Integrate output and input design into an overall user
interface that establishes the dialogue between users
and computer.
• Understand role of operating systems, web browsers,
and other technologies for user interface design.
• Apply appropriate user interface strategies to an
information system. Use a state transition diagram to
plan and coordinate a user interface.
• Describe how prototyping can be used to design a
17-2 user interface.
4. System User Classifications
Expert User – an experienced computer user
• Spends considerable time using specific application
programs.
• Use of a computer is usually considered non-
discretionary.
• In the mainframe computing era, this was called a
dedicated user.
Novice User – a less experienced computer user
• Uses computer on a less frequent, or even
occasional, basis.
• Use of a computer may be viewed as discretionary
(although this is becoming less and less true).
17-4 • Sometimes called a casual user.
5. Interface Problems
According to Galitz, the following problems result
in confusion, panic, frustration, boredom, misuse,
abandonment, and other undesirable
consequences.
• Excessive use of computer jargon and acronyms
• Nonobvious or less-than-intuitive design
• Inability to distinguish between alternative actions
(“what do I do next?”)
• Inconsistent problem-solving approaches
• Design inconsistency
17-5
6. Commandments of User
Interface Design
• Understand your users and their tasks.
• Involve the user in interface design.
• Test the system on actual users.
• Practice iterative design.
17-6
7. Human Engineering Guidelines
• The user should always be aware of what to
do next
• Tell user what the system expects right now.
• Tell user that data has been entered correctly.
• Tell user that data has not been entered correctly.
• Explain reason for a delay in processing.
• Tell user a task was completed or not completed.
• Format screen so instructions and messages
always appear in same general display area.
• Display messages and instructions long
enough so user can read them.
17-7
8. Human Engineering Guidelines
(continued)
• Use display attributes sparingly.
• Default values should be specified.
• Anticipate errors users might make.
• Users should not be allowed to proceed
without correcting an error.
• If user does something that could be
catastrophic, the keyboard should be locked
to prevent any further input, and an instruction
to call the analyst or technical support should
be displayed.
17-8
9. Guidelines for dialogue Tone
and Terminology
Dialogue – the overall flow of screens and messages
for an application
• Tone:
• Use simple, grammatically correct sentences.
• Don’t be funny or cute!
• Don’t be condescending.
• Terminology
• Don’t use computer jargon.
• Avoid most abbreviations.
• Use simple terms.
• Be consistent in your use of terminology.
17-9
• Carefully phrase instructions—use appropriate action verbs.
10. User Interface Technology
• Operating Systems and Web Browsers
• GUI
• Windows, Macintosh, UNIX, Linux, Palm OS, Windows CE
• Growing importance of platform independence
• Display Monitor
• Regular PC monitors
• Non-GUI terminals
• Growing importance of devices such as handhelds
Paging – Display complete screen of characters at a time.
Scrolling – Display information up or down a screen one
line at a time.
• Keyboards and Pointers
• Mouse
17-10 • Pens
11. Graphical User Interfaces
Styles and Considerations
• Windows and frames
• Menu-driven interfaces
• Pull-down and cascading menus
• Tear-off and pop-up menus
• Toolbar and iconic menus
• Hypertext and hyperlink menus
• Instruction-driven interfaces
• Language-based syntax
• Mnemonic syntax
• Natural language syntax
• Question-answer dialogue
17-11
21. Instruction-Driven Interfaces
• Language-based syntax is built around a
widely accepted command language that can be
used to invoke actions
• SQL
• Mnemonic syntax is built around commands
defined for custom information systems.
• Commands unique to that system and meaningful to
user
• Natural language syntax allows users to enter
questions and command in their native
17-21 language
23. Special Considerations for User
Interface Design
• Internal Controls – Authentication and
Authorization
• User ID and Password
• Privileges assigned to roles
• Web certificates
• Online Help
• Growing use of HTML for help systems
• Help authoring packages
• Tool tips
• Help wizards
• Agents – reusable software object that can operate
17-23 across different applications and networks.
28. Automated Tools for User
Interface Design & Prototyping
• Microsoft
Access
• CASE
Tools
• Visual
Studio
• Excel
• Visio Visual
Studio .NET
Menu
17-28
Construction
30. The User Interface Design
Process
1. Chart the user interface dialogue.
State Transition Diagram– a tool used to depict the
sequence and variation of screens that can occur
during a user session.
3. Prototype the dialogue and user interface.
4. Obtain user feedback.
• Exercising (or testing) the user interface
5. If necessary return to step 1 or 2
17-30
This repository of slides is intended to support the named chapter. The slide repository should be used as follows: Copy the file to a unique name for your course and unit. Edit the file by deleting those slides you don’t want to cover, editing other slides as appropriate to your course, and adding slides as desired. Print the slides to produce transparency masters or print directly to film or present the slides using a computer image projector. Each slide includes instructor notes. To view those notes in PowerPoint, click-left on the View Menu; then click left on Notes View sub-menu. You may need to scroll down to see the instructor notes. Teaching Notes This slide shows the how this chapter's content fits with the building blocks framework used throughout the textbook. The emphasis of this chapter is with the physical design phase, focusing on COMMUNICATION. It involves system designers and systems analysts.
No additional notes.
Chapter 17 – User Interface Design Teaching Notes This slide shows the how this chapter's content fits with the building blocks framework used throughout the textbook. The emphasis of this chapter is with the physical design phase, focusing on the communication building blocks. It involves system designers and systems analysts.
Teaching Notes Emphasize that expert and novice users are actually extremes in the continuum of all users. The totally novice user who hasn’t used a computer is becoming less common. Mention some people that the students might know (perhaps a department secretary, yourself, another colleague, etc.) and ask the students to characterize them as an expert or novice user. Be sure to acknowledge, once again, that some individuals may fit in between the two extremes. A given user might be an expert at PowerPoint, a novice at PhotoShop, and something in between at Excel.
Teaching Notes The above points can be driven home by providing the students with some sample screen designs that exhibit the various problems.
Teaching Notes These also come from Galitz.
Teaching Tips The above points can be driven home by providing the students with some sample screen designs that exhibit a failure to take into consideration the above guidelines. Alternatively, obtain some screen shots of a sample application from a local company and have the students assess the screens relative to the above guidelines.
Teaching Notes Entire books have been written on the subject of user interface design. Feel free to add additional user interface design considerations you want to bring to the students attention (such as the user of color, consideration of handicapped individuals, etc.). We provided several references to books on the subject of user interface design.
Teaching Notes The above points can be driven home by providing the students with some sample screen designs that exhibit the and incorrect use of tone and terminology. Have the students give examples of instructions that might appear on a screen. Is the tone and terminology acceptable?
Teaching Notes The manner in which the display area is shown to the user is controlled by both the technical capabilities of the display and the operating system capabilities. Paging and scrolling are the two most common approaches to showing the display area to the user. Scrolling is often used in web sites where a web page can be infinitely long. However users can get lost if they have to scroll too much to enter their inputs. In those cases, paging gives more control both to the user and the programmer.
Teaching Notes These will be illustrated in the following slides. Consider using a laptop and projection capability to demonstrate a software product(s) or application and its use of the different types of GUI menus. Emphasize to the students that the above styles/strategies should not be viewed as alternatives.
No additional notes.
Teaching Notes This screen dialogue chart was take from the First Edition of our textbook. This tool was created by the authors as a tool for designing dialogues for on-line mainframe-based computing solutions. Subsequently, the tool has been adopted and adapted by numerous authors of systems development textbooks. The authors emphasize that this tool has become ineffective in design GUI screens because today’s GUI design solutions are not naturally hierarchical.
No additional notes.
No additional notes.
Teaching Notes: Be sure to emphasize that such menus are not as appropriate for the novice user because they are less likely to even know the menu exists (since there is no visual hint of its existence).
No additional notes.
No additional notes.
Teaching Notes Consumer-style interfaces are somewhat more artistic The primary look and feel is more web-like The interface consists of clickable icons and buttons that replace more traditional Windows menu approaches
No additional notes.
No additional notes.
No additional notes.
Teaching Notes Screens to illustrate these concepts are on the following slides
No additional notes.
No additional notes.
No additional notes.
No additional notes.
No additional notes.
Teaching Notes: Feel free to provide additional screen shots of other user interface controls not presented in the textbook. These are only a few of the many controls that continue to evolve.
Teaching Notes In practice these steps are not strictly sequential.
