Seite wählen

Wahrnehmungspsychologie im UI Design

von | Okt 25, 2018 | NETWAYS, Development

Beim Gestalten von grafischen Benutzeroberflächen ist es oft hilfreich sich einiger Paradigmen aus der Wahrnehmungspsychologie zu bedienen bzw. diese im Hinterkopf zu haben.
Konkret gebe ich hier einen kurzen Überblick mit Beispielen über 5 Prinzipien aus der Gestalttheorie, die man sich beim UI Design zu nutze machen kann.

1. Ähnlichkeit (Similarity)


„Einander ähnliche Elemente werden eher als zusammengehörig erlebt als einander unähnliche.“

Beispiel

Ähnlichkeit kann verwendet werden, um bestimmte Elemente hervorzuheben. In einer Liste aus ähnlichen Elementen, kann eine Abhebung (z.B. durch Einfärbung) dazu verwendet werden um wichtigere Elemente hervor zu heben.

2. Nähe (Proximity)


“Elemente mit geringen Abständen zueinander werden als zusammengehörig wahrgenommen.”

Beispiel

Beim Seitenlayout werden Textblöcke voneinander abgesetzt, um eine optische Zusammengehörigkeit zu erzielen. In der Regel unterscheiden sich die Formatierungen von Überschrift und Absatztext (Prinzip der Ähnlichkeit). Dadurch, dass sie nahe aneinander platziert werden wird trotzdem eine Zusammengehörigkeit erzielt.

3. Fortsetzung (Continuity)


“Linien werden immer so gesehen, als folgten sie dem einfachsten Weg. Kreuzen sich zwei Linien, so gehen wir nicht davon aus, dass der Verlauf der Linien an dieser Stelle einen Knick macht, sondern wir sehen zwei gerade durchgehende Linien.”

Beispiel

Die gleiche lineare Ausrichtung von Listen, Navigationsleisten u.a. lässt den Benutzer Elemente als zusammengehörig wahrnehmen.

4. Geschlossenheit (Closure)


“Es werden bevorzugt Strukturen wahrgenommen, die eher geschlossen als offen wirken.”

Beispiel

Bei Icons wird das Gesetz der Geschlossenheit oft verwendet, um Bedeutungen über abstrakte Formen wiederzugeben.

5. Gemeinsames Schicksal (Common Fate)


“Zwei oder mehrere sich gleichzeitig in eine Richtung bewegende Elemente werden als eine Einheit oder Gestalt wahrgenommen.”

Beispiel

Das Prinzip des gemeinsamen Schicksals wird beispielsweise bei Slidern angewandt. Dadurch, dass das Überblenden der Slides gleichzeitig mit der Navigation stattfindet, ist intuitiv ersichtlich, dass beide Übergänge zusammenhängen.

Weiterführende Quellen

https://de.wikipedia.org/wiki/Gestaltpsychologie
https://medium.muz.li/gestalt-principles-in-ui-design-6b75a41e9965

Florian Strohmaier
Florian Strohmaier
Senior UX Designer

Mit seinen Spezialgebieten UI-Konzeption, Prototyping und Frontendentwicklung unterstützt Florian das Dev-Team bei NETWAYS. Trotz seines Design-Backgrounds fühlt er sich auch in der Technik zuhause. Gerade die Kombination aus beidem hat für ihn einen besonderen Reiz.

1 Kommentar

  1. Lukas

    Sehr interessante Information. Fortsetzung Medthode wurden bei uns verwendet. Es gibt viele Optimierungsfreiräume.

    Antworten

Trackbacks/Pingbacks

  1. Monthly Snap October – NET News | Tips & Tricks | DevOps | Events & the WAYS we go › NETWAYS Blog - […] but Gnocchi: Metriken und Metadaten explained Achim. With Florian you could join an experiment in Wahrnehmungspsychologie im UI Design.…

Einen Kommentar abschicken

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Mehr Beiträge zum Thema NETWAYS | Development

OSMC 2023 | Will ChatGPT Take Over My Job?

One of the talks at OSMC 2023 was "Will ChatGPT take over my job?" by Philipp Krenn. It explored the changing role of artificial intelligence in our lives, raising important questions about its use in software development.   The Rise of AI in Software...

Monthly Snap Februar 2024

Der Februar war ein ereignisreicher Monat bei NETWAYS! Neben dem normalen Alltag gab es auch unser Jahresmeeting, ein Spieleabend im Büro, und viele Kollegen waren auf Konferenzen und der Jobmesse in Nürnberg unterwegs. Und natürlich wurden viele Blogposts zu...