1. INTERACTION - Quick Tour -1L.F.M.I 2014

2. Interaction is Process of information transfer from user to the computer and from computer to the user. Interaction models: translations between user and system Ergonomics: physical characteristics of interaction Interaction styles: the nature of user/system dialog Context: social, organizational, motivationalL.F.M.I 20142 3. Ergonomics Study of the physical characteristics of interaction How the controls are designed, the physical environment in which the interaction takes place, the layout & physical qualities of the screen. Ergonomics issues arrangement of controls and displays surrounding physical environment health issues L.F.M.I 2014 use of colour3 4. Common interaction styles Command line interface Menus Natural languageQuestion/answer and query dialogue Form-fills and spreadsheets Wimp (Windows, Icons, Menus and Pointers) Point and click Threedimensional interfaces L.F.M.I 20144 5. User Interaction StylesInteraction can be seen as a dialog between the computer and the user.Linguistic manipulation - by typing in commandsDirect manipulation - by using some sort of pointing deviceL.F.M.I 20145 6. Interaction Styles : MenuBinary Menus Pull-Down, Pop Up and Toolbars Often have more than two items Menus True/False Pull-Down menus always Male/Female available to the user by making Yes/No selections on a top menu. Radio Buttons Choice Keyboard shortcuts ; Ctrl Check Boxes Choice C , Ctrl+V, etc Multiple-item Menus Multiple-selection menus or check Toolbars, iconic menus and boxes palettes L.F.M.I 2014 Pop up menu6 7. Interaction Styles : Menus for Long ListsScrolling Menus, Combo Boxes & Fisheye Menus L.F.M.I 20147 8. Interaction Styles : Menus for Long Lists Embedded Menus & Hotlinks : Embedded menus are an alternative to explicit menus The menu items might be embedded in text or graphics and still be selectable. L.F.M.I 20148 9. Interaction Styles : Combination of Multiple Menus1. 2. 3. 4.Linear menu sequencesSimultaneous menus Tree-structured menu Menu mapsL.F.M.I 20149 10. Interaction Styles : Dialog Boxes Dialog box design is combination of menu selection and form fill. Can also contain task-specific functions such as; entering the customers name and address for a car rental; specifying clothing size, color and fabric for an order entry system.L.F.M.I 201410 11. Interaction Design Users capabilitiesUser-centered approach is based on :Early focus on users and tasks: directly studying cognitive, behavioral, anthropomorphi c & attitudinal characteristics Empirical measurement: users reactions and performance to scenarios, manuals, simulations & prototypes are observed, recorded and analysed Iterative design: when problems are found in user testing, fix them and L.F.M.I 2014 carry out more tests Size of hands Motor abilities Height Strength Disabilities 11 12. Four basic activities in IDx Identifying needs and establishing requirements Developing alternative designs Building interactive versions of the designs Evaluating designsL.F.M.I 2014user-centered design approach12 13. Lifecycle models Lifecycle models are: management tools simplified versions of realityL.F.M.I 2014Traditional waterfall lifecycleSpiral Lifecycle model13 14. Lifecycle ModelL.F.M.I 2014Life Cycle for RAD (Rapid Application DevelopmentDynamic Systems Development Method14 15. Lifecycle ModelThe Star lifecycle model L.F.M.I 2014Usability engineering lifecycle model 15 16. INTERFACE DESIGN 1 - Quick Tour -L.F.M.I 201416 17. What is User Interface? The user interface, or the human/computer interface is what the user sees, and includes: the physical controls buttons, etc. what the system looks like (if there is a monitor the system could be a washing machine or a photocopier) how the system accepts input from the user how the system responds to user inputhow the system outputs the results of processing L.F.M.I 201417 18. Human-Computer Interface A human and a computer communicates. A human usually has 5 senses: Sight, Hearing, Touch, Taste, Smell L.F.M.I 2014 A keyboard, for typing, A mouse, for clicking, A scanner, for copying, A camera, for images. A monitor, for displaying, A printer, for printing, A sound card. For audio, A DVD, for video. 18 19. Metaphor: Computer objects as visible, moveable objects Items represented as icons a metaphor provides a lot of information it enables the transfer of skills good metaphors provide natural mappings metaphors are not taken literally they can highlight underlying assumptions metaphors are not symmetrical they can be violated Desktop Metaphor (Macintosh) L.F.M.I 201419 20. Expressive Interface: to make the look and feel of an interface appealing. Ways of conveying the status of a system are through the use of :Dynamic icons : a recycle bin expanding when a file is placed into it. Animations : a bee flying across the screen indicating that the computer is doing something, like checking filesSpoken messages, using various kinds of voices, telling the user what need to be done.Various sounds indicating actions and events (window closing, files being dragged, new email arriving). L.F.M.I 201420 21. Expressive Interface Benefit of expressive interface : Provide reassuring feedback to the user that can be both informative and funInfluences how pleasurable it to interact with.The more effective the use of imagery at the interface, the more engaging and enjoyable it can be. L.F.M.I 2014Emoticons - compensate for lack of expressiveness in text communication21 22. Gimmicks Amusing to the designer but not the user. - Clicking on a link to a website only to discover that it is still under constructionError Messages the application has expectedly quit due to poor coding in the operating systemShneidermans guidelines for error messages include: avoid using terms like FATAL, INVALID, BAD Audio warnings Avoid UPPERCASE and long code numbers Messages should be precise rather than vague L.F.M.I context-sensitive help Provide 201422 23. Website Error messages The requested page /helpme is not available on the web server.If you followed a link or bookmark to get to this page, please let us know, so that we can fix the problem. Please include the URL of the referring page as well as the URL of the missing page.L.F.M.I 201423 24. Summary Affective aspects are concerned with how interactive systems make people respond in emotional ways Well-designed interfaces can elicit good feelings in users Expressive interfaces can provide reassuring feedback Badly designed interfaces make people angry and frustrated L.F.M.I 201424