Download
csc 123 systems analysis design n.
Skip this Video
Loading SlideShow in 5 Seconds..
CSC 123 Systems Analysis & Design PowerPoint Presentation
Download Presentation
CSC 123 Systems Analysis & Design

CSC 123 Systems Analysis & Design

236 Views Download Presentation
Download Presentation

CSC 123 Systems Analysis & Design

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. CSC 123Systems Analysis & Design Part IV: The Essentials of Design Chapter 12 Designing Effective Input

  2. Systems Development Life Cycle 2. Requirements Capture 1. Initiation 3. Analysis 7. Implementation 4. Design 6. Testing 5. Development

  3. Major Topics • Input design • Form design • Display design • GUI screen design • GUI controls • Web design guidelines

  4. 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

  5. Input • Forms of input: • Forms • Computer Displays • Interactive web fill-in forms

  6. 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

  7. 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

  8. Form Design (cont) The seven sections of a form are: • Heading • Identification and access • Instructions • Body • Signature and verification • Totals • Comments

  9. Seven Sections of a Form

  10. 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

  11. Caption Types

  12. Meeting the Intended Purpose • Must serve their purpose which can be a combination of information: • Recording • Processing • Storing • Retrieving

  13. 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.

  14. Attractive Forms • Uncluttered • Get information in the expected order • Aesthetic forms or user of different fonts and line weights

  15. 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

  16. 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

  17. 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

  18. Display Design Guidelines: • Keep the display simple • Keep the display presentation consistent • Facilitateuser movement among display screens • Create an attractive display

  19. 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

  20. 2. Keep the Display Consistent • Same information in same area • Group together related information • No overlapping of data

  21. 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

  22. 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

  23. 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

  24. GUI Screen Example

  25. Types of GUI Controls • Text box • List box • Combo box • Check box • Radio button • Command button

  26. Types of GUI Controls (cont) Slider and spin button example

  27. 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

  28. 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

  29. 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

  30. 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

  31. 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

  32. 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