Zkoumání principů Gestalt designu

poslech zvukové verze tohoto článku

negativní prostor je již dlouho základem dobrého designu. Opuštění bílého prostoru kolem prvků designu je první věc, která obvykle přijde na mysl. Ale pak existují návrhy, které používají tento bílý prostor k odvození prvku, který ve skutečnosti neexistuje (jako příklad okamžitě přijde na mysl šipka skrytá mezi E a X v logu FedEx).

“ E „A“ x “ v logu FedEx vytvořte šipku uvnitř negativního prostoru mezi nimi.,

lidský mozek je mimořádně dobrý v plnění prázdná místa v obraze a vytváří celek, který je větší než součet jeho částí. Proto vidíme tváře ve věcech, jako jsou listy stromů nebo praskliny na chodníku.

tento princip je jednou z nejdůležitějších základních myšlenek gestaltových principů vizuálního vnímání., Nejvlivnější brzy návrhu napsáno o teorii byla publikována Max Wertheimer v jeho 1923 Gestalt zákony percepční organizace, i když Wolfgang Köhler je 1920 diskuse Fyzické Gestalten také obsahuje mnoho vlivných myšlenek na toto téma.

bez Ohledu na to, kdo jako první navrhl nápady (tam byly eseje se datují až k roku 1890), gestalt principy jsou důležitý soubor nápadů pro všechny návrháře se učit, a jejich plnění mohou výrazně zlepšit nejen estetiku a design, ale také jeho funkčnost a uživatelská přívětivost.,

jednoduše řečeno, gestalt teorie je založena na myšlence, že lidský mozek se pokusí zjednodušit a organizovat složité obrázky nebo vzory, které se skládají z mnoha prvků, tím podvědomě uspořádání částí do organizovaného systému, které vytváří celek, spíše než jen řadu nesourodých prvků. Naše mozky jsou postaveny tak, aby viděly strukturu a vzory, abychom lépe porozuměli prostředí, ve kterém žijeme.,

k Dispozici je šest jednotlivých zásad obvykle spojeny s gestalt teorie: podobnost, pokračování, ukončení, blízkost, obrázek/zem, a symetrie & objednávka (také volal prägnanz). Tam jsou také některé další, novější principy někdy spojené s gestalt, jako je společný osud.

podobnost

je to lidská přirozenost seskupovat jako věci dohromady. V gestaltu jsou podobné prvky vizuálně seskupeny, bez ohledu na jejich vzájemnou blízkost. Mohou být seskupeny podle barvy, tvaru nebo velikosti., Podobnost může být použita k propojení prvků, které nemusí být hned vedle sebe v designu.

čtverce, tady jsou všechny rovnoměrně rozmístěny a stejné velikosti, ale jsme automaticky seskupovat je podle barev, i když tam není žádný rým nebo důvod k jejich umístění.

samozřejmě, můžete dělat věci odlišné, pokud chcete, aby jim vystoupit z davu., Proto jsou tlačítka pro volání do akce často navržena v jiné barvě než zbytek stránky—takže vynikají a upozorňují návštěvníka na požadovanou akci.

v UX designu, pomocí podobnosti je jasné svým návštěvníkům, které položky jsou podobné. Například v seznamu funkcí používajícím opakující se konstrukční prvky (například ikonu doprovázenou 3-4 řádky textu) by princip podobnosti usnadnil jejich skenování., Naproti tomu změna konstrukčních prvků pro funkce, které chcete zvýraznit, je činí vynikajícími a dává jim větší význam ve vnímání návštěvníka.

I věci tak jednoduché, jak ujistěte se, že odkazy v celém návrhu jsou formátovány stejným způsobem spoléhá na princip podobnosti v tom, jak budou návštěvníci vnímat organizaci a strukturu vašeho webu.

pokračování

zákon kontinuity předpokládá, že lidské oko bude při prohlížení čar sledovat nejhladší cestu, bez ohledu na to, jak byly čáry skutečně nakresleny.,

oko má tendenci chtít sledovat rovnou čáru z jednoho konce této postavy na druhou, a zakřivené linie od vrcholu až na dno, i když linky, změna barvy uprostřed.

Toto pokračování může být cenným nástrojem, pokud cílem je vést oko návštěvníka v určitém směru. Budou následovat nejjednodušší cestu na stránce, takže se ujistěte, že nejdůležitější části, které by měly vidět, spadají do této cesty.,

Od oka přirozeně sleduje čáru, umístění položky v sérii v řadě bude přirozeně kreslit oko od jednoho bodu k druhému. Jedním z takových příkladů jsou horizontální posuvníky, stejně jako související výpisy produktů na webech, jako je Amazon.

Closure

Closure je jedním z nejlepších principů gestalt a na který jsem se již dotkl na začátku tohoto kusu. Je to myšlenka, že váš mozek vyplní chybějící části návrhu nebo obrázku, aby vytvořil celek.

princip uzavření umožňuje vašemu oku sledovat něco jako tečkovanou čáru až do konce., Složitější aplikace jsou však často vidět v logech, jako je tomu u Světového fondu pro Volně žijící zvířata. Velké kusy obrysu pro pandu chybí, ale váš mozek nemá problém vyplnit chybějící části, aby viděl celé zvíře.

gestaltův princip uzavření je krásně ilustrován v logu panda World Wildlife Fund. Mozek doplňuje bílé tvary, i když nejsou dobře definované.,

Uzavření je velmi často používán v logo design, s další příklady, včetně těch, pro USA Network, NBC, Sun Microsystems, a dokonce i Adobe.

