Explorarea principiilor Gestalt de proiectare

ascultați versiunea audio a acestui articol

spațiul negativ a fost mult timp un discontinue de design bun. Lăsarea spațiului alb în jurul elementelor unui design este primul lucru care de obicei îmi vine în minte. Dar apoi există modele care folosesc acel spațiu alb pentru a deduce un element care nu este de fapt acolo (săgeata ascunsă între E și X din sigla FedEx vine imediat în minte ca exemplu).

„E” și „x” în logo-ul FedEx a crea o săgeată în spațiul dintre ei.,

creierul uman este extrem de bun la a umple golurile dintr-o imagine și de a crea un întreg care este mai mare decât suma părților sale. De aceea vedem fețe în lucruri cum ar fi frunzele copacilor sau crăpăturile trotuarului.acest principiu este una dintre cele mai importante idei care stau la baza principiilor gestalt ale percepției vizuale., Cea mai influentă propunere timpurie scrisă despre teorie a fost publicată de Max Wertheimer în legile Gestalt din 1923 ale organizării perceptuale, deși discuția lui Wolfgang Köhler din 1920 despre Gestalten fizic conține, de asemenea, multe idei influente pe această temă.indiferent de cine a propus pentru prima dată ideile (au existat eseuri care datează încă din 1890), principiile gestalt sunt un set important de idei pentru orice designer de a învăța, iar implementarea lor poate îmbunătăți considerabil nu doar estetica unui design, ci și funcționalitatea și ușurința în utilizare.,în termeni simpli, teoria gestalt se bazează pe ideea că creierul uman va încerca să simplifice și să organizeze imagini complexe sau modele care constau din mai multe elemente, prin aranjarea subconștientă a părților într-un sistem organizat care creează un întreg, mai degrabă decât o serie de elemente disparate. Creierele noastre sunt construite pentru a vedea structura și tiparele pentru a înțelege mai bine mediul în care trăim.,

Există șase principii frecvent asociate cu teoria gestalt: similitudine, continuarea, de închidere, de proximitate, figura/sol, și de simetrie & comanda (de asemenea, numit prägnanz). Există, de asemenea, câteva principii suplimentare, mai noi, uneori asociate cu gestalt, cum ar fi soarta comună.

similitudine

este natura umană pentru a grupa ca lucrurile împreună. În gestalt, elemente similare sunt grupate vizual, indiferent de apropierea lor una de cealaltă. Ele pot fi grupate după culoare, formă sau dimensiune., Similitudinea poate fi utilizată pentru a lega împreună elemente care s-ar putea să nu fie chiar unul lângă celălalt într-un design.

pătrate aici sunt toate la distanțe egale și de aceeași dimensiune, dar noi în mod automat să le grupați după culoare, chiar dacă nu există nici o rimă sau un motiv pentru plasarea lor.

desigur, puteți face lucruri diferite, dacă doriți pentru a le face iasă în evidență din mulțime., De aceea, butoanele pentru apeluri la acțiune sunt adesea proiectate într—o culoare diferită de restul unei pagini-astfel încât acestea să iasă în evidență și să atragă atenția vizitatorului asupra acțiunii dorite.

în design UX, folosind similitudine face clar pentru vizitatorii care elementele sunt la fel. De exemplu, într-o listă de caracteristici care utilizează elemente de design repetitive (cum ar fi o pictogramă însoțită de 3-4 rânduri de text), principiul similitudinii ar facilita scanarea prin ele., În schimb, schimbarea elementelor de design pentru caracteristicile pe care doriți să le evidențiați le face să iasă în evidență și le conferă mai multă importanță în percepția vizitatorului.chiar și lucruri la fel de simplu ca asigurându-vă că link-uri de-a lungul unui design sunt formatate în același mod se bazează pe principiul de similitudine în modul în care vizitatorii vor percepe organizarea și structura site-ului.

continuare

legea continuității afirmă că ochiul uman va urma calea cea mai netedă atunci când vizualizează linii, indiferent de modul în care liniile au fost desenate.,

