Systems Analysis Input and Output 1. Input and Output



Similar documents
Web Pages. Static Web Pages SHTML

Fig (1) (a) Server-side scripting with PHP. (b) Client-side scripting with JavaScript.

Dreamweaver Tutorial - Dreamweaver Interface

Chapter 13 Computer Programs and Programming Languages. Discovering Computers Your Interactive Guide to the Digital World

Short notes on webpage programming languages

Web Development News, Tips and Tutorials

Contents. Introduction Downloading the Data Files... 2

Internet Technologies_1. Doc. Ing. František Huňka, CSc.

4.2 Understand Microsoft ASP.NET Web Application Development

WESTERN KENTUCKY UNIVERSITY. Web Accessibility. Objective

Web Design Specialist

Outline. CIW Web Design Specialist. Course Content

understand how image maps can enhance a design and make a site more interactive know how to create an image map easily with Dreamweaver

Contents. Downloading the Data Files Centering Page Elements... 6

ACE: Dreamweaver CC Exam Guide

Dreamweaver CS5. Module 2: Website Modification

SKILLS HIGHLIGHTS: W e b a n d G r a p h i c D e s i g n e r

Basic tutorial for Dreamweaver CS5

Dreamweaver CS3 THE MISSING MANUAL. David Sawyer McFarland. POGUE PRESS" O'REILLY 8 Beijing Cambridge Farnham Koln Paris Sebastopol Taipei Tokyo

White Paper Using PHP Site Assistant to create sites for mobile devices

Designing portal site structure and page layout using IBM Rational Application Developer V7 Part of a series on portal and portlet development

Requirements for Developing WebWorks Help

Web Programming Languages Overview

4D and SQL Server: Powerful Flexibility

Fast track to HTML & CSS 101 (Web Design)

Checklist of Best Practices in Website

ActiveX AJAX ASP. AudioMP3

Credits: Some of the slides are based on material adapted from

ADOBE DREAMWEAVER CS3 TUTORIAL

ProgressBook StudentInformation Report Builder User Guide

Chapter 1. Introduction to web development

IAS Web Development using Dreamweaver CS4

IT3503 Web Development Techniques (Optional)

The Web Web page Links 16-3

San Joaquin County Office of Education Career & Technical Education Web Design ~ Course Outline CBEDS#: 4601

Lesson Review Answers

Web Applications Come of Age

Creating a Resume Webpage with

CLASSROOM WEB DESIGNING COURSE

Xtreeme Search Engine Studio Help Xtreeme

ASP.NET: THE NEW PARADIGM FOR WEB APPLICATION DEVELOPMENT

Programming exercises (Assignments)

Oregon State Bar Software Standards Software Proficiency Expectations (Items in bold are to be demonstrated)

Business & Computing Examinations (BCE) LONDON (UK)

Microsoft Expression Web Quickstart Guide

MULTICULTURAL CONTENT MANAGEMENT SYSTEM

PaperlessPrinter. Version 3.0. User s Manual

IT3504: Web Development Techniques (Optional)

Web. Programming. Hans- Pe0er Halvorsen, M.Sc. h0p://home.hit.no/~hansha/?page=sojware_development

A review and analysis of technologies for developing web applications

CIW Web Design Professional

DreamFactory Security Whitepaper Customer Information about Privacy and Security

System Architecture V3.2. Last Update: August 2015

Using Database Metadata and its Semantics to Generate Automatic and Dynamic Web Entry Forms

Building A Very Simple Web Site

Maldives Pension Administration Office Republic of Maldives

How To Design The Web And The Internet

Brock University Content Management System Training Guide

Web Portal User Guide. Version 6.0

Chapter 10: Multimedia and the Web

Customer Profile Report for ABC Hosting Ltd

Expanded contents. Section 1. Chapter 2. The essence off ASP.NET web programming. An introduction to ASP.NET web programming

Smithsonian Institution Archives Guidance Update SIA. ELECTRONIC RECORDS Recommendations for Preservation Formats. November 2004 SIA_EREC_04_03

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence

Macromedia Dreamweaver 8 Developer Certification Examination Specification

Dreamweaver. Introduction to Editing Web Pages

Chapter 12 Creating Web Pages

Syllabus INFO-UB Design and Development of Web and Mobile Applications (Especially for Start Ups)

How To Understand Programming Languages And Programming Languages

Word Processing programs and their uses

To use MySQL effectively, you need to learn the syntax of a new language and grow

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence

Custom Reporting Basics for ADP Workforce Now. Automatic Data Processing, LLC ES Canada

Web Design Technology

A DIAGRAM APPROACH TO AUTOMATIC GENERATION OF JSP/SERVLET WEB APPLICATIONS

JavaFX Session Agenda

Alexander Nikov. 4. Building an ecommerce Presence: Web Sites, Mobile Sites, and Apps. Outline. Teaching Objectives

10CS73:Web Programming

Inserting the Form Field In Dreamweaver 4, open a new or existing page. From the Insert menu choose Form.

An overview of designing HTML s for Hotmail, Yahoo, Outlook, Lotus Notes and AOL

