User Experience Dossier – Teil 3: UX-Ressourcen

Einen guten Einstieg in das Feld der User Experience bieten unterschiedliche Webseiten und Blogs.

Smashing Magazine: Erste Anlaufstelle für UX-Neulinge. Das Spektrum reicht von unterschiedlichen Ideen und praktischen Tipps über hilfreiche Leitfäden sowie Best Practices hin zu zahlreichen Fallbeispielen.
Webdesigner Depot: Decken mit ihren Artikeln eine große Bandbreite von Design-Themen ab.
A List Apart: Design, Entwicklung und Web-Content mit Fokus auf Web-Standards und Best Practices.
UX Magazine: Zentralisierte Anlaufstelle für alles, was mit User Experience zu tun hat.
UX Movement: Progressiver User-Experience-Blog mit Fokus auf die Verbesserung des User Interfaces.

Überblick zur Artikelserie: User Experience Dossier

User Experience Dossier – Teil 1: UI versus UX
User Experience Dossier – Teil 2: UX Best Practices
User Experience Dossier – Teil 3: UX Best Practices

Daneben gibt es auch Bücher, die gut in die Materie einführen. Besonders betont wir der heutige Stellenwert einer guten User Experience und der Übergang zum Service Design (Stichwort: Webservices).

Don’t Make Me Think: A Common Sense Approach to Web Usability: Pflichtlektüre für jeden, der in der digitalen Branche arbeitet. Behandelt werden grundlegende Prinzipien, die dabei helfen, tägliche Designfragen richtig zu beantworten.
Pervasive Information Architecture: Designing Cross-Channel User Experiences: Die User Experience endet nicht am Bildschirm. Die richtige Gestaltung von Interaktionen setzt nicht nur ein Wissen über das Online-, sondern auch das Offline-Verhalten der Nutzer voraus. Wie im Buch behauptet, können nur so die sich bietenden Potenziale vollends ausgeschöpft werden.
This is Service Design Thinking: Mit dem Buzzwort Service Design verbindet sich eine Gewissheit: Die Grenze zwischen Produkten und Services verschwimmt zunehmend und macht ein Umdenken notwendig. Das Buch führt in die Thematik des Service Designs ein und ist sowohl für Anfänger als auch Fortgeschrittene geeignet.
UX Design für Tablets: Das Buch bietet UX-Anleitungen für Marketingverantwortliche, Webdesigner und -entwickler, Mediengestalter, Publisher und E-Commerce-Betreiber.

Sichere Logins sind doch ganz einfach!

mit Arne Blankerts (thePHP.cc)

Hands-on workshop – Hansel & Gretel do TLS

mit Marcus Bointon (Synchromedia Limited)

Darüber hinaus existieren unterschiedliche UX-Checklisten zur Standardisierung der Arbeitsabläufe.

UX Project Checklist: Eine interaktive Checkliste, die alle Schritte eines UX-Designers umfasst.
Good UI Checklist: Best Practices des User-Interface-Design im Checklistenformat.
W3C Accessibility Standard: Die offizielle Accessibility-Standard-Checklist des World Wide Web Consortium.
UX Recipe: Schnell und einfach die Kosten des eigenen UX-Projekts berechnen.

UX Best Practices

Im zweiten Teil unserer Artikelserie haben wir über die Best Practices eines guten User-Experience-Designs gesprochen. Auch hier existiert ein breites Angebot an unterschiedlichen Büchern. Ebenfalls finden sich im Netz eine Menge nützlicher Tools, die einem die Arbeit erleichtern. In der Regel sind sie nicht besonders teuer und man kann sie zumeist im Browser verwenden. Und auch im Falle eines kreativen Lochs kann schnell Abhilfe durch die richtigen Inspirationsquellen geleistet werden.

1. Es dreht sich alles um die User

Artikel:

How to Tell the User’s Story: Christopher Butler legt dar, wie man User Stories richtig erzählt.
A Closer Look At Personas: What They Are und How They Work: Shlomo Goltz erklärt Schritt für Schritt, wie man Personas erstellt.
All You Need To Know About Customer Journey Mapping: Paul Boag diskutiert, warum Customer-Journey-Maps die Frustrationen und Erfahrungen der Nutzer kommunizieren können.

Bücher:

Quantifying the User Experience: Practical Statistics for User Research: Eine der größten Herausforderungen für UX-Designer ist die Verwendung von Zahlen zur Berechnung der User Experience. Und auch die Wahl von Performance-Indikatoren fällt oftmals schwer. Das Buch bietet eine gute Einführung für UX-Designer und Produktmanager.
Mental Models: Aligning Design Strategy with Human Behavior: Die Verwendung mentaler Nutzer-Modelle erlaubt es Designern, konkrete und realistische Designentwürfe zu entwerfen, die auf den Motivationen und Eigenschaften der User basieren.
Interviewing Users: How to Uncover Compelling Insights: User Interviews können knifflig sein. Das Buch bietet einen guten Einsteig für Neulinge und Alteingesessene, um ihr Wissen über die richtigen Methode vor der Planung eines Interviews aufzufrischen.
The User is Always Right: A Practical Guide to Creating and Using Personas for the Web: Für die Erstellung einer Persona muss man das richtige Verfahren wählen und ausführlich Recherche betreiben. Das Buch dient als einfache Checkliste zur Entwicklung produktspezifischer Personas.

