This quiz is closed book, closed notes. You have 80 minutes to complete it. Your name:

Similar documents
MIT GSL week 4 Wednesday. User Interfaces II

Human-Computer Interaction IS4300

Today s Hall of Fame and Shame is a comparison of two generations of Google Advanced Search. This is the old interface.

This quiz is closed book, closed notes. You have 80 minutes to complete it. Your name:

Low fidelity: omits details High fidelity: more like finished product. Breadth: % of features covered. Depth: degree of functionality

Usability. CSE 331 Spring Slides originally from Robert Miller

Human-Computer Interaction: An Overview. CS2190 Spring 2010

2/1/2016. Discuss website usability essentials Explain principles of design Critique a website in terms of usability and design

Homework Set 2. A brief discussion

Input: Interaction Techniques

Prototyping. Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994.

Guidelines for Legible and Readable Text, page 2-1 Visual Density Transparent, Translucent, or Opaque?, page 2-3

Lecture 12: Computer Prototyping. Fall UI Design and Implementation 1

Poster-making 101 for 1 PowerPoint slide

Part II: Creating Visio Drawings

This section provides an overview of the features available within the Standard, Align, and Text Toolbars.

Developing successful posters using Microsoft PowerPoint

Work with RSS Feeds. Procedures. Add an RSS Text Object CHAPTER. Procedures, page 7-1

Seng310 Lecture 8. Prototyping

Visual Design. Gestalt Principles Creating Organization and Structure Typography. Visual Design 1

How to Make a Poster Using PowerPoint

Why Should We Care? More importantly, it is easy to lie or deceive people with bad plots

Designing and Creating an Academic Poster using PowerPoint

VHSE - COMPUTERISED OFFICE MANAGEMENT MODULE III - Communication and Publishing Art - PageMaker

Visual Design. Gestalt Principles Creating Organization and Structure Typography. UI Visual Design Objectives

Announcements. Usability. Based on material by Michael Ernst, University of Washington. Outline. User Interface Hall of Shame

ACCUFAST. LPX Printer Printing Guide

Lecture 6. Design (3) CENG 412-Human Factors in Engineering May

PowerPoint Basics (Office 2000 PC Version)

Input part 3: Interaction Techniques

InDesign CC 2014 Essential Skills

Lecture 9: UI Software Architecture. Fall UI Design and Implementation 1

Lecture 22: Heuristic Evaluation. UI Hall of Fame or Shame? Spring User Interface Design and Implementation 1

Principles of Design. Alignment

Design Principles. Advanced Higher Graphic Presentation. Professional Graphic Presentations by kind permission of

Mensch-Maschine-Interaktion 1. Chapter 7 (July 15, 2010, 9am-12pm): Implementing Interactive Systems

ezimagex2 User s Guide Version 1.0

How to use the ruler, grid, guides, and the Align panel

Exercise 19 Adding Graphic Images To Microsoft Word 2000

Concepts of Usability. Usability Testing. Usability concept ISO/IS What is context? What is context? What is usability? How to measure it?

DOING MORE WITH WORD: MICROSOFT OFFICE 2013

Human-Computer Interaction IS4300

Exploring Microsoft Office Word 2007

Fall UI Design and Implementation 1

MICROSOFT EXCEL Working with Charts

Design Languages and Experience Design. SWE 432, Fall 2018 Web Application Development

Human-Computer Interaction IS4300

DOING MORE WITH WORD: MICROSOFT OFFICE 2007

CS 556: Computer Vision. Lecture 18

User Centered Design Process. Prototyping II. What is a prototype? Prototyping phases Oct 11, 2017

INTRODUCTION TO USER INTERFACE DESIGN. M. Meyer Bridges To Computing

CSE 403: Software Engineering, Fall courses.cs.washington.edu/courses/cse403/16au/ User Interfaces. Emina Torlak

Edexcel CiDA Course Overview

Problem and Solution Overview: An elegant task management solution, that saves busy people time.

INFORMATION TECHNOLOGY

A QUICK TOUR OF ADOBE ILLUSTRATOR CC (2018 RELEASE)

Motic Images Plus 3.0 ML Software. Windows OS User Manual

Object-Oriented Software Engineering Practical Software Development using UML and Java

Presented by Dr. Mariah Judd February 15, 2013

On the Web sun.com/aboutsun/comm_invest STAROFFICE 8 DRAW

Additional reading for this lecture: Heuristic Evaluation by Jakob Nielsen. Read the first four bulleted articles, starting with How to conduct a

DOING MORE WITH WORD: MICROSOFT OFFICE 2010

Recipes4Success. Create a Character Scrapbook. Share 4

KF5008 Program Design & Development. Lecture 1 Usability GUI Design and Implementation

