Balsamiq Mockup [1] ist eine in Adobe Flex geschriebene Anwendung zur Erstellung von Skizzen und Wireframes. Die Erstellung von Wireframes mit Balsamiq Mockup ist sehr intuitiv und geht leicht von der Hand. Der Funktionsumfang ist überschaubar und gut auf die Erstellung von Skizzen abgestimmt. Balsamiq eignet sich sehr gut, um Wireframes schnell und einfach in eine digitale Version zu bringen. Die mitgelieferten Schablonen sehen wie von Hand gezeichnete Skizzen aus. Das ist hilfreich, da zu realitätsnahe Wireframes oft als Designvorschlag missinterpretiert werden.

Auf der Balsamiq-Website kann man das Tool kostenlos testen und einzelne Wireframes als PNG-Datei (mit Copyright-Hinweis) herunterladen. Wer Balsamiq Mockup regelmäßig einsetzt, sollte zur kostenpflichtigen Desktopversion greifen. Eine gehostete Version ist in Planung. Außerdem lässt sich Balsamiq Mockup in externe Wiki- und Projektmanagement-Tools wie Confluence, JIRA oder XWiki integrieren, da es auf XML-Daten basiert.

Omnigraffle Pro 5 [2] eignet sich besonders gut, um schnell Wireframes, Prozessdiagramme oder Sitemaps zu erstellen. Hilfreich dabei ist, ähnlich wie in Photoshop, die Möglichkeit, Ebenen zu verwenden. So lassen sich gemeinsame Ebenen und Master-Ebenen anlegen, um den Wireframes eine gewisse Konsistenz zu geben. Ein weiterer Vorteil von Omnigraffle ist das einfache Einbinden von Schablonen. Auf diese Weise lassen sich die Wireframes problemlos an die eigene Corporate-Identity anpassen. Im Internet findet man umfangreiche Sammlungen mit den verschiedensten Schablonen, zum Beispiel für Facebook- oder iPhone-Apps, Ajax-Elemente, Werbebanner-Formate oder Elemente von Social-Media-Websites (eine gute Quelle ist http://graffletopia.com/).

Um interaktive Prototypen zu erstellen, lassen sich Elemente mit Interaktionen belegen. Diese werden beim PDF-Export übernommen. Die so erstellten Klickpfade geben einen Eindruck der späteren Funktion, sind allerdings kein Ersatz für einen HTML-Prototypen.

Im Gegensatz zu Omnigraffle verfügt Axure [3] über umfangreiche Möglichkeiten, um Prototypen zu erstellen. Die in den Wireframes eingesetzten Elemente lassen sich mit einfachen HTML- und JavaScript-Aktionen belegen. Nach dem Export hat man einen funktionstüchtigen Prototypen, der sich hervorragend dazu eignet, einen Eindruck der späteren Webseite zu geben. Auch für Nutzertests während der Konzeptphase sind solche Prototypen eine gute Alternative zu komplett programmierten Klickdummies.

Darüber hinaus verfügt Axure über eine Funktion, Fußnoten und Erklärungen einzufügen, mit deren Hilfe man direkt aus Axure heraus Konzeptdokumente im Word-Format exportieren kann. Auch in Axure ist es möglich, benutzerdefinierte Schablonen und Mastervorlagen einzubinden. Ein Hinweis für alle Mac-User: Axure für den Mac befindet sich zurzeit in der Entwicklung [4].

Firefox Pencil [5] basiert auf der Geckoengine des Webbrowsers Firefox und lässt sich
problemlos als Addon installieren. Damit eignet es sich sehr gut für schnelle Skizzen und ist plattformunabhängig einsetzbar. Die fertigen Wireframes lassen sich in das PNG-Format exportieren und weiterverarbeiten. Zwar ist die Benutzung des Tools etwas gewöhnungsbedürftig, da einige der gängigen Tastaturkürzel nicht unterstützt werden, dennoch ist es eine interessante, kostenlose Alternative für die Erstellung von Wireframes.

Das noch in der Entwicklung befindliche Tool [6] aus dem Hause Adobe macht bereits in der Betaphase einen soliden Eindruck. Es kann Photoshop- und Illustratordateien importieren und interaktiv verarbeiten. Elemente, die im Design erstellt wurden, sind frei konfigurierbar und es lassen sich interaktive Verhaltensweisen festlegen. Das funktioniert mit allen erstellten Elementen, eine Scrollbar kann  beispielsweise tatsächlich den nebenstehenden Text scrollen. Rollover-, Fade- und Slideeffekte sind ebenso möglich wie Eingabe- und Auswahlmöglichkeiten. FlashCatalyst eignet sich sehr gut für die Erstellung von Prototypen mit komplexeren Animationen, für statische Wireframes ist es nur bedingt geeignet.

Die Tools im Überblick

Omnigraffle: nur für Mac verfügbar, Preis: 199 US-Dollar Pencil: Firefox-Extension, kostenlos Adobe Flash Catalyst: momentan noch Beta Balsamiq Mockups: Webanwendung (Trial-Mode), Preis: 79 US-Dollar (Desktop-Anwendung) Axure: nur für Windows verfügbar, Preis: 589 US-Dollar

Es gibt mittlerweile eine Fülle an guten Tools für alle Plattformen und in allen Preisklassen, mit denen man statische Wireframes und klickbare Prototypen erstellen kann. Eine übersichtliche Zusammenfassung weiterer Tools hat der Designexperte Dan Harrelson in seinem Blog veröffentlicht [7].