Tools:

Wufoo: Erstellt jede Art von Onlineumfrage. Äußerst umfangreich mit leicht zu analysierenden Ergebnissen (Alternative: Typeform).
BagelHint: Schnell und einfach einen unmoderierten User-Test auf der eigenen Webseite mit vordefinierter Zielgruppe durchführen.
Lucid Charts: Diagramme mit Linien erstellen, die sich automatisch verknüpfen. Die Google-App-Integration fördert das kollaborative Arbeiten (Alternativ: MindMaster).
Verify App: Nach Upload des eigenen Designentwurfs überprüft das Tool, welche Elemente die User wie häufig anklicken und gibt die Ergebnisse als Report aus.
Usabilla: Durch ein leicht zu installierendes Plug-in kann auf der eigenen Webseite das Feedback der Nutzer gesammelt werden.

2. Interaktionen als Designstrategie

Artikel:

Creating Perfect User Flows for Smooth UX: Anhand seiner Erfahrung als UX-Designer beschreibt Marek Browser, wie man einen guten User-Flow erstellt.
Microinteractions.com: Die Webseite erklärt, was Mikrointeraktionen sind und hält einige lustige Anekdoten bereit.

Bücher:

Designing Interfaces: Patterns for Effective Interaction Design: Ein sehr hilfreiches Buch, um sich die grundlegenden Konzepte und Prinzipien des Interaktionsdesigns zu vergegenwärtigen.
Microinteractions: Designing with Details: Dan Saffer erklärt und illustriert die Regeln sowie Strukturen von Microinteraktionen in einsteigerfreundlicher Art und Weise.
Designing Gestural Interfaces: Touchscreens and Interactive Devices: Das Buch dient als Einführung in Benutzeroberflächen, die per Gestensteuerung bedient werden. Es behandelt außerdem die Potenziale von mobiler und sensorischer Technologie.
Designing for the Digital Age: How to Create Human-Centered Products and Services: Ein praktischer Guide, der die Erstellung von Webseiten, Software, Handhelds und weiterer interaktiver Produkte von Anfang bis Ende erklärt.

Tools:

Kissmetrics: Leicht bedienbares Analytic-Tool, das die Bewegungen und Interaktionen der Besucher auf der eigenen Webseite aufzeichnet (Alternativen: Mix Panel, Google Analytics).
UX Archive: Vergleicht unterschiedliche User-Flows, die in verschiedene Kategorien eingeteilt sind.
Morae: Erfasst Geräusche, On-Screen-Aktivitäten, Keyboard- und Mausgesten während User-Tests.
UX Recorder: Benutzt die Frontkamera von Smartphones, um die Aktionen und Reaktionen von Nutzern während Mobile-Tests aufzuzeichnen.
Crazy Egg: Simples und erschwingliches Heatmap-Tool.

3. UI-Elemente testen

Bücher:

Designing Better UX With UI Patterns: Erklärt, wie man UI-Patterns am besten kategorisiert und klassifiziert, um möglichst gute UX-Entscheidungen zu treffen.
The Guide to Interactive Wireframing: Das Buch beschreibt anhand einer Vielzahl von Tutorials und Screenshots die besten Methoden, um Wireframes in den UX-Design-Prozess zu integrieren.
The Ultimate Guide to Prototyping: Lehrt die wichtigsten Methoden, Werkzeuge und Prozesses des Prototypings.

Tools:

Axure: Ausgereifte Wireframing- und Prototyping-Software. Das Photoshop der UX-Designer.
Sketch: Simples und effektives UI-Design-Tool mit großer Community.
UX Pin: Bietet eine Breite Palette an unterschiedlichen Funktionen: Darunter die Möglichkeit, responsive und klickbare Prototypen im Browser zu erstellen.
Wireframe.cc: Schnell und einfach Wireframes im Browser erstellen.
Pixate: Nützliches Tool, um komplexe mobile Interaktionen und Animationen zu testen.

UI-Inspirationen

Manchmal ist es schwierig auf Knopfdruck kreativ zu sein und gelegentlich fehlt einem einfach die zündende Idee. Um das kreative Tief zu überwinden, hilft es oftmals, sich durch andere Arbeiten inspirieren zu lassen.

User Interface:

Little Big Details: Sammlung von Microinteraktionen zur Verbesserung der eigenen User Experience.
Zurb PatternTap: Pattern-Library mit Standard-Web-Komponenten.
Konigi: UI-Benchmarks mit Videos und Kommentaren.
Pttrns: Umfangreiche Sammlung von Mobile-Design-Patterns und Ressourcen.

Animationen:

Six UX: Kollektion von sechssekündigen Animationen von unterschiedlichen Webseiten und Apps.
Capptivate.co: Pattern-Library von iOS-Animationen.
UI Animations: Tumblr-Blog mit UI-Animationen für Desktop- und Mobile-Interfaces.

Fazit

Die vorgestellten Ressourcen bilden natürlich nur einen Ausschnitt aus dem gesamten User-Experience-Universum ab. Die Liste besitzt daher keinen Anspruch auf Vollständigkeit, sondern soll in erster Linie als Einstiegshilfe in die Thematik dienen – was übrigens auch für das gesamte Dossier gilt. Feedback und weitere Anregungen gerne in die Kommentare!