Anzeige
Anzeige
Ratgeber
Artikel merken

Software für UX-Designer: Die 5 besten Prototyping-Tools im Vergleich

Statische Wireframes und Designs reichen inzwischen nicht mehr aus, um Anwendungen zu gestalten. Mit Prototyping-Tools können UX-Designer ihre Ideen interaktiv simulieren.

7 Min. Lesezeit
Anzeige
Anzeige

(Bild: Shutterstock / Rawpixel.com)

Prototyping-Tools können das Design einer Idee verständlich machen, Nutzertests erleichtern,
Stakeholder überzeugen und den Entwicklern die Anforderungen erklären. Die Wahl des richtigen Tools ist jedoch nicht einfach, da der Markt unübersichtlich ist und jedes Tool seine eigenen Stärken und Schwächen besitzt. Neben Software für interaktive Prototypen gibt es viele verwandte Tools, die diese Bedingungen nicht erfüllen. Der Artikel behandelt daher keine Wireframing-Tools, die keine Interaktivität erlauben, wie etwa Balsamiq, Mockingbird und Moqups, ebenso keine einfachen Prototyping-Tools, die nur Bilder verlinken können, wie etwa Invision ​oder Pixate.

Anzeige
Anzeige

Stattdessen starten wir mit einem Prototyping-Allrounder, der inzwischen eine stattliche Nutzer- und Fangemeinde aufgebaut hat.

Axure

Was Photoshop für Visual Designer ist, stellt Axure ​für UX-Designer dar. Unternehmen setzen in ihren Stellenanzeigen inzwischen häufig eine Kenntnis des Programms voraus – und bauen damit auf den Klassiker: Bereits seit 2003 gibt es das bewährte Prototyping-Tool, aktuell in der siebten Version.

Anzeige
Anzeige
Notizfelder, Spezifikationsdokumente und Daten in Variablen: Die Benutzeroberfläche von Axure ist recht komplex.

Notizfelder, Spezifikationsdokumente und Daten in Variablen: Die Benutzeroberfläche von Axure ist recht komplex.

Ein großer Vorteil von Axure ist, dass der Nutzer fast alles gestalten kann: Von handgezeichnet aussehenden, groben Wireframes bis zu sehr komplexen interaktiven Prototypen ist alles machbar. Durch die vielen Möglichkeiten ist die Benutzeroberfläche recht komplex, eine steile Lernkurve ist aber garantiert. Wegen der hohen Verbreitung des Tools gibt es eine sehr aktive Community, die sich im offiziellen Axure-Forum und auf Events austauscht und erfahrungsgemäß sehr hilfsbereit ist. Auch Kurse, offline und online, sowie Tutorials und Bibliotheken mit vorgefertigten Elementen sind in Massen vorhanden.Axure bietet jede Menge, gerade bei fortgeschrittenen Funktionen:

Anzeige
Anzeige
  • Der Nutzer kann die Prototypen mit detaillierten und konfigurierbaren Notizfeldern versehen, aus denen er dann Spezifikationsdokumente generieren kann.
  • Das Tool kann Daten in Variablen speichern und so Informationen im Prototypen von Seite zu Seite transferieren. Da Axure mit einer abgespeckten jQuery-Bibliothek arbeitet, sind auch sehr komplexe Berechnungen und Modifikationen von Daten möglich.
  • Von den hier beschriebenen Prototyping-Tools bietet Axure die beste Umsetzung von Responsive Design. Der Nutzer kann beliebige Breakpoints definieren, wobei alle Elemente vererbt oder auch modifiziert werden können. Wirklich „fluid“ ist die Anpassung jedoch leider nicht, sie ist nur schrittweise möglich.

Auch Teams können mit Axure gemeinsam an Prototypen arbeiten. Dies funktioniert über eine Versionierung per SVN-Server, ist also leider nicht ganz einfach. Prototypen öffentlich zu teilen dagegen schon. Das funktioniert über die Cloud-Plattform AxShare. Die Teammitglieder können die einzelnen Seiten kommentieren, jedoch keine Markierungen hinzufügen. Die Kollaborationsfunktionen sind somit bei Axure nicht so gut umgesetzt wie in anderen Prototyping-Tools.

Ein weiter Nachteil ist, dass die Standard-Bibliotheken nicht gerade umfangreich sind. Sie beschränken sich auf einfache geometrische Formen, Formularelemente sowie Überschriften und Texte. Für erfahrene Nutzer ist das kein Problem, da es viele Bibliotheken im Internet gibt und die meisten Unternehmen eigene Bibliotheken entsprechend des Corporate Designs anlegen. Als Anfänger kommt man aber mit anderen Programmen sehr viel schneller zu einem ersten eigenen Prototypen.