ochiul tinde să vrea să urmeze linia dreaptă de la un capăt de această cifră la alta, și curbat linie de sus în jos, chiar și atunci când liniile se schimba culoarea la jumătatea.

Acest continuarea poate fi un instrument valoros atunci când obiectivul este de a ghida ochiul vizitatorului într-o anumită direcție. Ei vor urma calea cea mai simplă de pe pagină, așa că asigurați-vă că părțile cele mai vitale pe care ar trebui să le vadă se încadrează în acea cale.,deoarece ochiul urmărește în mod natural o linie, plasarea articolelor într-o serie într-o linie va atrage în mod natural ochiul de la un element la altul. Glisoarele orizontale sunt un astfel de exemplu, la fel ca și listările de produse conexe pe site-uri precum Amazon.

Closure

Closure este unul dintre cele mai cool principii gestalt și unul pe care l-am atins deja la începutul acestei piese. Este ideea că creierul tău va completa părțile lipsă ale unui design sau imagine pentru a crea un întreg.în forma sa cea mai simplă, principiul închiderii permite ochiului să urmeze ceva ca o linie punctată până la capăt., Dar aplicații mai complexe sunt adesea observate în logo-uri, cum ar fi cea pentru Fondul Mondial pentru animale sălbatice. Bucăți mari ale conturului pentru panda lipsesc, dar creierul tău nu are nicio problemă să completeze secțiunile lipsă pentru a vedea întregul animal.

gestalt principiul de închidere este ilustrat frumos în World Wildlife fund panda logo-ul. Creierul completează formele albe, chiar dacă nu sunt bine definite.,

Închidere este destul de des folosit în logo design, cu alte exemple, inclusiv cei de la USA Network, NBC, Sun Microsystems, și chiar Adobe.un alt exemplu foarte important de închidere la locul de muncă în UX și UI design este atunci când arată o imagine parțială decolorare de pe ecranul utilizatorului pentru a le arăta că există mai multe pentru a fi găsit în cazul în care glisați spre stânga sau spre dreapta. Fără o imagine parțială, adică.,, dacă sunt afișate doar imagini complete, creierul nu interpretează imediat că ar putea fi mai multe de văzut și, prin urmare, utilizatorul dvs. este mai puțin probabil să deruleze (deoarece închiderea este deja evidentă).

proximitatea

proximitatea se referă la cât de apropiate sunt elementele unul de celălalt. Cele mai puternice relații de proximitate sunt cele dintre subiecții care se suprapun, dar doar gruparea obiectelor într-o singură zonă poate avea, de asemenea, un efect puternic de proximitate.

opusul este, de asemenea, adevărat, desigur., Prin plasarea spațiului între elemente, puteți adăuga separarea chiar și atunci când celelalte caracteristici ale acestora sunt aceleași.

Ia acest grup de cercuri, de exemplu:

singurul lucru Pe care diferențiază grupul de pe stânga de la cei de pe dreapta este apropierea de linii. Și totuși creierul tău interpretează imaginea din dreapta ca trei grupuri distincte.

O USPS PDF formularul de exemplu în cazul în care apropierea gestalt principiul este de a afecta UX., Datorită faptului că etichetele de câmp sunt mai aproape de câmpurile de sub ele, oamenii ar crede în mod eronat că acolo se află informațiile pentru „c” și „d”. totuși, informațiile ar trebui să fie furnizate în câmpurile de deasupra etichetelor de text.

în designul UX, proximitatea este cel mai adesea folosită pentru a determina utilizatorii să grupeze anumite lucruri împreună fără a folosi lucruri precum frontierele dure. Prin punerea ca lucrurile mai aproape împreună, cu spațiu între fiecare grup, privitorul va ridica imediat pe organizarea și structura pe care doriți să le perceapă.,

figura/sol

