UIUX Zeichnung von Hand
  • Kategorie:
    • Know-how

UX vs. UI

User Experience vs. User Inferface

UX steht für User Experience und bedeutet wörtlich Nutzererfahrung oder Nutzungserlebnis.
UI steht für User Interface und definiert die Benutzeroberfläche von einem Produkt (was für den Benutzer sichtbar ist).

Unterschied anhand eines Beispiels:

UIUX Zeichnung einfach erklärt

In diesem Beispiel sieht man unter UI zwei unterschiedlich gestaltete Flaschen. Optisch wirken beide Designs ansprechend, die obere Flasche wirkt sogar fast ein bisschen edler. Jetzt kommt das UX ins Spiel, das Nutzungserlebnis.

Was passiert, wenn ich die obere Flasche verwende? Der Benutzer hat Probleme damit, den Inhalt aus der Flasche zu drücken. Der Grund dafür liegt darin, dass man die Flasche nicht auf den Kopf stellen kann. Läuft Flüssigkeit aus der Flasche hinaus, dann nur in unterschiedlich grossen Mengen. Das Nutzungserlebnis ist negativ, der Kunde ist unzufrieden.

Bei der unteren Flasche wirkt das Design ansprechend und das Nutzungserlebnis ist positiv, da man die Flasche auf den Kopf stellen kann und entsprechend die Flüssigkeit in gleichmässigen Mengen austritt. Der Kunde ist zufrieden.


UI-Design Tools

Für das Design einer Website können unterschiedliche Tools verwendet werden. Wir arbeiten unter anderem mit Adobe XD, Sketch, Zeplin und Figma. Adobe XD, Sketch und Zeplin sind kostenpflichtig, bieten aber eine kostenlose Testversion an. Figma ist kostenlos verfügbar. Alle vier Programme sind von der Bedienbarkeit ähnlich aufgebaut.

Wir wünschen viel Freude und Erfolg beim ausprobieren der UI-Design Tools!