Skip to main content
All Posts By

Designsensor

Navigation

navigation design

Navigation

Navigation bezeichnet den Akt des Bewegens zwischen den Bildschirmen einer App, um bestimmte Aufgaben zu erledigen

navigation design

Navigieren wird durch unterschiedliche Navigationskomponenten und die Einbettung des Navigationsverhaltens in den Inhalt ermöglicht. Dabei gilt es die unterschiedlichen Plattformeigenheit von Google und Apple zu beachten.

Was ist Navigationsdesign?

Die Informationsarchitektur (IA) und das Navigationsdesign hängen eng miteinander zusammen und müssen in der Praxis klar unterschieden werden. Während die IA die Struktur des digitalen Produkts definiert und die Gestaltung der Navigation mitbestimmt, setzt sich die Navigation des digitalen Produkts aus verschiedenen User Interface-Komponenten und deren Verhalten zusammen.

Menschen neigen dazu, sich der Navigation einer App nicht bewusst zu sein, bis sie ihre Erwartungen nicht erfüllt. Ihre Aufgabe ist es, die Navigation so zu implementieren, dass sie die Struktur und den Zweck Ihrer App unterstützt, ohne die Aufmerksamkeit auf sich zu ziehen. Die Navigation sollte sich natürlich und vertraut anfühlen und sollte nicht die Oberfläche dominieren oder den Fokus vom Inhalt ablenken. Apple, Human Interface Guidelines

Google unterscheidet in den material.io Guidelines die «Seitliche Navigation», die «Vorwärtsnavigation» und die «Rückwärtsnavigation». Ergänzt wird das Thema durch die direkte Navigation mittels Suche. Apple unterscheidet in den Human Interface Guidelines die «Hierarchische Navigation», «Flache Navigation» und die «Inhaltsgesteuerte oder erlebnisorientierte Navigation».

Seitliche Navigation (Apple: Flache Navigation)

bezieht sich auf das Navigieren zwischen Bildschirmen auf derselben Hierarchieebene. Die primäre Navigationskomponente sollte den Zugriff auf alle Ziele auf der obersten Hierarchieebene ermöglichen.

UI-Komponenten für die seitliche Navigation sind

  • Global Header
  • Side-Bar, Navigation Drawer, Navigation Rail

Vorwärtsnavigation (Apple: Hierarchische Navigation)

bezieht sich auf das Bewegen

  • zwischen Screens auf aufeinanderfolgenden Hierarchieebenen
  • auf Schritte in einem Ablauf / Flow
  • über eine App hinweg

Bei der Vorwärtsnavigation wird das Navigationsverhalten in folgende UI-Komponenten eingebunden:

  • Container (wie z.B. Listen, Bilder, Grafiken)
  • Buttons
  • Links
  • Suche

Rückwärtsnavigation

bedeutet, sich rückwärts durch Bildschirme zu bewegen, entweder

  • chronologisch (innerhalb einer App oder zwischen verschiedenen Apps)
  • hierarchisch (innerhalb einer App)

Vom Bildschirm «xyz» aus können Benutzende auf eine von zwei Arten rückwärts navigieren:

  • aufwärts in der Hierarchie zum übergeordneten Bildschirm (z.B. mittels Breadcrumb)
  • chronologisch, zu einem Suchergebnisbildschirm, aber nur, wenn der Benutzer von diesem Bildschirm aus navigiert hat

Weiter Anmerkungen und Hinweise zum Thema Rückwärtsnavigation

Umgekehrt chronologisch

Die umgekehrte chronologische Navigation bezieht sich auf das Navigieren in umgekehrter Reihenfolge durch die Historie der zuletzt angezeigten Bildschirme eines Benutzenden.

Benutzende können sich zwischen Bildschirmen innerhalb einer App (oder über mehrere Apps hinweg) bewegen. Beispielsweise ist die Schaltfläche «Zurück» in einem Webbrowser eine Form der umgekehrten chronologischen Navigation. Diese Art der Navigation wird normalerweise vom Betriebssystem oder der Plattform bereitgestellt. Diese definieren das Rückwärtsverhalten und wie Benutzende auf diese Funktionalität zugreifen können.

Aufwärtsnavigation

Die Aufwärtsnavigation ermöglicht es Benutzenden, innerhalb der Hierarchie einer einzelnen App eine Ebene nach oben zu navigieren, bis der Start- oder Top-Level-Bildschirm der App erreicht ist.

Der Pfeil nach oben in der oberen App-Leiste ist zum Beispiel eine Form der Aufwärtsnavigation. Die Aufwärtsnavigation sollte für alle untergeordneten Bildschirme in einer App implementiert werden und den Plattformrichtlinien folgen.

Aus der Praxis

5 Fragen, die in jedem Projekt beantwortet werden müssen:

  • Welches Navigationskonzept erwarten die Nutzenden bei dieser Art von Produkt?
  • Welche Navigation müssen wir immer anbieten (Suche, Filter, Themen)?
  • Wo im Seitenlayout erwarten die Nutzer die Navigationskomponente?
  • Können wir das Navigationssystem für Untermenüs auf dem Handy vertikal teilen?
  • Benötigen wir wirklich eine tief verschachtelte Navigation (>3 Ebenen)?

Definieren Sie die IA bevor Sie mit dem Design der Navigation beginnen

Die IA muss nicht unbedingt vollständig fertig sein, damit Sie mit Wireframes und ersten Prototypen starten können – aber es ist zwingend notwendig zu wissen, wie komplex und umfangreich das geplanten digitale Produkt wird. Treffen Sie Entscheide für bestimmte Navigationskomponenten nicht nach dem Aussehen und ihren persönlichen Präferenzen. Setzen Sie Navigationskomponenten ein, die den Bedürfnissen und Erwartungen der Nutzenden und den Inhalten des digitalen Produkts dienen.

Links zum Thema Accessibility

Weitere Beiträge

designsensor infografik interaction design principles interaktionsdesign prinzipien

Interaction Design

| Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…
navigation design

Navigation

| Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Interaction Design, Wissen | No Comments
Navigation Navigation bezeichnet den Akt des Bewegens zwischen den Bildschirmen einer App, um bestimmte Aufgaben zu erledigen Navigieren wird durch unterschiedliche Navigationskomponenten und die Einbettung des Navigationsverhaltens in den Inhalt…
Zurück zur Übersicht

Kontakt

Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

Wir freuen uns auf Ihre Kontaktaufnahme!

Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

