1. HCI – Prototyping

2. Why Prototype?  Prototyping is a well understood and used technique in design engineering where products are tested via a model prototype  Usually carried out at the early stages of design giving the users and developers time to change things prototypes can be “throw away” (e.g. scale models) or will eventually go into commercial use.  In software development prototypes can be paper-based software-based

3. What is a Prototype  In interaction design it can be any of the following (and more): a series of screen sketches a storyboard, i.e. a cartoon-like series of scenes a PowerPoint slide show a video simulating the use of a system a lump of wood or a cardboard mock up a piece of software with limited functionality written in the target language or in another language

4. What to Prototype ? Work flow, task design, sequence i.e. in the order they happen Screen layouts and information display i.e. icons, home buttons, back buttons, colours etc Difficult, controversial, critical areas i.e. Undo button, help, exit, stop etc.

5. 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’ notes storyboards – covered in next slide ‘Wizard-of-Oz

6. 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

7. Storyboard Example

8. High Fidelity Prototyping Uses materials that you would expect to be in the final product. For a high-fidelity software prototype common environments include Macromedia, Visual Basic, MS PowerPoint. Prototype looks more like the final system than a low-fidelity version.

9. Aims of Prototyping in Software The aim of prototyping is to resolve uncertainty about  Functional and user requirements (input/output)  operation sequences – in what order?  user support needs – help, undo, back, home  “Look and Feel” of the interface  appropriateness of the design – think - user/task/environment