interaction design: building an ePortfolio
Blog
site map
resources
tools

Resembling the final product

When building a high fidelity prototype, be careful of scripting systems like Flash as code logic can become buried. If possible, prototype in a system where the interface and functionality can be easily separated. (Jones and Marsden, 2006, p. 193)

 

 

Prototype techniques

Be warned that prototyping is fun and can consume all available time unless it is properly managed. (Jones and Marsden, 2006, p. 193)

Techniques

In contrast to your text, Moggridge (2007) organises techniques into three main categories: screen based experiences, interactive products and interactive services

  • links
    Read the extract from Moggridge about prototyping for these categories.
  • Note the techniques suggested for screen based experiences, - is there anything here that you hadnt thought about when developing your low fidelity prototypes.

Tools

As noted in the readings above, a range of tools can be used for prototyping from simple pen and paper sketches to sophisticated software packages.

  • links
    A range of online articles are provided that discuss some of the software options available and what they are most appropriate for in prototyping activties.
  • text
    Some software tools are available free or a free 30 day trial – some of you may want to consider trying these out.
  • Dont forget that PowerPoint, a tool that Jones and Marsden recommend can be useful for demonstrating basic interactivity.
  • After you have investigated the options, consider which tool you will use for your high fidelity prototypes.

High fidelity prototype

High fidelity prototyping uses materials that you would expect to be found in the final product and produces a prototype that looks much more like the final thing (prrece, Rogers and Sharp, 2007, p. 535)

  • By definition, high fidelity prototyping will involve some type of software development. While this will enable a closer realisation of the final product, the coding should support fast fail – rapid changes to the code to try out ideas.
  • text
    Read the brief overview of high-fidelity prototyping in your text and the issues associated with throwaway prototyping.
  • A key issues in prototyping is deciding what to prototype – you cant do everthing. One way to think about this is to think about horizontal and vertical prototypes. Note the distinction between these two types in the powerpoint provided.
    How will this impact on your decisions of what to prototype?

Issues

A range of issues have been identified that can impact on prototyping activities.

  • links
    Two resources are provided in the links for you to consider some of the pitfalls and considerations that you need to make when prototyping.
  • Construct a table from these two readings that outlines the advantages and disadvantages of high and low fidelity prototyping.

Hi fi prototypes for your product

Now its time to create a prototype that more closely resembles the final product. This is not the start of developing the final product, but the end of prototyping. Keep that in mind. Choose one of the two options below:

Option 1

  • Develop a high fidelity prototype using XHTML and CSS. Forms and dialogues should be simulated, and no backend database connections or processing are required at this point. Essentially you are mainly demonstrating vertical prototyping here.

NOTE: if you have a good reason to use any of the other prototyping tools discussed above, please make a case to your lecturer.

Option 2

  • Develop a high fidelity prototype using Ruby on Rails. The backend database may be completely flat, and no related or linking tables are required. You are trying to demonstrate mainly horizontal prototyping here.
  • links
    Some references are provided to help you think through this process.

 

Iterate through at least two consultations with your clients, and modify the prototype as required.

Link this high fidelity prototype to your website, and address the following questions in the same section (300 words max):

  • What changes did you make to the prototype based on consultations with your clients?
  • Explain to what extent the prototype is vertical and/or horizontal.
  • How closely do you think this prototype will resemble the final product?
  • Comment on whether more or less prototyping is necessary for you to be able to commence the development of the final product.

 

Assessment
learning tasks what are design patterns? get to know one another Develop a company website What is Web 2.0? what is interaction design
ePortfolio
Mobile Design
Site info