References:

1. Dix, Finlay, Abowd & Beale, Human-Computer Interaction, 3/e, Chapter 6: HCI in the
Software Process, Pearson Education, 2004.
2. Jenny Preece, Yvonne Rogers, Helen Sharp, Simon Holland, Tom Carey, David Benyon,
Human-Computer Interaction, ICS Series, Pearson education, Addison-Wesley, 1994.

1. Prototypes, Prototyping
2. Prototype: A model / mockup of the system to be designed.
3. Is prototype a real system or can it become a real system?
4. Why we make prototype?
5. To check / assess the system b/f hand. Risks are minimized. For example, in a housing project
the client may not like your design.
6. We make the model, demonstrate the model to stake holders (end users, client, designers,
developers, testers, ….)
7. Product, beta version of a product
a. Why companies launch beta version?
i. To get the users’ feedback
ii. To trace the errors and resolve those in real life scenario
8. Making / development of the prototype (development stages, development methodology)
a. There are various tools / techniques / strategies
b. Serve various purposes
c. Types
9. Demonstrating / presenting the prototype
a. There are various tools / techniques / strategies
b. Serve various purposes
c. Types
10. Prototyping approaches
a. Requirements animation: Usually the functional requirements are demonstrated
through prototype.
b. Rapid prototyping: is used to build quick prototypes to assess design alternatives during
design phase for demonstrating the gathered requirements.
c. Throwaway prototypes: Normally paper-based, card board based, sometimes tool based
(prototype made using powerpoint, visio, paint, …)

d. Incremental prototypes: The final product is built as separate components, one at a

time. Each component has its prototype, and is discarded later.

e. Evolutionary prototypes: the prototype is not discarded and serves as the basis for the
next iteration of design. Apparently, the actual system evolves from a primitive first
version to its final version.
f. Low fidelity / high fidelity prototype: How much the prototype resembles with the real
product
i. For high fidelity, investment is more (may need to use software tools)
ii. For low fidelity, less investment may be enough (paper, pencil, storyboarding,
sketches may be enough)
g. Horizontal prototype: shows the main menu(s) / main option(s). There is no
functionality. Covers the breadth of the system.
h. Vertical prototype: contains the mockup of a single feature in detail. The whole system
may consist of many features.
i. Full prototype: contains mockup of complete system (whole breadth and depth is
covered). Consists of multiple vertical prototypes.
j. Storyboarding: small interaction stories (initially text based which may be transformed
into comprehensible sketches) are demonstrated. The sketches are in sequence.
k. Chauffeured prototyping: users (audience) watch while some member of the design
team operates (drives) the prototype.
l. Wizard of Oz prototyping: users interact with the screen while some member of the
design team from behind the scene, operates the prototype. It seems to the users that
prototype is responding to their moves.
Case study: Build a prototype for Pizza Ordering System.
1. Write a story
2. Separate story segments
3. Transform the story segments into sketches
4. Transform the sketches into sketched UI components