The Best Wire-framing Tool

Posted 11 years, 1 month ago in Resource, Ideology

I find myself often trying new software and techniques to help me get more out of my initial design ideas and documentation before I begin a site. What's worked best for me so far has been designing it in photoshop since it's less limited than the web.

However, it just occurred to me that the best tool to wireframe a design is actually paper. The reason is there's far fewer creative limits on it. For instance if you are working in HTML for your prototypes, you're always going to have to work in giant rectangles that either go side by side, vertically, or on top of each other. You can work around it but I feel if I were to start with HTML I wouldn't be pushing my designs to use those properties creatively.

The reason why I think that's bad is that it limits the result you'll have. Your design shouldn't be solely based on how it works behind the scenes but rather how it is experienced from a user's point of view. Therefore you should be working in a medium that focuses on the result and not the process and the mechanics behind it. There are of course exceptions but for most the client work I got, I'd be better off thinking more freely of what is the pure experience I want to offer the users of this website.

So from now on when faced with a design project I'm not going to jump into photoshop I'm instead going to take the time to really flesh everything out on paper using some 960 grid paper and color.