Ablauf und Ergebnisse unseres UX-Design-Prozesses:

Bevor wir beginnen, Antworten zu suchen, nehmen wir uns Zeit, Fragen zu stellen. Was ist der eigentliche Kern des Angebots, welches das zentrale Bedürfnis, das beantwortet werden soll? Aus Ihrer Perspektive und aus der Ihrer Nutzer.

Sobald das geklärt ist, geht es im nächsten Schritt um das „Wie“ einer möglichst optimalen Umsetzung. Angelehnt an den „Double Diamond Process“ des British Design Councils mit seinen Schritten "Discover", "Define", "Develop" und "Deliver" verstehen wir unseren UX-Design-Prozess als vierstufigen Weg:

Schritt 1: Entdecken und dokumentieren, was es zu tun gibt.
Schritt 2: Struktur schaffen, Wege und Verhalten definieren.
Schritt 3: Elemente, Seitentypen und Beispielseiten visuell skizzieren.
Schritt 4: Erstes Umsetzen, Testen, Optimieren.

Und dann?

Schauen wir in vereinbarten Intervallen, ob alles so funktioniert, wie wir uns das gemeinsam gedacht haben:

  • quartalsweise Auswertung der Zugriffszahlen
  • optionale Nutzer-Befragungen oder (A/B) Tests
  • Ausarbeitung von Optimierungsempfehlungen
  • kontinuierliche Optimierung hin zur besten Lösung!

Sollen wir mal sprechen, was wir als UX-Designer für Sie erreichen können?

Ihre Ansprechpartnerin für UX-Beratung und UX-Design:

Anjana Muschenich Kreativberatung / UX

Die Schritte und Ergebnisse im Detail:

Schritt I: Kennenlernen von Aufgabe und Situation (Discover)

Frage / Aufgabe

Ergebnis

Was sind Ihre Ziele, was soll die Site leisten und erreichen?  

> Rebriefing –  das haben wir verstanden, das sind unsere Anmerkungen zu Ihrer Fragestellung.

> Zielvereinbarung –  Was soll die Site wann erreichen? Welche Voraussetzungen müssen für die Erreichung dieser Ziele geschaffen werden?

 

Wen möchten Sie mit Ihrem Angebot erreichen, was sollen diese Nutzer tun?

 

> Use cases / User Szenarios –  darstellen, wer was  mit Ihrer Seite machen wollen wird.

Welche Ziele und Bedürfnisse haben Ihre Nutzer?

> Personas der zentralen Ziel- und Anspruchsgruppen. Wie ist ihre Nutzungssituation? Was ist ihnen wichtig? Was motiviert sie zum Exit? Womit könnte man sie glücklich machen?

 

Welche technischen, welche inhaltlichen Anforderungen gibt es?

> Lastenheft zur Dokumentation der technischen Anforderungen und Herangehensweisen.

> Grundlegende Content-Strategie.


Schritt 2: Verständnis klären (Define)

Frage / Aufgabe

Ergebnisdokument

Wie sind die Inhalte strukturiert?

 

> Sitemap als Übersicht

·         des Seitenaufbaus

·         grundsätzlicher Inhalte und Funktionen

·         der Ebenen und Seiten

 

Wie verläuft der Informationsfluss, wie bewegt sich ein Nutzer durch die Site und ihre Prozesse?

 

> Flowcharts der zentralen Nutzungspfade und –prozesse.

Was gibt dem Nutzer Orientierung, wie werden die verschiedenen Nutzertypen durch die Site geführt?

 

> Navigationskonzept zur Darstellung der Navigationselemente. Welche gibt es und wie spielen sie für eine optimale Orientierung und Nutzerführung zusammen?

> User Journeys zeigen gute Wege zu ausgewählten Inhalten und Angeboten.

 

Wie ist die Seite gegliedert, welche Seitentypen und Content-Module gibt es? Wie ist das responsive Verhalten?

>Responsives Seitenraster zur Veranschaulichung des Grundaufbaus, der Seitentypen und Content-Module und ihres responsiven Verhaltens.

> Wireframes der Seitentypen und Content-Module und ihres responsiven Verhaltens.

 

Wie reagieren die Site und ihre Elemente auf den Nutzer?

> Interaktionskonzept



Schritt III: Lösungen entwickeln (Develop)

Frage / Aufgabe

Ergebnisdokument

Gestalterische Annäherung an Raster, Form, Farbe, Schriften, Icons, Bildwelten

 

> Kommentierte Moodboards

Gestalterische Ausarbeitung der Seitentypen, Basiselemente, Funktionen und Module.

 

> Grundlayout der Seitentypen und Content-Module und ihres Interaktionsverhaltens.

> Gestaltung beispielhafter Seiten zur Erprobung und Veranschaulichung des Designs.

 

Dokumentation der Styles und Elemente.

> Aufbau eines Online-Styleguides (Frontify) im Geist des „Atomic Designs“. Bestimmung der Atome, Moleküle, Organismen, Seitentypen und Inhaltsseiten.


Schritt IV: Testen und Optimieren (Deliver)

Frage / Aufgabe

Ergebnisdokument

Funktioniert das Design in HTML so, wie im Design gedacht?

 

> Responsiver HTML Clickdummy mit beispielhaften Seiten und sämtlichen Content-Modulen als Realititätsabgleich:

·         zum Testen des responsiven Verhaltens und des Interaktionsdesigns

·         zur Browseroptimierung der Gestaltungselemente

·         zur Auslieferung von HTML, JS und SASS-basiertem CSS an die CMS-Template-Entwicklung und -Integration

 

Funktioniert die Seite für die Nutzer?

> Erstes Testing (intern oder mit externen Testpersonen) anhand des HTML-Clickdummies. Funktioniert die Site so wie geplant? Wo kann sie optimiert werden?


Projekte
Aktuell