Systems Design

Systems DesignSystems Design TasksOutput and Input Design - User Interface DesignData DesignSystem Architecture

System Design End-result/ Deliverable: System Design Specification

Output and User Interface designOutput design: focuses on user needs for screen and printed forms of outputInterface design stresses user interaction with the computer, including input design and procedures AvicennaSystem Analysis and Design System Design4Output design objectivesOutput should be designed toServe the intended purposeIt is not enough to make a report, screen, or web page available to users, you must find out and specify what purposes must be servedDesigning output to fit the userWith a large information system serving many users for many different purposes, it is difficult to personalize outputDuring fact-finding, it will be possible to determine which output users need and preferDeliver the right quantity of outputMore is not betterThe system must provide what each person needs to complete his or her work

AvicennaSystem Analysis and Design System Design5Output design objectivesOutput should be designed toMake sure the output is produced where it is neededOutput is often produced at one location, and then distributed to the userTo be useful, output must be presented to the right user No matter how well designed reports are, if they are not seen by the right user, they have no valueProvide output on timeTime plays a large part in how useful output will be to decision making Many reports are required on a daily basis, some only monthly, others yearly, and others on-demandChoose the right output methodOutput can take many formsYou need to recognize the trade-offs involved in choosing an output methodOutput methods affect, flexibility, durability, distribution, storage and retrieval possibilities

AvicennaSystem Analysis and Design System Design6Output DesignBefore designing output, ask yourself several questions:What is the purpose of the output?Who wants the information, why is it needed, and how will it be used?What specific information will be included?Will the output be printed, viewed on-screen, or both? What type of device will the output go to?When will the information be provided, and how often must it be updated?Do security or confidentiality issues exist?Your answers will affect your output design strategiesSome of the information needed to answer the questions were gathered during the system analysis phaseTo complete your answers, you should meet with users to find out exactly what kind of output is needed (you can use prototypes to obtain feedbacks)

AvicennaSystem Analysis and Design System Design7Types of OutputMost system output is printed in reports or displayed on screensNew technologies has had an enormous impact on how people communicate and obtain informationYou must consider the format and how it will be delivered, stored, and retrieved.AvicennaSystem Analysis and Design System Design8Types of OutputInternet-based information deliveryWeb designers must provide user friendly screen interfaces that display output and accept input from customersExample: Customers visiting the company site linked to an inventory system can see outputs like list of items, prices, and product availabilityAnother example of Web-based output is a system that provides customized responses to product or technical questions

E-mail: E-mail has become an essential means of internal and external business communicationCompanies use e-mail to send new product information to customers, and financial services use e-mail messages to confirm online stock tradesEmployees use e-mail to exchange documents, data, and schedules and to share business-related information they need to perform their jobsDigital Audio, Images and Video Firms use automated systems to handle voice transactions and provide information to customersSounds, images, and video clips can be captured, stored in digital format, and transmitted as output to users who can reproduce the content.

AvicennaSystem Analysis and Design System Design9Types of OutputInstant MessagingAnother way for individuals and companies to communicate effectively over the internet

Mobile DevicesMessages and data can be transmitted to a wide array of mobile devices

PodcastsSpecially formatted digital audio file that can be downloaded by internet users from a variety of content providers

AvicennaSystem Analysis and Design System Design10Types of OutputAutomated facsimile systemsFirms use automated facsimile, or called Faxback systems, to allow a customer to request a fax using e-mail, via the company web site, or by telephoneRequesting might be technical updates, information on new device drivers, or product assistanceComputer output microfilm (COM): records the images on a roll of film, microfiche records images using small sheet of filmMicrofilm, microfiche, capture an image of document and produce film outputUsers can retrieve, view, and print the imagesComputer output to laser disk (COLD): another way to store images of paper documentsPaper is scanned, and the digital image is stored on a high-density laser disk medium

AvicennaSystem Analysis and Design System Design11Types of OutputSpecialized Forms of OutputAn incredibly diverse marketplace requires a variety of specialized outputExamples:Point-of-sale terminals that handle computer-based credit card transactions, print receipts, an update inventory recordsAutomatic teller machine (ATM) that process bank transactionsSpecial-purpose printers that produce labels, photos, ID cards, gasoline pump receipts, and lottery ticketsPlotters that produce high-quality images such as maps, blueprints, and electronic circuit diagramsOutput from one system often becomes input into another systemAlthough digital technology has opened new horizons in business communications, printed output still is the most common type of output

