Produktlogik, UX/UI, Prototyping, Designsysteme und strukturierte Übergabe aus einem verbundenen Designprozess.
Neue Funktionen kommen hinzu. Weitere Nutzerrollen werden relevant. Ein bestehendes Dashboard wird um zusätzliche Informationen erweitert. Mobile und Desktop entwickeln sich parallel. Einzelne Screens funktionieren für sich, aber das gesamte Produkt wird zunehmend schwerer zu verstehen.
UXphoria verbindet Produktlogik, Nutzeraufgaben und Interfacegestaltung in einer durchgängigen Produktinteraktions-Architektur.
Das Modell übersetzt Anforderungen nicht direkt in einzelne Screens. Es ordnet zunächst die Zusammenhänge, aus denen ein belastbares Interface-System entstehen kann.
Die acht Ebenen entsprechen dem in der Architektur definierten UXphoria-Modell.
Ein Produkt kann beispielsweise gleichzeitig:
operative Aufgaben unterstützen
Informationen verwalten
Entscheidungen vorbereiten
Berechtigungen abbilden
Daten analysieren
wiederkehrende Aktionen vereinfachen
UXphoria strukturiert diese Anforderungen nicht als voneinander isolierte Screens, sondern als zusammenhängende Nutzerwege.
Dabei können je nach Produkt beispielsweise berücksichtigt werden:
Rolle
Wer nutzt das Produkt?
Aufgabe
Was soll diese Person erledigen?
Information
Was muss sie dafür wissen?
Aktion
Was soll sie als Nächstes tun können?
Berechtigung
Was darf sie sehen oder verändern?
Zustand
Was passiert, wenn Daten fehlen, geladen werden oder eine Aktion nicht möglich ist?
Das betrifft unter anderem:
Navigation
Seiten- und Bereichshierarchie
primäre und sekundäre Aktionen
Daten- und Inhaltspriorisierung
responsive Anpassungen
Interaktionsmuster
Rückmeldungen
Kontextinformationen
Detail- und Übersichtsansichten
Responsive Produktgestaltung bedeutet dabei nicht, einen Desktop-Screen kleiner zu machen.
1
Initial
Was sieht der Nutzer, bevor eine Interaktion stattgefunden hat?
2
Loading
Wie wird verständlich, dass das Produkt arbeitet?
3
Empty
Was passiert, wenn noch keine Daten oder Inhalte vorhanden sind?
4
Active
Wie wird der aktuelle Zustand eindeutig vermittelt?
5
Success
Wie erkennt der Nutzer, dass eine Aktion abgeschlossen wurde?
5
Error
Was ist passiert und welche sinnvolle nächste Handlung bleibt möglich?
5
Disabled oder Permission
Was darf der Nutzer in diesem Kontext nicht tun und warum?
Typografie
Farben
Abstände
Buttons
Formulare
Navigation
Karten und Informationsmodule
Tabellen
Statusanzeigen
Interaktionszustände
Modale und Overlays
responsive Muster
Komponentenvarianten
Der Zweck ist, wiederkehrende Entscheidungen nachvollziehbar zu machen und ein Produkt konsistent weiterentwickeln zu können.
App Design ist mehr als eine Desktop-Oberfläche auf einem kleineren Bildschirm.
Kurze Anfrage genügt. Wir melden uns mit einer ersten Einordnung.
Mobile Produkte müssen unter anderem berücksichtigen:
mobile Aufgaben
Navigation auf kleinem Raum
Touch-Interaktion
unterschiedliche Nutzungssituationen
Priorisierung
Zustände und Rückmeldungen
wiederkehrende Aktionen
responsive oder plattformspezifische Muster
Dabei unterscheiden wir klar zwischen:
App Design
UX, UI, Flows, Interaktionen, Prototyping und Designsystem
App Entwicklung
Programmierung, technische Architektur, Backend, Veröffentlichung und laufender Betrieb.
Daraus entstehen andere Designanforderungen:
authentifizierte Bereiche
Workspaces
Rollen und Berechtigungen
Tabellen und Daten
komplexe Navigation
wiederkehrende Workflows
Zustände
Filter und Suche
Dashboards
Einstellungen
produktinterne Benachrichtigungen
UXphoria konzentriert sich auf Produktstruktur, UX/UI, Interface-Systeme und die designseitige Übergabe. Technische Entwicklung und Softwarearchitektur werden nur dann Bestandteil eines Projekts, wenn sie separat vereinbart und entsprechend besetzt werden.
Je nach Projekt können deshalb unterschiedliche Artefakte entstehen:
User Flows
strukturelle Konzepte
Wireframes
UI Screens
responsive Varianten
Komponenten
Zustände
interaktive Prototypen
Designsysteme
Figma-Varianten
Spezifikationen
dokumentierte Übergaben
Wenn bereits ein Entwicklungsteam vorhanden ist, kann die Gestaltung so strukturiert werden, dass Entscheidungen und Komponenten nachvollziehbar übergeben werden.
Das bedeutet nicht, dass UXphoria automatisch die technische Implementierung übernimmt.
Design und Entwicklung sollen dieselbe Produktlogik verstehen können.
Je nach Ausgangslage können separat geplant werden:
umfangreiche Nutzerforschung
Usability Testing
vollständige Product Discovery
technische Softwarearchitektur
Backend-Entwicklung
Frontend-Entwicklung
App-Programmierung
API-Entwicklung
umfangreiche Accessibility-Audits
laufende Product-Optimierung
quantitative Produktanalyse
umfangreiche Content-Produktion
vollständige Markenentwicklung
Marketing-Website
laufende CRO-Programme
1
Produkt und Ausgangslage verstehen
Wir klären Produkt, Ziel, Nutzerrollen, bestehende Oberflächen, vorhandene Anforderungen und den aktuellen Designstand.vor eine Interaktion stattgefunden hat?
2
Aufgaben und Struktur ordnen
Nutzerwege, Informationsmodell, Navigation und zentrale Produktaufgaben werden aufeinander abgestimmt.
3
Interface gestalten
Aus der Produktstruktur entstehen UI-Richtung, Screens, Komponenten und relevante Interaktionszustände.
4
System aufbauen
Wiederkehrende Muster werden als konsistente Komponenten und Regeln organisiert, soweit dies für das Projekt sinnvoll ist.
5
Prototyp und Übergabe
Relevante Flows werden prototypisch nachvollziehbar gemacht und die Designentscheidungen für die weitere Umsetzung strukturiert übergeben.
5
Error
Was ist passiert und welche sinnvolle nächste Handlung bleibt möglich?
Ob neue App, bestehende Web App, SaaS-Produkt oder datenreiches Interface:
Wir können zunächst einordnen, welcher Teil des Produkts tatsächlich Designarbeit benötigt, welche Nutzeraufgaben im Mittelpunkt stehen und welche Artefakte dafür sinnvoll sind.
Beschreiben Sie kurz Ihr Produkt, die wichtigsten Nutzerrollen und den aktuellen Designstand. Sie erhalten eine erste Einordnung des möglichen Designumfangs und eines sinnvollen nächsten Schritts per E-Mail.
