Die wichtigsten Bestandteile des mobilen Designs und der UX-Methodik

Mobile Projekte können vom Design leben oder sterben. Diese Kolumne befasst sich mit der Bedeutung der Entwurfsmethodik mit einer detaillierten Darstellung des digitalen Entwurfsprozesses bei der britischen Kartierungsbehörde Ordinance Survey (OS).

Während die mobile Entwicklung in Methoden verwurzelt ist, die von der Web- und Softwareentwicklung übernommen wurden – Wasserfall oder Agile; Scrum und Kanban – es gibt keine branchenübliche Methodik für die Designphase Ihres mobilen Projekts.

Wenn man bedenkt, wie wichtig Design und User Experience (UX) für den Erfolg mobiler Projekte sind – es ist verrückt, dass Unternehmen und Agenturen eigene Vorgehensweisen entwickeln mussten … und verständlich, dass sich diese zu oft als unzureichend erweisen.

Die Design- und UX-Phase ist der Prozess, durch den das mobile Projekt – oder eine neue Iteration des mobilen Projekts – von der großartigen Idee zu etwas wird, an dem die Entwickler arbeiten können.

Zu den Schritten in diesem Prozess gehören:

• Visualisierung des Projekts – oft als Storyboard auf Papier gezeichnet.
• Testen Sie das an der Zielgruppe und verfeinern Sie es dann.
• Zustimmung von Stakeholdern einholen und dann verfeinern.
• Dem Projekt seine Struktur, sein Erscheinungsbild und seine Benutzeroberfläche geben – auf Papier oder digital, mithilfe von Drahtmodellen.
• Testen Sie erneut, verfeinern Sie und erhalten Sie eine Einigung.
• Erstellung eines Prototyps – meist digital.

Es gibt eine Vielzahl von Design- und UX-Techniken und -Tools, die Unternehmen/Agenturen verwenden können, um dies zu erreichen – einige davon werden wir in den folgenden Kolumnen im Detail untersuchen.

Dazu gehören Storyboards, User Journey Mapping, Mind Maps, Personas, Wireframes, Prototyping und Minimum Viable Product.

Wasserfall oder agil oder keins von beidem?

Die traditionelle Methodik für die Softwareentwicklung, die normalerweise als Wasserfall bezeichnet wird, ist ein linearer Prozess mit definierten Phasen: Forschung -> Design -> Entwicklung -> Test -> Bereitstellung (oder ähnliches).

Obwohl das Design dadurch nur eine Phase in einem Entwicklungsprozess ist, besteht der Vorteil darin, dass die eigentliche Entwicklung erst beginnen kann, wenn das Design abgeschlossen und abgenommen ist.

In der Web- und insbesondere Mobilentwicklung besteht ein Bedarf an Geschwindigkeit, die Anforderung, an verschiedenen Teilen des Projekts gleichzeitig zu arbeiten, regelmäßig geplante Tests durchzuführen und kontinuierlich zu verbessern und zu aktualisieren.

Dies hat zur Entwicklung und weit verbreiteten Einführung sogenannter agiler Entwicklungsmethoden wie Scrum oder Kanban geführt, bei denen Forschung (einschließlich Machbarkeitsstudien und Zielgruppenidentität und -bedürfnisse), Design, Entwicklung, Test und Bereitstellung – zu verschiedenen Aspekten der Projekt – könnten alle gleichzeitig laufen.

Eine der besten Illustrationen von Waterfall und Agile ist die folgende von der in den USA (New Hampshire) ansässigen Webdesign-Agentur CommonPlaces. Diese Agentur verwendet jedoch, wie viele andere, tatsächlich eine Mischung aus den beiden Ansätzen.

Während Agilität viele Vorteile bringt, besteht die Gefahr, dass der Designprozess gequetscht, gehetzt, übersehen oder, wenn er ausgelagert wird, zu mangelnder Kontinuität und Verzögerungen führt. Umso wichtiger ist es, dass Unternehmen eine Designmethodik einführen. Dies sollte nicht nur eine Teilmenge eines Entwicklungsprozesses sein, sondern eine eigenständige Methodik.

Maßgeschneiderte vs. Standard-Designmethodik

Wie bereits erwähnt, gibt es keine allgemein akzeptierte Methodik für die Gestaltung mobiler Projekte, kein Äquivalent zu Entwicklerprozessen wie Scrum oder Kanban. Aber viele Unternehmen und Agenturen haben ihre eigenen internen Methoden entwickelt, einige haben diese mit anderen geteilt.

Eine davon ist eine schlanke UX-Methodik, die der Experte für mobiles Design, Greg Nudelman, CEO der Designagentur DesignCaffeine, den $1 Prototype nennt. Dieser Prozess wurde in mobilen Projekten für Intuit-Apps, Wells Fargo, USAA und Oracle verwendet und ist die Grundlage für seine UX-Designkurse.