Kontaktformular









    Gestaltgesetze

    Gestaltgesetze UX Heuristik

    Gestaltgesetze

    Gutes Design ist so wenig Design wie möglich. Dieter Rams

    Gestaltgesetze UX Heuristik

    Die Anwendung der Gestaltgesetze helfen der Designerin bei der Strukturierung des Layouts und der Anordnung der einzelnen User Interface Elemente

    Warum brauchen wir Gestaltgesetze?

    Die Gestaltgesetze spielen im Zusammenhang mit der Gestaltung digitaler Produkte eine wichtige Rolle. Ohne Beachtung dieser Regeln kann es leicht passieren, dass beispielsweise zusammengehöriger Inhalt nicht als solcher erkannt wird, und sich die Benutzenden nicht orientieren können.

    Wir Menschen orientieren uns an unbekannten Orten indem wir nach Vertrautem suchen, um daraus weitere Informationen abzuleiten. Aus Erfahrung wissen wir beispielsweise, dass die Dorfkirche im Zentrum des Ortes steht. So können wir uns am Kirchturm orientieren, um das Zentrum zu finden. Auch in der virtuellen Welt orientieren wir uns an vertrauten Mustern und erwarten, dass bekannte User Interface Elemente an einer bestimmten Stelle im Layout positioniert sind.

    Um die richtigen Entscheide fällen zu können, muss die Interface Designerin die Erwartungen der Benutzenden kennen und wissen, wie ihr Blickverhalten ist. Mit diesen Kenntnissen, und einem Set an Gestaltungsregeln ausgerüstet, kann die Struktur des digitalen Produkts entwickelt werden.

    Die Gestaltgesetze basieren auf der Erkenntnis, dass die menschliche Wahrnehmung in ihrem Effizienzstreben bei der Verarbeitung von Informationen auf vorhandene Erfahrungen zurückgreift.

    Dabei wählt unser Gehirn die Interpretationsmöglichkeit aus, welche die kleinste kognitive Anstrengung verursacht. Automatisch reduzieren wir die Anzahl der zu verarbeitenden Objekten, indem wir ähnliche Bildbestandteile zu Einheiten zusammenfassen. Ein gutes User Interface beachtet die Regeln der Gestaltgesetze und bricht diese bewusst, damit eine spannende und zugängliche Benutzeroberfläche entsteht.

    Gesetz der Ähnlichkeit

    Das Grundgesetz der Gestaltpsychologie ist das Gesetz der Ähnlichkeit. Dies besagt, dass die menschliche Wahrnehmung zusammengehörende Elemente durch Ähnlichkeiten erkennt. Somit werden einander ähnliche oder gleiche Elemente eher als zusammengehörig erlebt, als einander unähnliche. Umgekehrt nehmen wir Elemente, die sich in wichtigen Merkmalen unterscheiden, als voneinander unabhängig wahr.

    Ähnlichkeit lässt sich mittels

    • Form
    • Farbe
    • Textur
    • Position
    • Orientierung
    • Grösse

    ausdrücken.

    Design Basics:

    Gestalten Sie Interface Elemente mit ähnlichen oder gleichen Inhalten / Funktionen immer gleich

    Gesetz der Nähe

    Elemente mit geringen Abständen zueinander nehmen wir als zusammengehörig wahr. In digitalen Produkten kann das Gesetz der Nähe angewendet werden, um strukturelle Zusammenhänge (beispielsweise ein Bild mit dazugehörendem Text) abzubilden, und damit die Informationsdichte zu reduzieren.

    Design Basics:

    Stellen Sie zusammengehörende Interface Elemente immer möglichst nah beieinander dar

    Gesetz der Prägnanz (guten Gestalt)

    Ein zentrales User Interface Element, das sich deutlich vom Rest abheben soll, kann mittels prägnanter Gestaltung in den Fokus gerückt werden. Wesentliche Gestaltungsmittel sind Farbe, Grösse, Form. Die menschliche Wahrnehmung bevorzugt Gestalten, die sich von anderen durch ein bestimmtes Merkmal abheben.

    Design Basics:

    Priorisieren Sie die unterschiedlichen User Interface Elemente. Welches Element soll am prägnantesten sein? Tipp: Dieses erkennen Sie, wenn Sie mit zugekniffenen Augen «unscharf» das User Interface betrachten.

    Gesetz der Geschlossenheit

    Unsere Wahrnehmung ist bestrebt, mehrere Objekte möglichst als Einheit zu sehen. Dabei identifizieren wir einfache und bekannte Formen schneller als komplexe und unbekannte. Das Gesetz der Geschlossenheit wird sehr häufig angewendet (z.B. Umrandung der Schaltfläche mit Konturlinien, Gliederung des Bildschirms durch Farbflächen, um hier zwei zu nennen). Eine vollständige Geschlossenheit ist nicht immer notwendig. Unser Gehirn ergänzt bei bekannten Formen automatisch die fehlenden Linien durch erdachte Linien.

    Design Basics:

    Nutzen Sie das Gesetz der Geschlossenheit, um ähnlich gestaltete Informationen / Funktionen voneinander zu trennen, wenn diese nicht zusammen gehören. Fassen Sie mittels realen, oder kognitiv ergänzten Linien, zusammengehörende Informationen / Funktionen zu einer Einheit zusammen.

    Gesetz der Kontinuität

    Das Gesetz der Kontinuität beschreibt, dass wir Menschen dazu neigen, einzelne Elemente so zu gruppieren, dass sie die erdachte Linie oder Kurve in Sinne ihrer bisherigen Linienführung fortsetzen. Selbst wenn sich in einem Diagramm zwei Linien schneiden, führen wir im Kopf automatisch den «natürlichen» Verlauf fort, und nehmen nicht an, dass die Linien an dieser Stelle einen Knick machen.

    Design Basics:

    Wenden Sie die die Wirkung dieses Gesetztes zum Gliedern einzelner Hierarchiestufen an. Inhalte auf der gleichen (erdachten) Fluchtlinie gehören zur gleichen logischen Ebene. Dies ist zum Beispiel bei einer komplexen Navigation hilfreich.

    Gesetz des gemeinsamen Schicksals

    Auch sehr unterschiedliche Elemente, die sich in die gleiche Richtung oder im gleichen Rhythmus bewegen, werden als zusammengehörige Gruppe wahrgenommen. Die Ähnlichkeit im Verhalten kann mittels Bewegung und Animation erzeugt werden. Einblenden, ausklappen, verschieben und andere. Auch akustische Signale, wie Geräusche oder Klänge, helfen dem Benutzenden bestimmte Ereignisse oder Meldungen einordnen zu können.

    Design Basics:

    Wenden Sie das Gesetz an, um Grundelemente (ruhend) und Figuren (bewegt) zu verdeutlichen.

    Gesetz der gemeinsamen Regionen

    Elemente in abgegrenzten Gebieten werden als zusammengehörig wahrgenommen. Das Gesetz der gemeinsamen Region hat vor allem Bedeutung, wenn mehrere Elemente (Gruppen) gleichzeitig auf einem Screen vorhanden sind.

    Design Basics:

    Grenzen Sie Elemente, die zusammengehörig sind, mittels hinterlegter Farbfläche oder Konturline, von den anderen Elementen ab.

    Gesetz der Verbundenheit

    Miteinander verbundene Formen werden als Einheit wahrgenommen. Unter Umständen kann das Gesetz der Verbundenheit andere Gestaltgesetze, wie z.B. das Gesetz der Nähe oder das Gesetz der Ähnlichkeit, übersteuern.

    Design Basics:

    Wenden Sie das Gesetz der Verbundenheit an, um Elemente, die zusammen eine Einheit bilden, miteinander zu verbinden.

    Weitere Beiträge

    Gestaltgesetze UX Heuristik

    Gestaltgesetze

    | Beyond Interface, Designmethoden, Designsensor, Expertise Holistic UX- und UI-Design, Information Design, User Interface Design, Wissen | No Comments
    Gestaltgesetze Gutes Design ist so wenig Design wie möglich. Dieter Rams Die Anwendung der Gestaltgesetze helfen der Designerin bei der Strukturierung des Layouts und der Anordnung der einzelnen User Interface…
    informationsarchitecture ia

    Informationsarchitektur

    | Beyond Interface, Design Strategy, Designsensor, Expertise, Expertise Digital Workplaces, Expertise Holistic UX- und UI-Design, Information Design, User Experience Design, User Interface Design, Wissen | No Comments
    Informationsarchitektur – Bauplan der Designstruktur Die Informationsarchitektur bildet das Rückgrat jeder digitalen Anwendung Die Informationsarchitektur (IA) organisiert, strukturiert und kennzeichnet Inhalte. Die IA hat zum Ziel, den Benutzenden relevante Informationen…
    Zurück zur Übersicht

    Kontakt

    Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

    Wir freuen uns auf Ihre Kontaktaufnahme!

    Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

    Kontaktformular









      Informationsarchitektur

      informationsarchitecture ia

      Informationsarchitektur – Bauplan der Designstruktur

      Die Informationsarchitektur bildet das Rückgrat jeder digitalen Anwendung

      informationsarchitecture ia

      Die Informationsarchitektur (IA) organisiert, strukturiert und kennzeichnet Inhalte. Die IA hat zum Ziel, den Benutzenden relevante Informationen zur Erledigung ihrer Aufgaben zur Verfügung zu stellen.

      Wir Menschen haben uns daran gewöhnt, die Inhalte und Funktionalität der digitalen Produkte so zu erleben, wie viele von ihnen sind: gut strukturiert und einfach zu bedienen. Dies passiert nicht zufällig.

      Was ist Informationsarchitektur?

      Informationsarchitektur ist eine Wissenschaft der Organisation und Strukturierung von Inhalten für Websites, Mobile Apps, Social Media und Softwareoberflächen. Die IA ist kein Bestandteil des User Interfaces (UI) – viel mehr versorgt die IA das UI mit Informationen. Die IA wird in Tabellen und Diagrammen dokumentiert, nicht aber in Wireframes, umfassenden Layouts oder Prototypen. Auch wenn die IA selbst nicht im UI zu sehen ist, hat sie Auswirkungen auf die User Experience (UX). Eine gute IA vermittelt den Nutzern das gute Gefühl, Inhalte entsprechend ihren Anforderungen und Erwartungen zu bekommen.

      Die IA ist der Bauplan der Designstruktur. UX-Designer verwenden die IA als Basismaterialien, um das Navigationssystem zu planen

      Der Zweck der IA besteht darin, den Benutzenden die richtigen Informationen zu geben, damit diese verstehen, wo sie sich befinden und welche Informationen sie gefunden haben. Die IA beeinflusst einerseits die Content-Strategie, durch die Verwendung der passenden Begriffe, und andererseits versorgt  sie das User Interface mit Informationen, die eine zentrale Rolle beim Prototyping und Gestalten der Interaktion spielen.

      Hauptkomponenten der Informationsarchitektur sind:

      Organisationsschemata und Strukturen

      Wie werden Informationen kategorisiert und strukturiert?

      Es können drei Hauptorganisationsstrukturen unterschieden werden:

      • hierarchisch
      • sequentiell
      • matrix

      Weiter können Inhalte

      • chronologisch
      • alphabetisch
      • thematisch
      • nutzerspezifisch

      • strukturiert werden,

      Beschriftungssysteme

      Wie werden zusammengehörende Informationen effektiv vereint und dargestellt?

      Ein Beispiel: Hinter dem Label «Kontakt» erwarten Benutzende alle relevanten Informationen und Funktionalitäten zu erhalten, um mit dem betreffenden Menschen in Kontakt treten zu können.

      Navigationssystem

      Wie bewegen sich die Benutzenden durch die Informationen?

      Das Navigationssystem im Sinne der IA beinhaltet die Art und Weise, wie sich Benutzer durch den Inhalt bewegen und besteht aus einer Vielzahl an Mustern und Komponenten.

      Suchsysteme

      Wie können Benutzende mit der Suche Informationen finden?

      Informationsreiche Produkte sollten eine Suchfunktion mit Filtern und erweiterten Tools anbieten, die die Benutzenden beim Finden unterstützen.

      Vorgehen

      Content Inventar

      Bestehende Inhalte und Funktionalitäten lokalisieren und identifizieren

      Content Audit

      Inhalte auf Nützlichkeit, Richtigkeit, Artikulation und Gesamteffektivität prüfen

      Informationsgruppierung

      Nutzerzentrierten Beziehungen zwischen den Inhalten definieren

      Entwicklung der Taxonomie

      Namenskonvention (kontrolliertes Vokabular) definieren, um diese überall anzuwenden

      Erstellen von Informationsbeschreibungen

      Nützliche Metadaten definieren (die genutzt werden können, um Navigationselemente, die das Entdecken in Inhalten erleichtert, zu generieren)

      Weitere Beiträge

      designsensor infografik experience principles erlebnisprinzipien

      Experience Principles

      | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise, Expertise Design Strategy, Expertise Human Machine Interface, User Experience Design, Wissen | No Comments
      Designmethode – Experience Principles Wie Sie mit Erlebnisprinzipien Kundenbedürfnisse und Markenpersönlichkeit in Einklang bringen Experience Principles (deutsch: Erlebnisprinzipien) beschreiben wie Kundinnen und Kunden einer Marke deren Produkte und Dienstleistungen konsistent…

      Millers UX Law

      | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Usability Accessibility, User Experience Design, Wissen | No Comments
      Millers UX Law Warum 7 plus/minus 2 eine gute Wahl ist Das Millersche Gesetz besagt, dass sich eine Person im Durchschnitt nur 7 plus/minus 2 Objekte im Gedächtnis merken kann.…
      Zurück zur Übersicht

      Kontakt

      Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

      Wir freuen uns auf Ihre Kontaktaufnahme!

      Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

      Kontaktformular









        Hicks UX Law

        Hicks UX Law

        Hicks UX Law

        Warum Sie weniger Optionen schneller machen

        Hicks UX Law

        Das Hicksche Gesetz besagt, dass je grösser die Auswahl an Möglichkeiten ist, umso mehr Zeit und Anstrengung braucht ein Mensch, um eine Wahl zu treffen. Eine Nutzerin oder ein Nutzer braucht also mehr Zeit um eine Aufgabe zu lösen, wenn er oder sie aus mehreren Optionen auswählen muss. Machen Sie durch Reduktion von Optionen Ihre Nutzerinnen und Nutzer schneller und zufriedener.

        Nehmen Sie ihren Nutzenden Entscheide ab

        Die Anwendung des Hickschen Gesetzt im UX/UI-Design unterstützt ein positives Nutzererlebnis. Bei der Konzeption eines digitalen Produkts gilt es herauszufinden, welche Inhalte und Funktionen von den Nutzenden im jweiligen Kontext wirklich gewünscht werden. Anschliessend müssen die Nutzenden sicher zu ihrem Ziel geführt werden. Dabei ist es wichtig, dass die Nutzenden auf ihrem Weg nicht abgelenkt werden und zu viele Entscheide fällen müssen. Denn:

        Zu viele Optionen sind verwirrend und eine Entscheidung zu treffen fällt uns Menschen schwerer, wenn viele Optionen zur Auswahl stehen.

        Besonders bei Kontroll-Systemen und Anlagesteuerungen, wenn die Reaktionszeit kritisch sein kann und schnelle Entscheide gefällt werden müssen, ist es wichtig, die Benutzenden nicht mit unnötigen Entscheidungen zu belasten. Aber auch bei alltäglichen Produkten ist es hilfreich, die Optionen auf dem User Interface zu reduzieren und auf alles zu verzichten, was die Nutzenden vor unnötige Entscheide stellt.

        Schaffe Sie Ordnung mit Kategorien

        Praktisch alle Website-Navigationen funktionieren nach dem Hickschen Gesetzt. Die Navigation strukturiert und gruppiert zusammengehörende Inhalte in übergeordnete Menüpunkte. Erst beim Anklicken oder Taben erscheinen die weiteren Inhalte. Eine gute Informationsarchitektur und eine passende Navigation helfen auch bei einem umfangreichen Umfang (z.B. Galaxus, Booking) schnell und möglichst direkt die für die jeweiligen Nutzenden relevanten Inhalte zu finden.

        So wenden Sie es an

        Analysieren Sie ihre Nutzerinnen und Nutzer und deren Bedürfnisse. Definieren sie die Inhalte und Funktionen, die sie brauchen um ihre Aufgaben zu erledigen ( Designmethode «Jobs to be done»). Reduzieren Sie die Optionen, um Nutzende nicht zu überfordern. Schaffen Sie Ordnung mit verschiedenen Kategorien und Zugängen. Die Designmethode Card Sorting ist eine hilfreiches Werkzeug, um herauszufinden, welche Kategorien für die Nutzenden sinnvoll sind und wie diese Kategorien benannt werden sollen. Probieren Sie es aus.

        Weitere Beiträge

        Designsensor Infografik Brand Persona Markenpersoenlichkeit

        Brandpersona

        | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise Design Strategy, Human Centered Design, Wissen | No Comments
        Designmethode – Brand Persona Die Brand Persona verkörpert das Markenversprechen Die Brand Persona ist ein Sammlung von Persönlichkeitsmerkmalen, Einstellungen und Werten, die Ihre Marke regelmässig präsentiert, um eine Verbindung zu…
        designsensor infografik interaction design principles interaktionsdesign prinzipien

        Interaction Design

        | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
        Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…
        Zurück zur Übersicht

        Kontakt

        Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

        Wir freuen uns auf Ihre Kontaktaufnahme!

        Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

        Kontaktformular









          10 Gesetze der Einfachheit

          Gesetzte der Einfachheit John Maeda

          Die 10 Gesetze der Einfachheit nach John Maeda

          Einfach ist schwer – sehr schwer sogar.

          Gesetzte der Einfachheit John Maeda

          Die Gesetze der Einfachheit dienen dazu, Produkte und Lösungen so zu gestalten, dass diese für die Nutzenden einfacher zu verstehen und zu benutzen sind und mehr Freude bereiten. Ein kurzer Leitfaden für Designerinnen und Nicht-Designer.

          John Maeda propagiert in seinem kleinen Buch das Prinzip «Simplicity» – «Einfachheit» als Grundprinzip des Lebens, wobei für ihn Reduktion, Zeiteffizienz und Funktionalität zentrale Merkmale sind. Dieses Prinzip lässt sich auf viele Lebensbereiche und Aufgabenstellungen anwenden. Maedas zehn Gesetze können uns dabei helfen, komplexe Sachverhalte einfacher erscheinen zu lassen, wodurch allmählich ein Gefühl von Sicherheit, Kontrolle und Durchschaubarkeit entsteht. Eine solche emotional positiv gefärbte Stimmung baut Ängste und Hemmungen beim Nutzen von Produkten ab und schafft eine zustimmende Haltung.

          Das 1. Gesetz

          Reduktion. Die einfachste Weise, Einfachheit zu erzielen, ist durch wohlüberlegte Reduktion.

          Am einfachsten erreicht man Einfachheit durch bewusstes Weglassen oder durch Verbergen. Die Entfernung von Funktionalitäten macht beispielsweise die Bedienung eines Produktes wie etwa eines DVD-Players viel einfacher, doch gleichzeitig schränkt dies auch die Verwendungsmöglichkeit ein. So gilt es einen Mittelweg zu finden, der möglichst die Bedienbarkeit vereinfacht und dennoch eine möglichst hohe Funktionalität erlaubt.

           

          Das 2. Gesetz

          Organisieren. Aufräumen lässt eine Vielzahl geringer erscheinen.

          Durch Strukturieren von komplexen Systemen erscheinen diese einfacher. Ein System aus vielen Teilen erscheint einfacher, wenn die Teile in sinnvolle Kategorien aufgeteilt sind. Das Zuordnen von Funktionen zu Kategorien erleichtert den Zugriff auf eine ansonsten unübersehbare Vielzahl von einzelnen Funktionen. Im Laufe der Sortierung entstehen jedoch auch oft Probleme:

          • Was gehört zu welcher Kategorie?
          • Wann soll etwas unter einer Rubrik versteckt werden und was muss unbedingt sichtbar bleiben?
          • Lassen sich Funktionen auch mehreren Kategorien zuordnen?

           

          Das 3. Gesetz

          Zeit. Zeitersparnis empfinden wir als Vereinfachung.

          Sinnvoller Umgang mit der Zeit und das Gefühl, die Zeit gut auszunutzen erzeugen positive Gefühle. Das Gefühl, Zeit zu sparen, erzeugt positive Emotionen. Wenn beispielsweise ein Computer lange braucht, bis er startbereit ist, wenn eine Website lange benötigt, bis sie geladen ist, dann wird Warten als unangenehm empfunden. Ist ein Computer dagegen sofort betriebsbereit oder öffnet sich eine App unmittelbar nach den Starten, dann wird dies als einfach empfunden.

           

          Das 4. Gesetz

          Lernen. Wissen macht alles einfacher.

          Je mehr man bereits weiss, desto leichter ist es, Neues hinzuzulernen. Je grösser das Vorwissen, desto einfacher erscheinen die Dinge. Wir alle kennen diese Aussagen wie «Lass es uns doch erst mal ausprobieren» oder «Wozu die Zeit verschwenden, um die Gebrauchsanweisung zu lesen?» Doch die Handhabung eines komplexen technischen Gerätes durch Ausprobieren zu erlernen verschlingt oft mehr Zeit, als vorher die Anleitung oder Gebrauchsanweisung zu lesen. Aus diesem Grund ist es sinnvoll, bekannte Bedienmuster bewusst einzusetzen oder in der Anwendung zu wiederholen, so dass das Gelernte mehrfach verwendet werden kann.

           

          Das 5. Gesetz

          Gegensätze. Einfachheit und Komplexität bedingen einander.

          Umso mehr alles um uns herum komplexer wird, umso mehr sticht das Einfache hervor. Und weil Technologie und digitale Produkte ständig an Komplexität gewinnen, ergibt sich ein ökonomischer Vorteil für die Übernahme der Strategie der Einfachheit, die ein Produkt von anderen absetzt und positioniert.

           

          Das 6. Gesetz

          Kontext. Das Umfeld von Einfachheit ist zweifellos nicht unbedeutend.

          Die blosse Fokussierung auf einen Gegenstand hilft weniger zu dessen Verständnis, als die Miteinbeziehung des Hintergrundes und Umfelds, in dem sich dieser Gegenstand befindet. Eine zu starke Fokussierung auf das blosse Produkt als Objekt im Designprozess lässt das Wichtige ausser Acht.

           

          Das 7. Gesetz

          Emotion. Mehr Emotionen sind besser als weniger Emotionen.

          Auch wenn es dem ersten Gesetz scheinbar widerspricht, so sind manchmal «ornamentale» und «üppigere» Design- und Informations-Elemente notwendig, um Emotionen mit ins Spiel zu bringen. Eine zu reduzierte Form kann eine Funktion, Anwendung oder Produkt als billig, ungestaltet oder sogar hässlich erscheinen lassen.

           

          Das 8. Gesetz

          Vertrauen. Wir vertrauen der Einfachheit.

          Ein System oder Produkt, welches schon weiss, was es zu tun hat, bevor oder wenn sich ein spezifischer Nutzer sich ihm zuwendet, erscheint diesem Nutzer als besonders einfach. Es kann aber auch das Gefühl der Bevormundung eintreten. Aus diesem Grunde ist es wichtig, dass wir einem System vertrauen.

           

          Das 9. Gesetz

          Fehlschläge. Manche Dinge können nicht einfach gemacht werden.

          Kann ich etwa eine Anleitung nicht mehr vernünftig lesen, weil ich zu viele Akronyme und Kürzel verwendet habe, so gilt es, die Vereinfachung rückgängig zu machen. Auch wenn ich ein Interface so vereinfacht habe, dass ich alle Rubriken anklicken muss, um zu sehen, welche Funktionen sich darunter verstecken, ist das für die Benutzung nicht ideal.

          Im 10. und letzten Gesetz fasst Maeda die Gesetze 1 bis 9 zusammen und definiert drei Schlüssel zur Einfachheit: away, open, power

           

          Das 10. Gesetz

          Das Eine. Einfachheit entsteht durch Fortlassen des Offensichtlichen und dem Hinzufügen von Wichtigem und Bedeutungshaftem.

          Entfernt (away)

          Mehr sieht nach weniger aus, wenn dies weit entfernt wird. Am Beispiel Google wird hier der Paradigmenwechsel hin zur Implementierung von Software als Service angeführt.

          Offen (open)

          Offenheit vereinfacht Komplexität. Dieses Prinzip verdeutlicht Maeda am Beispiel Linux (Open Source) und andererseits in offenen Schnittstellen (beispielsweise Amazon-API).

          Energie (power)

          Verwende weniger, erreiche mehr.

          Links zum Thema

          Weitere Beiträge

          Designsensor Infografik Brand Persona Markenpersoenlichkeit

          Brandpersona

          | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise Design Strategy, Human Centered Design, Wissen | No Comments
          Designmethode – Brand Persona Die Brand Persona verkörpert das Markenversprechen Die Brand Persona ist ein Sammlung von Persönlichkeitsmerkmalen, Einstellungen und Werten, die Ihre Marke regelmässig präsentiert, um eine Verbindung zu…
          designsensor infografik interaction design principles interaktionsdesign prinzipien

          Interaction Design

          | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
          Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…
          Zurück zur Übersicht

          Kontakt

          Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

          Wir freuen uns auf Ihre Kontaktaufnahme!

          Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

          Kontaktformular









            Aesthetik und Usability

            UX und UI Design – Ästhetik – Aesthetic Usability Effect

            Auch bei Produkten zählt der erste Eindruck – Warum ästhetische Produkte als benutzerfreundlicher empfunden werden

            Schöne, ansprechende oder zusammengefasst «ästhetische Produkte» werden laut verschiedenen Untersuchungen als benutzerfreundlicher angesehen, unabhängig ob sie es tatsächlich sind. Ebenfalls erhöht die empfundene Ästhetik die Wahrscheinlichkeit, das Produkt auch tatsächlich zu nutzen.

            Ästhetische Produkte sind besser

            Die Ästhetik [Wissenschaft vom sinnlich Wahrnehmbaren] spielt eine zentrale Rolle für die Art und Weise wie ein Produkt benutzt wird. Ästhetische Produkte sind effektiver bei der Bildung positiver Einstellungen als ein Produkt, welches als weniger schön empfunden wird. Gleichzeitig macht ein «schönes» Produkt die Benutzenden toleranter gegenüber allfälligen Designproblemen. Wer eine persönliche und positive Beziehung zu einem Produkt hat, begegnet diesem mit Zuneigung, Loyalität und auch Geduld. Welche Produkte sind das bei Ihnen? Warum?

            Schönheit ist keine Eigenschaft an den Dingen selbst. Sie existiert nur im Bewusstsein des Betrachters

            Subjektive Ästhetik

            «Schönheit ist keine Eigenschaft an den Dingen selbst. Sie existiert nur im Bewusstsein des Betrachters, und jedes Bewusstsein nimmt eine unterschiedliche Schönheit war.» David Hume 1757

            Was als «schön» empfunden wird ist:

            subjektiv
            • abhängig von der Zeit und dem Umfeld
            • abhängig vom eigenen Wissen und den Erfahrungen
            Objektive Ästhetik

            […] doch zeigen die Ergebnisse der objektiven Ästhetik, dass es Gesetzmässigkeiten zu geben scheint, die für alle Menschen gleichermassen gelten.

            Konkret bedeutet das für uns Designerinnen und Designer, dass ein Objekt von vielen Menschen als «schön» empfunden wird, wenn dieses

            • harmonisch
            • geschlossen
            • symmetrisch

            • ist.

            «Schönheit» liegt sprichwörtlich im Auge des Betrachters. Aus Sicht der Produktentwicklung bildet der Ausgleich zwischen objektiven und subjektiven Eigenschaften ästhetischer Wahrnehmung den Ausgangspunkt für die Marktsegmentierung und Definition eines neuen Produkts. In diesem Zusammenhang spielen die Phänomene der «Komplexität» und «Ordnung» eine zentrale Rolle.

            Ordnung versus Komplexität

            Komplexität und Ordnung sind Gegenpole, die einander ausschliessen. Sie bilden ein Spannungsfeld für die ästhetischen Wahrnehmung zwischen «unerträglich und verwirrend» auf der der einen Seite, sowie «unerträglich und fad» auf der anderen Seite der Skala. Dazwischen gibt es in der Mitte einen Bereich, der für die Wahrnehmung der meisten Nutzenden besonders attraktiv ist. Die Skala kann sowohl auf einzelne Gestaltelemente, wie auch auf das ganze Produkt angewendet werden. So kann beispielsweise ein Produkt mit hoher Ordnung und klarer Struktur, kombiniert mit einem komplexen Farbklima, eine attraktive und ausgeglichenen Gesamterscheinung erhalten.

            So wenden Sie es an:
            • Finden Sie heraus, was für Ihre Nutzenden subjektiv attraktiv ist.
            • Berücksichtigen Sie bei der Gestaltung die Prinzipien der objektiven Ästhetik, wie beispielsweise «der Goldene Schnitt» oder ein harmonisches Farbklima.
            • Suche Sie im Spannungsfeld von «Ordnung und Komplexität» eine ausgeglichenen Gesamterscheinung.

            Wie John Maeda in seinen «10 Gesetze der Einfachheit» schreibt, bedingen Einfachheit und Komplexität einander.

            Viel Erfolg mit mehr Schönheit.

            Weitere Beiträge

            designsensor infografik experience principles erlebnisprinzipien

            Experience Principles

            | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise, Expertise Design Strategy, Expertise Human Machine Interface, User Experience Design, Wissen | No Comments
            Designmethode – Experience Principles Wie Sie mit Erlebnisprinzipien Kundenbedürfnisse und Markenpersönlichkeit in Einklang bringen Experience Principles (deutsch: Erlebnisprinzipien) beschreiben wie Kundinnen und Kunden einer Marke deren Produkte und Dienstleistungen konsistent…

            Millers UX Law

            | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Usability Accessibility, User Experience Design, Wissen | No Comments
            Millers UX Law Warum 7 plus/minus 2 eine gute Wahl ist Das Millersche Gesetz besagt, dass sich eine Person im Durchschnitt nur 7 plus/minus 2 Objekte im Gedächtnis merken kann.…
            Zurück zur Übersicht

            Kontakt

            Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

            Wir freuen uns auf Ihre Kontaktaufnahme!

            Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

            Kontaktformular









              Designsystem für ganzheitlich User Experience und User Interfaces

              Designsystem für ganzheitlich User Experience und User Interfaces

              Das Designsystem regelt die Gestaltung der digitalen Produkte und Services über alle Kanäle

              design system

              Komplexe Gestaltungsaufgaben und Markenauftritte brauchen ein Designsystem, das die Gestaltung regelt. Ein Designsystem stellt alle Elemente zur Verfügung, die für die effiziente und konsistente Produktentwicklung im Team notwendig sind. Dies ermöglicht die agile Arbeitsweise und ist eine wertvolle Massnahme bei der digitalen Transformation.

              Ein Designsystem ist immer individuell. Es berücksichtigt den Reifegrad des Unternehmens, den Entwicklungsstand des Produkts und das Wissen des Teams.

              Folgende Fragen helfen die richtigen Eckpfeiler für das Designsystem zu setzen:

              • Wie viele Personen werden das Designsystem benutzen? Welches Profil haben sie? Sind sie reif genug für dieses Thema?
              • Wie viele Produkte sollen auf dem Designsystem aufgebaut werden? Auf welchen Plattformen? Mit welchen Technologien?
              • Welchen Grad an Konsistenz wünschen Sie sich für die Produkte?
              • Ist die Verbindlichkeit des Designsystems streng oder locker?
              • Ist der Aufbau modular oder integriert?
              • Wird das Designsystems zentralisiert oder verteilt verwaltet?
              • Wie automatisiert soll die Pattern Library mit dem produktiven Code verbunden sein?
              • Wie detailliert muss die Dokumentation sein?
              • Über welches Tool (Brand Management System) wird das Designsystem den End-Nutzenden zur Verfügung gestellt? Wer hat alles Zugriff?

              Das Designsystem als «einzige Quelle der Wahrheit» [.…] steigert die Produktivität der Produktteams

              Warum sich die Investition in ein Designsystem lohnt

              Konsistente markenprägende Produkte

              Die Arbeit mit einem Designsystem ermöglicht es einem Unternehmen, mehre einheitliche und konsistente Softwareprodukte mit weniger Aufwand zu entwickeln. Dies steigert die einheitliche Markenwahrnehmung auch bei Skalierung der Produktpalette.

              Neue Arbeitskultur

              Die Arbeit mit einem Designsystem erfordert eine bereichsübergreifende Zusammenarbeit und fördert den Silo übergreifenden Austausch. Eine solche Arbeitsweise spricht viele (jüngere) Mitarbeitenden an und kann mitentscheidend sein, wenn es darum geht, die besten Talente fürs Unternehmen zu rekrutieren

              Gemeinsame Sprache

              Ein Designsystem funktioniert wie ein «Werkzeugkasten» und ist die Basis für eine gemeinsame Sprache und eine geteilte Vision zwischen Designer, Entwickler, Business Analysten, Product Owner, Brand Manager und allen anderen beteiligten Personen.

              Wird das Designsystem mittels Design System Manager (oft auch Brand System Manager genannt) online für alle zugänglich gemacht, sind die Voraussetzungen für die erfolgreiche Kollaboration erfüllt.

              Steigerung der Produktivität

              Eine Designsystem gliedert sich in folgende Themen und  stellt alle notwendigen Ressourcen und Assets bereit.

              • Zweck und gemeinsame Werte
              • Design- und Erlebnisprinzipien
              • Design Grundlagen
              • Komponenten und Muster
              • Best Practices

              Das Designsystem als «einzige Quelle der Wahrheit» (single source of truth) und definierte Entwicklungsprozesse steigern die Produktivität der Produktteams. Zeitersparnis beim Gestalten und Entwickeln, und auch ein schnellerer Rollout, sind positive Folgen von dieser Arbeitsweise.

              Synchronisieren verschiedener Touchpoints

              Ein Designsystem ermöglicht verschiedene Markenkontaktpunkte miteinander zu synchronisieren und für Kunden ein 360°- Erlebnis entlang der Kundenerlebniskette zu gestalten. Je nach Unternehmen und deren Geschäftsmodell regelt ein Designsystem das Design und die User Experience folgender Touchpoints:

              • Website
              • Shop
              • Social Media
              • Human-Machine-Interface
              • Chatbot
              • Mixed Reality
              • Mail

              Weitere Beiträge

              Gesetzte der Einfachheit John Maeda

              10 Gesetze der Einfachheit

              | Beyond Interface, Design Strategy, Designsensor, Expertise, Expertise Design Strategy, Expertise Digital Workplaces, Holistic UX- und UI-Design, Human Centered Design, Wissen | No Comments
              Die 10 Gesetze der Einfachheit nach John Maeda Einfach ist schwer – sehr schwer sogar. Die Gesetze der Einfachheit dienen dazu, Produkte und Lösungen so zu gestalten, dass diese für…

              Designsystem für ganzheitlich User Experience und User Interfaces

              | Beyond Interface, Design Strategy, Designsensor, Expertise Holistic UX- und UI-Design, Holistic UX- und UI-Design, User Interface Design, Wissen | No Comments
              Designsystem für ganzheitlich User Experience und User Interfaces Das Designsystem regelt die Gestaltung der digitalen Produkte und Services über alle Kanäle Komplexe Gestaltungsaufgaben und Markenauftritte brauchen ein Designsystem, das die…
              Zurück zur Übersicht

              Kontakt

              Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

              Wir freuen uns auf Ihre Kontaktaufnahme!

              Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

              Kontaktformular









                Product Vision Canvas

                design vision

                Designmethode Product Vision

                Noch schöner als Visionen zu haben ist sie zu verwirklichen

                design vision

                Die Product Vision Prototype Canvas ist ein Werkzeug, um das erste Vorwissen, beste Ideen, Funktionalitäten, interessante Erkenntnisse und mögliche Lösungen festzuhalten und zu kombinieren.

                Der Aufbau der Product Vision Prototype Canvas hilft, etwas Struktur in die ersten Erkenntnisse zu bringen. Abhängig der Situation macht es Sinn, die Themen anzupassen.

                Was ist eine Product Vision?

                Eine gute Vision ist kurz und einfach verständlich. Sie beinhaltet keine fixen Anforderungen, sondern das gemeinsame Verständnis des übergeordneten Ziels. Die Vision beschreibt, welches Problem behandelt wird, wie die Lösung sein soll und welcher Wert durch das Produkt entsteht.

                Vorteile einer gemeinsamen Vision

                • Sie dient als Entscheidungsgrundlage während des Projekts
                • Sie minimiert Missverständnisse
                • Sie motiviert, gemeinsam in eine Richtung zu arbeiten

                Product Vision entwickeln in 5 Schritten

                01 | Schnelles Brainstorming zu ersten Ideen und Lösungen

                Nehmen Sie sich mit ihrem Team mindestens 90 Minuten Zeit, um die Product Vision Prototyp Canvas zu erarbeiten.

                Starten Sie, indem Sie 15 Minuten lang mit einem ersten Brainstorming potenzielle Ideen mit Lösungen generieren. Ziel dabei ist, sich dem Thema anzunähern und zu lernen, wie andere denken. Hier geht es um Quantität und nicht um Qualität. Halten Sie jede Idee schriftlich oder mittels Zeichnung auf einem Post-it fest, sprechen Sie laut und deutlich, was Sie damit meinen und kleben Sie das Post-it auf der Stellwand fest.

                Beantworten Sie folgende Schlüsselfragen:

                • Welche Ideen fallen uns spontan ein?
                • Welche Lösungsansätze verfolgen andere Produkte oder Anbieter?
                • Was können wir anders, besser, schöner machen als andere?
                • Haben wir alle das gleiche Verständnis der Problemstellung?
                02 | Welche Funktionalitäten sind für die Nutzer unabdingbar?

                Schreiben Sie 15 Minuten lang alle Funktionalitäten auf, die für die Nutzer unabdingbar sind.

                Beantworten Sie folgende Schlüsselfragen:

                • Welche Funktionalitäten sind zwingend notwendig, damit die Lösung ihren Zweck erfüllt?
                • Welche Erfahrung und Vorwissen sind für den Nutzer zwingend notwendig?
                • Wie ist die Beziehung zwischen der beschriebenen Funktion und der Erfahrung der Nutzer?
                03 | Welche Lösungen und Benchmarks sind bekannt aus anderen Anwendungsbereichen, Industrien und Erfahrungen?

                Schauen Sie 15 Minuten lang über den Tellerrand und adaptieren Sie Lösungen/Benchmarks aus anderen Anwendungsbereichen, Industrien und Erfahrungen auf die Problemstellung. Sie können auch schrittweise vorgehen, indem Sie zuerst andere Anwendungsbereiche anschauen, dann andere Industrien und am Schluss Erfahrungen aus anderen Themengebieten.

                Beantworten Sie folgende Schlüsselfragen:

                • Welche erfolgreichen Konzepte aus anderen Themengebieten lassen sich auf das Problem anwenden?
                • Welche Erfahrungen haben wir gemacht, die das Problem von einer anderen Seite beleuchten?
                • Gibt es Beziehungen zwischen der Problemstellung und anderen Erfahrungen?
                04 | Verlassen Sie die Komfortzone und steigern Sie die Kreativität, indem Sie radikale Ideen entwickeln.

                Nehmen Sie sich 10 Minuten Zeit, um radikale Ideen zu entwickeln. Lassen Sie in der nächsten Runde wesentliche Elemente einer Gegebenheit weg. Beispiel: Wie würden Sie eine Lernplattform ohne Schule konzipieren? Wie sieht eine Hochschule aus ohne Klassenzimmer? Halten Sie die Fragen und spontane Ideen fest.

                Suchen Sie Antworten auf folgende Schlüsselfragen:

                • Welche neuen und radikalen Ideen haben wir bis dato noch nicht thematisiert?
                • Welche Produkte und Dienstleistungen gibt es, die den Nutzen und die Wertschöpfung erweitern würden?
                • Welche Ideen finden wir vielversprechend?
                05 | Halten Sie die generierten Ideen und das Vision Statement auf der Vision Prototype Canvas fest.

                In den letzten 30 Minuten geht es darum, ihre Erkenntnisse zu strukturieren und auf der Vision Canvas wie folgt festzuhalten:

                • der Nutzer
                • dessen Bedürfnisse
                • mögliches Produkt resp. Produkt-Funktion und
                • der Nutzen

                so dass in einem nächsten Schritt die einzelnen Produktideen resp. Produkt-Funktionen als Prototyp entwickelt und getestet werden können.

                Aus der Praxis

                Das Vision Statement

                Das Vision Statement drückt ein hohes Ziel, einen erstrebenswerten Zustand in der Zukunft aus, ist in möglichst wenige Worte gefasst und wird im Präsens formuliert. Damit wird die Vision sprachlich bereits in die Gegenwart geholt.

                Beispiel kurz, Fokus auf Quantität:

                • Microsoft – A computer on every desk and in every home; all running Microsoft software.

                Beispiel kurz, Fokus auf Qualität:

                • At Microsoft, our mission and values are to help people and businesses throughout the world realize their full potential.

                Weitere Möglichkeiten, um die Product Vision festzuhalten

                Elevator Pitch

                Der Elevator Pitch bezieht sich darauf, dass man mit jemandem im Aufzug steht und nur diese kurze Zeit (max. 60 Sekunden) hat, um seine Geschäftsidee vorzustellen. In Wirklichkeit wird es wohl weniger vorkommen, dass Sie mit potentiellen Investoren im Aufzug stehen. Trotzdem ist der Elevator Pitch eine hilfreiche Methode wenn es darum geht, eine Produktvision schnell, klar und verständlich rüberzubringen.

                Produkt Tweet

                Tweets sind die Bezeichnung für die kurzen Meldungen, die bei Twitter veröffentlicht werden. Für die Kurznachricht stehen 280 Zeichen zur Verfügung. Wie lautet der erste Tweet zu Ihrem neuen Produkt?

                Landing Page

                Eine Landing Page ist eine Produktseite, die auf den Werbeträger und die Zielgruppe optimiert ist. Es steht ein bestimmtes Angebot im Fokus, das ohne Ablenkung präsentiert wird. Ein zentrales Element ist die CTA (call to action), die eine einfache Interaktion mit dem Benutzer sicherstellt. Gestalten Sie die Landing Page / Product Page für Ihr neues Product. Wie überzeugen sie die Besucher der Website von Ihrem neuen Produkt?

                Weitere Beiträge

                designsensor infografik interaction design principles interaktionsdesign prinzipien

                Interaction Design

                | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
                Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…

                Millers UX Law

                | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Usability Accessibility, User Experience Design, Wissen | No Comments
                Millers UX Law Warum 7 plus/minus 2 eine gute Wahl ist Das Millersche Gesetz besagt, dass sich eine Person im Durchschnitt nur 7 plus/minus 2 Objekte im Gedächtnis merken kann.…
                Zurück zur Übersicht

                Kontakt

                Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

                Wir freuen uns auf Ihre Kontaktaufnahme!

                Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

                Kontaktformular









                  Accessibility für barrierefreie Produkte

                  accessibility

                  Accessibility für barrierefreie Produkte

                  Digitale Produkte, die nach Accessibility-Richtlinien gestaltet und realisiert sind, bieten allen Menschen einen leichteren und bequemeren Zugang

                  accessibility

                  Accessibility beschreibt die Leichtigkeit (Bequemlichkeit), die Menschen mit Behinderungen oder Einschränkungen bei der Interaktion mit einem digitalen Produkt erleben. Usability beschreibt die generelle Leichtigkeit (Bequemlichkeit) bei der Interaktion mit einem digitalen Produkt, während User Experience die übergeordnete Zufriedenheit der Nutzenden im Fokus hat.

                  Was ist Accessibility?

                  Wie kann eine Website, ein Automat oder ein Informationssystem für alle Menschen, auch für solche mit Behinderungen oder Einschränkungen, zugänglich sein? Wie kann das digitale Produkt auch ohne Maus-Steuerung bedient werden? Wie müssen Informationen aufbereitet sein, damit diese auch von Menschen mit Leseschwäche verstanden werden? Aber auch umwelt- und situationsbedingte Einschränkungen wie zum Beispiel schwierige Lichtverhältnisse, kleine Monitore oder komplizierte Prozesse können Menschen ausschliessen. Das alles sind Themen mit denen sich das Fachgebiet Accessibility auseinandersetzt. Dabei steht das Prinzip der Gleichstellung aller Menschen im Zentrum.

                  Gleichstellung aller Menschen

                  Bei Accessibility geht es nicht um Kompromisse bei der Gestaltung, damit Menschen mit Behinderungen das digitale Produkt auch nutzen können. Vielmehr geht es darum, dass Accessibility-Richtlinien bei der Gestaltung und Realisierung helfen, digitale Produkte zu entwickeln, die von allen Menschen leichter verstanden und einfacher bedient werden können. Um ein barrierefreies Produkt zu entwickeln müssen weder grosse Abstriche bei der visuellen Gestaltung gemacht werden noch fallen riesige Summen für Extra-Aufwand an. Wichtig ist, dass die Accessibility-Leitlinien und Prinzipien von Anfang an in den menschenzentrierten Design-Prozess integriert werden und im Bewusstsein aller Projektbeteiligten (Stakeholder) verankert sind.

                  Bei Accessibility geht es nicht um Kompromisse bei der Gestaltung, damit Menschen mit Behinderungen das digitale Produkt auch nutzen können

                  Accessibility ist auf alle Aspekte von Einschränkungen anzuwenden

                  Bereits die in der Umgangssprache als Behinderungen bezeichneten Einschränkungen umfassen viele unterschiedliche Kategorien:

                  • Sensorische Einschränkungen: visuelle, auditive, taktile, haptische
                  • Motorische Einschränkungen: (Fein-)Motorik, Mobilität
                  • Kognitive Einschränkungen

                  Aber auch umwelt- und situationsbedingte Einschränkungen können Menschen von der erfolgreichen Teilnahme an der Informationsgesellschaft ausschliessen:

                  • Kleine Bildschirme
                  • Ungünstige Lichtverhältnisse
                  • Unnötig komplizierte Prozesse
                  • Unverständliche Sprache

                  Leitlinien für barrierefreie Gestaltung

                  Zwei-Sinne-Prinzip

                  Das digitale Produkt darf nicht nur visuelle erschliessbar sein. Gestalte immer nach dem Zwei-Sinne-Prinzip. Alle Informationen können mit Hilfsmitteln (z.B. Screenreader) über zwei Sinne wahrgenommen werden.

                  Universelles Design

                  Es gibt nur eine Lösung, die für alle bedienbar sein muss. Stelle sicher, dass das digitale Produkt auch mit der Tastatur bedienbar ist. Der Fokus muss immer sichtbar sein.

                  Selbstbestimmung

                  Das Design soll möglichst wenig fix vorgeben. Gestalte das Design flexibel. Im Minimum kann die Schriftgrösse den eigenen Bedürfnissen angepasst werden.

                  Accessibility-Checkliste

                  Wahrnehmbarkeit

                  «Die Informationen und Komponenten der Benutzerschnittstelle sind so darzustellen, dass sie von den Nutzerinnen und Nutzern wahrgenommen werden können.»

                  • Gibt es für Bilder, Grafiken, Videos und Animationen gute Textalternativen?
                  • Ist die Schrift gut lesbar?
                  • Können Nutzer die Schriftgrösse verändern?
                  • Sind Links gut erkennbar?
                  • Ist der Kontrast zwischen den einzelnen Elemente gross genug?
                  • Ist das User Interface räumlich klar definiert?
                  • Gibt es 3+-2 Einträge pro Menü?
                  • Wird auf unnötige und störende Element verzichtet?
                  • Sind Audio‐ und Videodateien mit Untertitel versehen?
                  • Gibt es für zeitbasierte Medien Alternativen?
                  • Werden Bewegung und Animation so eingesetzt, dass sie keine Anfälle auslösen?
                  Bedienbarkeit

                  «Die Komponenten der Benutzerschnittstelle und die Navigation müssen bedient werden können.»

                  • Ist das digitale Produkt auch mit der Tastatur bedienbar?
                  • Ist die Navigation auf allen Seiten konsistent?
                  • Ist die Benutzerführung leicht und verständlich?
                  • Gibt es eine Zurück-Funktion?
                  • Werde Orientierungshilfen angeboten?
                  • Helfen Piktogramme bei der Orientierung?
                  • Wird auf Captchas verzichtet?
                  • Haben die Benutzer genügend Zeit, um Inhalte zu lesen und zu benutzen?
                  • Ist das digitale Produkt für die Benutzer vorhersehbar?
                  • Wird die Affordance (Aufforderungscharakter) des Produktes erfüllt und ist die Bedienung intuitiv?
                  Verständlichkeit

                  «Die Informationen und die Bedienung der Benutzerschnittstelle müssen verständlich sein.»

                  • Sind Texte einfach und ohne Fremdwörter geschrieben?
                  • Unterstützen Illustrationen und Bilder den Inhalt?
                  • Werden bewährte und allgemein verständliche Zeichen verwendet?
                  • Ist der Fokus immer sichtbar?
                  • Sind Dialoge verständlich und hilfreich?
                  • Unterstützen Fehlermeldung beim Erlernen des Produkts?
                  • Sind Links und Button-Texte eindeutig? (nicht «Mehr» oder «Weiter»)
                  • Gibt es Hilfestellungen?
                  Robustheit

                  «Inhalte müssen so robust sein, dass sie von möglichst allen Benutzeragenten, einschliesslich assistiver Technologien, zuverlässig interpretiert werden können.»

                  • Ist das System Fehlertolerant?
                  • Ist das digitale Produkt maximal kompatibel mit Browsern und Hilfsmitteln?

                  Links zum Thema Accessibility

                  Weitere Beiträge zum Thema

                  Designsensor Infografik Brand Persona Markenpersoenlichkeit

                  Brandpersona

                  | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise Design Strategy, Human Centered Design, Wissen | No Comments
                  Designmethode – Brand Persona Die Brand Persona verkörpert das Markenversprechen Die Brand Persona ist ein Sammlung von Persönlichkeitsmerkmalen, Einstellungen und Werten, die Ihre Marke regelmässig präsentiert, um eine Verbindung zu…
                  designsensor infografik interaction design principles interaktionsdesign prinzipien

                  Interaction Design

                  | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
                  Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…
                  Zurück zur Übersicht

                  Kontakt

                  Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

                  Wir freuen uns auf Ihre Kontaktaufnahme!

                  Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

                  Kontaktformular









                    User Experience Design für positive Nutzererlebnisse

                    UX pyramide

                    User Experience Design für positive Nutzererlebnisse

                    Die User Experience ist ein zentraler Erfolgsfaktor für attraktive Produkte und Services

                    UX pyramide

                    Menschen erleben ein positives Nutzererlebnis (User Experience), wenn ihre Erwartungen erfüllt oder sogar übertroffen werden. Wie kann Design das Nutzererlebnis positiv beeinflussen?

                    Ganzheitliches Erlebnis

                    Die Din-Norm ISO 9241-210 definiert User Experience (kurz: UX, dt.: Nutzererlebnis) mit «Wahrnehmungen und Reaktionen einer Person, die aus der tatsächlichen und/oder der erwarteten Benutzung eines Produkts, eines Systems oder einer Dienstleistung resultieren» und ergänzt «User Experience umfasst sämtliche Emotionen, Vorstellungen, Vorlieben, Wahrnehmungen, physiologischen und psychologischen Reaktionen, Verhaltensweisen und Leistungen, die sich vor, während und nach der Nutzung ergeben.»

                    Beim Thema User Experience geht es um ein ganzheitliches Erlebnis beim Interagieren mit einem Produkt oder System und den damit verbundenen Emotionen.

                    Positive Emotionen

                    Damit ein Produkt erfolgreich wird, muss dieses beim Benutzer (Kunden) positive Emotionen auslösen. Zentraler Kern dafür ist die Usability (dt.: Gebrauchstauglichkeit). Zentrale Frage hier: Ist das Produkt einfach bedienbar? Die Usability bestimmt wie effektiv, effizient und zufriedenstellend ein bestimmter Benutzer seine konkreten Ziele mit dem Produkt erreicht. Wenn dieser dank dem Produkt seine Ziele einfach und angenehm erreicht, entstehen positive Erfahrungen. Soll das Produkt aber mehr als nur nützlich und angenehm sein und die Spitze der UX-Pyramide erklimmen, muss das Erlebnis für den Benutzer bedeutungsvoll sein.

                    Machen Sie kurz Pause. Ein Gedankenspiel:

                    • Welche Apps haben es auf den ersten Homescreen geschafft? Warum?
                    • Welche davon sind für Sie mehr als nur nützlich?
                    • Was machen dieses Produkt besonders gut?

                    Erfolgserlebnisse und Glücksgefühle

                    Wie kann die Chance erhöht werden, dass Benutzende ein Produkt als vergnüglich oder bedeutsam erleben? Um sich im harten Wettbewerb abzugrenzen, werden häufig einfach immer mehr und neue Funktionen in das Produkt gestopft. Bei diesem Vorgehen liegt der Fokus bei der Produktentwicklung auf den Funktionen, egal ob diese das Produkt für die Menschen bedeutsamer machen oder nicht.

                    Damit Produkte für Menschen und ihre Nutzungsanforderungen entstehen, müssen die Benutzer von Anfang an in die Produktentwicklung integriert werden, egal ob agil oder klassisch entwickelt wird. Die Human Centered Design Methode lässt sich in beide Vorgehensweisen integrieren. Während dem menschenzentrierten Entwicklungsprozess sind Themen wie Accessibility (deutsch: Zugänglichkeit), Utility (Nützlichkeit) aber auch Ästhetik und die Erfüllung des Markenversprechens von grosser Bedeutung.

                    UX-Checkliste

                    Kurze Checkliste, um die positive Wirkung der UX- Massnahmen zu überprüfen. Beantworten Sie die folgenden Fragen. Sie kennen die Antworten nicht? Fragen Sie Ihre Nutzerinnen und Nutzer.

                    Utility

                    Wie hoch ist der subjektive Nutzwert der Inhalte und Funktionen für die jeweilige Zielgruppe?

                    Accessibility

                    Wie gut ist die Zugänglichkeit und Kompatibilität?
                    Wie empfinden Nutzer die Performance und Ladezeiten?
                    Eignet sich das Angebot für das verwendete Endgerät?

                    Usability

                    Wie effektiv, effizient und somit zufriedenstellend kann ein Nutzer sein Ziel mit dem Produkt oder Service erreichen?

                    Ästhetik

                    Wie ansprechend ist die Optik für die Nutzer?

                    Markenversprechen

                    Wie gut erfüllt das Angebot das Markenversprechen und damit die Erwartungen der Nutzer?

                    Menschen erleben Glücksgefühle, wenn sie Erfolgserlebnisse haben. Wie kann das neue Produkt immer wieder kleine Glücksgefühle auslösen?

                    Praxistipp

                    Es ist hilfreich, wenn sich das ganze Entwicklungsteam immer wieder in Erinnerung ruft, dass Benutzer Menschen sind – und Menschen erleben Glücksgefühle, wenn sie Erfolgserlebnisse haben. Wie kann das neue Produkt immer wieder kleine Glücksgefühle auslösen? Positive Erlebnisse motivieren Menschen, das Produkt mit Freude zu nutzen und aktiv weiterzuempfehlen. Und das ist die Basis für ein erfolgreiches Produkt. Wie ermöglichen Ihre Produkte oder Services den Nutzerinnen und Nutzern Erfolgserlebnisse?

                    Weitere Beiträge

                    Designsensor Infografik Brand Persona Markenpersoenlichkeit

                    Brandpersona

                    | Beyond Interface, Brand Design, Designmethoden, Designsensor, Expertise Design Strategy, Human Centered Design, Wissen | No Comments
                    Designmethode – Brand Persona Die Brand Persona verkörpert das Markenversprechen Die Brand Persona ist ein Sammlung von Persönlichkeitsmerkmalen, Einstellungen und Werten, die Ihre Marke regelmässig präsentiert, um eine Verbindung zu…
                    designsensor infografik interaction design principles interaktionsdesign prinzipien

                    Interaction Design

                    | Beyond Interface, Designsensor, Expertise Holistic UX- und UI-Design, Human Centered Design, Interaction Design, Usability Accessibility, Wissen | No Comments
                    Interaction Design – Interaktion zwischen Menschen, Dingen und Räumen Digitale Produkte und Services sollten sich wie ein hilfsbereiter Mensch verhalten Interaction Design ist die Gestaltung von Parametern, die eine Interaktion…
                    Zurück zur Übersicht

                    Kontakt

                    Haben Sie ein spannendes Projekt oder brauchen Sie Unterstützung beim Lösen einer Herausforderung?

                    Wir freuen uns auf Ihre Kontaktaufnahme!

                    Kommen Sie uns besuchen, laden Sie uns ein oder rufen Sie uns an unter +41 31 970 30 90

                    Kontaktformular