UX/UI Design.

Schritt eins ist Verstehen, nicht Zeichnen. Wer sind die Nutzer, welche Aufgabe bringen sie mit, unter welchen Bedingungen erledigen sie diese? Dafür braucht es keine grosse Studie: fünf bis acht Gespräche mit echten Kundinnen und Kunden, ein Blick in Analytics auf die Seiten mit den höchsten Absprüngen, und die Fragen, die im Betrieb ohnehin täglich am Telefon gestellt werden. Genau diese Fragen sind die verlässlichste Quelle für die Struktur einer Website.

Schritt zwei ist die Struktur. Welche Inhalte gibt es, wie sind sie gruppiert, wie heissen die Menüpunkte in der Sprache der Nutzer und nicht in der des Organigramms? Daraus entstehen User Flows für die zwei oder drei Aufgaben, an denen das Produkt wirklich gemessen wird — bei einem KMU sind das meist «Leistung verstehen», «Vertrauen fassen» und «Kontakt aufnehmen».

Schritt drei sind Wireframes: bewusst graue, ungestaltete Entwürfe. Der Verzicht auf Farbe ist Absicht. Solange nichts hübsch ist, diskutieren alle Beteiligten über Reihenfolge, Umfang und Verständlichkeit statt über Geschmack. Änderungen kosten in dieser Phase Minuten; dieselbe Änderung nach der Entwicklung kostet Tage.

Schritt vier ist das UI Design und der klickbare Prototyp — in der Regel in Figma. Wichtig ist, dass der Prototyp nicht nur den Idealweg zeigt, sondern die Zustände dazwischen: Ladevorgänge, Validierungsfehler, leere Listen, sehr lange Produktnamen. Wer diese Zustände erst in der Entwicklung entdeckt, gestaltet sie nicht — er improvisiert sie.

Schritt fünf ist der Test. Fünf Testpersonen decken laut Jakob Nielsen (Nielsen Norman Group, basierend auf Nielsen und Landauer 1993) in einer Runde rund 85 Prozent der Usability-Probleme eines Prototyps auf. Diese Zahl gilt für Probleme, die man durch Beobachtung findet, nicht für Geschmacksfragen oder Marktakzeptanz. Sie ist trotzdem der Grund, warum ein Test mit fünf Personen fast immer besser investiert ist als eine weitere interne Abstimmungsrunde.

Schritt sechs ist die Übergabe. Ein Design-System hält Farben, Typografie, Abstände und Komponenten an einem Ort fest, damit die zwanzigste Seite noch aussieht wie die erste. Ohne Design-System driftet jedes Projekt, sobald mehr als eine Person daran arbeitet.

Ein Beispiel, das wir offenlegen können, weil es auf dieser Domain steht: Die häufigste Frage vor einem Webprojekt lautet «Was kostet das?». Die übliche Antwort einer Agentur ist ein Kontaktformular — der Nutzer soll seine Frage aufgeben und auf Rückruf warten. Das ist aus Sicht der Agentur bequem und aus Sicht des Nutzers der Abbruchpunkt.

Die UX-Entscheidung war, die Frage vor dem Formular zu beantworten statt danach. Daraus wurde der Projekt-Rechner: ein paar Angaben zu Umfang, Seitenzahl und Funktionen, und am Ende steht eine Spanne, bevor irgendeine Adresse eingegeben wird. Der Konfigurator macht dasselbe für den Leistungsumfang.

Die UI-Entscheidungen sind die Ebene darüber und in diesem Fall genauso entscheidend: Ein einziger Schritt pro Bildschirm statt eines langen Formulars. Ein sichtbarer Fortschritt, damit klar ist, wie lange es noch dauert. Grosse Antwortflächen, die auf dem Telefon mit dem Daumen erreichbar sind. Und ein Ergebnis, das als Spanne formuliert ist, nicht als Scheingenauigkeit — eine Zahl, der niemand glaubt, hilft niemandem.

Der Punkt des Beispiels ist nicht das Werkzeug. Der Punkt ist die Reihenfolge: Erst wurde die Frage der Nutzer identifiziert, dann der Ablauf gebaut, dann die Oberfläche gestaltet. Umgekehrt wäre ein hübsches Formular entstanden, das dieselbe Frage weiterhin unbeantwortet lässt.

In grossen Organisationen sind die Rollen getrennt. Ein UX Designer oder eine UX Researcherin arbeitet an Recherche, Informationsarchitektur, Flows und Tests. Ein UI Designer arbeitet an visueller Sprache, Komponentenbibliothek und Barrierefreiheit der Oberfläche. Ein Interaction Designer kümmert sich um Bewegung und Rückmeldung, ein Content Designer um die Wörter im Interface — Beschriftungen, Fehlermeldungen, Leerzustände. Sie klingen nebensächlich und entscheiden trotzdem oft über Abbruch oder Abschluss.

In Schweizer KMU-Projekten sind diese Rollen fast nie getrennt. Dort macht eine Person alles, was in einem Konzern vier Personen machen — was in Ordnung ist, solange die Reihenfolge stimmt und die Tests nicht ausfallen. «Product Designer» ist die heute übliche Sammelbezeichnung für genau dieses Profil.

Wichtig für die Einordnung: Ein Design-Team ist kein Entwicklungsteam. Ein Figma-Prototyp ist keine Website. Zwischen dem fertigen Design und dem funktionierenden Produkt liegt die Umsetzung — und genau dort geht Gestaltung am häufigsten verloren, wenn Design und Entwicklung getrennt eingekauft werden. Wie diese Übergabe bei einem Webprojekt konkret aussieht, steht unter Webdesign Zürich.

