However, there is a common problem when reviewing the early prototype with customers: they tend to focus on design issues instead of interaction/navigation you are trying to address at the meeting. Apparently, this is main reason even many visual designers prefer starting with paper-based wireframes, or rough ("low-fidelity") sketches in software (e.g. Visio, PowerPoint), instead of html. To understand difference between wireframe and prototype, see e.g. nice discussion here or follow links.
Recently I found the Denim web site prototyping tool that aims at this early stage of design. From their web site: "DENIM supports sketching input, allows design at different refinement levels, and unifies the levels through zooming."
Denim is an outcome of university research, Java GUI application with a long history, but never reaching mainstream awareness. Primarily oriented on pen tablet input, it "preserves the important properties of pencil and paper: a rough drawing can be produced quickly and the medium is flexible. However, unlike a paper sketch, this electronic sketch is interactive and can easily be annotated and modified using editing gestures."
Quick evaluation. Pros:
- zooming from site maps to storyboards to details of an individual page
- easy hyperlinks from page component to another page
- test the interactions in the Run mode, or export to HTML
- conditional hyperlinks (e.g. depending upon checkbox in the mockup)
- looks like paper sketches, users are more eager to suggest modifications; not distracted with design issues
- ability to replace handwritten component with text input or an image
- portable (requires only JRE 5), no installation needed.
- tablet oriented: mouse + keyboard are less intuitive to use (and my mouse-drawn text looks horrible)
- no reusable page chunks as header, menu, etc. (although promised in a future release)
- design-oriented, not technology-oriented: great for working with customers, but I also need to communicate the design with the implementation team. I am missing a separate layer (or level of detail) that enables assigning technical comments to pages, components, links. Something like tags in commercial EasyPrototype, but with explicit control over visibility.