button Double-click any tab on the Ribbon to minimize it. To expand, click the Expand the Ribbon button

Program and Graphical User Interface Design

Lecture 14: Heuristic Evaluation. Fall UI Design and Implementation 1

Using SymPrint to Make Overlays, Templates & More...

Lecture 11: Toolkits. Fall UI Design and Implementation 1

How to Create Greeting Cards using LibreOffice Draw

Publisher 2007 Creating Flyers and Brochures

Publisher 2007 Creating Flyers and Brochures

E D T 3 2 E D T 3. Slide 1

ADDENDUM. PRINCIPLES OF DESIGN COURSE Topic YouTube link QR Code

Create and edit word processing. Pages.

Microsoft Word

A Step-by-step guide to creating a Professional PowerPoint Presentation

ADOBE TRAINING CS6 PHOTOSHOP BASICS: EDITING PHOTOS & WORKING WITH TEXT - 1

Using Adobe Contribute 4 A guide for new website authors

- Is the process of combining texts and graphics layout to produce publications e.g. cards,

Work with Shapes. Concepts CHAPTER. Concepts, page 3-1 Procedures, page 3-5

A Beginner s Guide to Paint Shop Pro by Len Nasman Bristol Village, Ohio Computer Club

Index. Smart Image Processor PHP 2 Manual DMXzone.com

Using Microsoft Word. Working With Objects

SETTING UP A. chapter

CS Multimedia and Communications REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB! Lab 02: Introduction to Photoshop Part 1

Shape and Line Tools. tip: Some drawing techniques are so much easier if you use a pressuresensitive

cs414 principles of user interface design, implementation and evaluation

GUI Implementation Support

Visual Design + Gestalt Principles. Professor Michael Terry

PSD to Mobile UI Tutorial

Human-Computer Interaction Design

ILLUSTRATOR TUTORIAL-1 workshop handout

Design, prototyping and construction

FCKEditor v1.0 Basic Formatting Create Links Insert Tables

Giving instructions, conversing, manipulating and navigating (direct manipulation), exploring and browsing, proactive computing

Microsoft PowerPoint: Creating Academic Posters

14. Using Illustrator CC with Other Adobe Applications

Creating a Flyer. Open Microsoft Publisher. You will see the list of Popular Publication Types. Click the Blank Page Sizes.

MMF2 on a 800x600 display

Transcription:

6.831 User Interface Design & Implementation Fall 2004 Quiz 2 This quiz is closed book, closed notes. You have 80 minutes to complete it. Your name: 1. (4 points) Programmer convenience is one reason for automatic layout. Give two other reasons. Supporting window resizing; internationalization; screen resolution differences; cross-platform widget differences; font changes; dynamic data. 2. (4 points) List four graphic design principles that would be useful for designing a dialog box. Simplicity; contrast; whitespace; alignment; balance & symmetry. 3. (3 points) List two techniques for achieving greater simplicity in a graphic design. Reduction; regularity; using the same element for multiple purposes.

4. (4 points) Write constraint equations for the following layout, where rectangle B is half the height of rectangle A, centered in rectangle A, and has a 5-pixel margin around it. A B You may use left, right, top, bottom, width, height, all of which are screen coordinates in pixels. A.height = 2 B.height A.width = B.width + 10 B.top = A.top + (A.height B.height)/2 B.left = A.left + (A.width B.width)/2 5. (4 points) Explain what selectivity means for visual variables, and give an example of a variable that is not selective. Selectivity means that you can attend to one particular value of the visual variable, while ignoring all other values of that variable and other variables. Shape is not selective.

6. (4 points) Referring to visual variables in your answer, describe 5 different ways that you might make an advertising poster stand out on a crowded bulletin board. Put your poster in the center of the board at eye level (position); Make the text size or poster size larger (size); Use bold text or a bright color (value); Use a patterned background (texture); Tilt the text or the poster (orientation); Use an unusual color (hue); Give the poster an unusual aspect ratio, make it jagged-shaped, or use an unusual font or picture (shape). 7. (4 points) Louis Reasoner is designing a grade reporting program, and he proposes visualizing the grade for each homework (0% - 100%) by the angle of a line. Give two reasons why this is a bad idea. Orientation is neither ordered nor quantitative, but both of those comparisons are important for grades; and orientation is too short (4-8 levels) to cover the necessary range of grades. 8. (3 points) List three visual variables that can naturally represent ordered data. Position, size, value, texture granularity 9. (3 points) List 3 of the Gestalt principles of grouping. Proximity, similarity, closure, area, symmetry, continuity

