Prototyping is considered to be an integral part of web design allowing web designers and developers create interactive mock-ups of a future site, so that a client could get a feel of how the website is going to be functioning and see whether it meets all the design goals. Building and re-building the full design is expensive and time-consuming.

What prototyping offers is the following:

- visibility;

- user involvement;

- increased speed;

- lower costs;

- design aspects testing.

However, though prototyping is aimed to create a simplified version of the future website, the process itself can get rather complicated with a variety of prototyping tools out there and the solutions they offer, determining the time frame and number of revisions before the final requirements.

To find out answers on these questions for you, we addressed a short questionnaire to a number of web design professionals. Below is the express interview we compiled based on the answers given.

Our web design experts today are:

- Dan Mall

- Joe Dolson

- Matt Webb

- Amy Greiner

- Dan Lindop

1. What prototyping tools have you tried? Which ones have you chosen for usage?

Dan Mall: I almost always try to work out multiple ideas on paper; very rarely does my first idea work well. For certain projects, I?ll do a handful of sketches; for others, I?ve done up to hundreds of sketches. When I finally get an idea I?d like to refine, I?ll usually hop into Illustrator, Indesign, or Omnigraffle to try and work it out.

Joe Dolson: I've tried Photoshop, Visio, pencil and paper, and HTML. The principle tools I currently work with are HTML and paper and pencil. I?ve generally found that more complex software solutions require more time developing a prototype while saving little or no time in the final development process. If I worked on a team-based model where generating a detailed prototype was required which would be produced by somebody else, I may find it more worthwhile. However, for most of my projects, it simply adds weight to the project.

Matt Webb: I use one called OmniGraffle, because I?m a Mac user and I find it integrates well with OSX.

Amy Greiner: I create all layouts in Photoshop.

Dan Lindop: As we specialise in producing websites and web apps for small to medium businesses, we don?t really use any prototyping tools as such. We favour an iterative process involving our clients where they provide feedback on work-in-progress sites and applications. This works well for us as they can see the development as it would be in the final version.

2. What are the advantages of prototyping tool(s) you?re using now?

Dan Mall: For me, prototyping is about speed, about communicating ideas quickly, so I try to look for tools that allow me to do that. The best one I?ve found is pencil and paper. There?s nothing faster and more raw than sketching ideas by hand, because any insecurities like drawing straight lines or aligning elements perfectly are thrown out. It?s surprising how prototyping on a computer suddenly makes you aware of those issues, and addressing those things during a prototyping phase is a waste of time.

Joe Dolson: Mostly flexibility and the ability to prototype quickly and efficiently. When I?m prototyping in HTML, it also creates the benefit that some portions of the end-product will already be coded at the time that it comes to take the project into the development phase.

Matt Webb: Easy to use, can export a PDF with hotlinks.

Amy Greiner: It's easy to use as it?s a program I use very often. I don't do any programming or coding myself so this way I don?t need to involve a programmer until the initial designs have been worked out, which saves time and money. It?s easy to make any client changes without needing to rework any code.

Dan Lindop: Our method allows our clients to get a good feel for how the final site or application will work. As they get to test on a work-in-progress version, it allows us to tweak aspects of the system to suit their preferences. This can be particularly useful for web-based applications. How a user might tackle a problem may be different to how we envisaged, so they can then give us feedback on how they think the system can be made easier and quicker to use.

3. What are the key features you?re looking for when choosing a prototyping tool?

Dan Mall: Speed. That?s why I find that vector tools work really well.

Joe Dolson: Intuitiveness and efficiency. Flexibility.

Matt Webb: Ease of use, you don?t want to be spending a long time struggling to put something together.

Amy Greiner: I'm happy with my process so I really haven't looked at any other solutions.

4. How does you prototyping process flow? Do you put a time limit on it?

Dan Mall: For me, prototyping has almost always been internal, either to work things out for myself or show someone on my team how it would work. Because of that, I take the liberty of spending as much time on a prototype as I need. If I can solve functional issues up front in a prototype, I don?t have to worry about that when it gets to the actual design stage and can focus solely on design-related issues.

Joe Dolson: For most projects, prototyping is the rapid generation of a visual framework (very basic data layout) and the gathering of data requirements. Because of the way I work, I usually only prototype interactions - the order of events and behaviors in a process.

Matt Webb: It depends on the project. It?s good to get everyone involved ? programmer, designer, producer and client.

Amy Greiner: I present the client with 2-3 different designs, each showing 2-3 sample pages of each. I also illustrate how rollovers will work with add?l printouts if necessary. My standard turnaround time is 2 weeks to present initial concepts.

Dan Lindop: This can vary from client to client. In general, the better the initial brief and specification, the quicker it is for us to produce the final version. Most problems tend to occur when a client hasn?t thought through their objectives properly or they are woolly about how they want a system to work. We don?t tend to put a time limit on getting things right. We prefer to talk to the client in order to iron out any problems.

5. How many revisions do you allow your client before final requirements?

Dan Mall: Because prototyping is generally an internal process to me, I?ve only showed prototypes to a handful of clients. In those instances, it was because the client was savvy enough to understand the value of it, almost as if he or she was a part of my team. It was more collaboration than a review cycle.

Joe Dolson: No specific number. It depends on the situation, the change requested, and the cascading impact of the change.

Matt Webb: 2 or 3? Again, depends on the project and client.

Amy Greiner: I usually allow for up to two sets of revisions within the original estimates. I?m happy to make any additional estimates if necessary but these are billed at my hourly rate. Once the designs are signed off on, then I turn the project over to my programmers to create the HTML files. If there are any changes at any point after sign off, they will also usually incur additional costs as well.

Dan Lindop: Again, we prefer to work closely with our clients to get something they are happy with and so far this has worked well for us. Budget is obviously a factor when working on a project, but we make sure that the specification is agreed at the start of a project so all parties concerned know what they will get out of the project. Occasionally, clients will try to add features in so you do have to keep an eye on scope creep.

Helen Walker

Helen Walker graduated with a degree in Mass Communications and Sociology. She worked as a newspaper journalist for two years after that. Having always been interested in cyberculture and its impact on society, Helen switched to online journalism and joined Design Interviews blog in July, 2007. Ever since she's been interviewing web designers and administrating the blog. Helen is a keen movie-goer and she is also a panda lover.


Look for me on:
- Twitter
- VIRB
- Facebook

Get in touch with Helen: helen.walker4@gmail.com