AvicennaSystem Analysis and Design System Design12Printed and Screen OutputReports should be attractive and easy to understandManagers sometimes judge an entire project by the quality of the reports they receiveReports must include the information that a user needsReport with too little information is of no valueToo much information can make a report confusing and difficult to understandThe essential goal when designing reports is to match the report to the users specific information needsAvicennaSystem Analysis and Design System Design13Printed OutputDetail reports: produces one or more lines of output for each record processedEach line of output processed is called a detail lineContain subtotals and grand totalsControl field: controls the output, when the value of control field changes, a control break occursControl break: A control break usually causes specific actions to occur, such as printing subtotals for a group of records.

AvicennaSystem Analysis and Design System Design14Printed and Screen OutputA detail report with one printed line per employee.The report shows a simple detail report of employee hours for a chain of retail stores

detail linesAvicennaSystem Analysis and Design System Design15Printed and Screen OutputThis detail report contains the same data as the report in the pervious slide, but provides much more information. Control breaks are used to separate the data for each store, with subtotals and grand totals for numeric fields.

Sub totalsGrand totalsControl breaksAvicennaSystem Analysis and Design System Design16Printed and Screen OutputException reportsDisplays only those records that meet a specific condition or conditionsAre useful when the user wants information only on records that might require action, but does not need to know details.

An exception report that shows information only for employees who worked overtime.

AvicennaSystem Analysis and Design System Design17Printed and Screen OutputSummary reportsReports used by individuals at higher levels in the organization include less detail than reports used by lower-level employees

A summary report lists subtotals and grand totals.

AvicennaSystem Analysis and Design System Design18Printed and Screen OutputUser Involvement in Report DesignPrinted reports are an important way of delivering information to users, so recipients should approve all report designs in advanceTo avoid problems submit each design for approval as it is completed, rather than waiting to finish all report designsMock-up: a sample report that the designer should produce for users to reviewMock-up should include typical field values and contain enough records to show all the design featuresYou can use word processor, a report generator, or a printer spacing chart to create mock-up report designs

AvicennaSystem Analysis and Design System Design19Report Design PrinciplesPrinted reports must be attractive, professional, and easy to readReport headers A report header appears at the beginning of a report and identifies the report as well as the report title, date, and other necessary information. report footersThe report footer, which appears at the end of the report, can include grand totals for numeric fields and other end-of-report information. Page headersA page header appears at the top of the page and includes the column headings that identify the data. page footersA page footer appears at the bottom of the page and is used to display the name of the report and the page number.

AvicennaSystem Analysis and Design System Design20Printed and Screen OutputThe Employee Hours report is a detail report with control breaks, subtotals, and grand totals. Notice that a report header identifies the report, a page header contains column headings, a group footer contains subtotals for each store, a report footer contains grand totals, and a page footer identifies the page number.

Identifying fieldsHours fieldsReport headerPage headerGroup footerReport footerPage footerControl breakAvicennaSystem Analysis and Design System Design21Report Design PrinciplesColumn heading alignmentThere are several column heading alignment options

Four different column heading alignment options.

AvicennaSystem Analysis and Design System Design22Report Design PrinciplesColumn SpacingSpace columns of information carefullyCrowded reports is hard to read, and large gaps between columns make it difficult for the eye to follow a lineColumn should stretch across the report, with uniform spacing and suitable margins at top, bottom, right, and leftField orderFields should be displayed and grouped in a logical orderGrouping detail linesIt is meaningful to arrange detail lines in groupsGroup header: A group header appears above the first detail line of a group. Group footer: A group footer appears after the last detail line of a group. Group footers could include items such as a subtotal, an average, or a count of the records in that group.

AvicennaSystem Analysis and Design System Design23Report Design IssuesToo much detail is on the page, forcing users to search for the information they needGood design standards produce reports that are uniform and consistentWhen a system produces multiple reports, each report should share common design elementsConstant information does not change when the report is printedVariable information changes each time the report is printedSpecify the paper quality, type, and sizeLabel each column of data appropriatelyAfter a report design is approved, you should document the design in a report analysis form which contains information about the fields, data types and lengths, report frequency and distribution, and other comments.

