Share
Moderne Technologie erfordert ein hohes Maß an Interaktivität: Die Navigationsleisten ändern sich mit dem Bildlaufort eines Benutzers, die Felder werden durch Klicken erweitert, um unterstützende Informationen anzuzeigen und auszublenden, Listen werden per Drag & Drop zur Neuordnung usw. verschoben. Designer müssen alle möglichen Benutzerinteraktionen berücksichtigen Erstellen Sie eine optimierte, intuitive Benutzererfahrung in ihren Produkten.
Das Teilen und Bereitstellen interaktiver Designs kann verschiedene Formate annehmen, je nachdem, was Sie erreichen wollen und an wen Sie liefern.
In diesem Beitrag werde ich Sie durch verschiedene Prototyping-Ansätze führen und beschreiben, in welchen Kontexten Sie jeweils einen auswählen würden. Letztendlich haben die verschiedenen im Folgenden beschriebenen Methoden drei Aspekte, die Sie bei der Entscheidung über die Route berücksichtigen sollten:
Ich werde Illustrationen verwenden, die die Stufen der einzelnen Prototyping-Methoden zeigen.
Das frühe Web war staatlich ausgerichtet: Durch Klicken auf einen Link gelangte ich zu einer anderen Seite mit einer Sammlung von Links, die mich zu nachfolgenden Seiten führten, und so weiter. Das Verständnis von Javascript war eine fortgeschrittene Fähigkeit, und es mussten noch Frameworks entwickelt werden, die die Verwendung der Sprache erleichtern. Daher waren interaktive Komponenten selten. Die statischen Leistungen der Designer entsprechen den Anforderungen dieser technologischen Produkte: Da es nur wenige interaktive, sich bewegende Komponenten gab, konnten die Designs effektiv durch statische Komponenten dargestellt werden, die in Photoshop, InDesign und anderen Drucklayoutwerkzeugen erstellt wurden.
Mit fortschreitender Technologie hat das Verständnis der Vorteile einer höheren Interaktivität bei der Benutzererfahrung dazu geführt, dass mehr Design der Benutzererfahrung von der Interaktion abhängt. Aufgrund der Natur statischer Entwurfswerkzeuge ist es jedoch schwierig, interaktive Gestaltungsideen darzustellen, da der Lieferumfang an interaktiven Komponenten fehlt. Letztendlich hat dies zur Verbreitung von Prototyping-Werkzeugen geführt, um interaktive Designkonzepte effektiver ausarbeiten zu können.
Prototypen weisen zwei Hauptvorteile auf, denen statische Ergebnisse fehlen:
Daher können sie ein sehr effektiver Mechanismus sein, um Designideen zu liefern.
Abhängig von der Projektstruktur und ihren Zielen können statische Ergebnisse - "Prototypen aus Papier" - jedoch immer noch effektiv im Entwurfsprozess sein. Wenn das Produkt durch eine zustandsbasierte Informationsarchitektur besser dargestellt wird, funktionieren statische Ergebnisse zum einen einwandfrei. Wenn die Teamstruktur viel Kommunikation zwischen Teams und einen äußerst agilen iterativen Entwicklungs- / Entwicklungsprozess bietet, können statische Ergebnisse effektiv sein. Bei der Festlegung des zu beginnenden Pfades sollten Sie die Kommunikationsstruktur der Organisation, die beteiligten Stakeholder und den erforderlichen Grad an Interaktivität im Endprodukt berücksichtigen, wenn Sie sich entscheiden, ob Sie mit statischen Modellen oder robusteren Prototypen fortfahren möchten.
Prototyping von PapierLow-Fidelity-Prototypen versuchen, die Lücke zwischen den Beschränkungen von statischen Comps und Wireframes zu schließen, und umfassen ein Ergebnis, das einige der interaktiven Designkonzepte veranschaulicht, jedoch die Verfeinerung eines Endprodukts nicht aufweist. Das visuelle Gestaltungssystem kann beispielsweise nicht vollständig konzeptualisiert sein, und der Designer kann wählen, Informationen in Schwarzweiß darzustellen, wobei er Platzhalter für den Inhalt verwendet, um eine vorgeschlagene Vision der Informationsarchitektur zu präsentieren.
Solche Ergebnisse sind bei Designern beliebt, die sich ganz und gar als UX-Überzeugung bezeichnen, da es weniger komfortabel sein kann, wie eine Informationsarchitektur in ein visuelles Design-System übersetzt wird. Diese Arten von Prototypen werden häufig von „visuell entworfenen“ statischen Komponenten begleitet, um das Endprodukt robuster darzustellen.
Umgekehrt können andere Prototypen mit geringer Vertrauensstufe zwar ein hohes Maß an visueller Designqualität aufweisen, es fehlt jedoch an robusten interaktiven Zuständen. Viele Prototyping-Tools ermöglichen es Designern, "Trefferbereiche", Hotspots, die den Benutzer auf eine andere Seite oder einen anderen Abschnitt des Designs bringen, einfach zu definieren. Dies ist für visuelle Designer hilfreich, da sie sich mehr auf das Erstellen der visuellen Aspekte einer Informationshierarchie konzentrieren können und ihre Designs später miteinander verknüpfen können, um den Benutzerfluss zu veranschaulichen. Die Schaffung robusterer und komplexerer Interaktionen ist jedoch in diesem Entwurfsprozess begrenzt.
Daher erfordern sowohl Protokolle als auch Prototypen aus Papier eine hohe Kommunikation zwischen Design, Entwicklung und den wichtigsten Interessengruppen, da die Ergebnisse lediglich eine Annäherung an das fertige Produkt sind. Entweder ist das visuelle oder interaktive Design-System unterrepräsentiert, und letztlich sind solche Ergebnisse mit denselben Risiken behaftet wie statische Kompositionen: Missverständnisse der Design-Ideen, die zu Entwicklungszeit führen, die Notwendigkeit, anspruchsvolle Ideen mündlich oder schriftlich darzustellen, Zeit in Meetings, in denen über unterrepräsentierte Designideen usw.
Ein weiteres potenzielles Problem ist die Überfragmentierung von Designideen, was zu einem schlecht konzipierten Design führen kann, dem die Einheit fehlt. So wie Organisationen gerne Verantwortung in verschiedene Rollen unterteilen (UI, UX, Visual, Interaction usw.), ist Design eine Disziplin, die von der Schaffung von abhängig ist
„Etwas, das aus vielen teilen besteht und doch irgendwie mehr oder weniger als die Kombination seiner teile ist“ - Gestalt
Im Rahmen des Designs führt die übermäßige Fragmentierung der Verantwortlichkeiten ohne einen einheitlichen Ansatz bei der Produkterstellung daher häufig zu einem schlecht konzipierten Produkt. Das Produkt kann durch Erstellen von Interaktion, Schnittstelle, Erfahrung und visuellem Design in separaten Vakuumpumpen beeinträchtigt werden.
Abhängig vom Kontext können Prototypen mit niedriger Vertrauenswürdigkeit ein guter Mechanismus für die Bereitstellung von Design sein. Sie sind oft effektiv, um neue Produkte innerhalb eines bereits etablierten visuellen Designsystems zu liefern. Die visuelle Darstellung verschiedener Interaktionen ist bereits festgelegt. Daher ist die Art und Weise, wie ein Benutzer eine Anwendung interaktiv durchläuft, das Hauptziel des Ergebnisses.
Lo-Fidelity-PrototypingDer Hi-Fidelity-Prototyp zeigt die Gesamtheit eines Designs - das visuelle Design, das Interface und das Erlebnis-Design - und ist das Allerwichtigste an interaktiven Designs. In einem Hi-Fidelity-Prototyp können Stakeholder, Entwickler und Benutzer vollständig mit dem Ergebnis kommunizieren, was der Organisation eine Reihe von Vorteilen bietet.
Erstens gewährleisten Hi-Fidelity-Prototypen eine effektivere und effizientere Kommunikation zwischen Abteilungen. Oft wird Zeit gespart, da Entwickler die Struktur einer Interaktion vollständig verstehen können, bevor sie den falschen Weg einschlagen und wertvolle Entwicklungszeit verschwenden. Stakeholder schätzen auch Hi-Fidelity-Prototypen, da sie die interaktiven und visuellen Gestaltungskonzepte in einer Hand erfassen können. Hi-Fidelity-Prototypen sparen daher Ressourcen, indem sie eine effektive Kommunikation der Konstruktionsideen an Entwickler und Stakeholder sicherstellen.
Ein weiterer Vorteil der Erstellung von Hi-Fidelity-Prototypen ist die Erleichterung einer gründlicheren Benutzererlebnisforschung. Ein Benutzer kann vollständig mit dem Prototyp interagieren, wodurch Lücken im Design in Echtzeit dargestellt werden. Viele Hi-Fidelity-Prototypen ermöglichen die Einführung von Analysesoftware in das Ergebnis selbst und bieten zusätzliche unterstützende Methoden zur Durchführung von Benutzerforschungen. Google Analytics kann beispielsweise in von HTML generierte Prototypen integriert werden, um Anwenderexperimente und A / B-Tests zu erleichtern. Die Möglichkeit, Anwendertests früher in den Produktentwicklungslebenszyklus einzubinden, führt letztendlich zu einem effizienteren Prozess und zu einem besseren Produkt: Entwicklungszeit wird gespart, da das Design geändert wird, bevor es erstellt wird, und Iterationen erfolgen vor der ersten Veröffentlichung von Produkt.
Abhängig von Ihren Stakeholdern kann ein Hi-Fidelity-Prototyp zudem das Umsatzpotenzial erhöhen und sich somit direkt auf den Gewinn Ihres Unternehmens auswirken. Bei CrossCap entwerfen wir Module für die Manipulation und Analyse von Marketingkampagnen bei den größten Einzelhändlern der Welt. Der Verkauf eines Kunden über ein bestimmtes Modul, von dem viele erst noch entwickelt werden müssen, ist viel einfacher, wenn sich der Kunde mit dem zukünftigen Produkt vollständig auseinandersetzen kann. Die Bereitstellung interaktiver Prototypen mit hoher Zuverlässigkeit hat daher durch die Steigerung des Umsatzes zum Ergebnis des Unternehmens beigetragen.
Die Herstellung von interaktiven Hi-Fidelity-Prototypen bietet viele Vorteile. Leider fehlt vielen aktuellen Prototyping-Tools die Komplexität, um robuste visuelle und erfahrungsorientierte Designkonzepte darzustellen. Die Prototyping-Tools von heute sind in ihrem Umfang begrenzt und auf das eine oder das andere spezialisiert. Axure verfügt beispielsweise über eine robuste Interaktionsdesign-Suite, die eine einfache Bearbeitung von Elementen ermöglicht, jedoch nicht die Raffinesse aufweist, die in anderen visuell orientierten Werkzeugen vorhanden ist, wie z. B. Farbpaletten, erweiterte Formmanipulation usw..
Am anderen Ende des Spektrums befinden sich Tools wie Quartz Composer, mit denen Sie problemlos hoch entwickelte visuelle Design-Comps integrieren können, die jedoch die Anforderungen an erweiterte Interaktionen veranschaulichen und die Bearbeitung von Patches und fortgeschrittenes Wissen über das Tool erfordern.
Origami the Quarz Composer Toolkit von FacebookAngesichts des Fehlens eines ganzheitlichen, gestaltorientierten Ansatzes bei der Entwicklung von Technologien durch die aktuellen Werkzeuge ist die Erstellung von Hi-Fidelity-Prototypen eine erhöhte Belastung für die Konstruktionsabteilung, da Werkzeuge sorgfältig massiert werden müssen, um das gewünschte Ergebnis zu erzielen. Um beispielsweise Hi-Fidelity-Prototypen erstellen zu können, mussten wir uns in Axure einhacken, um interaktionsorientiertes Javascript direkt in die generierte HTML-Datei einzufügen. Die Verwendung von Sketch mit framer.js hat zu ähnlichen Problemen geführt und erfordert einen fortschrittlichen Workflow, der auf einem interdisziplinären Designansatz beruht.
Unser Designteam beseitigt diese Hindernisse bei der Erstellung interaktiver Prototypen mit hoher Vertrauensstufe durch eine multidisziplinäre Teamstruktur: Wir verfügen über ein Team, das von hochqualifizierten visuellen Designern bis zu codezentrierten Front-End-Entwicklern sowie einigen Mitgliedern reicht, die die Grenze zwischen den beiden überspannen . Auf diese Weise kann jedes Mitglied seine Fähigkeiten einsetzen, um zu einer einzigen Lieferung beizutragen, die robuster ist. Die Teamstruktur schafft somit mehr Effizienz, spart Zeit und Ressourcen und trägt zum Umsatzpotenzial unserer Produkte bei. Während einige Organisationen das Designteam und seine Ergebnisse in verschiedene Einheiten unterteilen (Benutzeroberfläche in Photoshop, UX in Axure usw.), liegt die Stärke unseres Teams darin, unterschiedliche Fähigkeiten unter einem einzigen Ziel zusammenzufassen und zu erreichen.
Hi-Fidelity-PrototypingDie Herstellung von Prototypen mit hoher Zuverlässigkeit bei der Entwicklung von technologischen Produkten bietet viele Vorteile: Sie sparen Entwicklungszeit, schaffen eine effektivere Kommunikation zwischen Abteilungen und Interessengruppen, tragen zu einem effizienteren Prozess bei und steigern je nach Organisation das Umsatzpotenzial. Letztendlich sollte die Entscheidung für den zu wählenden Weg jedoch von der Organisation, den Stakeholdern, dem Zeitplan, der Art der Leistung, der Kommunikationsebene zwischen den Abteilungen und der Produktentwicklungsphilosophie der Organisation abhängen.
Die Effektivität des Designs wird an der Ausführung gemessen. Während Hi-Fidelity-Prototypen die Umsetzung von Designideen erleichtern, indem sie eine effektivere Kommunikation bieten, die eine bessere Aneignung der Ressourcen ermöglicht, sind sie keineswegs das einzige Mittel, um ein großartiges Produkt zu schaffen. Berücksichtigen Sie bei der Erstellung Ihrer Ergebnisse die Vor- und Nachteile der verschiedenen oben aufgeführten Methoden, Ihre Teamressourcen und deren Fähigkeiten, Ihre Organisationsstruktur und -philosophie sowie die Zielgruppe, an die Sie das Design liefern, um die besten Ergebnisse zu erzielen Pfad und erstellen Sie das beste Produkt.
In meinem nächsten Beitrag werde ich diese High-Level-Prototyping-Ansätze anhand von Beispielen für jedes lieferbare Format veranschaulichen, um Sie weiter auf den richtigen Weg zu führen, um interaktive Ergebnisse zu erreichen.
Accentsconagua