Blog

TOP 7 Prototyping-Tools für UI & UX-Designer im Jahr 2020

Von Serhiy Khvashchuk · · Keine Kommentare

Wenn es um Prototyping geht, kann es sehr schwierig sein, schnell die richtigen Tools zu finden. Es kann viel Zeit und Mühe kosten, um die gewünschten Ergebnisse zu erhalten, und die Erfahrung ist mehr als interessant, weil davon. Aber du musst dich fragen: Wie können Prototyping-Tools dir helfen und welche sind einige der besten in der Branche? Hier findest du eine gute, kreative Liste mit einigen der besten auf dem Markt.

Wenn du dich für hochwertiges Prototyping entscheidest, dann solltest du immer alle neuesten Tools ausprobieren. Neue Produkte erscheinen ständig auf dem Markt, daher kann das Finden der richtigen dir langfristig sehr hilfreich sein. Sobald du das tust, wirst du feststellen, dass die Ergebnisse mehr als in Ordnung sein können.

Figma

https://www.figma.com/

Figma-Prototyping-App
Quelle

Der Grund, warum Figma in diese Liste aufgenommen wurde, ist, dass es dir erlaubt, zu designen, zu prototypen und Feedback in einem einzigen Ort zu erhalten. Nicht nur das, sondern es ist auf den meisten Plattformen ohne Probleme verfügbar. Du kannst den Prototyp vor Ort erstellen und leicht einige schöne Funktionen nutzen, die dir gefallen.

Da alles browserbasiert ist, musst du dich nicht Sorgen um die Unfähigkeit, die neuesten Versionen zu erhalten. Du kannst auch den aktuellen Prototyp studieren und ihn mit anderen bereits verfügbaren vergleichen. Es gibt eine einzige Wahrheitsquelle für Design-Dateien und alles wird visuell durchgeführt. Die Ergebnisse sind großartig deshalb, und es zeigt, dass die Erfahrung noch besser wird mit Hilfe dieses Tools.

Ihre Leinwand erlaubt dir auch, den Prozess kollaborativ durchzuführen. Du kannst sogar in Echtzeit Kommentare zum Design abgeben, was die gesamte Erfahrung viel lohnenswerter und interessanter als erwartet machen kann.

Vorteile:

  • Kollaboratives Prototyping
  • Du kannst dich mit deinem Team verbinden und Änderungen vor Ort vornehmen
  • Kostenlos für 3 Projekte
  • Einfache zu bedienende Oberfläche.

Nachteile:

  • Keine Downloads, keine Kontrolle darüber, welche Version du verwenden kannst
  • Speicherungen werden automatisch durchgeführt, manchmal können einige Änderungen verloren gehen

Invision

https://www.invisionapp.com/

Vielleicht das Beste an der Invision-App ist, dass sie dir erlaubt, schnell großartige Designs zu erstellen und mit einem enormen Fokus auf Bequemlichkeit. Der Wert kann mehr als in Ordnung sein, und das Ergebnis wird äußerst interessant sein, weil davon.

Invision-App-Prototyping

Dank dieser Plattform kannst du schnell Prototypen erstellen und dir leicht einen funktionierenden Prototyp zeigen, ohne viel Zeit damit zu verbringen. Das ist großartig für freiberufliche UI- und UX-Designer, die eine gute Reputation im Online-Welt aufbauen wollen. Es gibt zahlreiche Funktionen und Möglichkeiten hier, aber die Erfahrung allein kann schon ziemlich interessant sein.

Sie haben auch Slack-Integration, einbettbare Prototypen, automatische Synchronisierung und andere großartige Funktionen hinzugefügt. All diese Dinge strahlen sehr stark und die gesamte Erfahrung kann als Ganzes ziemlich interessant sein!

Vorteile:

  • JIRA- und Slack-Integration
  • Einbettbare Prototypen
  • Projektmanagement-Funktionen
  • Automatische Synchronisierung
  • Versionshistorie

Nachteile:

  • Es ist nicht so umfassend wie andere Tools
  • Ein wenig herausfordernd beim ersten Lernen

UXPin

https://www.uxpin.com/

UXPin-Prototyping-App