principiul figura / sol este similar cu principiul închiderii prin faptul că profită de modul în care creierul procesează spațiul negativ. Probabil că ați văzut exemple ale acestui principiu plutind în meme pe social media sau ca parte a logo-urilor (cum ar fi logo-ul FedEx menționat deja).creierul dvs. va distinge între obiectele pe care le consideră a fi în prim-planul unei imagini (Figura sau punctul focal) și fundalul (zona pe care se sprijină figurile)., În cazul în care lucrurile devin interesante când prim-plan și de fundal conține de fapt două imagini distincte, astfel:

Unii oameni vor vedea imediat copac și păsări, atunci când vizualizarea logo-ul de la grădina Zoologică din Pittsburgh & PPG Acvariu, în timp ce alții vor vedea gorila și leul se uită unul la celălalt.

un Alt mare exemplu de figura/sol gestalt principiul.,

Un simplu exemplu poate fi văzut cu această imagine, de două fețe crearea unei lumanari sau vaza între ele:

În acest faimos iluzie dezvoltat de către psiholog danez Edgar Rubin, privitorul este de obicei prezentat cu două forma interpretări—două fețe sau o vaza. Este un alt exemplu excelent al principiului figura / sol.

în termeni generali, creierul dvs. va interpreta zona mai mare a unei imagini ca sol și cea mai mică ca figură., După cum se arată în imaginea de mai sus, totuși, puteți vedea că culorile mai deschise și mai întunecate pot influența ceea ce este privit ca figură și ceea ce este privit ca sol.

principiul figura / sol poate fi foarte util atunci când designerii de produse doresc să evidențieze un punct focal, în special atunci când este activ sau în uz—de exemplu, când apare o fereastră modală și restul site-ului se estompează în fundal sau când se face clic pe o bară de căutare și contrastul este crescut între acesta și restul site-ului.,

Simetrie și Ordine

legii de simetrie și ordine este, de asemenea, cunoscut sub numele de prägnanz, cuvântul German pentru „figură bună.”Ceea ce spune acest principiu este că creierul tău va percepe forme ambigue într-un mod cât mai simplu posibil. De exemplu, o versiune monocromă a logo-ului Olimpic este văzută ca o serie de cercuri suprapuse, mai degrabă decât o colecție de linii curbe.,

Iată un alt exemplu bun de gestalt principiul de design „prägnanz”:

creierul va interpreta imaginea din stânga, ca un dreptunghi, cerc, triunghi, chiar și atunci când prezintă de fiecare sunt incomplete, deoarece acestea sunt mai simple forme decât imaginea de ansamblu.deși soarta comună nu a fost inclusă inițial în teoria gestalt, ea a fost adăugată de atunci. În designul UX, utilitatea sa nu poate fi trecută cu vederea., Acest principiu afirmă că oamenii vor grupa împreună lucruri care indică sau se mișcă în aceeași direcție.în natură, vedem acest lucru în lucruri precum turme de păsări sau școli de pești. Ele sunt alcătuite dintr-o grămadă de elemente individuale, dar pentru că se mișcă aparent ca unul, creierul nostru le grupează și le consideră un singur stimul.

Un stol de păsări este văzută ca o singură unitate, atunci când zboară în aceeași direcție și, astfel, schimbul de o soartă comună., (de Martin Adams pe Unsplash)

Acest lucru este foarte util în UX ca efecte animate devenit mai răspândit în design modern. Rețineți că elementele nu trebuie să se miște de fapt pentru a beneficia de acest principiu, dar trebuie să dea impresia de mișcare.ca și în cazul oricărui principiu psihologic, învățarea de a încorpora principiile percepției vizuale ale gestalt în munca dvs. de proiectare poate îmbunătăți considerabil experiența utilizatorului., Înțelegerea modului în care funcționează creierul uman și apoi exploatarea tendințelor naturale ale unei persoane creează o interacțiune mai perfectă care face ca un utilizator să se simtă confortabil pe un site web, chiar dacă este prima lor vizită.principiile Gestalt sunt relativ ușor de încorporat în aproape orice design și pot ridica rapid un design care pare întâmplător sau ca și cum ar lupta pentru atenția utilizatorului față de unul care oferă o interacțiune naturală, naturală, care îi ghidează pe utilizatori spre acțiunea pe care doriți să o ia.