340 likes | 629 Views
CSC 123 Systems Analysis & Design. Part IV : The Essentials of Design Chapter 1 2 Designing Effective Input. Systems Development Life Cycle. 2. Requirements Capture. 1. Initiation. 3. Analysis. 7. Implementation. 4 . Design. 6. Testing. 5. Development. Major Topics.
E N D
CSC 123Systems Analysis & Design Part IV: The Essentials of Design Chapter 12 Designing Effective Input
Systems Development Life Cycle 2. Requirements Capture 1. Initiation 3. Analysis 7. Implementation 4. Design 6. Testing 5. Development
Major Topics • Input design • Form design • Display design • GUI screen design • GUI controls • Web design guidelines
Input Design Objectives • The quality of system input determines the quality of system output • Well-designed input objectives: • Effectiveness: serve a specific purpose • Accuracy: ensures proper completion • Ease of use: straightforward • Consistency: same use and feel • Simplicity: uncluttered • Attractiveness: user enjoys using them
Input • Forms of input: • Forms • Computer Displays • Interactive web fill-in forms
Form Design Guidelines for good form design: • Make forms easy to fill in (next slide) • Ensure that forms meet the purpose for which they are designed • Design forms to assure accurate completion • Keep forms attractive
Form Design (cont) Easy to fill out, techniques: • Use proper flow • Left Right, Top Bottom • Group information logically using the seven sections of a form (next slide) • Provide people with clear captions • Captions tell the person completing the form what to put on a blank line, space, or box
Form Design (cont) The seven sections of a form are: • Heading • Identification and access • Instructions • Body • Signature and verification • Totals • Comments
Caption Types • Captions tell the person filling out the form what to put in a blank line, space, or box. • Captions may be one of the following: • Line caption • put the caption on the same line or below the line • Boxed caption • provide a box for data instead of a line • Vertical check off • line up choices or alternatives vertically • Horizontal check off • line up choices or alternatives horizontally
Meeting the Intended Purpose • Must serve their purpose which can be a combination of information: • Recording • Processing • Storing • Retrieving
Ensuring Accurate Completion • To reduce error rates associated with data collection, forms should be designed to assure accurate completion. • Design forms to make people do the right thing with the form. • In order toencourage people to complete forms, keepthem attractive.
Attractive Forms • Uncluttered • Get information in the expected order • Aesthetic forms or user of different fonts and line weights
Computer Form Design Software • Many form design software is available • Features of electronic form design software: • Can design paper, electronic, or Web-based forms • Use templates • Can cut and paste familiar shapes and objects • Field validations & messages • Facilitate the completion using software
Computer Form Design Software(cont) • Features (cont): • Permit customized menus, toolbars, keyboards, and macros • Support popular databases • Enable broadcasting of electronic forms • Permit sequential routing of forms • Assist form tracking • Encourage automatic delivery and processing • Establish security for electronic forms
Omniform from ScanSoft allows the user to take an existing form, scan it into the computer, and define fields so the form can be easily filled out on a PC
Display Design Guidelines: • Keep the display simple • Keep the display presentation consistent • Facilitateuser movement among display screens • Create an attractive display
1. Keep the Design Simple 3 screen sections - divide the screen into: • Heading: title, menu, icons • Body: data entry, captions, specific instructions • Comments and instructions: for inexperienced users
2. Keep the Display Consistent • Same information in same area • Group together related information • No overlapping of data
3. Facilitating Movement • Guidelines for facilitating movement from one page to another: • Clicking: the three clicks rule says that users should be able to get to the screens they need within three mouse or keyboard clicks • Scrolling: using arrows or PgDn keys • Using context-sensitive pop-up windows • Using onscreen dialogue
4. Design an Attractive Screen • To make the screen attractive use: • Different thickness of separation lines between subcategories • Inverse video and blinking cursors • Different combinations of colors • Different type fonts • fontface.com
Using Icons in Screen Design • Used in graphical screens to run programs and execute commands • Guidelines: • Use universally recognizable icons • Icons for a particular application should be limited to 20 recognizable shapes • Use icons consistently throughout
Types of GUI Controls • Text box • List box • Combo box • Check box • Radio button • Command button
Types of GUI Controls (cont) Slider and spin button example
Types of GUI Controls (cont) • Message boxes • used to warn users and provide feedback messages in a dialog box • Command buttons • perform an action when the user selects it
Types of GUI Controls (cont) • Hidden Fields: • Not visible to the viewer • Do not take up any space on the Web page • Can only contain a name and value • Used to store values sent from one Web form to the server
Types of GUI Controls (cont) • Tab control dialog boxes • help organize GUI controls for users • each tab should have 3 basic buttons: • OK • Cancel • Help
Color • Do not overdo it with color • The most legible foreground/background color combinations for display monitors are: • Green on white • Blue on white – White on blue – Yellow on black – Black on yellow
Internet & Intranet Design Guidelines • Provide clear instructions • Use a logical entry sequence for fill-in forms • Use a varietyof text boxes, push buttons, radio buttons, drop-down lists, and other GUI features • Provide a scrolling text box if you are uncertain how much text will be entered • Include two basic buttons: Submit and Clear • If the form is lengthy, divide it into several simpler forms on separate pages • Create a feedback screen that lists error messages if a form has not correctly been filled out
e-Commerce Applications • Involve more than just good Web site design • Customers need to be confident of the site, including privacy and security • Example: Nordstrom shopping