Anzeige
Anzeige

Sehr bald, wahrscheinlich schon vor Erscheinen dieses Artikels, soll die neue Version 8 veröffentlicht werden. Diese verspricht unter anderem eine Vereinfachung der Benutzeroberfläche und eine bessere Team-Kollaboration direkt über AxShare.

In der Standard-Version kostet Axure 289 US-Dollar pro Einzelnutzer-Lizenz, die Pro-Version mit Spezifikationen und Team-Features schlägt mit 589 US-Dollar zu Buche.

Justinmind

Am besten mit Axure vergleichbar ist Justinmind. Auch bei diesem Tool handelt es sich um eine Standalone-Software. Sie ist nicht webbasiert und bietet sehr fortgeschrittene Features.

Anzeige
Anzeige

Die Dokumentationsmöglichkeiten gehen sogar noch weiter als bei Axure: Der Nutzer kann nicht nur Notizen verfassen und Spezifikationen exportieren, sondern sogar Requirements dokumentieren. Auch Flowcharts und Sitemaps kann er – wie auch bei Axure – erstellen.

Die Oberhand hat Justinmind auch, sobald der Prototyp möglichst realistisch mit Daten arbeiten soll. Das Programm kann im Hintergrund Datenbanken anlegen, die dann von speziellen Listen- und Grid-Elementen automatisch angezeigt werden.

Unschlagbar bei der Verarbeitung von Daten: Justinmind legt im Hintergrund Datenbanken an.

Unschlagbar bei der Verarbeitung von Daten: Justinmind legt im Hintergrund Datenbanken an.

Justinmind bietet auch direkt gerätespezifische Bibliotheken mit ausgestalteten Elementen, um den Start ins Prototyping zu vereinfachen. Spannend sind auch die Elemente für Parallax-Effekte: In anderen Tools lassen sich diese zwar auch umsetzen, aber wesentlich mühsamer. Die Team-Funktionen ähneln denen von Axure stark, zum Beispiel in der gemeinsamen Arbeit an einem Prototypen über eine Versionierung, dem öffentlichen Teilen und der Kommentarfunktion. Im Detail sind sie aber meist besser und einfacher umgesetzt. Der größte Nachteil an Justinmind: Die Möglichkeiten für fortgeschrittene Interaktivität sind in der Handhabung meist mühsamer als in Axure. Die Bearbeitung der Interaktionen gerade mit verschiedenen Bedingungen ist eher unübersichtlich.

Anzeige
Anzeige

Einzelnutzer-Lizenzen gibt es entweder für 19 US-Dollar pro Monat oder für einmalig 495 US-Dollar. Preise für Enterprise-Pakete teilt Justinmind auf Anfrage mit.

proto.io

Anders als Axure und Justinmind ist Proto.io ein webbasiertes Tool, mit allen Vor- und Nachteilen: Die
Einrichtung geht schnell und erfordert keinen IT-Support, jedoch ist die Nutzung
nur online möglich und nicht ganz so reibungslos wie bei nativer
Software.

Proto.io ist stark auf Mobile ausgerichtet und nur online verfügbar. Das Tool kann Screens mit mehreren Zuständen versehen und zwischen ihnen wechseln.

Proto.io ist stark auf Mobile ausgerichtet und nur online verfügbar. Das Tool kann Screens mit mehreren Zuständen versehen und zwischen ihnen wechseln.

Proto.io unterstützt zwar prinzipiell auch andere Prototypen, ist aber eigentlich sehr stark auf Mobile ausgelegt. So gibt es viele Bibliotheken mit vorgefertigten Elementen für iOS, Android und Windows
Phone. Die unterstützten Touch-Gesten sind so umfangreich wie bei keinem anderen Prototyping-Tool.Die Stärke von proto.io liegt in der Möglichkeit, Screens mit mehreren Zuständen zu versehen und animiert zwischen diesen Zuständen zu wechseln. Diese Überblendeffekte sind einfacher und besser als bei allen Konkurrenzprodukten über einen Zeitstrahl einstellbar.

Anzeige
Anzeige

