1. Low Fidelity Prototyping and Wizard of Oz Studies Because they are easy to create and modify, low fidelity prototypes commonly provide designers with.

Slides:



Advertisements
Similar presentations
Chapter 11 Design, prototyping and construction 1.
Advertisements

Design, prototyping and construction
Rapid Prototyping Dimensions and terminology Non-computer methods
1 CS 501 Spring 2002 CS 501: Software Engineering Lecture 11 Designing for Usability I.
Prototypes Low-fidelity prototypes design.org/encyclopedia/contextual_design.html Heim, Chapter 5.3 Lecture 9 Physical Design.
Human Computer Interaction
© by Pearson Education, Inc. All Rights Reserved.
Prototyping. Introduction Low-fidelity prototyping High-fidelity prototyping Compromises in prototyping From design to implementation.
Part 2d: Requirements Chapter 2: How to Gather Requirements: Some Techniques to Use Chapter 3: Finding Out about the Users and the Domain Chapter 4: Finding.
DENIM A Brief Tutorial By Philip Luedke. Introduction An Informal Tool For Early Stage Web Site and UI Design Early Stage Web Site and UI Design DENIM.
Human Computer Interface. HCI and Designing the User Interface The user interface is a critical part of an information system -- it is what the users.
CS CS 5150 Software Engineering Lecture 12 Usability 2.
DENIM: Finding a Tighter Fit with Web Design Practice James Lin, Mark W. Newman, Jason I. Hong, James A. Landay April 6, 2000 CHI 2000, The Hague
Prototyping By Greg Rogers. Agenda For Today  What is a prototype  Why prototype  What to prototype.
ISP 666 Week 6 Prototyping. Design a Solution From task to system From abstract to concrete Task Models UI Presentation evaluation Conceptual Model System.
SIMS 202 Information Organization and Retrieval Prof. Marti Hearst and Prof. Ray Larson UC Berkeley SIMS Tues/Thurs 9:30-11:00am Fall 2000.
Brad A. Myers, CMU Pilot: Exploratory Programming for Interactive Behaviors: Unleashing Interaction Designers’ Creativity Brad Myers, Stephen Oney, John.
Introduction to Alice Basics : What is Alice? Object Oriented Definitions What Does it Look Like? Where Can I Use it?
What is a prototype? A prototype is a small scale model of your larger product. Can be a physical object, or a simple software program. Many physical.
Design, goal of design, design process in SE context, Process of design – Quality guidelines and attributes Evolution of software design process – Procedural,
If you are connected to the Internet, click and then click on the web page to experience an introduction to applications. The following lesson is about.
Web Design Process CMPT 281. Outline How do we know good sites from bad sites? Web design process Class design exercise.
Comparing Python and Visual Basic
Human Interface Engineering1 Main Title, 60 pt., U/L case LS=.8 lines Introduction to Human Interface Engineering NTU Seminar Amy Ma HIE Global Director.
1 SWE 513: Software Engineering Usability II. 2 Usability and Cost Good usability may be expensive in hardware or special software development User interface.
Describing Methodologies PART II Rapid Application Development* Systems Analysis and Design II.
MERLOT’s Peer Review Report Composed from reports by at least two Peer Reviewers. Description Section Provides the pedagogical context (i.e. learning goals,
Computer –the machine the program runs on –often split between clients & servers Human-Computer Interaction (HCI) Human –the end-user of a program –the.
Prototyping Creation of concrete but partial implementations of a system design to explore usability issues.
Design, prototyping and construction CSSE371 Steve Chenoweth and Chandan Rupakheti (Chapter 11- Interaction Design Text)
Visualizing Information in Global Networks in Real Time Design, Implementation, Usability Study.
Automating Database Processing Chapter 6. Chapter Introduction Design and implement user-friendly menu – Called navigation form Macros – Automate repetitive.
Fall 2002CS/PSY Rapid Prototyping Sketches, Storyboards, Mock-Ups and Scenarios Agenda Dimensions and terminology Non-computer methods Computer methods.
HCI – Prototyping. Why Prototype?  Prototyping is a well understood and used technique in design engineering where products are tested via a model prototype.
1 Lecture 16 Prototyping Software Engineering. 2 Outline Definitions Uses of prototyping in the design process Prototyping approaches Prototyping “technologies”
Prof. James A. Landay University of Washington Autumn 2008 Video Prototyping October 14, 2008.
CS2003 Usability Engineering Human-Centred Design Dr Steve Love.
Human-Computer Interaction Lecture 4: Inference-based approaches.
©Ian Sommerville 2004Software Engineering, 7th edition. Chapter 4 Slide 1 Slide 1 Human Computer Interface Design (HCI - Human Computer Interactions Alias.
Prototyping 1. Design Document How express your design ideas. How express your design ideas. Key notions Key notions Cheap, FastCheap, Fast Flexibility.
1 Human Computer Interaction Week 7 Prototyping. 2 Introduction Prototyping is a design technique where users can be involved in testing design ideas.
Prototyping. REVIEW : Why a prototype? Helps with: –Screen layouts and information display –Work flow, task design –Technical issues –Difficult, controversial,
1 Lecture 5: Interactive Tools: Prototypers (HyperCard, Director, Visual Basic), Interface Builders Brad Myers Advanced User Interface Software.
Chapter 5:User Interface Design Concepts Of UI Interface Model Internal an External Design Evaluation Interaction Information Display Software.
Hasselt University – tUL – IBBT Expertise Centre for Digital Media Jan Van den Bergh Deepak Sahni Mieke Haesen Kris Luyten Karin Coninx EICS 2011 (ACM.
Low-fidelity Prototyping. Outline Low-fidelity prototyping Wizard of OZ technique Informal user interfaces Sketching user interfaces electronically Informal.
Design, prototyping and construction(Chapter 11).
Prototyping Creation of concrete but partial implementations of a system design to explore usability issues.
Prof. James A. Landay University of Washington Winter 2007 Video Prototyping January 22, 2007.
SE 431 Human Computer Interactions Jamal Nasir. How to design & build good UIs UI Development process Usability goals User-centered design Design discovery.
 refers to the overall experience a user has with a product. This experience doesn’t stop at the use of the product but starts with the advertising and.
WINDOWS 7 Windows 7 is an operating system that Microsoft has produced for use on personal computers. It is the follow-up to the Windows Vista Operating.
DOCUMENTATION REF: Essentials of IT (Hamilton et al) Chapter 1.
1 University of Washington Yang Li DUB Group activity-based ubiquitous computing – structuring ubicomp technologies and representing interaction contexts.
1 User testing approaches: Practical techniques toward a more usable website Arc Worldwide 1.
Digital Media & Interaction Design LECTURE 4+5. Lecture 4+5 Draw requirement + Prototyping.
Lecture 2 Supplement - Prototyping
Sampath Jayarathna Cal Poly Pomona
Practical information
Prototyping & Design CS 352.
Prototyping.
Design, prototyping and construction
Digital Technologies Lesson Yrs 5/6
Chapter 11 Design, prototyping and construction 1.
Rapid Prototyping Sketches, Storyboards, Mock-Ups and Scenarios
Prototype using PowerPoint
DESIGN, PROTOTYPING and CONSTRUCTION
Med-Fi Prototype Presentation
Team #3: Interactive Medium-Fi Prototype
Design, prototyping and construction
Presentation transcript:

1. Low Fidelity Prototyping and Wizard of Oz Studies Because they are easy to create and modify, low fidelity prototypes commonly provide designers with valuable feedback on user interface designs. They are often used within the context of wizard of oz studies, in which a human wizard simulates the interface as test users interact with it. User interface designers typically construct low fidelity prototypes with various tools: Christopher D. Hundhausen, Anzor Balkar, Mohamed Nuur, and Stephen Trent Visualization and End User Programming Lab School of Electrical Engineering and Computer Science Washington State University Pullman, WA {hundhaus, abalkar, mnuur, This research is funded by a Hewlett Packard “Technology for Teaching” grant (no. U06TFH0033E) 3. WOZ Pro Design Through an iterative, user-centered design process, we have developed WOZ Pro (Wizard of OZ Prototyper), a pen-based software environment that supports the quick and easy creation and testing of low fidelity user interface prototypes. With WOZ Pro, constructing a low fidelity prototype and running a wizard of oz study are as easy as 1-2-3: 2. Problems with Existing Low Fi Prototyping Tools 1. Design change propagation is cumbersome. With art supplies, making changes to multiple screens requires repetitive erasing and redrawing. With computer-based tools, it may be difficult to apply changes to a specific subset of screens. 2. Running wizard of oz studies incurs a potentially high cognitive load. Low fidelity prototypes can grow to dozens, even hundreds, of screens, making it difficult for human wizards to quickly navigate from screen to screen. If one is willing to put in implementation effort up-front, tools like SILK and DENIM can eliminate the need for a human wizard—and hence do not technically support wizard of oz studies. simple art supplies (e.g., pen, paper, and scissors) general-purpose graphics and presentation software (e.g., PowerPoint®, Photoshop®) Pen-based low fidelity prototyping software (e.g., SILK, DENIM; see 5. Future Work In order to better support wizard of oz studies, we will explore such a task pile metaphor in future versions of WOZ Pro. 1.Low Fidelity Prototyping and Wizard of Oz Studies 4. Empirical Evaluation In order to evaluate the effectiveness of WOZ Pro, we recently ran an experiment in which 24 participants used either WOZ Pro or pen-and- paper to construct and simulate, in wizard of oz fashion, a low fidelity prototype of a 21-screen website. We are presently analyzing video data to obtain four dependent measures: 1. Time to construct prototype 2. Accuracy of constructed prototype 3. Average delay between screen transitions 4. Average number of screen transition errors Pen-and-paper participant sketches screen WOZ Pro participant sketches screen In our experiment, WOZ Pro participants often created large, cluttered STNs that were difficult to work with. In contrast, pen-and-paper participants simply organized their screens into piles according to task. 2.Problems with Existing Low Fi Prototyping Tools 3. Present prototype, in wizard of oz fashion, to test users in “Run Screens” mode. Pop-up navigation menu constrains valid next screens according to STN defined in (2) 2. Specify state-transition network (STN) in “Edit Screen Transitions” mode. Drag-and-drop screens from “Unlinked Screens” pane onto canvas; link screens via drag and drop 1. Create a low fidelity prototype by sketching screens in “Design Screens” mode. A toolbox of sketching tools appear on left; screen thumbnails appear on right WOZ Pro supports a novel feature that allows the designer to propagate a series of recent edits to an arbitrary subset of screens. Here, we have changed the “Caffeine” menu item to “Smoothies” (see “Preview” pane), and we are about to propagate that change to all screens.