COSC 3461: Module 6

1. COSC 3461: Module 6 UI Design in the Workplace

2. What is User-Centered Design? • Three major components: • Iterative design • Early focus on users and tasks • Empirical measurement • In practice, software development often involves incremental changes rather than the creation of an entirely new product • Variety of process models in use, will now show one of them

3. User-Centered Design Process • Requirements analysis performed before iterative design Reference:Mayhew, Deborah J. (1999) The Usability Engineering Lifecycle

4. User-Centered Design Process Requirements Analysis Design, Testing, & Development

5. Requirements Analysis General DesignPrinciples Platform Capabilities & Constraints User Profile Task Analysis Usability Goals StyleGuide On to Design/Testing/Development

6. Requirements Analysis • Goal is to produce Style Guide • Contains full documentation of the analysis of requirements • Will include a specification of the Usability Goals • Description of minimal acceptable user performance • Definition of the criteria for determining whether the goals have been satisfied

7. Requirements Analysis • Relevant Factors: • User • User Profile: A description of the specific user characteristics relevant to UI design. • Task • Contextual Task Analysis: A study of user’s current tasks, work-flow patterns. • Environment • Platform Capabilities & Constraints: The available hardware, operating system, toolkits.

8. Iterative Design No Yes Yes Yes No No Requirements Analysis Work Re- engineering Screen Design Standards (SDS) Detailed User Interface Design (DUID) Conceptual Model (CM) Design SDS Prototyping Style Guide Style Guide Iterative DUID Evaluation CM Models Mockups Iterative SDS Evaluation Iterative CM Evaluation Met Usability Goals? Met Usability Goals? No Eliminated Major Flaws? All Functionality Provided?

9. Design/Testing/Development • Work Reengineering: User task redesign, reorganization of functionality, and work-flow design. No user interface design in this step • Conceptual Model Design: Based upon previous tasks, high-level design alternatives are generated. • Conceptual Model Mockups: Generate low-fidelity mock-ups for selected subsets of product functionality. • Iterative Conceptual Model Evaluation: Low-fidelity user testing with redesign & reevaluate iterations.

10. User’s Conceptual Model Review • Recall that the User’s Conceptual Model might differ from: • Designer’s Model • Programmer's Model http://www-3.ibm.com/ibm/easy/eou_ext.nsf/Publish/569

11. User’s Conceptual Model Review • The user creates a mental model as he or she interacts with the system • hypothesize rules and perceive patterns in order to explain the situation • operation typically understood in terms of roles and relationships they already understand (metaphors) • not necessarily conscious http://www-3.ibm.com/ibm/easy/eou_ext.nsf/Publish/569

12. Designer’s Model Review • Model of the interface components, behavior and interrelationships • Which components will be visible to users? • How will users make use of them to accomplish their tasks? • Appearance and behaviour of components intended to influence user's conceptual model • Designer needs an understanding of user’s conceptual model http://www-3.ibm.com/ibm/easy/eou_ext.nsf/Publish/569

13. Programmer’s Model Review • Includes internal system components and other implementation details and that implement the designer's model. • E.g., a directory object that consists of people's names, addresses, office numbers, etc • Implementation details from the programmer’s model: • should not be evident in the designer's model • transparent to users http://www-3.ibm.com/ibm/easy/eou_ext.nsf/Publish/569

14. Iterative Design No Yes Yes Yes No No Requirements Analysis Work Re- engineering Screen Design Standards (SDS) Detailed User Interface Design (DUID) Conceptual Model (CM) Design SDS Prototyping Style Guide Style Guide Iterative DUID Evaluation CM Models Mockups Iterative SDS Evaluation Iterative CM Evaluation Met Usability Goals? Met Usability Goals? No Eliminated Major Flaws? All Functionality Provided?

15. Design/Testing/Development • Screen Design Standards: Development of a set of product-specific standards and conventions for all aspects of detailed screen design. • Screen Design Standards Prototyping: Implement a running prototype for selected subsets of product functionality based on the Screen Design Standards. • Iterative Screen Design Standards Evaluation: Formal usability testing with redesign/reevaluate iterations until all major usability bugs are eliminated and usability goals seem within reach.

16. Iterative Design No Yes Yes Yes No No Requirements Analysis Work Re- engineering Screen Design Standards (SDS) Detailed User Interface Design (DUID) Conceptual Model (CM) Design SDS Prototyping Style Guide Style Guide Iterative DUID Evaluation CM Models Mockups Iterative SDS Evaluation Iterative CM Evaluation Met Usability Goals? Met Usability Goals? No Eliminated Major Flaws? All Functionality Provided?

17. Design/Testing/Development • Detailed User Interface Design: Detailed design of the complete product user interface based on Conceptual Model and Screen Design Standards detailed in the Style Guide. • Iterative Detailed User Interface Design Evaluation: Formal usability testing conducted during product development to include unassessed subsets of functionality and categories of users.

18. Roles in User-Centered Design • Graphic Design • GUI Programming and Software Development • UI Design • Usability Testing • Technical Writing andDocumentation Preparation • Marketing Adapted from Johnson, J. (2000) GUI Bloopers, p.419

19. Graphic Design • How to make best use of the available display medium? • Visual consistency • Layout • Development of graphics, images, symbols, textual elements • recognizablity • intuitiveness • aesthetic appeal

20. GUI Programming • Programming, implementation, development of internal architecture • Applying knowledge of GUI toolkit • Maximizing performance • response time/latency/lag, computational resources • Identification of technical constraints on implementation

21. UI Design • Task analysis, conceptual design • Assessing conformance to usability standards

22. UI Design – Examples • Reduce the number of commands in an application • Flatten its menu hierarchy • Decrease the number of windows • Elimination of mouse actions (and input actions, more generally) • Enforce consistency • E.g., menu commands • Improve feedback • E.g., improve error messages

23. Usability Testing • Ability to recruit participants, users • Usability evaluation, usability testing • Knowledge of “thinking aloud” protocol • Conduct surveys, interviews, observational studies

24. Technical Writing • Ability to develop customer/market driven documentation • Screen readability and organization • Strong writing skills, ability to convey highly technical information clearly • Variety of presentation methodologies

25. Marketing • Knowledge of customer (vs. user!) • Economic Trend Analysis • Product and Service Analysis • Market Potential Analysis • Knowledge of Packaging, Pricing, Distribution, Advertising, Promotion, Publicity

26. Application of User-Centered Design • For consumer products • previously, little to no user-centered design • value of this paradigm increasingly recognized, but not always • E.g., During 2000-2001, Nortel laid off every human factors professional in its organization.

27. Why User-Centered Design is not used… • Short-term expense • UI work during the product cycle is often not conducted to cut costs • short-term savings do not translate to overall savings • much greater costs in terms of higher customer support • slower market acceptance • lower consumer satisfaction. • Time • Delay in market entry • Emphasis on being first to market • E.g., Newton, Palm Pilot • Lack of management buy-in

28. Bottom-line Benefits • Bottom line = profit -- Decreased customer support costs • Better product • User-Centered Design results in more competitive products/services • More follow-on due to satisfied customers

29. Usability • Factors that contribute to the development of usable software: • An understanding of user needs • User interface design standards • Early usability testing • Management buy-in to user-centered design http://www.humanfactors.com/library/usabilityquiz.asp