Tools

Olsen, H ( 2002) Results from a survey of web prototyping tools usage  The Interaction Designer’s Coffee Break viewed 31st March, 2007 <http://www.guuui.com/issues/01_03_02.php>
In June 2002 a survey on web prototyping tools usage was conducted. The purpose of the survey was to find out what tools are used for prototyping, what requirements interaction designers have for their tools, and how happy they are with the tools they are using.

Dimon, G ( 2006) Just Build it: HTML Prototyping and Agile Development Digital Web Magazine. viewed 31st March, 2007 <http://www.digital-web.com/articles/just_build_it_html_prototyping_and_agile_development/>
Creating wireframes, PDDs, site maps, storyboards, process flows, and other tools for developing user interfaces is a lot like working in a vacuum. You’re ignoring many of the significant factors that influence your final product. These documents have their place. However, it is important to understand when a design document might not cut it. HTML prototyping and full-on agile development of Web applications are increasingly viable options that help minimize communication gaps and assumptions and deliver more accurate results sooner. If you haven’t considered it, now may be the time.

Prototyping links

http://www.d.umn.edu/itss/support/Training/Online/webdesign/architecture.html#prototyping

Wireframes with HTML

Stanford, J (2003) HTML Wireframes and Prototypes: All Gain and No Pain  Boxes and Arrows  viewed 31st March, 2007 <http://www.boxesandarrows.com/view/html_wireframes_and_prototypes_all_gain_and_no_pain>
Using HTML as the basis for your wireframing and prototyping can be a quick and rewarding experience with fabulous benefits, including easier user testing, improved client communication, and faster, more effective use of design time.

Zapata, A (2006) The Guided Wireframe Narrative for Rich Internet Applications Boxes and Arrows viewed 31st March, 2007 <http://www.boxesandarrows.com/view/the_guided_wire>
This case study covers the “guided wireframe narrative” technique used to design a typical web-based application.

Links on use of Wireframes for prototyping
http://www.d.umn.edu/itss/support/Training/Online/webdesign/architecture.html#wireframes

Software

  1. Axure
    Axure RP Pro 4 <http://www.axure.com/downloads.aspx>  Download a free trial.
  2. Tool Review
    McDowell, S (2006) Visio Replacement? You Be the Judge Boxes and Arrows
    http://www.boxesandarrows.com/view/visio_replaceme#comment_4027
    A review of some software tools for visualisation aspects of prototyping.
  3. DENIM
    DENIM: An Informal Tool For Early Stage Web Site and UI Design <http://dub.washington.edu/denim/>
    DENIM is a system that helps web site designers in the early stages of design.
    DENIM supports sketching input, allows design at different refinement levels, and unifies the levels through zooming.
  4. Visio
    Olsen, H. (2007) Visio - the interaction designer's nail gun (3rd edition) The Interaction Designer’s Coffee Break  Viewed April 08, 2007
    <http://www.guuui.com/issues/02_07.php>
    The reason why Microsoft Visio is a popular prototyping tool is because of its interface widgets that you can drag and drop onto pages and its ability to link together pages and view them as web pages.