Ein weiterer Clou ist der direkte Import aus Photoshop und Sketch. Alle Ebenen bleiben dabei erhalten, der Nutzer kann dadurch mit proto.io ein vorhandenes Design sehr schnell interaktiv gestalten. In Tools wie Axure und Justinmind dauert das deutlich länger. Die Möglichkeiten für Interaktivität sind durchaus umfangreich und umfassen auch die Nutzung von Variablen. Leider fehlen bedingte Interaktionen, der Nutzer wird hier auf Grenzen stoßen. Prototypen können wie bei allen Tools üblich öffentlich geteilt und kommentiert werden.

Die Kosten für proto.io starten bei 24 US-Dollar pro Monat für Freelancer und steigen mit der Anzahl der Nutzer und aktiven Projekte. Studenten und nichtkommerzielle Organisationen erhalten Rabatte.

UXPin

Auch UXPin ist ein webbasiertes Prototyping-Tool, bei dem aber der Fokus auf Team-Kollaboration und dem Design-Prozess liegt.

Anzeige
Anzeige

Bei der Interaktivität bietet UXPin die gewohnten Basics: Elemente einblenden und bewegen, zwischen verschiedenen Zuständen eines Elements wechseln und Formularelemente modifizieren. Darüber hinaus hören die Möglichkeiten aber auch schnell auf, wirklich komplexe Prototypen sind nicht möglich.

Dafür ist UXPin insgesamt sehr einsteigerfreundlich mit einer sehr guten Benutzeroberfläche, umfangreichen Bibliotheken sowie vielen Beispielen, Tutorials und Hilfestellungen. Selbst einige eBooks mit allgemeinen Design-Themen gibt es auf der Website von UXPin. Hier zeigt sich, dass UXPin mehr als eine reine Prototyping-Software sein will.

Eine weitere Stärke von UXPin ist die Team-Kollaboration. Prototypen können gleichzeitig live bearbeitet werden, und auch das Veröffentlichen, Kommentieren und Präsentieren ist sehr gut umgesetzt.

Anzeige
Anzeige
Teamarbeit wird bei UXPin groß geschrieben: Jeder kann den Prototypen live bearbeiten, veröffentlichen, kommentieren und präsentieren. Richtig komplexe Ideen lassen sich aber kaum umsetzen.

Teamarbeit wird bei UXPin groß geschrieben: Jeder kann den Prototypen live bearbeiten, veröffentlichen, kommentieren und präsentieren. Richtig komplexe Ideen lassen sich aber kaum umsetzen.

Die Kollaboration geht dabei über reine Designs und Prototypen hinaus: UXPin unterstützt auch rudimentäres Projektmanagement, die Erstellung von anderen Dokumenten wie Personas oder
Business-Model-Canvas-Formularen sowie den Upload von beliebigen weiteren Dateien, etwa Requirements oder Spezifikationen. Genauso wie in proto.io können in UXPin auch Photoshop- und Sketch-Designs mit allen Ebenen importiert werden.

Die Nutzung von UXPin kostet Nutzer monatlich mindestens 19 US-Dollar. Je nach gewünschtem Feature-Umfang wird auch eine höhere Rate fällig.

HotGloo

Eher an Einsteiger richtet sich das webbasierte Prototyping-Tool HotGloo. Grafisch detaillierte Designs liegen nicht im Fokus dieser Software, sondern eher Low-Fidelity-Prototypen, die aber trotzdem interaktiv sein können.

Simples und übersichtliches Design: Das webbasierte Tool HotGloo ist vor allem etwas für Einsteiger.

Prototyping simpel und übersichtlich: Das webbasierte Tool HotGloo ist vor allem etwas für Einsteiger.

Alle vorgefertigten Elemente in der Bibliothek sind schwarz-weiß und sehr simpel gestaltet. Das Design der Elemente lässt sich zwar anpassen, jedoch nicht in gleichem Maße wie mit den anderen Tools. Dafür enthält die Bibliothek schon Elemente mit integrierter Interaktivität, etwa Akkordeons und Navigationsleisten. Einfache dynamische Prototypen können so schnell erstellt werden. Auch weiterführende Interaktionen sind möglich, aber ähnlich wie bei UXPin auf Grundlegendes beschränkt. Variablen und Bedingungen unterstützt die Software nicht. Leider ist der Editor für Interaktionen nicht gut umgesetzt. Zudem werden keine Touch-Gesten unterstützt, für mobile Prototypen scheidet HotGloo damit quasi aus.

HotGloo kostet je nach Anzahl der aktiven Projekte und Nutzer zwischen zwölf und 49 Euro pro Monat.

Fazit: Für jeden das richtige Prototyping-Tool

