Czym są zasady Gestalt & Jak je stosować

Jedną z najbardziej wpływowych teorii psychologicznych w dziedzinach UX i projektowania interakcji jest teoria Gestalt. Teoria ta została założona przez niemieckich psychologów, a słowo "Gestalt" oznacza formularz lub kształt Jak sama nazwa wskazuje, ideą zasad Gestalt jest to, że ludzie postrzegają grupy obiektów jako wzory, a nie pojedyncze obiekty.

Istnieje wiele artykułów na temat zasad Gestalt, ale nie tak wiele z nich pomaga zrozumieć, jak zastosować je w swojej pracy jako projektant UX/UI. Ten artykuł da ci kilka pomysłów, jak wykorzystać zasady Gestalt do tworzenia lepszych projektów UX i UI, które pomogą ludziom osiągnąć ich cele przy mniejszym wysiłku.

Prawo podobieństwa

Zasada podobieństwa mówi, że gdy obiekty są fizycznie podobne, mamy tendencję do zgrupować je razem i zakładają, że mają ta sama funkcjonalność Na przykład, na poniższym obrazku dość łatwo jest odróżnić linię zawierającą bordowoczerwone kółka od reszty obrazu ze względu na jej inny kolor.

Przykład zasady podobieństwa. fot. autora.

Wykorzystanie podobieństwa w projektowaniu UX i UI

Wyobraźmy sobie, że Twoja firma stworzyła aplikację o nazwie "Il Mio Chef'', która jest używana przez miłośników włoskiego jedzenia w Stanach Zjednoczonych i Kanadzie (będziemy używać jej do końca tego artykułu). Ostatni raport, który przekazał Ci Twój badacz UX, stwierdza, że jeśli chodzi o zamawianie włoskiego jedzenia, użytkownicy zwracają uwagę głównie na to, które restauracje są najbliżej nich. W końcu wszyscy chcielibyśmy mieć naszelasagna lub pizza dostarczona, gdy jest jeszcze świeża i ciepła, prawda?

Aby ułatwić użytkownikom naszej aplikacji zorientowanie się, które restauracje są najbliżej nich, możemy wykorzystać zasadę podobieństwa poprzez wyróżnienie tych restauracji w UI. Na poniższym obrazku widać, jak wyróżnienie tych opcji na żółto (po prawej stronie) robi dużą różnicę poprzez wizualne podkreślenie różnicy między najbliższymi restauracjami a tymi, które są dalej. W ten sposóbmoże wykorzystać zasadę podobieństwa, aby pomóc Twoim użytkownikom szybko znaleźć to, czego szukają.

Wykorzystanie zasady podobieństwa Gestalt.Obraz autorski.

Prawo bliskości

Zasada bliskości mówi, że obiekty, które znajdują się blisko siebie wydają się być bardziej powiązane Na przykład pierwszy i drugi obrazek mają taką samą ilość kółek, ale na drugim obrazku niektóre kolumny są bliżej siebie i tworzą wrażenie trzech odrębnych grup zamiast jednej dużej.

Bliskość - przykład 1 - duża grupa. obraz autorski.

Bliskość - przykład 2 - trzy odrębne grupy. obrazek autora.

Wykorzystanie bliskości w projektowaniu UX i UI

Weźmy przykład z dziedziny wizualizacji informacji.

Tym razem wyobraźmy sobie, że jesteś kierownikiem, który chce sprawdzić, jak radzi sobie Twoja aplikacja "Il Mio Chef". Chcesz przyjrzeć się wskaźnikom KPI, które mierzą wyniki finansowe, zaangażowanie użytkowników i ich satysfakcję. Na początku Twój specjalista od wizualizacji informacji tworzy poniższy dashboard, który sprawia, że Ty i wszyscy inni kierownicy gubią się w liczbach i zadają jeszcze więcej pytań. Po miesiącu wielu z Waspo prostu przestań używać tego pulpitu.

Pulpit nawigacyjny KPI - Il Mio Chef - zdjęcie autorstwa.

W tym momencie wracasz do swojej specjalistki od wizualizacji informacji i prosisz ją, aby ułatwiła ludziom zrozumienie całości poprzez przeprojektowanie dashboardu. Zasada bliskości przydaje się w tym przypadku, a nowy projekt możesz zobaczyć poniżej. Zawiera on trzy grupy podzielone według rodzaju KPI i pomaga wszystkim zrozumieć, jak aplikacja radzi sobie pod względem finansowymGrupowanie obiektów i stosowanie większej ilości białej przestrzeni pomiędzy grupami może pomóc użytkownikom w szybszym przyswajaniu informacji.

Wykorzystanie zasady bliskości Gestalt w projektowaniu deski rozdzielczej.Zdjęcie autorstwa.

Prawo ciągłości

Zasada ciągłości mówi, że gdy oko zacznie podążać za obiektem, będzie kontynuowało "ruch" w tym kierunku, aż napotka inny obiekt.Ten ruch pomaga nam postrzegać obiekt jako część tej samej ścieżki, którą musimy przejść, aby znaleźć informacje.Poniższy obrazek pokazuje, jak możemy wykorzystać zasadę ciągłości, aby stworzyć takie wzorce wizualne, które prowadząoko w określonym kierunku.

Przykład zasady Ciągłości.Obraz autora.

Wykorzystanie ciągłości w projektowaniu UX i UI

Twój badacz UX przedstawił nowy raport, z którego wynika, że główną motywacją użytkowników do korzystania z aplikacji "Il Mio Chef" jest odkrywanie jedzenia, ponieważ umożliwia ona dostęp do nowych włoskich restauracji co tydzień. Patrzysz na metrykę, która pokazuje, ile razy ludzie przeciągają się po opcjach przy obecnym projekcie UI na obrazku poniżej (lewa strona) i widzisz, że nigdy nie przeciągają się więcej niż dwa razy naśrednie, aby zobaczyć, jakie opcje są dla nich dostępne.

Wykorzystując zasadę ciągłości (prawa strona na obrazku poniżej) Twój projektant UX pomógł zwiększyć tę liczbę do około 10 machnięć średnio. Jak to się stało? Poprzez ukrycie części obrazu i podkreślenie faktu, że musisz przeciągnąć palcem w lewo lub w prawo, aby zobaczyć, co tam jest, oczy użytkowników były kierowane do dosłownego tworzenia ruchu "swipe" i były bardziej zmotywowane do odkrywania kolejnych restauracji ico oferują. To coś, do czego wcześniejszy projekt w ogóle nie motywował, nawet jeśli już z natury jesteś do tego zmotywowany.

Wykorzystanie zasady ciągłości Gestalt w projektowaniu UX/UI Obrazek autorstwa.

Podsumowując , wykorzystanie zasad Gestalt przedstawionych w tym artykule w Twoim projekcie UX i UI może pomóc Twoim użytkownikom szybciej znaleźć informacje i lepiej je przetrawić. Poza tym może zwiększyć ich satysfakcję z Twojego produktu poprzez motywowanie ich do podejmowania działań, które najbardziej lubią.

‍

Na okładce znajduje się grafika Miklosa Philipsa, edytowana w Vectornatorze.