Diese Seite ist von einer Agentur geschrieben und beschreibt die Disziplin aus Auftraggeber-Sicht. Wer Berufseinstieg, Ausbildung oder Gehalt recherchiert, ist mit den Angeboten von Hochschulen, Fachverbänden und der Nielsen Norman Group besser bedient — wir bilden nicht aus und geben dazu keine Auskunft, die wir belegen könnten.

Die Web Content Accessibility Guidelines (WCAG) des W3C sind seit Version 2.2 der übliche Bezugspunkt. Für die tägliche Design-Arbeit bedeuten sie vor allem vier Dinge: ausreichender Farbkontrast zwischen Text und Hintergrund, jede Funktion auch mit der Tastatur erreichbar, ein sichtbarer Fokusrahmen, und Formularfelder mit echten Beschriftungen statt nur mit Platzhaltertext.

Diese vier Punkte sind keine Sonderausstattung für eine kleine Gruppe. Kontrast hilft jedem, der draussen auf ein Telefon schaut; Tastaturbedienbarkeit hilft jedem, der schnell arbeitet; echte Beschriftungen helfen jedem, der ein Formular nach einer Unterbrechung wieder aufnimmt. Mehr dazu unter Digitale Barrierefreiheit.

Rechtlich ist die Lage in der Schweiz differenziert: Verbindliche Vorgaben treffen zuerst Bund und Verwaltung. Wer allerdings Produkte oder Dienstleistungen in den EU-Markt verkauft, fällt unter den European Accessibility Act, der seit dem 28. Juni 2025 gilt. Für ein Schweizer Unternehmen mit EU-Kunden ist Barrierefreiheit damit keine reine Stilfrage mehr. Prüfen Sie den konkreten Fall mit einer Rechtsberatung — wir liefern die technische und gestalterische Umsetzung, keine Rechtsauskunft.

Bei DLM Digital beginnt ein UX-Audit bestehender Seiten bei CHF 1'500. Ein UX/UI-Design-Sprint für einen abgegrenzten Bereich — eine Landingpage, ein Anmeldeprozess, ein Konfigurator — beginnt bei CHF 6'000. Ein vollständiges Produktdesign mit Recherche, Design-System und Tests beginnt bei CHF 15'000. Eine komplette Website inklusive Umsetzung liegt je nach Umfang zwischen CHF 3'000 und CHF 25'000; ein validierter Prototyp für ein neues digitales Produkt beginnt bei CHF 10'000.

Und jetzt der Teil, den Agenturen selten schreiben: Es gibt Fälle, in denen ein eigenes UX-Projekt die falsche Ausgabe ist. Wenn Sie eine fünfseitige Firmenwebsite mit Kontaktformular brauchen und Ihr Angebot sich in einem Satz erklären lässt, ist ein UX-Prozess mit Recherche und Testrunden überdimensioniert. Nehmen Sie ein sauber gemachtes Standard-Layout, investieren Sie die Differenz in Texte und Bilder, und ziehen Sie einen echten Nutzen daraus.

Ebenfalls die falsche Reihenfolge: ein Redesign, solange niemand weiss, warum Besucher abspringen. Wer ohne Datengrundlage neu gestaltet, tauscht ein ungeprüftes Design gegen ein anderes ungeprüftes Design und hat danach nur eine neue Meinung. Beginnen Sie mit Analytics, ein paar Nutzergesprächen und einem Audit; das kostet einen Bruchteil und sagt Ihnen, ob ein Redesign überhaupt das Problem ist.

Und ein dritter Fall: Wenn die eigentliche Schwäche im Angebot, im Preis oder im Vertrieb liegt, löst kein Interface das. Ein besseres Formular verkauft kein Produkt, das niemand will. Wir sagen das lieber im Erstgespräch als nach der dritten Rechnung.

Brauchbare Messgrössen sind: die Task-Success-Rate (wie viele Testpersonen schaffen die Aufgabe ohne Hilfe), die Zeit bis zum Ziel, die Abbruchquote an jedem einzelnen Schritt eines Ablaufs, die Zahl der Support-Anfragen zu einem bestimmten Bildschirm, und die Conversion Rate über einen Zeitraum, der lang genug ist, um nicht Zufall zu sein. Dazu kommen technische Werte, die die Erfahrung direkt betreffen — Core Web Vitals messen, ob eine Oberfläche schnell sichtbar ist und beim Antippen zuverlässig reagiert.

Zur Einordnung einer Zahl, die in diesem Themenfeld unvermeidlich auftaucht: Die viel zitierte Behauptung, jeder in UX investierte Franken bringe hundert zurück, geht auf eine ältere Forrester-Publikation zurück und wird seither ohne prüfbare Rechnung weitergereicht. Ebenso die Angabe, gute UX steigere die Conversion um 200 bis 400 Prozent. Beide Zahlen sind für Ihr Projekt wertlos, weil sie nicht sagen, wovon aus, in welcher Branche und über welchen Zeitraum. Wir verwenden sie nicht.

Sinnvoll ist stattdessen die eigene Ausgangsmessung: Wie viele Besucher erreichen heute das Kontaktformular, wie viele senden es ab, wo genau bricht der Rest ab? Diese vier Zahlen kosten nichts ausser einem sauberen Analytics-Setup und machen jede spätere Design-Entscheidung überprüfbar — statt sie zur Geschmacksfrage zwischen Agentur und Geschäftsleitung zu machen.

Welche Gestaltungsmoden gerade laufen und welche davon überhaupt einen Nutzen haben, steht im Artikel UI/UX Design Trends. Wie sich Layouts über Bildschirmgrössen verhalten, erklärt Responsive Design.