Das eine, beste Prototyping-Tool gibt es nicht, denn jedes hat seine Vor- und Nachteile. Welches also geeignet ist, kommt ganz auf die eigenen Anforderungen an:

  • Arbeite ich allein oder im Team an den Prototypen?
  • Welche Art von Anwendungen will ich erstellen?
  • Wie sieht mein sonstiger Workflow aus, in den das Tool integriert wird?
  • Wie komplex sind die Interaktionen? Werden Variablen und Bedingungen benötigt?

Vor der Auswahl sollte man die verschiedenen Prototyping-Tools gründlich ausprobieren. Alle hier beschriebenen Tools bieten kostenlose Trial-Versionen mit vollem Funktionsumfang. Ob man wirklich gut mit einer Software klarkommt, lässt sich schließlich nicht nur anhand einer Featureliste bewerten.

Die professionellsten Tools sind eindeutig Axure und Justinmind. Sie eignen sich besonders für sehr umfangreiche Prototypen. Justinmind hat bei Datenbanken, Team-Kollaboration und den Bibliotheken einen leichten Vorsprung, während Axure bei komplexen Interaktionen und mit seiner Community punktet. Die anderen drei Prototyping-Tools füllen jeweils eine eigene Nische:

  • Proto.io ist perfekt für mobile Prototypen mit Animationen.
  • UXPin ist die beste Wahl für Team-Kollaboration und um ganze Design-Projekte zu managen.
  • HotGloo ist gerade für Einsteiger geeignet, die Prototypen ohne grafisch perfektes Design erstellen möchten.

Wer häufiger aus vorhandenen Photoshop- oder Sketch-Designs einen interaktiven Prototypen erstellen will, sollte sich unbedingt proto.io und UXPin näher anschauen. Sie bieten als einzige Tools einen zeitsparenden Import.

Mehr zu diesem Thema
Fast fertig!

Bitte klicke auf den Link in der Bestätigungsmail, um deine Anmeldung abzuschließen.

Du willst noch weitere Infos zum Newsletter? Jetzt mehr erfahren

Anzeige
Anzeige
Ein Kommentar
Bitte beachte unsere Community-Richtlinien

Wir freuen uns über kontroverse Diskussionen, die gerne auch mal hitzig geführt werden dürfen. Beleidigende, grob anstößige, rassistische und strafrechtlich relevante Äußerungen und Beiträge tolerieren wir nicht. Bitte achte darauf, dass du keine Texte veröffentlichst, für die du keine ausdrückliche Erlaubnis des Urhebers hast. Ebenfalls nicht erlaubt ist der Missbrauch der Webangebote unter t3n.de als Werbeplattform. Die Nennung von Produktnamen, Herstellern, Dienstleistern und Websites ist nur dann zulässig, wenn damit nicht vorrangig der Zweck der Werbung verfolgt wird. Wir behalten uns vor, Beiträge, die diese Regeln verletzen, zu löschen und Accounts zeitweilig oder auf Dauer zu sperren.

Trotz all dieser notwendigen Regeln: Diskutiere kontrovers, sage anderen deine Meinung, trage mit weiterführenden Informationen zum Wissensaustausch bei, aber bleibe dabei fair und respektiere die Meinung anderer. Wir wünschen Dir viel Spaß mit den Webangeboten von t3n und freuen uns auf spannende Beiträge.

Dein t3n-Team

Hannes

Da beide Links auf HotGloo in dem Artikel falsch verlinkt sind und ins Leere führen möchte ich darauf hinweisen, dass der Link https://www.hotgloo.com ist :-)

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.

Bitte schalte deinen Adblocker für t3n.de aus!
Hallo und herzlich willkommen bei t3n!

Bitte schalte deinen Adblocker für t3n.de aus, um diesen Artikel zu lesen.

Wir sind ein unabhängiger Publisher mit einem Team von mehr als 75 fantastischen Menschen, aber ohne riesigen Konzern im Rücken. Banner und ähnliche Werbemittel sind für unsere Finanzierung sehr wichtig.

Schon jetzt und im Namen der gesamten t3n-Crew: vielen Dank für deine Unterstützung! 🙌

Deine t3n-Crew

Anleitung zur Deaktivierung
Artikel merken

Bitte melde dich an, um diesen Artikel in deiner persönlichen Merkliste auf t3n zu speichern.

Jetzt registrieren und merken

Du hast schon einen t3n-Account? Hier anmelden

oder
Auf Mastodon teilen

Gib die URL deiner Mastodon-Instanz ein, um den Artikel zu teilen.

Anzeige
Anzeige