AvicennaSystem Analysis and Design System Design24Printing Volume and Time RequirementsHigh volume of reports can significantly increase a systems TCOPaper is expensive to purchase, print, and storePrinted information is outdated quicklyTake into consideration printer specific capacity and limitationEfficient printing operations, timely delivery of finished reports, and accurate forecasts of paper and storage needs, all depend on accurate estimates of print volume and timesAvicennaSystem Analysis and Design System Design25Output Control and SecurityOutput must be accurate, complete, current, and secureCompanies use various output control methods to maintain output integrity and securityOutput control includesReport titleReport number report codePrinting dateTime period coveredThe end of the report should be labeled clearlyControl totals and recorded counts should be reconciled against input totals and countsAll processing errors or interruptions must be logged so they can analyzedAvicennaSystem Analysis and Design System Design26Output Control and SecurityOutput security protects privacy rights and shields the organizations data from theft or unauthorized accessOutput security includesLimit the number of printed copies and use a tracking procedure to account for each copyYou should use specific procedures to ensure that the output is delivered to authorized recipients onlyKeep sensitive data in a secure place

AvicennaSystem Analysis and Design System Design27Output Control and Security The IT department is responsible for output control and security measuresSecurity should be designed into the system by using passwords and other authentication methodsControlling user access by assigning suitable authorizations and privilegesPhysical security always will be necessaryMany companies have installed diskless workstationsA diskless workstation is a network terminal that supports a full-featured user interface, but limits the printing or copying of data, except to certain network resources that can be monitored and controlled more easily. USER INTERFACE DESIGNAvicennaSystem Analysis and Design System Design29User Interface DesignThe user interface (UI) is the system which helps users communicate with the computer system and/or the application systemUI Consists of all the hardware, software, screens, menus, functions, and features that affect two-way communications between the user and the computerA good user interface provides a unifying structure for finding, viewing and invoking the different components of a system

AvicennaSystem Analysis and Design System Design30Evolution of the User InterfaceIn older systems, analysts designed all the printed and screen output first, then worked on the inputs necessary to produce the resultsIn older systems interface mainly consisted of Process-control screens that allowed the users to send commands to a system A process control screen (also known as a dialog screen) is part of the user interface, and enables a user to initiate or control system actions. A process-control screens worked well with traditional systems that simply transformed input data into structured outputAs information management evolved from centralized data processing to dynamic, enterprise-wide systems, the primary focus also shifted from the IT department to the users themselves

AvicennaSystem Analysis and Design System Design31Evolution of the User InterfaceIn modern systems, the main focus is on users within and outside the company, how they communicate with the information system, and how the system supports the firms business operationsIn modern systems most users work with varied mix of input, screen output, and data queriesTo perform users day-to-day job, the user interface is a vital element in the systems design phaseRequires an understanding of human-computer interaction and user-centered design principles

User Interface DesignCompare the traditional, processing-centered system at the top of the figure to the modern, user-centered information system at the bottom. Notice the change in the role of the IT department.

AvicennaSystem Analysis and Design System Design33User Interface DesignHuman-Computer InteractionA user interface is based on basic principles of human-computer interactionHuman-computer interaction (HCI) describes the relationship between computers and people who use them to perform business-related tasksUser interface includes all communications and instructions necessary to enter input to the system and to obtain output in the form of screen displays or printed reportsAs a systems analyst, your main objective is to create a user-friendly design that is easy to learn and use

AvicennaSystem Analysis and Design System Design34User Interface DesignHuman-Computer InteractionDr. Clare-Marie Karat IBM usability expert, states that in this new computer age, the customer is not only right, the customer has rights.The user rights cited by Dr. Karat includePerspective: The user is always right. If there is a problem with the use of the system, the system is the problem, not the userInstallation: the user has the right to install and uninstall software and hardware systems easily without negative consequencesCompliance: the user has the right to a system that performs exactly as promisedInstruction: the user has the right to easy-to-use instructions(user guides, online or contextual help, and error messages) for understanding and utilizing a system to achieve desired goals and recover efficiently and gracefully from problem situations.Control: the user has the right to be in control of the system and to be able to get the system to respond to a request for attention

AvicennaSystem Analysis and Design System Design35User Interface DesignHuman-Computer InteractionThe user rights cited by Dr. Karat includeFeedback: the user has the right to a system that provides clear, understandable, and accurate information regarding the task it is performing and the progress towards completionDependencies: the user has the right to be informed clearly about all systems requirements for successfully using software or hardwareScope: the user has the right to know the limits of the systems capabilitiesAssistance: the user has the right to communicate with the technology provider and receive a thoughtful and helpful response when raising concernsUsability: the user has the right to be the master of software and hardware technology, not vice versa

AvicennaSystem Analysis and Design System Design36

Basic Principles of User-Centered Design

