INFO 355

Systems Analysis II

User and system interface design

INFO 355 Glenn Booker Week #7 1

INFO 355

User and System Interfaces

  User interfaces involve a human  Internal or external  Ease of use, efficiency, device-specific System interfaces are largely automated  Little or no human intervention  Direct communication with other systems, or automated communication with users Week #7 2

INFO 355

User-centered design

    Focus early on the users and their work Evaluate designs to ensure usability Use iterative development What do users know? How do they learn? How do they work? What motivates them?

Week #7 3

INFO 355

User-centered design

  Usability is the degree to which a system is easy to learn and use  May vary for different types of users  Learning very different from using Consider novice versus experienced user needs Week #7 4

INFO 355

HCI Metaphors

  Metaphors are analogies between UI and physical objects  Windows uses desktop, direct manipulation, and document metaphors Dialog metaphor is a conversation between user and computer Week #7 5

INFO 355

UI Design Concepts

   Affordance means appearance of a feature implies its function Visibility means control is visible so user knows it’s available and/or responding Use consistency in function and appearance of the UI Week #7 6

INFO 355

UI Design Concepts

    Use shortcuts for advanced users Provide audible and/or visual feedback End dialogs with clear closure Anticipate common errors and help user avoid them  Give clear error messages and how to fix them Week #7 7

INFO 355

UI Design Concepts

    Make it easy to reverse actions Reduce short term memory needs of users Group use cases to produce logical menu hierarchies  5-10 items per menu  Group by subsystem and/or actor Might write out dialogs or sketch storyboards Week #7 8

INFO 355

UI Design

  Constructing the UI depends on the tools available Use consistent layout and formatting (same look and feel, use of color, function keys, etc.)  Use clear labels and headings   Distribute and order UI contents Use font and colors methodically Week #7 9

INFO 355

UI Design

  Data entry should use common controls to reduce errors and speed input  Text box, list box, combo box, radio buttons, check boxes Consider standard controls for navigation and window manipulation Week #7 10

INFO 355

Web interfaces

  Use appropriate technologies to implement web browser interfaces (CSS) Consider performance needs  Are you using client-side or server-side technologies?

  How much data is being sent?

How fast can you expect their Internet or network connection to be?

Week #7 11

INFO 355

Web interfaces

  What network capacity is available for multimedia data?

Do some users have special needs (screen readers, voice recognition, etc.)?

Week #7 12

INFO 355

Handheld devices

 Consider the limits on handheld devices  Small screen (4”, 480x320 px)    Small keyboard or touch screen Limited network speed App design guidelines and toolkits Week #7 13

INFO 355

System Interfaces

  Consider possible types of interfaces to other systems  I/O from and to other systems   Automated I/O I/O to external databases Electronic data interchange (EDI) has been around decades, now often going to XML Week #7 14

INFO 355

Designing System Inputs

    Need to identify devices used  Magnetic strip, barcode, RFID, etc.

Identify all input data for each device Define controls for each input Reduce errors by avoiding human interference, and validate data when entered Week #7 15

INFO 355

Designing System Inputs & Outputs

    Only enter unique information Define details of each data field or group entered Design outputs to get the right information, right place, right time, to the right people Define type of each output, specify controls needed, and prototype each Week #7 16

INFO 355

Design Reports

  Reports, statements, and turnaround documents fall into four types  Detailed reports    Summary reports Exception reports Executive reports Have internal vs. external reports, and electronic vs. printed reports Week #7 17

INFO 355

Design Reports

  Often want to “drill down” in reports to get more details Consider graphic outputs and/or audio outputs  Bar or column charts, pie charts, scatter plots, line or run charts, etc.

Week #7 18