About prototyping

There is a lot of writing and talking about prototyping tools at the moment. And there are tons and tons of new design and prototyping tools coming up very regularly. As research of his work for Adobe, Khoi Vinh already provided a great summary earlier this year. And sure, there are a lot of powerful and fast improving tools out in the wild. InVision for example, became already something like a quasi standard at the moment. And it's great! You should try it out if you haven't already.
I tested quite a lot of tools for myself and I realized that I am really picky with them. I won't provide complete tests or reviews here though, because there are many reviews on the interwebs. But I do want to share some testing criteria which I find quite important:


This is meant in terms of project size. The perfect tool should be suitable to provide a complete and complex workflow as well as a tiny detailed and very custom animation. I might want to add some special logic to simulate a price calculator or pull in some "real" data. I need a tool which does all that.


I know that this might not be a serious issue for a lot of designers but I want a tool or framework which runs locally and independent of en internet connection. Some clients demand NDA’s which forbid the use of clouds or web services.


This is really important. Especially when it is web content I want it to scale on the target platforms I’m designing for. I don’t want to do some screens – iPhone, tablet, desktop – because that is not responsive and it does not show any floating or behavior. It is the same for prototypes of websites or web apps.


I want to design and test on, or as close as possible to my target platform, which is in most cases a web browser. It is there where I have to adjust sizes, colors or font-sizes across different devices and operating systems. It is also what I preferably hand over to testers and developers. Downloading "player" apps on the appstore or open static screens on special showcase websites is rubbish.


If I have to run a tool, player or special website to present my work, that is a problem. It might not sound like a big deal but sometimes the internet somewhere does not work well or god knows what happens. It is much better to just fire up a local server, run it on your machine and access it with your devices.


The big word. But it is just annoying to find yourself limited by the technology or environment you’re using.


Well, to make it short, every tool I tested has at least one major tradeoff. Maybe it doesn’t matter to most of the people. In the end everyone has to find his perfect way to work. But as I wrote, tools are improving fast and as a designer you should always try to keep up with the latest developments.
And still, in my opinion, the perfect tool is not here yet. But there is one thing which is already on everyones machine. It runs across all platforms and it is completely free. It’s „code“ :)
I know that many designers don’t feel ready or capable but I strongly encourage you to learn at least some basics. If you master HTML 5 and CSS 3 you can get really far. And if it is done right there is no specification which is more exact. It is highly flexible and you can easily look at it on any device. You want to know if this fancy font renders well on windows? Just fire up IE. You want to see if those small buttons work for the users? Just make a quick evaluation with colleagues or friends. And if you have findings, implement them right away. The developer wants to know the exact height of the header? It’s already there. You want to find out how many breakpoints you really need? Well there is no other way than to find out in the browser.

Okay, you may see where this is leading but I, personally, don’t feel so much need for new, fancy tools. Sure I use sketch every day because a graphical tool is good to get the "big picture". You have to draw and try things out. And I’m not a developer. What I basically want to say is that I'm not bounding myself to one or two tools because that is just not possible today. We should be creative not only in what we do but also how we do it.

By the way: For rough interactive wireframes (even with logic and math) I think good ol’ Axure is doing that just fine. Actually better than most of the other tools.

Well I hope that my little text can inspire and encourage you to get a head start into some Html. There are really great resources and many free tools and helpers. Have fun!