Release 1. ICAPRG604A Create cloud computing services

Voluntary Product Accessibility Report

Full version is >>> HERE <<<

CaptainCasa. CaptainCasa Enterprise Client. CaptainCasa Enterprise Client. Feature Overview

WHAT'S NEW IN SHAREPOINT 2013 WEB CONTENT MANAGEMENT

What is a Web Browser? Web Site Functionality. A client program that uses HTTP to communicate with web servers.

Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl. Web Design in Nvu Workshop Session Plan

AUTOMATED CONFERENCE CD-ROM BUILDER AN OPEN SOURCE APPROACH Stefan Karastanev

Advanced Web Development SCOPE OF WEB DEVELOPMENT INDUSTRY

SaskTel Web Hosting Feature Overview

DEVELOPMENT OF AN ANALYSIS AND REPORTING TOOL FOR ORACLE FORMS SOURCE CODES

E-commerce. Web Servers Hardware and Software

Syllabus INFO-GB Design and Development of Web and Mobile Applications (Especially for Start Ups)

UNPAN Portal Content Management System (CMS) User Guide

Transcription:

Systems Analysis Input and Output 1 Input and Output A course in information architecture or web design, complemented with work in Human-Computer Interaction, will help the analyst understand how to improve the acceptability and utility of any computerbased system. End-users may be required to use a computer program but may not be satisfied with the interface. An understanding of interface tools, such as HTML forms, the concept of error-correction on input, and the like will inform your work. Increasingly data are presented to end-users through web browsers or web-browser-like interfaces. Therefore a knowledge of HTML, CSS, XML, XML style sheets, and relational database and other file access via the Internet are the minimum skills an analyst should know. Input During the data gathering stage, the analyst collects samples of input and output screen designs and reports. These provide information about the data that are collected, who (or what job function) collected them, the aesthetics that end-users are familiar with, and the types of interactivity they know. In situations where end-user participation is solicited, the analyst has many techniques for critiquing and designing new input screens and reports. One technique is to hold meetings with the various user groups and to ask them to draw their ideal reports and input screens. The quality of the drawing is not important, what data and what labels the end-users provide are. Another common technique is to provide a toolkit of parts of screen designs (pieces of paper like a puzzle) and ask end-users to build various interfaces from the pieces. Below is an image of the toolkit provided by OmniGraffle, first for web pages, second for Windows computer interfaces:

Systems Analysis Input and Output 2

Systems Analysis Input and Output 3 Web interface toolkit