UXPin hat möglicherweise nicht die beste Oberfläche auf dem Markt, aber es strahlt, weil es die Funktionen liefert, die du willst und du sie nutzen kannst, wie du es siehst. Dies ist ein großartiges Tool für Leute, die nur ziehen und ablegen zum Prototypen möchten. Es ist auch voller Bibliotheken, die du leicht verwenden kannst, um die Designs hervorzuheben. Das bedeutet, dass du deine Assets einfach nutzen kannst, um Wireframes und Prototypen mit wenig oder keinem Aufwand zu erstellen.

Du kannst UXPin sowohl für mobile als auch für Desktop-Prototyping verwenden. Die Erfahrung wird dadurch sehr gut, und der Wert kann wirklich erstaunlich sein, allein deshalb. Es wird dir sicherlich helfen, zahlreiche Elemente zu jeder Interaktion hinzuzufügen, und sie haben sogar ein Eye-Dropper-Tool. Das macht die Nutzung der App sehr bequem und einfach, genau das, was du brauchen könntest. Die Entwickler haben auch mehr als 80 kostenlose Icons hier hinzugefügt, alle davon können sowohl auf mobilen als auch auf Webplattformen verwendet werden!

Vorteile:

  • Mehr als 1000 Elemente zur Auswahl
  • Sketch- und Photoshop-Plugins
  • 80+ Icons
  • Unbegrenzte Elemente hinzufügen

Nachteile:

  • Es hat keine intuitive Oberfläche
  • Es dauert eine Weile, sich daran zu gewöhnen

Axure

https://www.axure.com/

Warum würdest du Axure verwenden? Der Hauptvorteil, den du aus diesem Tool erhalten kannst, ist, dass es sehr komplex und einfach anzupassen ist. Du bist frei, den Prototyp auf die gewünschte Art zu erstellen, da es eine Fülle von Optionen für dich gibt, aus denen du wählen kannst. Das macht den Prozess wirklich bequem, und der Wert allein kann sich tatsächlich in der langfristigen Perspektive sehr lohnen.

Axure-Prototyping-App

Im Gegensatz zu anderen Tools ist Axure ein vollständiges Lebenszyklus-Entwicklungstool. Es ist nicht nur auf Prototyping fokussiert, es ermöglicht dir auch, Diagrammfunktionen zu annotieren. Du kannst sogar dies für die Umsetzung deiner Ideen verwenden, und das Ergebnis kann mehr als in Ordnung sein.

Während einige ähnliche Tools ziemlich begrenzt sein können, leistet Axure eine sehr gute Arbeit bei der Bereitstellung der Möglichkeit, Prototypen zu erstellen und sogar verschiedene Testfälle auszuwählen. Alle diese sind datengesteuert und machen es dir leicht, den gewünschten Prototyp zu erstellen. Es funktioniert großartig und liefert einen erstaunlichen Wert für dein Geld, wenn du es verwendest. Die hier erstellten Prototypen sind sehr gut, weil sie echte Lebensszenarien widerspiegeln. Das ist sehr hilfreich und bringt den Sinn der Bequemlichkeit in den Vordergrund, die du benötigst.

Axure-gif-Prototyping-App

Vorteile:

  • Unterstützung für bedingte Abläufe und dynamischen Inhalt
  • Prototypen können über datengesteuerte Interaktionen erstellt werden
  • Sie können eine Kundenerlebniskarte (Customer Journey Map) erstellen
  • Echtzeit-Zusammenarbeit mit Benutzern

Nachteile:

  • Nicht ganz einfach zu bedienen für Einsteiger
  • Schwierig anpassbar

Concept.ly

http://concept.ly/

Conceptly-Prototyping-App

Eines der Dinge, die man über Concept.ly wissen sollte, ist, dass es Ihnen hilft, Mockups in Prototypen umzuwandeln. Obwohl es nicht das komplexeste Tool auf dem Markt ist, ist es das bequemste und das zählt ziemlich viel. Falls Sie der Typ von UX- oder UI-Designer sind, der gerne immer neue Ideen testet, kann dies für Sie passen. Ein weiterer Punkt: Sie können verschiedene Designversionen auf demselben Bildschirm vergleichen. Die Bequemlichkeit ist groß und der Wert kann mehr als in Ordnung sein, also sollten Sie das berücksichtigen.

