it-swarm-eu.dev

Best Practices für interaktive Prototypen?

Ich stelle einem Kunden zum ersten Mal Axure-Prototypen vor. Axure bietet zwar sehr detaillierte Anmerkungen und Spezifikationen, aber ich denke, es ist übertrieben für dieses Projekt - eine Planungsanwendung für den internen Gebrauch. Der Projektmanager ist an Visio-Flows und Photoshop-Kompositionen gewöhnt, ist aber genauso bemüht, den Entwurfs-/Genehmigungsprozess zu verbessern. Ich möchte herausfinden, welcher Detaillierungsgrad in der Benutzeroberfläche, den Anmerkungen und den Spezifikationen empfohlen wird. Meine Frage ist nicht spezifisch für Axure, aber das ist das Tool, das ich verwende.

Überarbeitet: Ich möchte die Frage auf die zu erbringenden Leistungen konzentrieren. Welche Ergebnisse sind für den Kunden wichtig und wie weit entwickeln Sie sie? Zum Beispiel könnten die Axure-Spezifikationen für das Entwicklungsteam nützlich sein, aber für den Genehmigungszyklus für das UX/UI-Design halte ich sie nicht für nützlich.

9
JK Hudson

Der Grund, warum wir Prototypen herstellen, besteht darin, Ideen/Konzepte/Lösungen zu vermitteln, die nicht durch statische Bildschirme vermittelt werden können.

Ich verwende immer die Regel, dass Sie Prototypen erstellen sollten, wenn Sie ein Gefühl oder ein Verständnis für den Ablauf in Ihrer Anwendung/Ihrem Webdienst vermitteln möchten.

Mit den Prototypen können Sie simulieren, wie sich etwas anfühlt.

Wenn Sie beispielsweise eine Suchfunktion anzeigen möchten, die wie Google Suggest funktioniert, und Ihr Kunde wahrscheinlich nicht weiß, was Sie nur mit der Referenz meinen. Dann machen Sie einen Prototyp, um es zu zeigen.

Ich glaube, dass der Ablauf jeder Anwendung einer der blinden Flecken von normalem UX ist. Vieles, was eine Anwendung ausmacht, ist das, was zwischen den Klicks passiert.

8
ThomPete

Für Prototypen würde ich sagen, dass Sie die Detailebene erreichen müssen, auf der Sie die Funktionalität auf leicht verständliche Weise erklären und veranschaulichen können.

Jedoch, es ist auch von großer Bedeutung , dass niemand glaubt, Ihr Prototyp sei fertig (oder fast fertig) ) Produkt. In diesem Fall laufen Sie Gefahr, dass Ihr Kunde entweder glaubt, dass Sie morgen liefern können ... oder dass Sie in einer Diskussion über kleinere (kosmetische) Details stecken - in einem Prototyp, der nicht unbedingt genau so aussehen soll wie der Endprodukt also!


Im Allgemeinen wird ein unfertiger/unpolierter Prototyp oder ein Modell zu Benutzereingaben, Kritik und alternativen Lösungen einladen. Dadurch können Benutzer mögliche Veränderungen der bestehenden Praxis erkennen (Ehn & Kyng 1991, S. 652). Es wird auch kaum mit einem Endprodukt verwechselt (ebenda; Beyer & Holtzblatt 1998, S. 372-3). (Genau deshalb liebe ich Balsamiq Mockups .)

Ein funktionaler Prototyp hingegen ermöglicht es Benutzern, praktische Erfahrungen in konkreten Nutzungssituationen zu sammeln (Bødker & Grønbæk 1991, S. 198).

Bei einem Prototyp ist von einem Vollständigkeitsversuch keine Rede; Seine Aufgabe ist es, bestimmte Aspekte des Informationssystems zu beleuchten. Besonderes Augenmerk wird auf diejenigen Aspekte gelegt, bei denen die größte Unsicherheit besteht. ... Prototypen werden verwendet, um die Richtigkeit der zu diesen Aspekten getroffenen Annahmen zu überprüfen. Im Gegensatz zu Produktionssystemen sind Prototypen in der Regel unvollständig und sollen nicht fehlerfrei funktionieren. (Vonk 1990, S. 20-1)