Systems Analysis Input and Output 4 An important aspect of data input is to prevent errors before the data are stored in the system. For example, imagine a payroll system where the end-user can change his or her pay rate, accidentally entering $1.05 / hour or $1050 / hour instead of $10.50. Error correction on input sets the range of possible correct inputs, preventing null or 0 values when not permitted, higher or lower numbers, etc. The screen designer (the analyst himself or someone else on a design team) must know which fields can be null, repeated, required, and so on. This information comes from the data dictionary. Designing Screens While end-user assist the analyst by drawing screens and reports on paper, the analyst (analyst, builder, designer, web-master, interface designer, whatever title) can layout screens quickly by using special tools, called IDEs, or Integrated Development Environments. Here is a list of input controls for web forms. They are demonstrated in the figures above. Text field A single line for entering text; analyst can define the maximum length of this field on screen and the maximum number of characters that can be input in this field. This is important because the data are usually stored in an SQL table. The data in the form cannot be larger than the field length size in the table. hidden field Same as above, but the end-user cannot see or alter the data contents. test area A text area is like a text field, but has multiple lines. check box radio button radio group list or menu Also known as a drop-down box hyperlinks image links buttons Dreamweaver is an IDE for creating web forms (http://www.adobe.com/products/ dreamweaver/). It is now part of Adobe s (www.adobe.com) Creative Suite 3 series. For computer programs that collect input and provide output to end-users, analysts, programmers, and builders use other tools, depending on the programming language and operating system. Setting aside computer applications, there remain other kinds of compiled code that can run in a web browser or which communicate with a browser. Such plug-ins are familiar already among end-users who may have downloaded and installed skins for Netscape and other programs that change the aesthetics of a program, or other plug-ins for displaying Adobe.pdf (portable document format) files and Macromedia Flash movies. The analyst s designs may be implemented by the analyst or by someone else. In the latter case, the analyst looses control over the product: if an organization has only a qualified web designer, he or she may opt to convert the design into a web form; alternatively, a computer programmer may see the implementation as an applet, ActiveX control, or some other form, such as Visual Basic programs. It is the analyst s responsibility to know what the organization or client will or can implement and specify that as part of the design. ActiveX controls are part of Microsoft Corporation s solution to adding greater interactivity in web design. The liability is, naturally, a preference for the Microsoft operating system. While the analyst should

Systems Analysis Input and Output 5 know the benefits and liabilities of all the operating systems, she or he must look at Microsoft s approach, even when the more useful solution is towards OpenSource or Unix; but be aware that Microsoft products may not run correctly on Unix, Linux or Macintosh computers. Applets are small pieces of applications that will run on any computer. Although Microsoft has tried not to provide access to the Java Virtual Machine (JVM) or the Java Runtime Environment (JRE), endusers can download these products for free from java.sun.com. These applications are bit-wise converters : they convert the native code (Linux, Unix, Macintosh (which is now a flavor of Unix), and Microsoft) to a virtual computer. The virtual computer is a software implementation that makes it possible to run anywhere, anytime. The advantage, of course, is that the analyst can specify Java and the client can implement the application or applet without fear it will not operate as specified. [Note: sometimes Java-specific recommendations may be implemented in C++, but this approach removes the platform-independence that so many people value.] A popular approach to accessing data stored as files or in relational databases (such as MySQL) is to use interpreted languages, such as PHP or Perl. These languages are specially designed to process text (and after all, web files are just text). In between the power of compiled languages and interpreted languages are Java Server Pages (JSP) and Active Server Pages (ASP). JSP, like Java, will operate on any computer. ASP and ASPX are Microsoftspecific implementations and require additional Microsoft products to create the files. Other implementations include Cold Fusion, Ruby on Rails, and some emerging technologies. Reports Increasingly the analyst may design reports to be viewed through web browsers or at least on a computer screen. Let s stick with web browsers for the moment. HTML permits the specifying of an internal or external file that holds commands that overwrite HTML s interpretation of HTML tags. These are called cascading style sheets (.css). CSS can be created to control how data are presented on screen, but also how the data are expressed off-screen, that is, in print. In addition, CSS let the analyst address how data will be viewed by other media types. If, for example, the client-base includes blind people, the analyst could specify how the data should be reported in braille. There s no reason, too, why the analyst couldn t suggest alternative devices, such as televisions! Here is an example of specifying different media in a web page (using the paragraph <p> tag), followed by a list of different media types. <html> <head> <title>report</title></head> <style> @media screen { p.test {font-family:verdana, sans-serif;font-size:14 px} } @media print { p.test { font-family: times, serif; font-size: 10px } } @ media screen, print { p.test { font-weight: bold } }

Systems Analysis Input and Output 6 </style> </head> <body> rest of the document </body> </html> Above we used screen and print. Here is the list of complete media types you could use: Media type Description all Used for all media type devices aural Used for speech and sound synthesizers braille Used for braille tactile feedback devices embossed Used for paged braille printers handheld Used for small or handheld devices print Used for printers projection Used for projected presentations, slides screen Used for computer screens tty Used for fixed-pitch character grid (teletypes, terminals) tv Used for televisions Aural Style Sheets Properties Aural presentations are intended to be used by the blind, helping others to read, home entertainment, in the car, and where print is not possible. The below is an example of changing the <h1>, <h2>, <h3> tags in a web page: h1, h2, h3 { voice-family: male; richness: 80; cue-before: url( beep.au ) } In this case a file will be read (beep.au) and played before any text tagged with <h1>, <h2>, or <h3> is read by a male voice. For more, read about CSS2 Aural Reference recommendations. Print Style Sheet Properties Anyone who has printed a document from a web browser has been surprised how the screen display differs from the printed version. The CSS2 print properties offers a great deal of control over how lines of text print. Variables are in italics (e.g., number could refer to any numeric value, e.g., 2, or 4, or 10, etc.). Property Description Values orphansminimum number of lines that must be left at the number, e.g. 2 bottom of a page marks Sorts of marks that should be rendered outside the none page box crop cross

Systems Analysis Input and Output 7 page Sets a page type to use when display an element auto identifier page-break-after [and] page-break-before auto always avoid left right size Orientation and size of a page auto portrait landscape windows The minimum number of lines for a paragraph number that must be left at the top of a page In addition to the.css commands, output may be directed automatically to a.pdf file, using XSL- FO (Extensible Markup Language-Formatting Objects). Report formats However the data are reported, most analyses require some kind of status or overview report. In this example, parts of these types of reports are identified: [Report header / page header -->] Sales by Stock Number June 30, 2008 [Column headers -->] Stock Description Invoice Quantity Code number [Detail lines -->] 2-1102 21 monitor 07-99939 1 2-1334 27 cinema dis. 08-10029 3 29-12 19 monitor 08-10040 1 99281-2 32 display 08-9-110 0 [Summary line -->] Subtotal 4 [Detail lines suppressed -->] 2-1334 27 cinema dis. 08-10030 1 08-70031 1 08-70032 1 08-92211 1 Subtotal 4 [Report summary] Report total 8 Finally, reports should be identified by any identifier, name, date, version number, page number, and creator.

Systems Analysis Input and Output 8 What reports to make? The analyst should consider clustering input and output interactions by function: input process output recipient Specify what restrictions there are on the reports. This is called the view of the data. The concept is reviewed in any database and XML reporting texts and courses. In short, not all end-users ought to see all data. For example, from the same personnel and salary databases, two different end-users will see (at least) two different types of reports. One end-user may see only a list of staff identification numbers and paycheck numbers to make sure every staff member has a paycheck prepared. A manager, on the other hand, may see a summary report that lists all names, identification numbers, salaries, as well as the paycheck number.