Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

Prototyping: 5 Online Tools für Dein UX-Design

Eine optimale User-Experience kann nur in Zusammenarbeit mit Benutzern und Tests gewährleistet werden. Je später die Test-Prozesse eingeleitet werden, umso aufwändiger und kostspieliger werden die Anpassungen des Endprodukts im Endeffekt ausfallen. Mit diesen 5 Tools kannst Du bereits in der Entwurfspahse Deiner App oder Website wichtiges Feedback einholen.

POP - Prototyping on paper

pop_prototyping-tool

POP ist eine mobile App für Android und iOS, mit der handgemachte Entwürfe eingescannt werden können. POP sorgt dafür, dass Helligkeit und Kontrast der Fotos auf ein Level gebracht werden.  Anschließend kann eine interaktive Simulation erstellt zum Einholen von Feedback geteilt werden.

Moqups - Webseiten online entwerfen und testen

moqups_prototyping-tool

 

Moqups ist eine WebApp, mit der man Entwürfe für Webseiten schnell und unkompliziert realisieren kann. Aus einer Auswahl von über 60 Vektor-Schablonen können schnell Layouts entstehen und exportiert werden. Durch Drag&Drop kann die jeweilige Schablone auf die Arbeitsfläche gezogen und dort weiter verarbeitet werden. Moqups bietet die Möglichkeit die Entwürfe projektbezogen und mit Unterseiten zu organisieren. Diese können als PDF, PNG oder interaktive Online Präsentation mit funktionierenden Verknüpfungen unter den Unterseiten ausgegeben und per eMail geteilt werden.

Solidify - Online Tests und Feedback

solidify_prototyping-tool

Solidify ist ein Tool, mit dem klickbare Prototypen für userorientierte Tests erstellt werden können. Mit Hotspots können klickbare Prototypen erstellt und mit einander verbunden werden. Test-User können im Anschluss einzelne Seiten oder den gesamten Prototypen bewerten und Feedback geben. Neben allgemeinen Bewertungen können Ziele für Besucher der Seite definiert werden, sodass bereits in einem frühen Stadium ersichtlich wird, ob der Entwurf benutzerfreundlich ist, oder nachgebessert werden muss. Tester können über das Internet live beobachtet oder für spätere Analysen aufgezeichnet werden.

Invision - Prototypen präsentieren und Feedback sammeln

invision_prototyping-tool

Invision vereinfacht die Arbeit mit Prototypen und vereinfacht die Arbeit zwischen Designern und Entscheidungsträgern indem es eine zentrale Plattform zur Präsentation und Diskussion bietet. Entwürfe können hochgeladen, bewertet und kommentiert werden. Außerdem können mit Hotspots interaktive Entwürfe realisiert werden um möglichst früh erste Usability Insights zu bekommen.

Proto.io - Realistisches App-Prototyping

proto.io_prototyping-tool

Mit proto.io können realitätsnahe Prototypen innerhalb von Minuten zusammengestellt werden. Nach der Auswahl eines Gerätes können vorgefertigte UI-Komponenten per Drag&Drop zusammengefügt und emuliert werden. Porto.io emuliert interaktive Touch-Gesten, Screen Transitions, Animationen und sogar den Wechsel vom Hochformat ins Querformat. Die Prototypen können dann im Browser oder auf dem Endgerät, wie eine echte App, getestet werden.

Weiterführende Links

Bitte beachte unsere Community-Richtlinien

4 Reaktionen
EmaJohnson

Habe einen tollen Artikel gefunden, vielleicht gefällt er euch auch so wie mir

http://blog.mwaysolutions.com/2014/02/21/agile-ux-design-creative-ux-strategy-in-action-ii/#more-878

Antworten
Catriona

Interessante Liste. Pidoco ist eine alternative Prototyping Tool mit der man Prototypen von Apps auf mobile Geräten testen kann. Wir haben auch einen Free Trial.

http://www.heise.de/newsticker/meldung/Web-Prototyping-plus-Usability-Tests-1818278.html

Antworten
Peter Paul

:D und hier der t3n Artikel zu jetstrap ;)

https://t3n.de/news/jetstrap-praktisches-417738/

Antworten
Peter Paul

jetstrap.com ist definitiv auch ein Blick wert. Es ist nutzbar um Mockups zu erstellen, die dann anschließend gleich zum Umsetzen des Projekts dienen können. CSS und HTML wird dank Bootstrap gleich mitgeliefert und kann ggf. live angepasst werden.

Leider kann unter der Free license nur ein relativ "kleiner" Prototyp erstellt werden. Vielleicht wird hier noch einmal nachgebessert. Um ein fundierten Eindruck (neu Denglisch Experience ;-) für das Endprodukt zu erhalten unschlagbar.

Antworten

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

Abbrechen

Finde einen Job, den du liebst