Wireframes erstellen leicht gemacht

Fünf Mockup-Tools im Test

wireframe - mockup

Wer seine Websites schon früh, also in der Konzentrationsphase visualisieren will, braucht ein Mockup-Tool. Diese Tools sind die gute Alternative zu Stift und Zettel, um Websites zu designen. Hier kann man auf zahlreichen nützlichen Funktionen zugreifen und die eigene Site professionell designen.

Doch welche sind die Besten Tools und wie viel kosten Sie?

Balsamiq Mockup
In diesem Tool sehen die Elemente, mit denen man die Site gestalten kann, wie von Hand gezeichnet aus. Das bietet eine gute Übersicht und eine hohe Professionalität.
Die Anwendung ist in Adobe Flex geschrieben und soll dabei helfen eine Skizze und verschiedene Wireframes zu erstellen. Auch die Handhabung ist mit diesem Tool sehr unkompliziert. Zwar gibt es reichlich Funktionen, diese sind jedoch gut überschaubar und auf die Erstellung von unterschiedlichsten Skizzen abgepasst. Mit Balsamiq kann man die erstellten Skizzen unkompliziert und schnell eine digitale Version bringen.

Durch die handgezeichneten Schablonen entfällt die Missinterpretation als Designvorschlag.

Auf der Website des Programmes ist es möglich, das Tool kostenfrei zu testen und so zu schauen, ob dies dem Gesuchtem entspricht.

Wer jedoch dieses Mockup öfters nutzen möchte, sollte es sich für nur 79 US-Dollar kaufen. Auch eine gehostete Version soll es bald geben.

Omnigraffle
Das Besondere an diesem Tool ist, dass es, wie es sie auch in Photoshop und diversen anderen Bildbearbeitungsprogrammen gibt, Ebenen verwendet. Hier ist es möglich, Master-Ebenen und gemeinsame Ebenen anzulegen. So erhält die Site später eine überschaubare Konsistenz. Auch hier lassen sich unterschiedliche Schablonen nutzen, um die Gestaltung um einiges einfacher zu machen. Diese kann man kostenlos online herunterladen.

Die Wireframes lassen sich optimal an eine eigene Corporate-Identity angleichen.

Allerdings läuft dieses Tool ausschließlich auf dem Mac und kostet 199 US-Dollar.

Axure
In diesem Tool ist es möglich, verschiedene Bereiche einer Website mit JavaScript- und HTML-Aktionen zu belegen. So erstellt man schnell und einfach einen klickfähigen Prototypen.
Hier gibt es verschiedene Möglichkeiten diesen zu erstellen. Ganz anders als bei Omnigraffle, bei dem man nur auf eine Art einen Prototypen erstellen kann, verfügt Axure über Fußnoten, Erklärungen und Funktionen, die dabei helfen, die Konzeptdokumente in einem Word-Format zu exportieren. Zudem kann man bei diesem Tool verschiedene nutzerdefinierte Mustervorlagen und Schablonen einfügen. Axure gibt es noch nicht für den Mac, ist aber in Entwicklung.

Das Tool ist nur für Windows kompatibel und eines der teueren Varianten.

Der Preis liegt momentan bei 589 US-Dollar.

Pencil
Auch wenn es wie eine eigenständige Anwendung aussieht, läuft das Tool im Browser.
Pencil ist sehr unkompliziert und lässt sich leicht als Add-on installieren. Auch die Anwendungen funktionieren problemlos. Das Tool ist plattformunabhängig einsetzbar und eignet sich perfekt zum Erstellen von schnellen Skizzen. Fertige Wireframes können in ein PGN-Format exportiert und daraufhin weiterverarbeitet werden. Das Pencil-Tool wird für einige jedoch ein wenig gewöhnungsbedürftig sein, da es manche der bekannten Tastenkürzel nicht unterstützt, dennoch ist das kostenlose Programm eine tolle und interessante Alternative zu seinen oftmals teuren Verwandten.

Adobe FlashCatalyst
Trotz, dass das Tool noch nicht vollständig entwickelt ist und momentan erst in der Beta-Phase steckt, ist es schon jetzt sehr beliebt und solide.

Illustratoren- und Photoshopdateien können importiert und verarbeitet, verschiedene Elemente, die von dem Nutzer erstellt wurden, können frei konfiguriert und eine Vielzahl von Verhaltensweisen festgelegt werden. Die Elemente sind einwandfrei und funktionieren uneingeschränkt. So ist es beispielsweise wirklich möglich, mit einer Scrollbar einen Text zu scrollen. Auch Fade-, Slide- und Rollovereffekte sind möglich. Das Tool eignet sich deshalb sehr gut für die Erstellung von Skizzen mit vielen Animationen, jedoch kaum für statistische Wireframes.