Skip navigation
factory /><div class=

Grayscreen Prototypes: The Secret Sauce


Surprisingly, the most common barrier to effective web development is not technology, but miscommunication.
And as George Bernard Shaw once said,

"The biggest problem in communication is the illusion that it has taken place."

This is especially true in web development. Sitemaps and wireframes more often create illusions of communication than resolve them. That's because they cannot demonstrate subtle aspects of a site's content, structure, and functionality, which can only be understood through the experience of clicking.
Client vs. Developer Wars

We wrote our book Client vs. Developer Wars after experiencing how even the best efforts of sincere and capable web teams (programmers, designers and clients) still can't avoid perplexing communication traps. Our book contrasts common negative experiences with abundantly positive development projects which flow from the simple practice of using a clickable grayscreen prototype rather than a site map or wireframe.

In contrast, grayscreen prototypes do effectively communicate a site's content, structure, and functionality before design and development begin. Building a thorough and detailed prototype is the key to a successful website development project.

For more information about our grayscreen prototyping you can watch the videos above and below, read, download, or buy our book Client vs. Developer Wars, or check out our Web Smart newsletters "Why We Prototype and "How We Prototype."


This ten minute video shows our process of grayscreen prototyping.
To embed this video on your site use this code:
<embed style="width:400px; height:326px;" id="VideoPlayback" type="application/x-shockwave-flash" src="http://video.google.com/googleplayer.swf?docId=-1308138296088477010&hl=en" flashvars=""> </embed> <br>Grayscreen Prototyping video by <a href="http://www.newfangled.com">Newfangled Web Factory</a>.