Referenzen

Beyer, H. & K. Holtzblatt (1998). Kontextdesign: Kundenorientierte Systeme definieren. San Francisco, Kalifornien: Morgan Kaufmann Publishers

Bødker, S. & K. Grønbæk (1991). "Design in Aktion: Vom Prototyping durch Demonstration zum kooperativen Prototyping", in Kyng, M. & J. Greenbaum (Hrsg.), Design at Work (S. 197-218). New Jersey: Lawrence Erlbaum Associates

Ehn, P. & M. Kyng (1991). "Cardboard Computers: Mocking-It-Up oder Hands-On the Future", in Wardrip-Fruin, N. & N. Montfort (Hrsg.), The New Media Reader (S. 651 -62). Cambridge, MA: Die MIT Press

Vonk, R. (1990). Prototyping: Der effektive Einsatz der CASE-Technologie (S. 20-33). Englewood Cliffs, NJ: Prentice Hall Inc.

12
jensgram

Die Art Ihrer Leistungen hängt ehrlich gesagt vom Umfang des Projekts, der von Ihnen geleisteten Arbeit und der Art des Kunden ab, mit dem Sie es zu tun haben. Die größte Herausforderung, der Sie sich stellen müssen, ist Bestimmen, was der Kunde erwartet und dann diese bereitzustellen (oder ihre Erwartungen gegebenenfalls anzupassen).

Zum Beispiel hat ein Kollege von mir kürzlich einen interaktiven Prototyp für einen Kunden im Energiesektor in HTML, CSS und Javascript erstellt. Die Benutzeroberfläche, die nachgebildet werden musste (es war eine Neugestaltung), war so kompliziert, dass die beste Möglichkeit, mit dem Kunden darüber zu sprechen, eine sehr hohe Wiedergabetreue war. Da er den Kunden bei der Hand nahm und ihn durch den Prozess der Iteration des Prototyps führte, konnte der Kunde auch viel darüber lernen, was seine aktuelle Benutzeroberfläche falsch machte, warum unsere Verbesserungen notwendig und wertvoll waren, und es gab ihnen Guter Einblick in den Arbeitsaufwand bei der Neuerstellung einer solchen Benutzeroberfläche. Die Aufgabe bestand lediglich darin, den interaktiven Prototyp zu liefern - basierend auf dieser Arbeit würde der Kunde seine nächsten Schritte bewerten. (Es genügt zu sagen, dass wir jetzt beauftragt wurden, die gesamte nächste Version der App neu zu entwerfen und zu implementieren.)

