Overvie w • Prototyping • Construction • Conceptual design • Physical design • Generating prototypes • Tool support
Jan 18, 2018
Overview
• Prototyping
• Construction
• Conceptual design
• Physical design
• Generating prototypes
• Tool support
Why prototype?
• Evaluation and feedback for iteration • You can test out ideas for yourself
• It encourages reflection• Makes the invisible visible
AwareHouse for the elderlyor...
A warehouse for the elderly• Supports team member communication• Stakeholders can see, hold, interact with a prototype more easily than a document or a drawing
• Prototypes answer questions, and support designers in choosing between alternatives
Messies vs Neats
• This applies to HCI design as well as to research methodologies
• In HCI design you will find two cultures:– Prototyping culture
• Roughly aligned with the messies• Assume that the user doesn’t know what they want• Falls prey to missing the real need
– Specification culture• Roughly aligned with the neats• Assumes that the user does know what they want• Falls prey to innovation
Prototyping• Different kinds of prototyping
-low fidelitydrawings on paper
-high fidelitypartially functional system
• Compromises in prototyping-vertical
lots of detail in a small portion-horizontal
lots of surface functionalityprovides the “flavor” of the
design
What is a prototype?
In interaction design it can be (among other things):• a storyboard, i.e. a cartoon-like series of scenes
• scenario of use• a series of screen sketches• an html web site• a video simulating the use of a system• a lump of wood• a cardboard mock-up• a piece of software with limited functionality
Low-fidelity Prototyping
• Uses a medium which is unlike the final medium, e.g. paper, cardboard
• Is quick, cheap and easily changed
• Examples:sketches of screens, task
sequences, etc‘Post-it’ notesstoryboardsfunctionality provided by
‘Wizard-of-Oz’
Sketching
• Sketching is important to low-fidelity prototyping
• Don’t be inhibited about drawing ability. Practice simple symbols
Storyboards
• Often used with scenarios, bringing more detail, and a chance to role play
• It is a series of sketches showing how a user might progress through a task using the device
• Used early in design
Generate storyboard from scenario
Card-based prototypes•Index cards (3 X 5 inches) •Each card represents one screen or part of screen
•Often used in website development
Generate card-based prototype from use case
‘Wizard-of-Oz’ prototyping
• The user thinks they are interacting with a computer, but a developer is responding to output rather than the system.
• Usually done early in design to understand users’ expectations
• What is ‘wrong’ with this approach?
>Blurb blurb>Do this>Why?
User
What to do with this data…• Generate some graphs that show that new people have
a hard time with Building A• Organize the technology section in a meaningful
way… the idea here is to get a handle on what your technology constraint will be
• Print out the “open discussion” sections cut them up and try to organize them in a useful manner to help support what the actual problem is…
• Begin iteration on your design ideas• How to start this process…
Develop a scenarios of use• Express in words a description of the situation
• Tell the story from the user’s perspective• Use names… users can envision things better in the concrete-Bob is new to GGC.-He has the unfortunate need to attend his first class in building A
-As he talks to his girlfriend Elaine, he walks into the building and his cell phone buzzes
-He looks to see his room is down the hall and to the right and then continues his conversation
-Notice that the device is clairvoyant… it knows where he is going
Generate storyboard from scenario