07 HCI - Lesson 6 Introduction to MiLE+ : a systematic method for usability evaluation Prof. Garzotto.

Slides:



Advertisements
Similar presentations
Evaluating quality: the MILE method applied to museum Web sites Franca Garzotto - HOC- Hypermedia Open Center, Politecnico di Milano Maria Pia Guermandi.
Advertisements

Chapter 11 Designing the User Interface
UI Best Practices Application Developer’s Intro School Week 1 Day 1.
Principles of Web Design 5 th Edition Chapter Nine Site Navigation.
1 Today’s Goal: Web Design for Usability To become able to appreciate the role of usability in Web design To become able to identify some of the factors.
1 CS 501 Spring 2002 CS 501: Software Engineering Lecture 11 Designing for Usability I.
User Interface Evaluation Usability Inspection Methods
Técnicas de Calidad en el Software Sesión # 10. Good quality software Operations Transition Testing Portability Reusability Interoperability Maintainability.
11 HCI - Lesson 5.1 Heuristic Inspection (Nielsen’s Heuristics) Prof. Garzotto.
Multimedia Project Proposal
Usability presented by the OSU Libraries’ u-team.
Knowledge Acquisitioning. Definition The transfer and transformation of potential problem solving expertise from some knowledge source to a program.
07 Prof. Garzotto HCI – Lesson 6 MILE+ Homework: Readings and assignements.
COMP6703 : eScience Project III ArtServe on Rubens Emy Elyanee binti Mustapha Supervisor: Peter Stradzins Client: Professor Michael.
©Ian Sommerville 2000 Software Engineering, 6th edition. Chapter 15Slide 1 User interface design l Designing effective interfaces for software systems.
Web Accessibility Tests Using the Firefox Browser ACCESS to Postsecondary Education through Universal Design for Learning.
Day 9 Navigation Heuristic evaluation. Objectives  Look at some simple rules on navigation  Introduction to Heuristic Evaluation.
4. Interaction Design Overview 4.1. Ergonomics 4.2. Designing complex interactive systems Situated design Collaborative design: a multidisciplinary.
SIMS 213: User Interface Design & Development Marti Hearst Thurs, Jan 22, 2004.
Chapter 4 Planning Site Navigation Principles of Web Design, 4 th Edition.
User Centered Web Site Engineering Part 2. Developing Site Structure & Content Content View Addressing content Outlining content Creating a content delivery.
INTRODUCTION. Concepts HCI, CHI Usability User-centered Design (UCD) An approach to design (software, Web, other) that involves the user Interaction Design.
User interface design. Recap User Interface GUI Characteristics (Windows, Icons, Menus, Pointing, Graphics) User Centered Design User Interface Design.
Web 2.0 Testing and Marketing E-engagement capacity enhancement for NGOs HKU ExCEL3.
THE BASICS OF THE WEB Davison Web Design. Introduction to the Web Main Ideas The Internet is a worldwide network of hardware. The World Wide Web is part.
WEB DESIGNING Prof. Jesse A. Role Ph. D TM UEAB 2010.
Microsoft ® Expression ® Web An Introduction to the Your Learning Guide to Expression Web tutorial.
Web Design Process CMPT 281. Outline How do we know good sites from bad sites? Web design process Class design exercise.
Paper Prototyping Source:
Section 2.1 Compare the Internet and the Web Identify Web browser components Compare Web sites and Web pages Describe types of Web sites Section 2.2 Identify.
New Portal to Cost and Performance Integration The Planning and Evaluation Staff is pleased to introduce the new and improved Cost and Performance Integration.
Microsoft Wang Li, Wang Yini, Li YIcheng.  This is a presentation about Microsoft Windows7 guidelines  Wang Li K8wali00  Li Yicheng K8liyi00  Wang.
1 WEB Engineering Introduction to Electronic Commerce COMM1Q.
Performance Reports. Objectives Understand the role and purpose of the Performance Reports in supporting student success and achievement. Understand changes.
MERLOT’s Peer Review Report Composed from reports by at least two Peer Reviewers. Description Section Provides the pedagogical context (i.e. learning goals,
Introduction to Interactive Media The Interactive Media Development Process.
Q Q Human Computer Interaction – Part 1© 2005 Mohammed Alabdulkareem Human Computer Interaction - 1 Dr. Mohammed Alabdulkareem
Interacting with IT Systems Fundamentals of Information Technology Session 5.
Part 1-Intro; Part 2- Req; Part 3- Design  Chapter 20 Why evaluate the usability of user interface designs?  Chapter 21 Deciding on what you need to.
MULTIMEDIA DEFINITION OF MULTIMEDIA
Web Design with HTML & CSS Lesson 1. Planning Your Website   Good design comes from decisions that designers make in order to have a certain effect.
Heuristic evaluation Functionality: Visual Design: Efficiency:
COMP106 Assignment 2 Proposal 1. Interface Tasks My new interface design for the University library catalogue will incorporate all of the existing features,
Usability Inspection for AT&T Official Website Debaleena Chattopadhyay, Katherine Pacis Manuel, Li He Rethink Usability.
Evaluation of User Interface Design 4. Predictive Evaluation continued Different kinds of predictive evaluation: 1.Inspection methods 2.Usage simulations.
Information Systems Engineering. Lecture Outline Information Systems Architecture Information System Architecture components Information Engineering Phases.
Chapter 9 Prototyping. Objectives  Describe the basic terminology of prototyping  Describe the role and techniques of prototyping  Enable you to produce.
Week 4 Planning Site Navigation. 2 Creating Usable Navigation Provide enough location information to let the user answer the following navigation questions:
Software Engineering User Interface Design Slide 1 User Interface Design.
Usability 1 Usability evaluation Without users - analytical techniques With users - survey and observational techniques.
Copyright 2006 John Wiley & Sons, Inc. Chapter 1 - Introduction HCI: Designing Effective Organizational Systems Dov Te’eni Jane Carey Ping Zhang.
Slide 1-1 The Web Wizard’s Guide to Web Design by James Lengel.
Web Page Concept and Design :
1 Technical & Business Writing (ENG-715) Muhammad Bilal Bashir UIIT, Rawalpindi.
 Network  A _____ of computers that can _________ w/ each other  Examples of hardware  ______________ & communication lines  Internet  Hardware.
Topic 4 - Database Design Unit 1 – Database Analysis and Design Advanced Higher Information Systems St Kentigern’s Academy.
PERFORMANCE REPORTS. Understand the role and purpose of the Performance Reports in supporting student success and achievement. Understand changes to the.
Writing to Teach - Tutorials Chapter 2. Writing to Teach - Tutorials The purpose of a tutorial is to accommodate information to the needs of the user.
Paper Prototyping Source: Paper Prototyping a method of brainstorming, designing, creating, testing, refining and communicating.
Oman College of Management and Technology Course – MM Topic 7 Production and Distribution of Multimedia Titles CS/MIS Department.
Usability Olaa Motwalli CIS764, DR Bill – KSU. Overview Usability factors. Usability guidelines.  Software application.  Website. Common mistakes. Good.
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
Design Evaluation Overview Introduction Model for Interface Design Evaluation Types of Evaluation –Conceptual Design –Usability –Learning Outcome.
© 2016 Cognizant. © 2016 Cognizant Introduction PREREQUISITES SCOPE Heuristic evaluation is a discount usability engineering method for quick, cheap,
6. (supplemental) User Interface Design. User Interface Design System users often judge a system by its interface rather than its functionality A poorly.
UCDW2 - Site Design. Lazar’s Development Lifecycle Define the mission & target users Collect user requirements Create and Modify Conceptual design Create.
Chapter 1 - Introduction
Information System Design Info-440
Usability Techniques Lecture 13.
HCI – Lesson 7 USABILITY Homework Prof. Garzotto.
Presentation transcript:

07 HCI - Lesson 6 Introduction to MiLE+ : a systematic method for usability evaluation Prof. Garzotto

2 In a nutshell... MiLE+ (Milano-Lugano Evaluation) Developed in cooperation between HOC-Lab (Politecnico di Milano) and TEC-Lab (University of Lugano). Strikes a healthy balance between heuristic based and task-based techniques. Offers reusable tools and procedures to carry out inspection within budget and time constraints. It is well integrated with user testing

3 In a nutshell...(cont.) MiLE+ (Milano-Lugano Evaluation) Key concepts: Application independent usability attributes Application dependent usability attributes Two types of Inspection activities: – Technical Inspection For discovering application-independent problems – User Experience (UX) Inspection For discovering application-dependent problems

4 Application-dependent vs. Application Independent usability aspects Application-independent usability aspects: …understandability…. …navigation quality… …content accuracy …consistency …application status communication …graphic and layout quality …interface order…. …compliance with standards and conventions… …accessibility These features can be evaluated even without knowing the purpose and the user of the application

5 Application-dependent vs. Application Independent usability aspects Application-dependent usability aspects: – Users can achieve their goals People find the information they need... People are properly driven and guided to unexpected content.. Content is relevant to specific user profiles (kids, local tourists, tourists from abroad, families, curious, …)... Content is enjoyable/entertaining for specific user profiles.. … – The application can be effectively used in a specific context (while driving, while at home, office, walking, visiting, …) Understanding users, their goals and the contexts of use is essential to evaluate these features.

6 Application-dependent vs. Application Independent usability aspects – The effectiveness of application-independent aspects (font, layout, navigation, structure,…) – The effectiveness of application-dependent aspects (meeting user profiles, context, needs and goals) ARE BOTH IS A NECESSARY CONDITION FOR USABILTY!!!

7 Examples of Application independent Usability Problems

8 Content

9 Currency of Information Page visited the 2th December

10 Text Conciseness

11 Technology/Performance

12 Browser Compatibility Explorer 6.0Mozzilla Firefox 1.0

13 System Reaction to User’s Error(s) Which is the error?

14 Semiotics

15 Understandability of the main menu

16 Ambiguity of labels Two labels: two different websites

17 Cognitive

18 Information Overload

19 Web site Mental Map Navigate within the British Museum Website for 5 minutes. After 5 minutes are you able to formalize the web site map?

20 Graphic Technical

21 Anchor identity & Use of a Link’s Cromatic Code Which are links?

22 Background Contrast & Font size Are you able to read the different information on the screen?

23 Menu Font Size Are you able to read the menus?

24 Navigational

25 Consistency within Sections’ Navigation Strategy These links are anchors in the same page. Links for accessing subsections

26 Backward Navigation ?

27 Semiotics: Understanding Link Labels What happens when I click on the button “Tours”? And on the button “Take a online tour?” Which is the difference?

28 How the navigation between objects works?

29 Application dependent Usability Problems

30 Multilinguisticity I’m an American tourist. It does not exist the English version of the current exhibition’s description? And the description of the collection?

31 Satisfaction on provided information I don’t have found information in English about the collection and the current exhibition. However I‘m very interested in the MEN Museum and I want to visit it. Therefore I need road markings for reaching the museum. But also this information is given only in French !!!

32 Engagement Once understand the interaction strategy of the website, this could be entertaining.

33 Memorability of online tours When users return to the online tours of British Museum Websites after a period of not using it, they should be able to re-establish proficiency the past experiences of use?

34 HOW TO PERFORM MILE+ EVALUATION: TECHNICAL INSPECTION Main goal: to evaluate Application INDEPENDENT Usability, i.e., identification of design problems and implementation breakdowns. The inspector evaluates the application from the design dimensions’ perspective – Content – Navigation – Technology – Interface Design Semiotics Cognitive Graphics

35 MILE+ Technical Inspection For each design dimension MiLE provide a library of “technical” heuristics organized in various dimensions: – Content – Navigation – Technology/Performance – Interface Design Semiotics Graphics Cognitive For each tech heuristic MILE+ provides: – Its definition – Suggested (inter)actions on the web site to perform in order to measure it (see documentation in Beep)

36 How to carry on Technical Inspection: simple applications (“few” pages) Explore the application page by page For each page: – For each heuristic which may be relevant for the current page perform the suggested ACTIONS and give a score to the heuristics (choose a metric previously agreed among all evaluators) Record the page where problems are detected, and the reason why you gave a given score Organize the results – By design dimension – By heuristics – By page – …. Provide aggregated numerical data (and their proper visualization) along various perspectives

37 If the application is wide and complex, and cannot be inspected exaustively, use SCENARIOS to choose where to focus inspection FOR EACH SCENARIO: Perform the tasks; for each task, work on the pages you are traversing as indicated in the previous slide How to carry on Technical Inspection: complex applications (many pages)

38 HOW TO PERFORM EVALUATION: UX INSPECTION How to evaluate Application DEPENDENT Usability Problems ?

39 USER EXPERIENCE INSPECTION: CONCEPTUAL TOOLS: SCENARIOS + USER EXPERIENCE INDICATORS (UEIs) UEIs: Fine-grained heuristics that cannot be evaluated without knowing user profiles and goals – i.e. their measure depends upon some scenarios

40 MILE+ UEIs – Three categories of UEIs (corresponding to the different types of user interaction experiences) Content Experience Indicators (ex. Multilinguisticity) Navigation & Cognitive Experience Indicators (ex: Predictability) Interaction Flow Experience Indicators (ex. Naturalness)

41 The role of scenarios User/Customer Experience End-user Want to do something in a given context Through a series of acts Scenario Users profile Goal/Context Tasks SCENARIO Exectute the scenario di evaluate … UX INDICATORS Evaluation activity USABILITY KIT (U-KIT)

42 Examples of scenarios SCENARIO Well-educated American tourist who knows he will be in town, he wants visit the real museum on December 6th 2004 and therefore he/she would like to know what special exhibitions or activities of any kind (lectures, guided tours, concerts) will take place in that day. USER PROFILETourist GOALVisit the M useum in a specific day TASKS Find the events/exhibitions/lectures occurring on December 6th in the real museum Find information about the museum’s location SCENARIO Marc looking for some information about Enlightenment period studying at school. USER PROFILE Marc, High-school student GOALTo be informed on a specific historical period (e.g. Enlightenment) TASKS Find general information about this period; Find detailed information about social and religious impact of Enlightenment period.

43 FOR EACH SCENARIO: Perform the tasks; for each task Evaluate the task through User Experience Indicators (UEIs) For each attribute which may be relevant for the task, give a score. (Weight the results according to the priority of user profiles and goals) How to carry on UX evaluation

44 APPLICATION Technical Heuristics NAVIGATION CONTENT TECHNOLOGY SEMIOTICS GRAPHICS COGNITIVES TECHNICAL INSPECTION APPLICATION INDEPENDENT USABILITY APPLICATION DEPENDENT USABILITY Validate / Invalidate SCENARIOS USER TESTING USER’s WORLD EXPERT Scenarios (NOT mandatory) INSPECTION UEIs Library of Heuristics Library of Scenarios Library of UEIs MILE+ activities: mutual relationships and relationship to User Testing (which is NOT a MILE activity) OUTSIDE MILE+ (APPLICATION INDEPENDENT USABILITY UX INSPECTION EXPERT