NB 1 $ ist nicht der Preis des Buches, dies ist der Preis für zwei Packungen Haftnotizen. Nudelman argumentiert überzeugend, dass Haftnotizen das wichtigste Werkzeug für Storyboarding und Wireframing mobiler Projekte sind. Das Bild unten zeigt ein mobiles Projekt, das von einigen Schülern von Nudelman mit dieser Methode skizziert wurde.

Wir werden uns in zukünftigen Kolumnen mit dem Wert von Stift und Papier – und Haftnotizen – im digitalen Designprozess befassen.

Entwurfsmethodik in der Praxis: Verordnungsübersichtskarten

Unternehmen beschäftigen immer häufiger digitale Kreative mit Agenturhintergrund, da diese über eine Designmethodik verfügen, die durch jahrelange Kundenarbeit verfeinert wurde.

Ordinance Survey, der britische Kartierungsdienst, hat Ben Scott-Robinson, einen Mitbegründer der bahnbrechenden britischen Agentur We Love Mobile, angeworben, um eine interne Agentur für die Bereitstellung seiner digitalen Produkte und Dienstleistungen zu gründen.

Dies ist Ben Scott-Robinson, Leiter von The Agency at Ordnance Survey, Zusammenfassung des Designprozesses für digitale OS-Projekte:

Das Team der OS Agency führt zu Beginn des Projekts einen Design Sprint durch. Wir beginnen mit einer Erzählung, die die emotionale Bindung umreißt, die wir mit unserem Kunden erreichen möchten, und verwenden diese als Grundlage, um mit der Bearbeitung der User Journeys zu beginnen.

Bei OS Maps haben wir uns zum Beispiel darauf konzentriert, ein Erlebnis namens Emotive Mapping zu schaffen. Wir fragten:

• Wie können wir die emotionale Resonanz, die Menschen mit Papierkarten im Allgemeinen und OS im Besonderen haben, in den digitalen Raum übertragen?
• Wie können wir Karten produzieren, die mehr als nur funktional sind, aber klar gestaltet sind, um eine positive emotionale Bindung zu erzeugen?
• Wie können wir Menschen von einem „Ort“-Konzept zu einem „Ort“-Konzept führen?

Dieser Fokus wurde durch das bestehende Kundenengagement mit traditionellen OS-Papierkarten und das Gefühl des Glaubens und der Gewissheit vorangetrieben, ihre unmittelbare Umgebung zu verstehen, anstatt nur zu wissen, wo sie sich befinden.

Von hier aus arbeiten wir relativ standardisiert; wir:

1. Erstellen Sie eine Liste potenzieller Vorteile, die die Erzählung erfüllen, und führen Sie Kartensortierungen unter Vertretern der Zielgruppentypen durch.
2. Unter Ausnutzung dieser Vorteile erstellen wir User Journeys und Storyboards um sie herum. Diese neigen dazu, scamped zu sein.
3. Testen Sie die Reisen zwischen den Publikumstypen erneut (immer anhand von Kriterien, die rund um die Erzählungen festgelegt wurden) und beginnen Sie dann, divergierend über Schnittstellen nachzudenken.
4. Recherchieren Sie Schnittstellentypen und beginnen Sie dann mit dem Skizzieren von Schnittstellen.
5. Erstellen Sie mit Marvel klickbare Prototypen aus diesen Skizzen und verwenden Sie Ferntests, wie normalerweise usertesting.com, um zu testen, was funktioniert.
6. Beginnen Sie mit der Erstellung detaillierter Prototypen bestimmter Erlebnisse in Axure (Mapping-Apps sind in der Regel Einzelbildschirm-Erlebnisse mit mehreren Interaktionen, die ein ziemlich ausgeklügeltes Tool erfordern).
7. Validieren Sie mit den Entwicklern, um zu prüfen, ob unsere Designs möglich sind oder nicht!
8. Testen Sie erneut aus der Ferne, um die Spreu zu schneiden; Testen Sie dann mit dem Zielgruppentyp, um detaillierteres Feedback zu erhalten.
9. Fangen Sie an, die Erfahrungen zu einem Produkt zusammenzufügen – wiederum mit Axure – und beginnen Sie damit, Interaktionen zu vereinfachen und auszurichten.
10. Dann kommen die visuellen Designer hinzu und wir beginnen mit der Erstellung von Designmustern und ganzen Bildschirmdesigns, die in die Prototypen integriert werden. Wir betrachten auch die Gestaltung von Übergängen und Animationen.
11. Testen und testen Sie erneut, dann ziehen wir die Entwickler hinzu, um mit der Erstellung des Designs zu beginnen.
12. Ein UX- und visueller Designer wird an das Entwicklungsteam abgeordnet, um mit ihnen am agilen Prozess zu arbeiten, an der Planung beteiligt zu sein und Fragen zu unterstützen, spontane Überarbeitungen bereitzustellen und Randfälle zu bearbeiten. OS tendiert eher zu einem Kanban-Ansatz als zu Scrum, da dies flexibler ist und weniger Planungsaufwand für das Entwicklungsteam bedeutet.

Dies ist Teil 16 der ClickZ-Serie „DNA des mobilfreundlichen Webs“.

___
von Andy Favell