1 / 64

CHAPTER 11 DESIGNING THE USER INTERFACE LAYER

CHAPTER 11 DESIGNING THE USER INTERFACE LAYER. Objectives Understand the difference between User Interfaces and System Interfaces Explain why the User Interface is the System to the Users Discuss the importance of the three principles of User-centered design

Download Presentation

CHAPTER 11 DESIGNING THE USER INTERFACE LAYER

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. CHAPTER 11DESIGNING THE USER INTERFACE LAYER Objectives • Understand the difference between User Interfaces and System Interfaces • Explain why the User Interface is the System to the Users • Discuss the importance of the three principles of User-centered design • Describe the historical development of the field of Human-Computer Interaction (HCI) • Describe the three metaphors of Human-Computer Interaction (HCI) • Discuss how Visibility and Affordance affect usability • Apply the eight golden rules of Dialog Design when designing the User Interface • Avoid common mistakes in Web design • Define the overall System structure as a Menu hierarchy Object-Oriented Analysis and Design with the Unified Process

  2. USER INTERFACE DESIGN • Information Systems capture Inputs and produces Outputs, and Inputs and Outputs occur where there are ‘Interfaces” between the System and its environments. • User Interfaces handle Inputs and Outputs that involve a System User directly • System Interfaces handle Inputs and Outputs that require minimal human intervention. • In most System Development Projects, Analyst separate design of System Interfaces from the design of User Interfaces because the two types require different expertise and technology. • Developer must consider the interaction between the User and the Computer for every Use Case with an input or Output, and define the Interface to process the input or Output. • The Interaction is much like a dialog between the User and the Computer, Thus the User-Interface Design is often referred to as “Dialog Design”. Object-Oriented Analysis and Design with the Unified Process

  3. USER INTERFACE • User Interface is everything the End-user comes into contact with while using the System ; Physically, Perceptually, and Conceptually. • To the End-User of a System the User Interface is the System itself. Thus, Consideration of User Interface Design should come very early in the development process • The term “Human-Computer Interaction” (HCI) is generally used to refer to the study of end-Users and their Interaction with Computers. Object-Oriented Analysis and Design with the Unified Process

  4. USER INTERFACE PHYSICAL ASPECTS OF USER INTERFACE • Physical Aspect of User interface include the devices the User actually touches, including the keyboard, mouse, touch screen, or keypad etc. • Also the desk space, the documents , the available light, and the Computer terminal hardware all make up the Physical Interface for the end User PERCEPTUAL ASPECTS OF USER INTERFACE • Perceptual aspect includes everything the End-User sees, hears, or touches (beyond the Physical devices). Such as All data and instructions displayed on the screen, including shapes, lines, numbers and words. Sounds made by the system, beeps or clicks as well as computer generated speech . • Objects that the User touches such as Menus, Dialog boxes, and buttons, documents, drawings or records of transactions with a mouse when completing tasks on the screens Object-Oriented Analysis and Design with the Unified Process

  5. USER INTERFACE CONCEPTUAL ASPECTS OF USER INTERFACE • Includes everything User knows about using the System such as Problem Domain Things (Classes) in the System, The Operations that can be performed and the Procedures followed to carry out the operations. • The knowledge about using the System is referred to as “User’s Model” of the System. Much of the User’s Model is based on the Requirements Model of the system. • The User’s Knowledge becomes the determinant of what the System is, and if the User’s knowledge of the System is part of the Interface, then the User Interface must be much more than a component added near the end of the Project. Object-Oriented Analysis and Design with the Unified Process

  6. Aspects of the User Interface Object-Oriented Analysis and Design with the Unified Process

  7. User-Centered Design • Many researches focus their attention on creating Analysis and Design Techniques that place the User Interface at the centre of the Development process because they recognize the importance of the User Interface to System Developers and the System Users. • TheseTechniques are often referred to as “User-Centered Design” • The User-Centered Design Techniques emphasize three important principles:- • Focus early on the users and their work • Evaluate Designs to ensure Usability • Use iterative development Object-Oriented Analysis and Design with the Unified Process

  8. User-Centered Design FOCUS EARLY ON THE USER AND THEIR WORK • The Object-oriented approach focuses early on the Users and their Work by identifying Actors, Use Cases and Scenarios followed by Users when using the System. • User-Centered design goes much further in attempting to understand the Users by exploring, What Users know, How Users learn, How they prefer to work, and what motivates the Users. EVALUATE DESIGN TO ENSURE USABILITY • Usability refers to the degree to which a System is easy to “Learn” and easy to “Use”. • Ensuring Usability is not easy since there are many different Users, with differing preferences and skills to accommodate. USE ITERATIVE DEVELOPMENT • Iterative development keeps the focus on the User by continually returning to the User Requirements during each iteration and by evaluating the System after each iteration. Object-Oriented Analysis and Design with the Unified Process

  9. HUMAN COMPUTER INTERACTION (HCI) • User Interface Design techniques and HCI as a field of study evolved from studies of Human Interaction with machines in general, referred to as “Human Factors Engineering”The field of Human Factors Engineering was first associated with engineering. Gradually, specialists emerged who begun to draw on many disciplines to understand people and their behavior. • These disciplines include Cognitive Psychology, Social Psychology, Linguistics, Sociology, Anthropology, and others. • Information Systems specialists with an interest in Human-Computer Interaction, study Computers plus all of these disciplines. • The field of HCI has grown to support many academic journals, conferences, etc and many undergraduate and graduate degree programs are also available to train HCI specialist. Object-Oriented Analysis and Design with the Unified Process

  10. Fields Contributing to the Study of HCI Object-Oriented Analysis and Design with the Unified Process

  11. Metaphors for Human-Computer Interaction There are many ways to think about Human Computer Interaction, including “Metaphors” or “Analogies”. There are three Metaphors for HCI • Direct Manipulation Metaphor (including Desktop Metaphor) • Document Metaphor • Dialog Metaphor DIRECT MANIPULATION METHAPHOR A Metaphor of HCI in which the User Interacts directly with objects on the Display Screen instead of typing commands. Objects are made visible on the screen so the User can point at them and manipulate them with the mouse or arrow keys. • Direct manipulation coupled with O-O Programming eventually evolved into the Desktop Metaphor. Object-Oriented Analysis and Design with the Unified Process

  12. Metaphors for Human-Computer Interaction DESKTOP METAPHORA Direct Manipulation Metaphor approach in which the Display Screen includes an arrangement of objects commonly found on a Desk. Common Desktop objects include Notepad, Calendar, Calculator, Telephone, Answering machine, Fax, CD Player Video monitor, Folders etc… DOCUMENT METHAPOR A Metaphor in which interaction with computer involves browsing and entering data on Electronic documents. These Document that allow the Users to click on a link and jump to a different part of the document or to other documents are referred to as “Hypertext Documents” Hypermedia extends the Hypertext Document concept to include multimedia content such as graphics, video ,and audio in a document all of which can be linked for navigation by a User. Object-Oriented Analysis and Design with the Unified Process

  13. Metaphors for Human-Computer Interaction DIALOG METHAPOR A Metaphor of HCI in which interacting with the computer is much like carrying on a conversation or Dialog. The Dialog Metaphor is another way of thinking about Human Computer Interaction because the Computer and the User “Listens to” and “responds to” each others questions or comments. • Advances in Computer technology are making it possible for User to communicate in more natural ways (i.e. Voice Communication) , but the typical User Interface today still rely on the mouse and keyboards. • One reason is the need for silence and also privacy in the office. Thus, it is not clear whether Voice commands will become common in computer applications. Object-Oriented Analysis and Design with the Unified Process

  14. Desktop Metaphor Based on Direct Manipulation Shown on Display Screen Object-Oriented Analysis and Design with the Unified Process

  15. Guidelines for Designing User Interfaces • There are many Interface Design Guidelines ranging from general Principle to Very specific Guidelines to guide System Developers. • Some organizations adopt these Interface Design Guidelines as Design Standards in order to help them ensure that all User Interfaces function well and that all Systems developed by the Organization have a similar “Look and Feel”. • The two Key Principles to ensure good interaction between User and the System are: • Visibility • Affordance Object-Oriented Analysis and Design with the Unified Process

  16. Guidelines for Designing User Interfaces VISIBILITY Visibility is one of the Key Principle of HCI stating that all Controls should be visible and provide feedback to indicate the Control is responding to the User’s action. e.g . A Button that can be clicked by a User is visible, and when it is clicked, it changes to look as though it has been pressed, to indicate it is responding. Some buttons make a clicking sound to provide feed back. AFFORDANCE Affordance is another key Principle of HCI stating that the appearance of any Control should suggest its functionality- that is , the purpose for which the Control is used. e.g.A button affords clicking, a Scroll Bar affords scrolling and an Item in a List affords selecting. Object-Oriented Analysis and Design with the Unified Process

  17. Guidelines for Designing User Interfaces • If User Interface Designers make sure that all Controls are Visible and that heir Appearance suggests what they do, the Interface will be usable. • Most Users are familiar with Window Interfaces and the common Windows Controls. • System Designers should be careful to apply Visibility and Affordance Principles when designing Web Pages. • Many new types of Controls are now possible at Web sites, but these Controls are not always Visible and their effects are not always obvious as they are in a “Standard Windows Interface”. • e.g. Sometimes you click an image and a new pages opens in the Browser. Other times you click an image and nothing happens. Object-Oriented Analysis and Design with the Unified Process

  18. The Eight Golden Rules for Designing Interactive User Interfaces • 1. Strive for Consistency • 2. Enable Frequent Users to Use Shortcuts • 3. Offer Informative Feedback • 4. Design Dialogs to Yield Closure • 5. Offer Simple Error Handling • 6. Permit Easy Reversal of Actions • 7. Support Internal Locus of Control • 8. Reduce Short-Term Memory Load • Although these Rules are General Guidelines rather than Specific Rules yet they are the key to Usability. • With these rules in mind the Interface Designer can help ensure that User Interactions are efficient and effective. Object-Oriented Analysis and Design with the Unified Process

  19. The Eight Golden Rules for Designing Interactive User Interfaces 1.Strive For Consistency Designing a consistent looking Interface that functions consistently is one of the most important Design goal. • The way that information is arranged on Forms, • The Names and arrangements of Menu Items • The Size and shape of Icons • The Sequence followed to carry out tasks should be consistent throughout the System. If a new application comes along that has different way of functioning, the Users will be unhappy and this will have a negative effect on their productivity. However researches has shown that Inconsistent Interfaces sometimes are beneficial. • If User is interacting with multiple Applications in separate Windows, a different visual appearances may help the User to differentiate them • When the User is learning several Applications in one session some differences in the Interfaces may help the User remember which Application is which. Object-Oriented Analysis and Design with the Unified Process

  20. The Eight Golden Rules for Designing Interactive User Interfaces 2. ENABLE FREQUENT USERS TO USE SHORTCUTS • Users who work with one Application all day long are willing to invest tome to learn Shortcuts. • Users rapidly lose patience with long Menu sequences and multiple Dialog boxes when they know exactly what they want to do. Therefore, Designers proved Shortcut Keys that reduce the number of interactions for a given task. • Also Designers should consider providing “Macro Facilities” for user to create their own Shortcuts. 3. OFFER INFORMATIVE FEEDBACK • Every Function User takes should result in some type of feedback from the Computer so that the User knows the action has been recognized. Even Keyboard clicks can help the User. Thus Clicking a button should visually change and perhaps make a sound. • Feedback of information is also important .Feedback can sometimes provided to help the User in other ways Object-Oriented Analysis and Design with the Unified Process

  21. The Eight Golden Rules for Designing Interactive User Interfaces 4. DESIGN DIALOG TO YIELD CLOSURE • Each Dialog with the System should be organized with a clear sequence. i.e. A Beginning, Middle, and End. • The User’s tasks on the Computer should also follow the same way. • The User can get lost if it is not clear when a task starts and ends. Additionally, the User often focuses intently on a task. So when it is confirmed that the task is complete, the User can clear his/her mind and get ready to focus on the next task. • If the System Requirements are defined initially as Events to which the System responds, each Event leads to processing of one specific, well defined Use Case. • Event Decomposition sets the stage for Dialogs with Closer. Object-Oriented Analysis and Design with the Unified Process

  22. The Eight Golden Rules for Designing Interactive User Interfaces 5. OFFER SIMPLE ERROR HANDLING • User errors are costly in terms of time and money to correct them . So the Designer must prevent the User from making errors whenever possible • A chief way prevent errors is to limit available options and allow the User to choose only from a valid options at any point in the dialog. - Nevertheless, if an error occur the System should have mechanism for handling it such as “Validation Techniques”. • When the System finds an error, the error message should state specifically what is wrong and explain how to correct it. - Error Messages should not be judgmental ! - The System should also make it easy to correct the error. - To make error correction easy the System should be redisplayed with all fields still filled in, and the cursor should be placed at the field with invalid data, ready for User to edit the field. Object-Oriented Analysis and Design with the Unified Process

  23. The Eight Golden Rules for Designing Interactive User Interfaces 6. PERMIT EASY REHARSAL OF ACTION • Users need to feel that they can explore options within the System and take actions that can be cancelled or reversed without difficulties. - This is one way that Users learn about the System (by experimenting!) as well canceling the action when they realize that they make a mistake. • Designers should be sure to include:- - “CANCEL” Buttons on all Dialog Boxes and and allow User to go back one step at a time. - Confirmation Message when “DELETE” button is used . 7. SUPPORT INTERNAL LOCUS OF CONTROL Experienced Users want to feel that they are in charge of the System and that the System responds to their commands. Users should not be forced to do anything or made to feel as if the System is controlling them. System should make the User feel that s/he is deciding what to do. Designers can provide much of this comfort and control through the wording or prompts and messages. Object-Oriented Analysis and Design with the Unified Process

  24. The Eight Golden Rules for Designing Interactive User Interfaces 8. REDUCE SHORT-TERM MEMORY LOAD • People have many limitations, and short-term memory is one of the biggest. People can remember only about seven chunks of information at a time. • The Interface Designer should not place too much of a burden on the User’s memory by assuming that the User will remember anything from a form to another form or dialog box to dialog box during the interaction with the System. For example: If the User has to stop and ask “Now what was the file name, What was the Customer number etc… is an indication of placing too much of a burden on the User’s memory. Object-Oriented Analysis and Design with the Unified Process

  25. DOCUMENTING DIALOG DESIGN • Many Techniques are available to help the Designer to document Dialog Design • Techniques for the Dialog Designs:- • Storyboarding, • Prototypes • UML Diagrams can be used • Written descriptions following flow of events Object-Oriented Analysis and Design with the Unified Process

  26. DOCUMENTING DIALOG DESIGN • The Dialogs that must be designed are based on Use Case Inputs and Outputs requiring User Interaction. • Generally each Use Case with an:- • Input obtained interactively from a User requires a Dialog Design • Output produced at the request of a User requires a Dialog Design • These techniques are also used to define a Menu Hierarchy that allows the User to navigate to each Dialog. - The available Menus reflect the overall System Structure from the User point of view. - Each Menu contains a hierarch of options and often arranged by Sub-systems or by action on objects. Object-Oriented Analysis and Design with the Unified Process

  27. A Use Case Diagram of the Customer Support System (by Subsystem) Object-Oriented Analysis and Design with the Unified Process

  28. DOCUMENTING DIALOG DESIGN USE CASE, SUB SYSTEMS AND MENU HIERARCHY • The available Menus reflect the overall System Structure from the User point of view. • Each Menu contains a hierarch of options and often arranged by Sub-systems or by action on objects. • Each Sub System might be represented as a Menu with each Menu option representing a Use Case. • Menus might also be arranged according to objects (Customer, Orders, Inventory etc) with each Menu option representing an operation on an object. • Menus should also include portions that are not Use Case based on the Event List (most important are options related to the System Controls) Object-Oriented Analysis and Design with the Unified Process

  29. DOCUMENTING DIALOG DESIGN A Menu Hierarchy grouped by Subsystems and based on Use Cases Order EntrySystem Utilities Check Availability Printers and devices Create new Order Backup and Recovery Update Order User Accounts - Maintain Accounts - Change Password * Added Menus During Design for Controls Preferences and Help ORDER FULFILLMENTCheck Order Status Record Fulfillment Record Back Order Create Return A Dialog Design is created for each of these Menu Options. After completion the Dialog Designs for all options the Designer can redefine the structure of the Menus for different types of Users. Object-Oriented Analysis and Design with the Unified Process

  30. DOCUMENTING DIALOG DESIGN • Designers can also document Dialog Designs by writing a Human / Computer “Dialog • The Designer thinks through the sequence of screens that the User would need to carry on this Dialog with Computer. • One Technique used to show the Screens is called “Storyboarding”. • STORYBOARDING Is a technique used to document Dialog designs by showing a sequence of Sketches of the Display Screen. • Sketches do not have to be very detailed to show the basic design concept. • Designers can implement a Storyboard with a Visual Programming tool such as Visual Basic etc…. This Storyboarding approach to Dialog Design provide only a framework to work from and the resulting design remains fairly general. As working Prototypes are produced many details still have to be worked out. Object-Oriented Analysis and Design with the Unified Process

  31. DIALOG DOCUMENTATION WITH UML Many UML Diagrams are useful for modeling User-Computer Dialogs • Use Case Descriptions include a list of Steps followed as the User and System interacts • Activity Diagrams also document the Dialog between User and System • System Sequence Diagrams also shows a dialog between the User and the System. • SSD is based on sequence of steps included in the Use Case Description therefore it implies that Dialog Design for the Use Case begins very early and is refined continually. • Sequence Diagrams also contain User-Interface Classes <<boundary>> to show details about the Dialog between the User and Computer. (e.g. Input form) Object-Oriented Analysis and Design with the Unified Process

  32. DIALOG DOCUMENTATION with UML • A Class Diagram with the Interface Classes can be used to show the structure of the Form. • A Sequence Diagram can be used to model the Messages between the User and the Specific Objects making up the Form, including the message that the interface Objects send to each other. Object-Oriented Analysis and Design with the Unified Process

  33. Class Diagram Showing Interface Classes Making up the Item Search Form Object-Oriented Analysis and Design with the Unified Process

  34. Sequence Diagram for the RMO Look Up Item Availability with Item Search Form Added Object-Oriented Analysis and Design with the Unified Process

  35. Sequence Diagram Showing Specific Interface Objects for the Look Up Item Availability Dialog Object-Oriented Analysis and Design with the Unified Process

  36. GUIDELINES FOR DESIGNING WINDOWS AND BROWSER FORMS • Analyst must take care in designing the Forms that Users see on the screen • Each Dialog might require several Windows Forms and each Form must be designed for “Usability”. • The underlying principles of designing Window Forms regardless of its environment (i.e. Microsoft Windows, X-Windows (Unix) or Macintosh Windows) are same. • Standard Tools are widely available to create Input forms and Browser Forms. • Windows Tools: Visual Basic, C++, Java etc… • Browser Tools: HTML, ASP, Java Servlets etc.. Object-Oriented Analysis and Design with the Unified Process

  37. GUIDELINES FOR DESIGNING WINDOWS AND BROWSER FORMS WINDOW FORMS vs BROWSERS • WINDOW FORMS are programmed in a full-featured Programming languages such as Visual Basic, C++ or Java etc…. • Window forms have the advantage of being extremely flexible and capable of accessing data directly on a Workstation. • BROWSER FORMS are programmed using HTM, and script languages such as VBscript or JavaScript. Object-Oriented Analysis and Design with the Unified Process

  38. GUIDELINES FOR DESIGNING WINDOWS AND BROWSER FORMS WINDOW FORMS vs BROWSERS Browser Forms have the advantage of being displayed by any Internet Browser, which makes them accessible on a variety of platforms. • Browser Forms have the additional advantage since the same forms can be used by both internal staff on Company Intranets and Customers on the Internet. (As a result many firms are designing User Interfaces for their new Systems as Browser Forms.) • - Browser Forms produced by Visual Studio.NET (called Web forms) provide the same design flexibility as Window Forms.- Server-side Processing using ASP or Java Servlets can add some of the Window form functionality to Browser forms • A Major Difference between a standard Window Input Forms and Browser Input Forms is that the Window form can easily perform edits field by field as the data are entered. • - However in a Basic Browser Input Form the edits are not performed until Form is transmitted to the Server Computer. Object-Oriented Analysis and Design with the Unified Process

  39. GUIDELINES FOR DESIGNING WINDOWS AND BROWSER FORMS CATAGORIES OF FORMS • Input Forms • Output Forms • Input / Output Forms • Input Forms are used to record a transaction or enter Data. • Output forms are displaying information • Input /Output Forms are closely related and are designed using similar principles. • Before designing a Form the Designer should carefully analyze the “Integrity Controls” required for Data Input. • There are four major issues to consider in the Design of a Form • Form Layout and Formatting • Data Keying and Data Entry • Navigation and Support Controls • Help Support Object-Oriented Analysis and Design with the Unified Process

  40. GUIDELINES FOR DESIGNING WINDOWS AND BROWSER FORMSFORM DESIGN ISSUES • Form Layout and Consistency • Headings, Labels, Logos • Font sizes, Highlighting, Colors • Order of fields • Data keying and Data entry • Text Boxes, List Boxes, Combo Boxes, etc. • Navigation and support controls • Help support • Tutorials, Indexed help , Context-sensitive help Object-Oriented Analysis and Design with the Unified Process

  41. FORM LAYOUT AND FORMATTING • Form Layout and Formatting are concerned with the General Look and Feel of the Form • The Forms that are well laid out are the form that are easy to use. • One of the best method to ensure good laid out forms is to Prototype various alternatives and let users test them. • As you Design the Forms you should think about:- • Consistency • Headings, Labels, and Logos • Distribution and Order of Data-entry Fields and Buttons • Font Sizes, highlighting and Colors. Object-Oriented Analysis and Design with the Unified Process

  42. FORM LAYOUT AND FORMATTING 1. CONSISTENCY is the most important especially when multiple Inputs Forms are required by large Systems and several people involve in the design. • Consistent use of Function Keys, Shortcuts, Control Buttons, color and Layout makes the system much more useful and professional. • Design Templates help the Designer to control the consistency of Window Forms • Cascading Style sheets help designers to control consistency of Web Forms. 2. HEADINGS, LABELS, AND LOGOS help to convey the purpose of the form. • A clear, descriptive Title at the top of the Form helps to minimize confusion about a form’s use. • Labels should also be easy to identify and read Object-Oriented Analysis and Design with the Unified Process

  43. FORM LAYOUT AND FORMATTING 3. Carefully position of the Data-entry fields around the Form • Place related fields next to each other and even isolate them with a fine- lined box. • Carefully consider TAB order. • Use blank space to distinguish and enable easy reading of the Fields. • Navigation Buttons are normally at the bottom of the Window. Be sensitive to follow the traditions of Navigations! 4. FONT SIZES, HIGHLIGHTING AND COLORS. • The purpose is to make the form easy to read. • A Careful mix of large fonts, with small fonts, bold and normal types and fonts with different colors or backgrounds can help a user to find important critical information. Object-Oriented Analysis and Design with the Unified Process

  44. DATA KEYING AND DATA ENTRY • The heart of any Input Form is the entry of the new data. However a primary objective is to require as little data entry as possible. • Any information that is already in the computer or that could be generated by computer should not be re-entered. • Use Selection Lists, Check boxes, Automatic retrieval of Descriptive fields etc will speed up data entry and also reduce errors. • TYPES OF DATA-ENTRY CONTROLS USED IN WINDOWS • Text Box – An input control that accepts keyboard data entry. • List Box – An input control that contains a list of acceptable entries that the user can select • Spin Box – A variation of the list Box that presents multiple entries in a text box from which the User can select • Combo Box – a variation of List Box that permits the User to enter a new value or select from the entries. • Radio Buttons – Also called Option Buttons enables the User to select One option from a group. • Check Boxes – Enables User to select more than one option from a group. Object-Oriented Analysis and Design with the Unified Process

  45. NAVIGATION AND SUPPORT CONTROLS • Standard Windows interface provide several controls for Navigation and Window manipulation. (Minimize, Maximize and Close buttons in right Top right corner) • Horizontal and Vertical Scroll Bar, Record selection bar on the left panel • Record navigation arrows at the bottom of window etc. • To maintain Consistency across Systems, utilize these Navigation Controls when possible. • Also you should include other Control Buttons.(Move from screen to screen etc) • Browser Forms also provide Navigation and support Controls. Each Form might include its own Navigation buttons. Object-Oriented Analysis and Design with the Unified Process

  46. HELP SUPPORT • A Primary objective in the design of Input Forms is for it to be intuitive so that Users will not need help. • Online Help is recommended since there is a possibility of even well designed systems to be misunderstood. • THREE TYPES OF HELP • Tutorial • Indexed List of help topics • Context-sensitive Help • Tutorial s can assist in training new Users. Can be organized by Tasks. • Indexed list Of Help can be invoked either through a keyword search or with Help Wizard. • Context-sensitive Help ban be based on Indexed list of Help topics but it is invoked differently. • Context-sensitive Help displays the appropriate help tomatically based on the location of the Cursor. Object-Oriented Analysis and Design with the Unified Process

  47. GUIDELINES FOR DESIGNING WEB SITES • Web-site design draws from guidelines and rules for designing Windows forms and browser forms. • Many Business Systems make use of both technologies. • Web- site are also used for :- • Corporate communication • Customer information • Service • Online Sales, distribution, and marketing • Because Web-sites are available 24 hours a day 7 days a week they need to interact seamlessly with customers. Object-Oriented Analysis and Design with the Unified Process

  48. GUIDELINES FOR DESIGNING WEB SITES TEN GOOD DEEDS IN WEB DESIGN1. Place the organization Name and Logo on every page and make the Logo a link to the Home Page 2. Provide a Search function if the site has more than 100 pages. 3. Write simple and straightforward Headlines and Page Tittlesthat clearly explain what the page is about and make sense in a Search Engine when read out. 4. Structure the Page to facilitate reader scanning and help users to get the gist of the information at a glance while ignoring large chunks of the page. 5. Use Hypertext to structure the Content space into a starting page that provides an overview and several secondary pages that each focus on a specific topic instead of cramming everything about a product or topics into a single large page. Object-Oriented Analysis and Design with the Unified Process

  49. GUIDELINES FOR DESIGNING WEB SITES TEN GOOD DEEDS IN WEB DESIGN(Continued) 6.Use product photos but avoid cluttered and located product family page with lots of photos. The primary product page must load quickly and function fast so it should be limited to a thumbnail product shot. 7. Use “relevance-enhanced image reduction: when preparing small photos and images, instead of simply reducing the original image to a tiny unreadable thumbnail zoom on its most relevant detail by cropping and resizing the image. 8. Use LINK Titles to provide users with a preview of where each link will take them before they have clicked on it. 9. Ensure that all important pages are accessible for users with disabilities. Especially visually impaired users 10. Do the same as everybody else, because if most big Web sites do something in a certain way , users will expect other sites to work similarly. Object-Oriented Analysis and Design with the Unified Process

More Related