Wrapping up prototyping

Slides:

Advertisements

Similar presentations

Chapter 11 Design, prototyping and construction 1.

Advertisements

Design, prototyping and construction

Rapid Prototyping Dimensions and terminology Non-computer methods

ISE554 Human Computer Interaction Design 2.3 Principled Methods for Design.

Reference Prof. Saul Greenberg, University of Calgary, notes and articles.

Human Computer Interaction

User Centered Design and Prototyping

Prototyping Techniques

Saul Greenberg Prototyping techniques Learning different techniques for rapid prototype development.

Prototyping. Introduction Low-fidelity prototyping High-fidelity prototyping Compromises in prototyping From design to implementation.

Concepts and Prototypes

1 CS 544 Prototyping Low and Medium Fi Prototyping Acknowledgement: Some of the material in these lectures is based on material prepared for similar courses.

Graphical User Interfaces Design and usability Saul Greenberg Professor University of Calgary Slide deck by Saul Greenberg. Permission is granted to use.

Foundations and Principles of Human Computer Interaction Slide deck by Saul Greenberg. Permission is granted to use this for non-commercial purposes as.

ISP 666 Week 6 Prototyping. Design a Solution From task to system From abstract to concrete Task Models UI Presentation evaluation Conceptual Model System.

COMP5047 – Design Prototyping and storyboards Judy Kay CHAI: Computer human adapted interaction research group School of Information Technologies Acknowledgement:

James Tam User Centered Design And Prototyping Why User Centered Design is important Approaches to User Centered Design Rapid prototype techniques.

Design, prototyping and construction Readings: ID-book, Chap. 11 (through 11.3) Also, Prototyping for Tiny Fingers

Paper Prototyping Source:

Human Computer Interaction & Usability Prototyping Design & Prototyping HCI Prototyping.

Guidelines and Prototypes CS774 Human Computer Interaction Spring 2004.

What is a sketch? Chapter 1.2 addendum Sketching User Experiences: The Workbook.

Overview Prototyping and construction Conceptual design

HCI Prototyping Chapter 6 Prototyping. Learning Outcomes At the end of this lecture, you should be able to: –Define the term “prototyping” –Explain the.

Design, prototyping and construction CSSE371 Steve Chenoweth and Chandan Rupakheti (Chapter 11- Interaction Design Text)

UML & Prototyping. What is a prototype? A prototype is a small-scale model. It can be (among other things): a series of screen sketches a storyboard,

Merja & Pauli Rapid prototyping & other stuff.

COMP5047 – Design Prototyping and storyboards Judy Kay CHAI: Computer human adapted interaction research group School of Information Technologies Acknowledgements:

HCI – Prototyping. Why Prototype?  Prototyping is a well understood and used technique in design engineering where products are tested via a model prototype.

Prototyping. What is a prototype? In other design fields a prototype is a small- scale model: a miniature car a miniature building or town.

Chapter 9 Prototyping. Objectives  Describe the basic terminology of prototyping  Describe the role and techniques of prototyping  Enable you to produce.

1 Human Computer Interaction Week 7 Prototyping. 2 Introduction Prototyping is a design technique where users can be involved in testing design ideas.

Mario Čagalj University of Split 2014/15. Human-Computer Interaction (HCI)

Prototyping. REVIEW : Why a prototype? Helps with: –Screen layouts and information display –Work flow, task design –Technical issues –Difficult, controversial,

Begin Class with More Studio. Introduction to Prototyping.

©2001 Southern Illinois University, Edwardsville All rights reserved. Today Wednesday Running A Paper Prototyping Session Paper Prototyping Video: Paper.

Paper Prototyping Source: Paper Prototyping a method of brainstorming, designing, creating, testing, refining and communicating.

Overview Prototyping Construction Conceptual design Physical design Generating prototypes Tool support.

What is a sketch? 1 Concepts (and selected visuals) from this slide deck are based on: -Buxton, B. (2007) Sketching User Experiences: Getting the Design.

Sketching and Prototyping Sketches / low / medium / high fidelity prototypes – as investment in design increases (red arrow), so does the formality of.

Design, prototyping and construction(Chapter 11).

James Tam User Centered Design And Prototyping Rapid prototyping techniques Why User Centered Design is important Approaches to User Centered Design.

©2001 Southern Illinois University, Edwardsville All rights reserved. Today Tuesday CS 321 Human-Computer Interaction Paper Prototyping Video: Paper Prototyping.

Prototypes, Storyboards, and Flowcharts Ike Choi.

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

Sketching and Prototyping

CS 3120 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION (UIDIE)

Task-Centered Walkthrough

Prototyping & Design CS 352.

WXGE6103 Software Engineering Process and Practice

Introduction to Prototyping

Cognitive Walkthrough

Design, prototyping and construction

Cognitive Walkthrough

Chapter 11 Design, prototyping and construction 1.

The Role of Prototyping

Rapid Prototyping Sketches, Storyboards, Mock-Ups and Scenarios

CS 522: Human-Computer Interaction Lab: Formative Evaluation

Mockups and Prototypes

DESIGN, PROTOTYPING and CONSTRUCTION

Computer Science Department

Design, prototyping and construction

Interface Design and Usability

Design, prototyping and construction

COMP444 Human Computer Interaction Prototyping

Presentation transcript:

Wrapping up prototyping

Objectives for today Clarify Next Week’s Deliverable/Activity Moving beyond LoFi prototypes

LoFi Prototype Deliverable Prepare a well organized, somewhat documented (labels on the back of images) LoFi Prototype. This is due at the start of class on Monday. Be prepared to show it to a group of your classmates for 10-15 minutes. Have one or two tasks clearly prepared and printed out. You will ask a member of another team to walk through the task using your prototype.

Storyboards Series of sketches showing how a user might progress through a task using an interface Often used with scenarios, bringing more detail Make it easier to envision the progress of the interaction

Medium fidelity prototypes Now move to the computer (e.g., use Visual Basic or a wireframe tool in NetBeans/Eclipse) Simulate some but not all features of the intended system  more engaging for users Purpose Provide interactive (but limited) scenario for user to try out; gets around limits of LoFi prototypes on testing flow of interaction May offer a development path to running system

How do you limit functionality? Horizontal prototypes Entire UI is implemented, but no underlying functionality Vertical prototypes Include in-depth functionality for a few features Common design ideas can be tested in depth Scenario-based Scripts of particular uses of the system; no deviations Wizard of Oz – human simulates the intelligence

High fidelity prototypes Basically complete running system But may not be: In a suitable language for delivery Efficient Robust Well-coded “Build one to throw away”… a common research methodology

Recall benefits of LoFi Prototypes LoFi prototypes are very quick to develop Early in the process when changes are cheap Users focus on content instead of superficial issues Developers aren’t yet invested, thus are willing to change Don’t set unrealistic expectations No bugs to halt testing

The Prototyping Spectrum Early design Brainstorm different representations Choose a representation Rough out interface style Task centered walkthrough and redesign Fine tune interface, screen design Heuristic evaluation and redesign Usability testing and redesign Limited field testing Alpha/beta tests LoFi (paper) prototypes Medium Fidelity prototypes HiFi Prototypes / restricted systems Working system Late design