Aber Sie müssen verstehen, dass Sie die Bildschirme nicht allein erstellen können. Sie müssen ein Mockup-Tool verwenden, um diese Bildschirme zu erstellen und dann können Sie sie in einen Prototyp umwandeln. Der Prozess ist sehr bequem und funktioniert meistens sehr gut. Sie müssen alles innerhalb des Tools importieren, damit der Prozess funktioniert.

Vorteile:

  • Sie dürfen Bilder beliebig miteinander verknüpfen
  • Das Erstellen von Hotspots ist einfach
  • Viele Feedback-Optionen
  • Seitenweise Vergleichsmöglichkeit

Nachteile:

  • Sie können die Bildschirme nicht erstellen, Sie müssen sie importieren
  • Ladezeiten können je nach Datei etwas lang sein

Webflow

https://webflow.com/

Webflow-Prototyping-App

Leute mögen Webflow, weil es eine umfassende und sehr benutzerfreundliche Plattform ist. Sein Schwerpunkt liegt auf dem Design, Testen, Prototyping und Launchen von Websites. Aber das Beste hierbei ist, dass Sie auch CMS- und Hosting-Funktionalität erhalten.

Im Grunde können Sie Webflow als Sandkasten betrachten, was die gesamte Erfahrung viel interessanter machen kann. Das arbeitet zu Ihrem eigenen Vorteil und am Ende kann das Projekt interessanter werden.

Sie können auch den generierten Code außerhalb dieses Tools exportieren. Wenn Sie möchten, können Sie ihn gerne in jedem Projekt verwenden. Ohne eine solche Einschränkung ist das großartig und zeigt die enorme Wertigkeit, die Sie von einem solchen Ansatz erhalten können. Sie haben auch die Mittel hinzugefügt, um Animationen und interaktive Elemente zu erstellen. Diese können ohne viel Code erstellt werden, was äußerst wichtig ist.

Vorteile:

  • Exportieren Sie generierten Code
  • Sie können Hunderte von Seiten gleichzeitig gestalten
  • Große Landing Page-Funktionalität
  • Hervorragende visuelle Oberfläche
  • Erstellen Sie Animationen und interaktive Elemente ohne Code zu schreiben.

Nachteile:

  • Zu komplex und nicht so leicht zu verstehen.
  • Es fehlen einige fortgeschrittene Funktionen, die andere Tools haben.

Mockup.io

https://mockup.io/about/

Mockup.io Prototyping-App 2

Das, was Mockup.io großartig macht, ist die Tatsache, dass es Prototyping nahtlos mit einem kollaborativen Ansatz kombiniert. Es ist schwer, Prototypen allein zu entwerfen, daher wird der Prozess so gestaltet, dass er viel einfacher und bequemer ist. Und ja, es funktioniert sehr gut, allein deshalb.

Mockup.io kann verwendet werden, um mehrere Prototypen zu erstellen und bietet Ihnen auch die Möglichkeit, diese mit dem Team oder Kunden zu teilen, um Feedback zu erhalten. Ja, Feedback kann in Echtzeit erlangt werden und Sie können daran arbeiten, ohne viel Aufwand zu betreiben.

Mockups können auch für Wearables und mobile Geräte erstellt werden. Das Dateimanagementsystem ist hier sehr gut und Sie haben auch dedizierte mobile Apps, falls Sie dies benötigen. Mockup.io hat auch seinen eigenen Weg, um statische Prototypen zu animieren, falls nötig.

Vorteile:

  • Erstellen Sie Mockups für Wearables und mobile Geräte
  • Stellar Datei-Management-System
  • Mobile Apps
  • UI-Testfunktionen
  • Animation und GIF-Erstellung

Nachteile:

  • Es erstellt keine komplexen Projekte
  • Die Oberfläche scheint begrenzt zu sein

Das sind die besten Prototyping-Tools, die Sie jetzt verwenden können. Wenn Sie Ihre Prototyping-Erlebnisse auf das nächste Niveau heben möchten, erwägen Sie, diese großartigen Tools auszuprobieren. Prüfen Sie ihre Vor- und Nachteile, identifizieren Sie, was Sie benötigen, und probieren Sie sie aus. Sie werden die Ergebnisse sicherlich mögen!

Weiterlesen: