SYS 366 User Interface Theory Design 1 User
- Slides: 42
SYS 366 User Interface Theory & Design 1
User Interface n n User interface is everything the end user comes into contact with while using the system To the user, the interface is the system 2
User Interface Design n User Interface n includes all the communications and instructions necessary to navigate through a system, to enter input to the system, or to obtain output in the form of screen displays or printed reports. 3
User Interface Design n Why is User Interface Design important? n n The user interface is what the user first sees when they use a system – this is the ‘system’ to them If it has been designed well: n n n The users are happy and satisfied with the system It will improve their productivity If it has not been designed well: n it’s Windows 4
User Interface Design n The concept behind User Interface Design n Human Computer Interaction (HCI) describes the relationship between computers and the people who use them to perform business-related tasks 5
Fields Contributing to Study of HCI 6
User Interface Design n The concept behind User Interface Design needs to be centred around the user n n Users are involved throughout the analysis and design processes to provide input into the interfaces The iterative development cycle helps to facilitate this 7
User Interface Design n n Users work with a varied mix of screen or form input, screen or report output and data queries as they perform their day-to-day job functions. Useful web site to read: n IBM’s Ease of Use white paper n Discussion on User Centred Design and design concepts 8
User Interface Design n The analyst must consider the following when designing user interfaces: n The interaction between the user and the computer when designing the interface for: n n Processing the input Processing the output Starting the system Logging onto the system 9
User Interface Design n The analyst must consider the following when designing user interfaces: n The type of user that is using the system n n Is it an expert user? (Someone who has spent considerable time using a computer) Is it a novice user? (Someone who infrequently uses a computer) 10
User Interface Design n The Analyst must take into consideration everything the user comes into contact with while using the system: n n n Physically Perceptually Conceptually 11
User Interface Design 12
User Interface Design n Physical n What the user actually touches to use the system: the keyboard, mouse, touch screen, light pen, reference manuals, printed documentation, data-entry forms 13
User Interface Design n Perceptual n n What the user sees or hears: flashing messages, beeps Conceptual n n What the user is manipulating with the system How the system is used to complete tasks 14
User Interface Design n n User interfaces can occur between a user and a screen or between systems Between a user and a monitor, interfaces can be: n n n Text-based (I. e. AS/400 or mainframe) Command line Graphical User Interface (GUI) – most common 15
User Interface Design n Between two systems, interfaces are generally messages that are exchanged n Messages can be passing of actual data values or passing of parameters that can be set and deciphered for their meaning n I. e. if validating a credit card, then a flag can be passed with the credit card to the Validation ‘routine’ which sets the flag as to whether the validation was successful or not 16
User Interface Design n Several types of user interfaces: n n Menus Query Data Entry Reports n n Detail Summary Bill payments Account statements 17
User Interface Design n Method of accessing user interfaces: n n n Keyboard Mouse Arrow Keys Function Keys Ctl or Alt button in combination with a keyboard key 18
User Interface Design n Navigate using mouse or arrow Keys in this “desk top” 19
User Interface Design n Navigate using mouse or buttons on this web “order form” 20
User Interface Design n Navigate through a paper-based interface 21
User Interface Design n Navigate using menus on this “web page” 22
User Interface Design n Navigate using a Mouse and linking On the drill down report 23
User Interface Design n Graphical document 24
User Interface Design n General guidelines: n Make interfaces consistent n Provide meaningful feedback to users in the form of warning, informational and error messages n Allow short cuts for experienced users n Allow easy reversal of actions n Always provide Help throughout online applications 25
User-Centered Design n Focus early on the users and their work n Evaluate designs to ensure usability n Use iterative development 26
Dialogue/Dialog Charts n A formal method of designing and representing Dialogues/Dialogs 27
Dialogue/Dialog Expresses that the User and Computer Interact by Sending Messages 28
Documenting Dialogue/Dialogs n Many methods exist for documenting Dialogue/Dialogs n Use Case diagrams: the dialogue between the actor and the use case n Written descriptions such as use case descriptions or scenarios n Sketches of screens, i. e. storyboards n Dialogue/dialog charts 29
Storyboard for Down. Town Videos Rent Videos Dialogue/Dialog 30
Storyboard for Down. Town Videos Rent Videos Dialogue/Dialog 31
Dialogue/Dialog Documentation with UML n OO approach provides UML diagrams that are useful for modeling Dialogue/Dialogs in addition to Use case diagrams n Sequence diagrams act much as a Dialogue/Dialog n Objects can be added to class diagrams and interaction diagrams to represent Dialogue/Dialog 32
Designing Dialogues/Dialogs n n The process of designing the overall sequences that users follow to interact with an information system the sequence in which information is displayed to and obtained from the user 33
Sequence n understanding how the user will interact with the system n clear understanding of user, task, technological and environmental characteristics 34
Screen identifier Dialog Chart Example 1 Product Management 0 1. 1 Add New Product 1, 1. 2 Screen name 0 Main Menu 3 Sales Management 0 1. 2 Update Product 1 … 4 Purchasing 0 5 Receiving 0 … … Continued Denotes continuation Indicates the number of the slide that can be transferred or returned to 1. 2. 1 Update Product prices 1. 2, 1 35
Dialogue/Dialog Chart Symbols open Dialog. Charts. zip from web page and see: Dialogue 1. doc 36
Example: Customer Information System n A marketing manager wants sales and marketing personnel to be able to review the year-to-date transaction activity for any customer 37
Dialogue/Dialog between a user and the Customer Information System 1. Request to view individual customer information 2. Specify the customer of interest 3. Select the year-to-date transaction display 4. Review customer information 5. Exit system 38
Dialogue/Dialog Chart open Dialog. Charts. zip from web page and see: Dialogue 2. doc 39
Documenting Dialogue/Dialog Designs n n n Designs must be done simultaneously with other system activities Include options such as backup and recovery Overall system structure from standpoint of user is reflected in menu structures 40
Overall Menu Hierarchy 41
Eight Golden Rules for Interactive Interface Design 42
- User interface design in system analysis and design
- User interface design in system analysis and design
- Opwekking 366
- 37521 to the nearest 10
- Ps 366
- Pobble 365 beach
- Each pair of wires is wrapped in metallic foil
- 98 366
- Na jednom kraju bakrene cijevi duljine 366 m
- User interface theory
- Basic principles of input design
- User interface design cycle
- User interface design steps in software engineering
- User interface analysis and design
- Principles of user interface design
- Uiecu hours
- Atm user interface
- User interface design and evaluation
- Mode based vs modeless interface in software engineering
- User interface design in software engineering
- Python gui design
- Visualization in user interface design
- Recoverability in user interface design
- Interface analysis means understanding
- Task centered user interface design
- User interface design in software engineering
- Labview user interface design examples
- User interface design process in software engineering
- Fitts law user interface design
- Interface in interface java
- Areas of the screen that behave as if they were independent
- Office interface vs industrial interface
- Interface------------ an interface *
- Yahoo user interface library (yui)
- Xml user interface language
- Graphical user interface testing
- Komponen user interface
- Enterprise architect deployment diagram
- User interface importance
- Touchless touchscreen
- Characteristics of graphical user interface
- Tangible user interface examples
- Explain mdi