Wichtige Erkenntnisse aus diesem Prozess:

  • Passen Sie die Wiedergabetreue Ihres Prototyps an die Erwartungen des Kunden an. Bei einem guten Projektmanagement geht es darum, die Erwartungen zu managen, und das ist bei einem Prototyping-Projekt nicht anders. Finden Sie also heraus, was Ihr Kunde sehen muss, und passen Sie dann den Prototypentyp an, um Ihre Arbeit optimal zu kommunizieren. Beim interaktiven Prototyping interpretiere ich "High-Fidelity" so, dass es über Grau-Weiß-Bildschirme hinausgeht und Farbe, Typografie, Größe usw. so nah wie möglich an der endgültigen App modelliert. Das einzige, was wir in dem oben genannten Prozess ausgelassen haben, war die Anwendung des Hausstils (z. B. alles in einen schrecklichen Grünton zu verwandeln ;-))

  • Seien Sie so transparent wie möglich über Ihren Designprozess. Wie bereits von mehreren anderen erwähnt, besteht eine Gefahr während des Prototyping-Prozesses darin, dass der Kunde irgendwie denkt, dass der Prototyp mit dem Endprodukt identisch ist. Im obigen Beispiel hat sich mein Kollege nicht auf die Wartbarkeit der Codebasis oder ähnliches konzentriert - er hat sie nur für den spezifischen Anwendungsfall, für den er entworfen hat, zusammen gehackt. Aber weil er seinen Entwurfsprozess gut mit dem Kunden kommunizierte, jeden Schritt des Geschehens erklärte und die Tatsache unterstrich, dass nichts davon endgültig war, konnte der Kunde verstehen, was er bekam. Es ist eine wichtige Gefahr, die es zu vermeiden gilt, aber ein gutes Erwartungsmanagement kann einen ziemlich guten Job machen.

  • Dokumentieren Sie, was Sie tun und warum. Ein interaktiver Prototyp reicht nicht aus. Sie müssen es so präsentieren , dass der Kunde es verstehen kann - nicht nur den Product Owner, mit dem Sie direkt zusammenarbeiten, sondern alle Stakeholder die Kette hoch, die nicht in den Designprozess involviert war. Mein Kollege erstellte eine Miniatur-Website, auf der Aspekte der Bildschirme dargestellt wurden, an denen er gearbeitet hatte, und schrieb einfachen Code, um verschiedene Teile der Funktionsweise hervorzuheben. Diese Metadaten waren von unschätzbarem Wert, um sicherzustellen, dass die Drähte nicht gekreuzt oder verwirrt wurden, da der zu liefernde Prototyp nach Fertigstellung innerhalb des Unternehmens weitergegeben wurde.

Best Practices für interaktive Prototyp-Ergebnisse? Ehrlich gesagt dreht sich alles um gute Kommunikation und Erwartungsmanagement. Sie müssen herausfinden, was der Kunde erwartet. Sobald Sie das getan haben, liegt der schwierige Teil hinter Ihnen - jetzt können Sie Ihre Designarbeit erledigen!


PS. Nicht um unser Produkt anzuschließen, aber mein Kollege hat es während dieses Prozesses verwendet und viele Vorteile des Tools wurden sichtbar. Die Tatsache, dass alle unsere Prototypen sofort online gemeinsam genutzt werden können, machte es zum Kinderspiel, den Kunden über den Fortschritt auf dem Laufenden zu halten, und wir konnten den Kunden sogar telefonisch durch die Dinge führen. Das war eine große Verbesserung gegenüber alten Situationen, in denen Kunden entweder in unseren Büros sein mussten oder nicht sehen konnten, was los war.

6
Rahul

Ich habe Axure und einige andere Tools ausprobiert, um Prototypen herzustellen, und bin zu dem Schluss gekommen, dass Prototypen eine reine Zeitverschwendung mit einem schrecklichen ROI sind. Ich kehrte zu einer viel erfolgreicheren Methode zurück und verwendete PowerPoint, um Storybaords zu erstellen.

Ich verwende den Folienmaster, um einen Vanille-Rohling meiner App einzufügen. Die Haut als Hintergrundbild. Dann habe ich ein paar Steuerelemente auf einer letzten Folie gespeichert, wie Kombinationsfelder und so weiter. Schließlich habe ich ein Bild eines Cursors, den ich animiere, um zu zeigen, wo der Benutzer klicken würde.

Sehr schnell, sehr einfach, jeder hat die Möglichkeit, es zu öffnen und zu ändern. Und das Beste ist, dass es die Designvision sehr klar kommuniziert.

Ich hoffe das hilft.

2
Glen Lipka

