Für Anfänger

UX-Design wirkt am Anfang wie ein Berg aus Fachbegriffen, Methoden und Tools. Die gute Nachricht: Du musst nicht alles auf einmal lernen. Dieser Pfad sortiert die Grundlagen so, dass jeder Schritt auf dem vorherigen aufbaut. Du kannst ihn von oben nach unten lesen oder direkt zu der Etappe springen, die dich gerade beschäftigt.

Jede Etappe besteht aus zwei bis sechs Artikeln. Wenn dir unterwegs ein Begriff begegnet, den du nicht kennst, hilft dir das UX-Glossar weiter.

1. Worum es bei UX geht

Bevor du Methoden lernst, lohnt sich ein klares Bild davon, was User Experience eigentlich ist, wie sie sich von Usability unterscheidet und in welchen Schritten UX-Arbeit abläuft.

• Was ist User Experience? Der Begriff in wenigen Minuten erklärt.
• Was ist Usability? Warum Gebrauchstauglichkeit nur ein Teil der Nutzungserfahrung ist.
• Was ist UX-Design? Beispiel: Banane Ein Alltagsgegenstand als Lehrstück für gutes Design.
• Der UX-Prozess im Überblick Die Landkarte für alles, was auf diesem Pfad folgt.

2. Menschen verstehen

Gutes Design beginnt nicht im Designtool, sondern bei den Menschen, die ein Produkt nutzen. In dieser Etappe lernst du, wie du ehrliche Antworten bekommst und deine Erkenntnisse so festhältst, dass dein Team damit arbeiten kann.

• User Interviews ohne Suggestivfragen So stellst du Fragen, die nicht schon die Antwort vorgeben.
• Personas aus echten Daten Aus Interviews eine Persona bauen, die im Alltag wirklich hilft.
• Journey Map erstellen Den Weg eines Menschen zu seinem Ziel sichtbar machen.

3. Struktur und erste Entwürfe

Wenn klar ist, was Menschen brauchen, geht es um die Frage, wo welche Inhalte hingehören und wie du Ideen schnell sichtbar machst, bevor jemand über Farben diskutiert.

• Navigation, in der sich niemand verirrt Informationsarchitektur mit Card Sorting und Tree Testing.
• Wireframe, Mockup, Prototyp Welcher Entwurf welche Frage beantwortet.

4. Wie Menschen wahrnehmen und entscheiden

Ein paar psychologische Grundlagen erklären, warum manche Interfaces sofort verständlich sind und andere nicht. Sie helfen dir, Designentscheidungen zu begründen statt nur nach Geschmack zu urteilen.

• Gestaltgesetze im Interface Warum Menschen Elemente als zusammengehörig sehen.
• UX-Gesetze an Beispielen erklärt Fitts, Hick, Jakob und Miller im Alltag.
• Kognitive Last Warum weniger im Interface oft mehr ist.

5. Gestaltungsgrundlagen

Jetzt wird es konkret. Mit diesen Grundlagen gestaltest du Screens, die aufgeräumt wirken und sich gut bedienen lassen. Die Reihenfolge folgt dem Aufbau eines Screens: von der Ordnung über Schrift und Farbe bis zum einzelnen Button.

• Visuelle Hierarchie So lenkst du den Blick durch dein Interface.
• Abstände und Raster im Interface Weißraum, 8-Punkt-System und Layout-Grids.
• Typografie für Bildschirme Schriftgröße, Zeilenlänge und Zeilenabstand.
• Farben im Interface Die Grundlagen für deine erste Farbpalette.
• Buttons richtig gestalten Hierarchie, Beschriftung, Zustände und Größe.
• Mobile First und Responsive Design Damit deine Website auf jedem Bildschirm funktioniert.

6. Barrierefreiheit von Anfang an

Barrierefreiheit ist kein Extra für später. Wer sie früh mitdenkt, spart sich aufwendige Korrekturen und erreicht mehr Menschen.

• WCAG einfach erklärt Die vier Prinzipien der Richtlinien im Überblick.
• Deine Website in 15 Minuten mit der Tastatur testen Ein erster Praxistest ohne Spezialwerkzeug.

7. Testen und messen

Ob ein Design funktioniert, zeigt sich erst, wenn echte Menschen es benutzen. Diese Artikel helfen dir, Probleme systematisch zu finden und Verbesserungen sichtbar zu machen.

• Heuristische Evaluation Schritt für Schritt Die zehn Usability-Heuristiken an einem Beispiel.
• Dein erster Usability-Test Schritt für Schritt mit fünf Personen.
• UX messen Erfolgsquote, Zeit, SUS und Conversion verständlich erklärt.

8. Werkzeuge

Tools kommen bewusst zum Schluss. Sie machen die Arbeit leichter, ersetzen aber keine der vorherigen Etappen. Für den Start reichen wenige Werkzeuge.

• Die richtigen UX-Tools für den Anfang Was du wirklich brauchst, sortiert nach Aufgaben.
• Figma-Grundlagen Frames, Auto Layout und Komponenten.

Begriffe zum Nachschlagen

Diese Glossar-Einträge begegnen dir auf dem Pfad immer wieder: User Experience, Usability, User Research, Persona, Wireframe, Usability-Test und WCAG.

Zum Weiterlesen

• Laws of UX: die bekanntesten UX-Gesetze kompakt gesammelt.
• 10 Usability-Heuristiken: die Prüfliste für deine erste heuristische Evaluation.
• Don’t Make Me Think: Steve Krugs Klassiker über Usability im Web.