WED JUL 18 2018


The development of prototypes is one of the main principles of the user-centred design.  In this topic, we will take a closer look at how this activity is implemented.


The activity of designing a prototype commences as soon as a set of system specifications is produced.  There are two types of prototype designs:

  • Conceptual Design (related to the conceptual model development that revolves around the capability and functionality of the product.

  • Physical Design (related to the menu structures and displays, icons, and graphics that are utilised on the interface.

The design is produced by an iterative software life cycle process that requires evaluation by users.  To enable users to effectively evaluate a design, it is necessary for the designers to provide an interactive version of the product.  During the initial stages of system development, this interactive version can be produced by using manila cardboards and papers.  However, in the following levels where the system design becomes more advanced, it is more ideal to use an interactive version that
resembles the end product.  These interactive versions are what we call "prototypes".  It is commonly known that users are unsure of their needs but, once familiarised with a product, are quick in identifying the shortcomings in a system.  Upon gathering information on user work practices and views regarding what can and cannot be done by the system, we should then implement our proposal to develop an ideal prototype, and later reproduce it in different versions.  The more repetitions done, the better the product would be.

11.1.1     What is a Prototye

When you hear the term "prototype", you may imagine an object that resembles the model of a building or bridge, or software that contain many bugs and frequently crash.  However, a prototype can also be a paper, electronic photo or video simulation of a specific task.  A prototype could have many versions, and is used to illustrate software.  It can be designed in the simplest form, such as storyboards on papers, on in a more complex form such as near-complete software.  A prototype enables interaction with stakeholders by illustrating the characteristics of the system.  This interaction is intended to help obtain information and experience of using the software in an authentic environment, whilst exploring the imaginations of users.  For example, when the Palm Pilot idea was taking shape, the inventor of the product, Jeff Hawkins, initially carved the precise size and form of his idea onto a piece of wood.  He often carried this wood, and behaved as if it were a real tool for him to input information.  This helped him visualise the scenario in which he owned the product.  Although this scenario may seem strange to some people, it is actually an example of the simplest prototype that enabled Hawkins to achieve his goals.  In conclusion, a prototype is a representation of a product being designed which enables user interaction as well as allows them to understand its suitability.

11.1.2    What is the Need for Prototype Development
Prototypes are useful tools for designers to discuss their ideas with stakeholders.  It becomes a communication medium between the systems developers and is very suitable and effective to be used by developers as a test platform for their ideas.
The prototype provides the answers for all arising questions apart from helping designers to make selections based on different alternatives.  A number of reasons for prototype development are listed below:

  • Tests the technical feasibility of a system.

  • Explains vague and ambiguous requirement specifications.

  • Determines if a design's approach is compatible with the development of other parts of the system.

The designer influences the type of prototype being developed.  For example, if the designer is trying to identify methods in which the users would implement a set of tasks, and to determine if the tools developed would be able to support these tasks, the prototype being developed should be paper based.

There are various methods that can be used in developing prototypes, where some prototypes can be developed faster, at different stages, and in evolutions.  The following subtopics discuss each of these methods.

  • Fast and Disposable Prototypes

  • Layered Prototype

  • Evolution Prototype

11.2.1     Fast and Disposable Prototypes
Prototypes developed using this technique are not stored, but disposed as soon as the testing and evaluation phases have been completed.  It is only meant to test certain aspects of the system.  Usually, this prototype is used to obtain more detailed information about the system's requirements.  Figure 11.1 illustrates the procedures and processes involved in the development of this prototype.

Concept           DLC            Basic Principles          User-Centred Life Cycle Model             Participatory Design

We will now look at a number of techniques that can be used to develop the fast and disposable prototype.

  • Storyboard and Sketches:  The drafting of storyboards is an example of a prototype that is usually used in this scenario.  A storyboard contains a series of sketches that illustrate how users implement tasks by using the tools that are being developed.  It may consist of a series of screen sketches for GUI-based software, or sketches that illustrate how users utilise the tools.  When used together with the scenario, a storyboard can provide more specific information to ensure appropriate interaction between stakeholders and the prototype.  Sketches are also widely used to produce icons or symbols in upcoming GUIs.

  • Index Cards:  Prototypes using index cards are mostly used for developing websites.  Each index card represents a screen display or element on an interface.  In user evaluations, the user can pretend to surf the internet while observing each index card arrangement.

  • Computer Simulations:  Another technique of developing a prototype is based on simulation or
    animation that illustrates the flow of a system.  These kinds of prototypes are usually produced by using specific software as toolkits.  Among the software that can be used are HyperCard and Visual Basic.  By using this software, sample screens can be produced and interrelated to observe the process flow from one screen to another screen or element of the system.  Users are also able to improve their interaction with the interfaces.  However, this simulation-based prototype does not have to necessarily support all the functionalities of the prospective system.  Just as other prototypes, it is merely used to test certain aspects of the system.

  • Wizard of OZ:  In this technique, users use the computer and are given the impression they are using software that have already been developed.  However, the user"s computer is actually connected to another computer that is being used by the software designer.  Each time the user interacts with the software prototype, the designer responds to the user, yet giving the user the impression of receiving a response from the software.

  • Chauffeured Prototype:  This involves users who observe a designer testing the system prototype.  This technique differs from other techniques, in that users do not interact with the system, but only observe how the system is used to implement a task.  This technique can be used to validate the sequence of actions involved in implementing a task.  However, this technique is rarely used as it goes against user evaluation principles, where users interact directly with the prototype or system.

11.2.2     Layered Prototype​

In this approach, the system is divided into a number of smaller components.  Each of these components is individually and independently developed as prototypes.  The final product is launched as a series of a product, where each launch may consist of different components.  This process can be illustrated as in Figure 11.2.​

If you notice, the prototype developed using this approach is not disposed, but used as a basis for the final designs of components in a system.

11.2.3     Evolution Prototype

The evolution prototype refers to an evolutionary approach towards system development, beginning from a prototype with limited functions, and expanding to the final product.  Just as the layered prototype, the evolution prototype is not disposed, but used as a basis for designing the final product.   This process is illustrated in Figure 11.3.


As indicated earlier, prototypes can be classified based on the approaches used during its development.  The prototypes can also be classified based on their similarities with the final product.  With this, they can be divided into low-fidelity prototypes and high-fidelity prototypes.  The following subtopic will discuss each of these prototypes.

11.4.1     Low-fidelity Prototypes
Low-fidelity prototypes are quite different from the final products. For example, the prototype does not use the same materials as the final product.  For example, the prototype might use paper and manila cardboards as opposed to steel and electronic displays in the final product.  The wood used as a prototype for the Palm Pilot is an example of a low-fidelity prototype.  Low-fidelity prototypes are very useful because they are simple, cheap and easily used. This means that the prototype can be easily customised into alternative designs that can be tested and tried.  This is a very important factor during the initial phases of development.  One example is during the conceptual design. The prototype used to analyse and test ideas should be flexible and easily modifiable.  Low-fidelity prototypes are not created with the intention of storing and integrating them with the final product, but merely for the purpose of trials and research.

11.4.2     High-fidelity Prototypes
High-fidelity prototypes utilise materials that are used in the final products.  Thus, they have similar characteristics with the final product.  A system prototype that is developed with Visual basic, for example, would be more accurate compared to screen sketches on a paper.  To produce high-fidelity prototypes, you would need software such as Macromedia Director, Visual Basic and SmallTalk.  These software contain powerful prototyping toolkits that enable easy development of prototypes.  However, this technique has a number of weaknesses that cause researchers to discourage its usage.   Among the problems of this prototype are:

  • It takes a longer period of time to be produced.

  • Evaluators would usually concentrate their criticism on external aspects that are related to the prototypes toolkits, rather than focusing on the contents of the prototype.

  • Developers are usually reluctant to make modifications on a prototype that had been designed previously in the past.

  • Prototypes that utilise software may lead to overly-optimistic expectations.

  • Even with the existence of a small error, the process of evaluation or testing would be halted.

High-fidelity prototypes are useful as they provide ideas to users and test the technical issues of the system.  However, the use of low accuracy prototypes to study and explore all issues that are related to its contents and structure should be encouraged.