Die Antwort hängt möglicherweise auch davon ab, welche Art von Prototyp Sie liefern wollten. Wenn es sich nur um eine (statische) Webseite handeln würde, hätten Sie viele Optionen, z. Entwurfswerkzeuge wie Photoshop oder Illustrator und sogar handgezeichnete Skizzen. Für eine vollständigere/komplexere Geschichte, die Webseiten mit mehreren Status, Benutzerabläufe und/oder eine angepasste Benutzeroberfläche enthalten kann, verwende ich normalerweise eine Kombination aus Balsamiq , PowerPoint und Word.

  1. Balsamiq, um die Modelle zu erstellen.
  2. PowerPoint zum Kompilieren der Modelle und/oder Screenshots; und fügen Sie Beschriftungen hinzu, um die erforderlichen Details hinzuzufügen. Dies ist sehr nützlich, insb. bei der Darstellung über den Fluss.
  3. Word (oder ein beliebiges Textverarbeitungsprogramm), um die gründlicheren Hintergrund- und Entwurfsentscheidungen zu dokumentieren. Aufgrund meiner Erfahrung mit mehreren großartigen Produktleuten und Designern finde ich es eine gute Angewohnheit, dies zu entwickeln, da wir uns oft nicht daran erinnern können, was wir im Detail entschieden hatten.

Ich weiß, dass es bei der Frage mehr darum ging, die effektiven Werkzeuge zu finden, aber meiner Meinung nach geht nichts über die Chance, wenn Sie Ihre Entwurfsentscheidungen persönlich besprechen können (oder auch auf virtuellem Wege).

2
moey

"Welche Ergebnisse sind für den Kunden wichtig und wie weit entwickeln Sie sie?"

Ein Ergebnis, das die Interaktion und Absicht der Benutzeroberfläche vollständig kommuniziert, ist wichtig. Sie entwickeln es so weit, wie Sie es brauchen, um dies zu erreichen. Die Einzelheiten dieser Antwort hängen vollständig vom Projekt und vom Kunden ab.

Abgesehen davon versucht Agile Development dabei zu helfen. Die Idee ist, dass Sie "berührbar" schneller an Kunden geliefert werden können, sodass die unvermeidliche Optimierung früher als später erfolgt.

2
DA01

Ich würde Balsamiq www.balsamiq.com oder Mockingbird gomockingbird.com für Rapid Prototyping verwenden. Wenn Sie einen detaillierteren Interaktionsplan bereitstellen müssen, wählen Sie Axure.

Ich habe ziemlich gute Ergebnisse mit der Kombination von gestalteten Designs (in Photoshop) und Axure erzielt, um eine sehr realistische Demo zu erstellen und Designideen an (ältere) Stakeholder zu verkaufen, die nicht die Fähigkeit/den Wunsch haben, Drahtgitter zu interpretieren.

0
Rob Varney

Wie andere angegeben haben, hängt es davon ab, was überprüft wird. Wenn wie Balsamiq-Modelle, um Struktur und Interaktion zu verbessern. Balsamiqs Bilder vermitteln gut, was das Modell ist (eine vorgeschlagene Struktur) und was nicht (eine Design-Komposition), und wir konzentrieren uns auf die Struktur gegenüber dem Grafikdesign. Erst wenn dieser Teil fertig ist, gehe ich zum visuellen Design über. Wenn die Struktur bereits vereinbart ist, können Sie flache Dateien für die Designgenehmigungen verwenden. Was Sie wirklich vermeiden möchten, ist eine Diskussion über den richtigen Grünton, wenn Sie noch nicht entschieden haben, wie die Anwendung funktionieren soll.

0
ThatSteveGuy

Um es noch einmal zusammenzufassen:

Best Practices für interaktive Prototypen

  • Zeigen Sie den Fluss zwischen den Bildschirmen
  • Lassen Sie die Benutzeroberfläche nicht verfeinert, um die Erwartungen festzulegen, dass die Anwendung nicht abgeschlossen ist, und laden Sie zu Feedback ein.
  • Verwenden Sie die agile Methodik und stellen Sie dem Client mehrere Iterationen zur Verfügung, um Entwurfsprobleme zu lösen, bevor die Codierung beginnt
  • Vervollständigen Sie die Benutzeroberfläche und die Anmerkungen nur bis zur Vollständigkeit, die der Client benötigt, um die Interaktion zu verstehen. Der Grad der Vollständigkeit variiert je nach Kunde

Dies sind meine wichtigsten Imbissbuden. Hat noch jemand etwas hinzuzufügen?

0
JK Hudson