10. (4 points) Explain how Gestalt principles of grouping help you understand the structure of this quiz page. Proximity groups the number, point score, and question together into a single unit, separated from other units by white space. Similarity groups the multiple choices (A, B, C, D) together. More of a stretch: closure might help us imagine a box below each question, framed by the question and the question below it, in which to write the answer. 11. (3 points) Explain why strongly saturated colors are rarely used in good user interface designs. Strongly saturated colors have two effects that both lead to eye fatigue: they saturate the retina s cones, and they force the lens to refocus more often. 12. (3 points) Which of the following problems are least likely to be found by user testing a horizontal computer prototype? A. An important toolbar button is too small and too far away. B. The system s response time is too slow. C. An icon is incomprehensible. D. There isn t enough room on the screen for all the information. Choose one: B A horizontal prototype has no backend, so its response time isn t realistic.

13. (4 points) Give one advantage of a form builder (or GUI builder) for creating computer prototypes, and one advantage of storyboarding. Form builders use actual widgets, so the interface is more high-fidelity in feel; and you can more easily hook in some backend if you need it. Storyboards offer more creative freedom, the ability to draw anything without being constrained to a fixed set of widgets. 14. (4 points) Give one usability advantage of reusable widgets, and one usability disadvantage. Advantages: external consistency; reuse of usability design and testing that was done on the widget (if any) Disadvantages: tends to constrain designer s thinking to use widgets when a custom direct manipulation interface might be more appropriate 15. (3 points) Define toolkit layering, and give one example of a layered toolkit. Toolkit layering is when a user interface toolkit is built on top of another toolkit, reusing some or all of its features. Swing is layered on top of AWT. 16. (3 points) Explain the difference between Swing and AWT in their approach to widgets. AWT reuses the widgets of the native platform toolkit it s layered on, but only offers widgets that are available on all platforms it supports. Swing reimplements its own widgets, not using the native platform widgets, but using pluggable look-and-feel to make its widgets resemble the native widgets where possible.

17. (4 points) Give two important differences between user testing and heuristic evaluation. User testing employs representative users; heuristic evaluation uses a usability expert. User testing is a testing method; heuristic evaluation is an inspection method. In user testing, the facilitator should rarely help a user; in heuristic evaluation, helping the evaluator is OK once the problem has been noted. Heuristic evaluation can find problems that might be rare or hard to uncover with user testing, like font consistency or Fitts s Law issues. 18. (4 points) Define a critical incident. A critical incident is an event during user testing that strongly affects task performance or subjective satisfaction. Examples include errors, thrashing, curses, pleasant or unpleasant surprises. The comments below come from a heuristic evaluation performed on a web site. Name a heuristic that justifies each of the following usability problems found during the evaluation. 19. (3 points) The form s Clear button is too prominent. Error prevention. 20. (3 points) Hyperlinks are not underlined. Consistency, or affordances. 21. (3 points) Documents in the library are listed by an obscure product code, instead of by title. Match the real world. 22. (3 points) The form asks for the user s personal information every time the user visits the site. Flexibility and efficiency.

In the following questions, you are designing a controlled experiment concerning menus. 23. (3 points) The experiment will compare conventional rectangular popup menus with radial (pie-shaped) menus. This is: A. independent variable B. dependent variable C. uncontrolled variable Choose one: A 24. (3 points) The experiment will measure time to make a choice from the menu. This is: A. independent variable B. dependent variable C. uncontrolled variable Choose one: B 25. (4 points) The experiment will use a within-subjects design. What does this mean? Each subject uses both kinds of menu, and the difference in performance is used as the measurement for that subject. 26. (3 points) The experiment will only use users who have played a game that uses radial menus (such as the Sims). This decision threatens: A. reliability B. internal validity C. external validity Choose one: C Most users haven t used radial menus. 27. (3 points) Louis Reasoner runs an enormous experiment with 20 different independent variables. He s thrilled to find that exactly one of the independent variables has a statistically significant effect (p=0.05) on the dependent variable. Should he publish his result? Why or why not? No; if you make 20 significance tests at the 5% significance level, you can expect one of them to appear significant purely by chance.

28. (4 points) Explain the differences between formative evaluation and a controlled experiment. Formative evaluation tests a prototype of a single interface in an iterative design, in order to discover usability problems that can be fixed by further design and development. The results of formative evaluation are largely qualitative. A controlled experiment tests working implementations, in order to test a hypothesis, often involving a comparison of two or more interface alternatives rather than a single interface. The results of a controlled experiment are largely quantitative. 29. (3 points) List 3 things you should say, for ethical reasons, when briefing a user for a user test. We re testing the system, we re not testing you. Any difficulties you encounter are the system s fault, not yours. You can stop at any time. Your test results will be completely confidential. You are being videotaped (or audiotaped, or otherwise observed). The purpose of this experiment is... END OF QUIZ