dalším velmi důležitým příkladem uzavření při práci v designu UX a UI je, když zobrazíte částečný obraz vyblednutí z obrazovky uživatele, abyste jim ukázali, že existuje více, pokud přejdou doleva nebo doprava. Bez částečného obrazu, tj., pokud jen plné obrázků jsou zobrazeny, není mozek okamžitě interpretovat, že tam by mohlo být více vidět, a proto své uživatele, je méně pravděpodobné, scroll (od uzavření je již zřejmé).

blízkost

blízkost označuje, jak blízko prvky jsou k sobě navzájem. Nejsilnější vztahy v blízkosti jsou vztahy mezi překrývajícími se subjekty, ale pouze seskupení objektů do jedné oblasti může mít také silný efekt blízkosti.

opak je samozřejmě také pravdou., Umístěním prostoru mezi prvky můžete přidat oddělení, i když jsou jejich další vlastnosti stejné.

tato skupina kruhů, například:

jediná věc, diferenciační skupiny vlevo od těch, na pravé straně je blízkost linek. A přesto váš mozek interpretuje obraz vpravo jako tři odlišné skupiny.

USPS PDF formulář příklad, kde blízkost gestalt principu je narušena UX., Vzhledem k oblasti etikety, být blíže k pole pod nimi, lidé by se mylně domnívají, že je místo, kde informace, které platí pro „c.“ a „d“. Přesto, že informace by měly být poskytovány v oblastech nad textové popisky.

V UX designu, takových je nejvíce často používán s cílem získat uživatele do skupiny určité věci dohromady bez použití věci, jako pevné hranice. Tím, že jako věci blíž k sobě, s mezerou mezi každou skupinu, divák okamžitě vyzvednout na organizaci a strukturu, kterou chci je vnímat.,

obrázek/země

princip obrázku / země je podobný principu uzavření v tom, že využívá způsobu, jakým mozek zpracovává negativní prostor. Pravděpodobně jste viděli příklady tohoto principu plovoucí v memech na sociálních médiích nebo jako součást log (jako již zmíněné logo FedEx).

váš mozek bude rozlišovat mezi objekty, které považuje za v popředí obrazu (obrázek nebo ohnisko), a pozadím (oblast, na které spočívají postavy)., Místo, kde se věci zajímavé, je to, když je popředí a pozadí, ve skutečnosti obsahují dva odlišné snímky, jako je tento:

Někteří lidé budou okamžitě vidět strom a ptáci při prohlížení logo Pittsburgh Zoo & PPG Aquarium, zatímco jiní budou vidět gorila a lev zíral na sebe navzájem.

Další skvělý příklad na obrázku/zem gestalt principu.,

jednodušší příklad může být viděn s tímto obrazem, dvou tváří vytvoří svícen nebo vázu mezi nimi:

V této slavné iluzi vyvinut dánský psycholog Edgar Rubin, divák je obvykle prezentovány s dvěma tvar výklady—dva obličeje nebo vázu. Je to další vynikající příklad principu postavy / země.

obecně bude váš mozek interpretovat větší plochu obrazu jako zemi a menší jako obrázek., Jak je znázorněno na obrázku výše, i když, můžete vidět, že světlejší a tmavší barvy mohou ovlivnit to, co je zobrazeno jako obrázek, a to, co je vnímána jako země.

obrázek/ground princip může být velmi užitečné, když návrháři produktů chcete zvýraznit kontaktní místo, zejména, když je aktivní nebo v použití—například, když se modální okno se objeví, a zbytek stránky ustupuje do pozadí, nebo když je vyhledávací panel, kliknete na a kontrast se zvyšuje mezi ním a zbytkem stránky.,

Symetrie a Řádu

zákon symetrie a pořádku je také známý jako prägnanz, německé slovo pro „dobrou postavu.“Tento princip říká, že váš mozek bude vnímat nejednoznačné tvary co nejjednodušším způsobem. Například monochromatická verze olympijského loga je považována spíše za řadu překrývajících se kruhů než za sbírku zakřivených čar.,

Zde je další dobrý příklad gestalt princip konstrukce „prägnanz“:

Váš mozek bude interpretovat obrázek vlevo jako obdélník, kruh, trojúhelník, i když obrysy každého jsou neúplné, protože ty jsou jednodušší tvary než na celkový obraz.

společný osud

zatímco společný osud nebyl původně zahrnut do teorie gestalt, od té doby byl přidán. V designu UX nelze jeho užitečnost přehlédnout., Tato zásada uvádí, že lidé budou seskupovat věci, které ukazují nebo se pohybují stejným směrem.

V přírodě to vidíme ve věcech, jako jsou hejna ptáků nebo školy ryb. Jsou vyrobeny z spoustu jednotlivých prvků, ale protože se pohybují zdánlivě jako jeden, náš mozek je seskupit dohromady a považovat je za jediný stimul.

hejno ptáků je při létání stejným směrem vnímáno jako jediná jednotka a tím sdílí společný osud., (Martin Adams na Unsplash)

To je velmi užitečné v UX jako animované efekty se stala více převládající v moderním designu. Všimněte si, že prvky se ve skutečnosti nemusí pohybovat, aby mohly těžit z tohoto principu, ale musí vyvolat dojem pohybu.

principy Gestalt v designu UX

stejně jako u jakéhokoli psychologického principu může učení začlenit principy vizuálního vnímání gestalt do vaší designové práce výrazně zlepšit uživatelskou zkušenost., Pochopení toho, jak funguje lidský mozek, a pak využívá člověk přirozené tendence vytváří více bezproblémové interakce, které dělá uživatel cítit pohodlně na webu, i když je to jejich první návštěva.

Gestalt principy jsou relativně snadno začlenit do téměř jakéhokoliv designu a může rychle zvýšit design, který se zdá být nahodilé, nebo jako je to boj o pozornost uživatele na jeden, který nabízí bezproblémové, přirozené interakce, která vede uživatele k akci chcete, aby se.