Understand the underlying business functions the interface designer must understand the underlying business functions and how the system supports the individual, departmental, and enterprise goalsoverall objective is to design an interface to help users perform their jobA good starting point might be to analyze a functional decomposition diagram (FDD) FDD can provide a check list of user tasks that you must include in the interface design.Maximize graphical effectiveness (GUI) uses graphical objects and techniques that allow users to communicate with the system. A well designed GUI help users learn a new system rapidly, and work with the system effectively.Profile the system usersa system analyst must understand user experience, knowledge, and skill levels.The interface should be flexible enough to accommodate novices as well as experienced users

AvicennaSystem Analysis and Design System Design37Basic Principles of User-Centered Design

Think like a userthe designer must learn to think like a user and see the system through a users eyes.The interface should use terms that are familiar to usersUse prototyping it is essential to construct models, and prototypes for a user approval. Then interface designer should obtain as much feedback as possible, as early as possibleInitial screen designs can be through storyboard, a sketch that shows the general screen layout and design Design a comprehensive interface the user interface should include all tasks, commands, and communications between the users and the information system

Basic Principles of User-Centered DesignIn designing a comprehensive interface:Too many options on one screen can confuse a user but too few options increase the numbe of submenu levels and complicate the navigation process. AvicennaSystem Analysis and Design System Design39Basic Principles of User-Centered DesignContinue the feedback processit is important to monitor system usage and user suggestions(sometimes full-scale operation highlight problems that were not apparent when the prototype was tested)You can determine if system features are being used as intended by observing and surveying usersDocument the interface design you should document all screen designs for latter use by programmers If you are using a CASE tool or screen generator, number the screen designs and save them in hierarchy similar to a menu tree.

It is important to design a user interface that is easy to use, attractive and efficient.AvicennaSystem Analysis and Design System Design41User interface design guidelinesGood user interface design is based on eight basic guidelines:Focus on basic objectivesBuild an interface that is easy to learn and useProvide features that promote efficiencyMake it easy for users to obtain help or correct errorsMinimize input data problemsProvide feedback to usersCreate an attractive layout and designUse familiar terms and images

Good user interface design is based on:-Ergonomics, describes how people work, learn, and interact with computers;-Aesthetics, focuses on how an interface can be made attractive and easy to use;-Interface Technology, provides the operational structure required to carry out the design objectives.AvicennaSystem Analysis and Design System Design43User interface design guidelinesFocus on basic objectivesFacilitate the system design objectives, rather than calling attention to the interfaceCreate a design that is easy to learn and rememberDesign the interface to improve user efficiency and productivityWrite commands, actions, and system responses that are consistent and predictableMinimize data entry problemsAllow users to correct errors easilyCrate logical and attractive layout

44User interface design guidelinesBuild an interface that is easy to learn and useLabel clearly all controls, buttons, and icons.Select only those images that users can easily understandProvide on-screen instructions that are logical, concise, and clear.Show all commands in a list of menu item, but dim any commands that are not currently available.Make it easy to return to one or more levels in the menu structure

In the example shown at the top of the figure, only one of the control buttons has an obvious meaning. In the bottom screen, the first message is hard to understand, but the bottom message is unmistakable.

AvicennaSystem Analysis and Design System Design45User interface design guidelinesProvide features that promote efficiency organize tasks, commands, and functions in groups that resemble actual business operations. You should group functions and submenu items in a multilevel menu hierarchy, or tree, that is logical and reflects how users typically perform the tasks.

Tasks, commands, and functions should be organized in logical groups, such as this menu hierarchy for a customer order tracking system [1]AvicennaSystem Analysis and Design System Design46User interface design guidelinesProvide features that promote efficiencyCreate alphabetical menu or lists or place the selections used frequently at the top of the menu list.Provide shortcuts so experienced users can avoid multiple menu levels(e.g. ALT + the underlined letter of a command)Use default values if the majority of values in field are the sameProvide a fast-find feature that displays a list of possible as soon as users enter the first few letters.Use a natural language feature that allows users to type commands or requests in normal English phrases (e.g. MS Office products allows users to request help by typing a question into a dialog box, the software then uses natural language technology to retrieve a list of topics that match the request).

47User interface design guidelinesMake it easy for users to obtain help or correct errorsEnsure that Help is always availableProvide user-selected Help and context-sensitive HelpProvide a direct route for users to return to the point from where Help was requestedInclude contact information, such as telephone numberRequire user confirmation before data deletion (Are you sure?) Provide an Undo keyHighlight the erroneous part of a command and allow the user to make correction without retyping the entire command

A context-sensitive dialog box that is displayed if a user requests help while entering data into the ADVISOR ASSIGNED field. Clicking the Close button returns the user to the task.

AvicennaSystem Analysis and Design System Design48User interface design guidelinesMinimize input data problemsProvide data validation checksDisplay event-driven messages and reminders, display an appropriate message when it is time for the user to perform a certain taskEstablish a list of predefined values that users can click to selectPredefined values prevent spelling errors, avoid inappropriate data in a fieldBuild in rules that enforce data integrityUse input masks, which are templates or patterns that make it easier for users to enter data.

49User interface design guidelinesProvide feedback to usersDisplay messages at a logical place on the screen, and be consistentAlert users to lengthy processing times or delays. Give users an on-screen progress report, especially if the delay is lengthy.Allow messages to remain on the screen long enough for users to read themLet the user know whether the task or operation was successful or not(e.g. Update Completed, ID num not found) Provide a text explanation if you use an icon or image on a control button(e.g. Use messages that are specific, understandable, and professional

Avoid messages that are cute, cryptic, or vague such as: ERROR-You have entered an unacceptable valueERROR DE416

Better examples are:Enter a number between 1 and 5.Customer number must be numeric.Please re-enter a numeric value.

AvicennaSystem Analysis and Design System Design51User interface design guidelinesCREATE AN ATTRACTIVE LAYOUT AND DESIGNUse appropriate colors to highlight different areas of the screen; avoid gaudy and bright colors.Use special effects like sound and animation carefully. Too many special effects can be distracting and annoying to the user.Use hyperlinks that allow users to jump to related topics.Group related objects and information. Visualize the screen the way a user will see it, and simulate the tasks that the user will perform.Screen density is important. Keep screen displays uncluttered, with enough white space to create an attractive, readable design.

AvicennaSystem Analysis and Design System Design52User interface design guidelinesCREATE AN ATTRACTIVE LAYOUT AND DESIGNDisplay titles, messages and instructions in a consistent manner and in the same general locations on all screens.Use consistent terminology. For example, do not use the terms delete, cancel, and erase to indicate the same action.Ensure that commands will always have the same affect.Ensure that similar mouse actions will produce the same results throughout the application Require the user to confirm data entry by pressing the ENTER key or TAB key at the end of a fill in field, even if the data does not completely fill the field.

AvicennaSystem Analysis and Design System Design53User interface design guidelinesUse familiar terms and imagesProvide a keystroke alternative for each menu command, with easy to remember letters, such as File, ExitUse familiar commands, such as Cut, Copy and PasteAvoid programmer terminology/technical jargon

Provide a Windows look and feel in your interface design if users are familiar with Windows-based applicationsRemember that users are accustomed to a pattern of red = stop, yellow = caution, and green = go. Stick to that pattern and use it when appropriate to reinforce on-screen instructions

AvicennaSystem Analysis and Design System Design54USER INTERFACE CONTROLSMenu bar: main menu options at the top of the screenToolbar: contains icons or buttons that represent shortcuts for executing common commandsCommand buttonDialog box: allows users to enter information about a task that the system will perform.Text box: can display messages or provide a place for user to enter data Toggle button: is used to represent on or off status , clicking the toggle button switches to the other status

AvicennaSystem Analysis and Design System Design55USER INTERFACE CONTROLSList box:displays a list of choices that the user can selectscroll bar: allows the user to move through the available choices.Drop-down list box(combo box): displays the current selection; when the user clicks the arrow, a list of the available choices displaysOption button, or radio button: represent groups of options. The user can select only one option at a time; a selected option contains a black dot. Check box: is used to select one or more choices from a group.Calendar control: allows the user to select a date that the system will display and store as a field value

AvicennaSystem Analysis and Design System Design56User interface controls

AvicennaSystem Analysis and Design System Design57The opening screen is especially important because it introduces the application and allows users to view the main optionsIn designing an opening screen, you can use a main form which functions like a switchboardA switchboard uses command buttons that enable users to navigate a system and select from groups of related tasks.

58Evaluating User InterfacesThe five useful standards in evaluating the interfaces areThe training period for users should be acceptably shortUsers in the early part of their training should be able to enter commands without thinking about them, or referring to a help menu or manualThe interface should be "seamless" to minimize input/output errors Time necessary for users and the system to bounce back from errors should be shortInfrequent users should be able to relearn the system quickly

End of Part 1