Lytt til lydversjonen av denne artikkelen

Negativ plass har lenge vært en stift for god design. Å forlate hvitt mellomrom rundt elementer i et design er det første som vanligvis kommer til hjernen. Men så er det design som bruker det hvite rommet til å utlede et element som ikke er der (pilen skjult mellom E og X i FedEx-logoen kommer umiddelbart til å tenke på som et eksempel).

Den menneskelige hjerne er usedvanlig god til å fylle ut emnene i et bilde og skape en helhet som er større enn summen av delene. Det er derfor vi ser ansikter i ting som treblader eller fortau sprekker.

Dette prinsippet er en av de viktigste underliggende ideene bak gestaltprinsippene for visuell persepsjon. Det mest innflytelsesrike tidlige forslaget skrevet om teorien ble publisert av Max Wertheimer i 1923 Gestaltlover for perseptuell organisering , skjønt Wolfgang Köhlers 1920-diskusjon av Fysiske former inneholder også mange innflytelsesrike ideer om emnet.

Uansett som først foreslo ideene (det har vært essays helt tilbake til 1890), gestaltprinsipper er et viktig sett med ideer for alle designer å lære, og implementeringen av dem kan forbedre ikke bare estetikken til et design, men også dets funksjonalitet og brukervennlighet.

I de enkleste termer er gestaltteori basert på ideen om at den menneskelige hjerne vil forsøke å forenkle og organisere komplekse bilder eller design som består av mange elementer, ved ubevisst å ordne delene i et organisert system som skaper en helhet, snarere enn bare en serie av ulike elementer. Hjernen vår er bygget for å se struktur og mønstre slik at vi bedre kan forstå miljøet vi lever i.

Det er seks individuelle prinsipper som ofte er knyttet til gestaltteori: likheten , fortsettelse , nedleggelse , nærhet , figur / bakken , og symmetri og orden (også kalt kortfattethet ). Det er også noen ekstra, nyere prinsipper som noen ganger er knyttet til gestalt, for eksempel felles skjebne .

Likheten

Det er menneskelig natur å gruppere som ting sammen. I gestalt er lignende elementer gruppert visuelt, uavhengig av nærheten til hverandre. De kan grupperes etter farge, form eller størrelse. Likheten kan brukes til å knytte sammen elementer som kanskje ikke er rett ved siden av hverandre i et design.

Selvfølgelig kan du gjøre ting forskjellige hvis du vil få dem til å skille seg ut fra mengden. Det er grunnen til at knapper for handlinger ofte er utformet i en annen farge enn resten av siden - slik at de skiller seg ut og trekker den besøkendes oppmerksomhet til ønsket handling.

I UX-design gjør bruk av likhet det tydelig for dine besøkende hvilke varer som er like. For eksempel, i en funksjonsliste som bruker repeterende designelementer (for eksempel et ikon ledsaget av 3-4 linjer med tekst), vil likhetsprinsippet gjøre det enkelt å skanne gjennom dem. Derimot endrer designelementene for funksjoner du vil fremheve, at de skiller seg ut og gir dem større betydning i den besøkendes oppfatning.

Selv ting som er enkle som å sørge for at lenker i et design er formatert på samme måte, er avhengige av likhetsprinsipp på den måten de besøkende vil oppfatte organisasjonen og strukturen til nettstedet ditt.

Fortsettelse

De lov om kontinuitet antyder at det menneskelige øye vil følge den jevneste banen når man ser på linjer, uavhengig av hvordan linjene faktisk ble tegnet.

Denne fortsettelsen kan være et verdifullt verktøy når målet er å lede et besøkendes øye i en bestemt retning. De vil følge den enkleste banen på siden, så sørg for at de mest vitale delene de skal se faller innenfor den banen.

Siden øyet naturlig følger en linje, vil plassering av elementer i en serie i en linje naturlig trekke øyet fra ett element til det neste. Horisontale glidebrytere er et slikt eksempel, det samme er relaterte produktoppføringer på nettsteder som Amazon.

Lukking

Lukking er et av de kuleste gestaltprinsippene og en jeg allerede har berørt i begynnelsen av dette stykket. Det er ideen at hjernen din skal fylle ut de manglende delene av et design eller bilde for å skape en helhet.

I sin enkleste form tillater prinsippet om lukking øyet å følge noe som en stiplet linje til enden. Men mer komplekse applikasjoner blir ofte sett i logoer, slik som for World Wildlife Fund. Store biter av omrisset til pandaen mangler, men hjernen din har ikke noe problem å fylle ut de manglende delene for å se hele dyret.

Lukking brukes ofte i logo-design, med andre eksempler, inkludert de for USA Network, NBC, Sun Microsystems og til og med Adobe.

Et annet veldig viktig eksempel på nedleggelse på jobb i UX og UI-design er når du viser et delvis bilde som falmer av brukerens skjerm for å vise dem at det er mer å finne hvis de sveiper mot venstre eller høyre. Uten et delvis bilde, dvs. hvis bare fulle bilder vises, tolker hjernen ikke umiddelbart at det kan være mer å se, og det er derfor mindre sannsynlig at brukeren din vil rulle (siden lukking allerede er tydelig).

Nærhet

Nærhet refererer til hvor nær elementene er til hverandre. De sterkeste nærhetsforholdene er de mellom overlappende motiver, men bare å gruppere objekter i et enkelt område kan også ha en sterk nærhetseffekt.

Det motsatte er også sant, selvfølgelig. Ved å sette mellomrom mellom elementene, kan du legge til separasjon selv når de andre egenskapene er de samme.

Ta denne gruppen sirkler, for eksempel:

I UX-design brukes nærhet ofte for å få brukere til å gruppere visse ting sammen uten bruk av ting som harde grenser. Ved å legge like ting nærmere hverandre, med plass mellom hver gruppe, vil seeren umiddelbart ta opp organisasjonen og strukturen du vil at de skal oppfatte.

Figur / bakken

De figur / grunnprinsipp ligner på lukkingsprinsippet ved at det utnytter måten hjernen behandler negativt rom på. Du har sannsynligvis sett eksempler på dette prinsippet som flyter rundt i memes på sosiale medier, eller som en del av logoer (som FedEx-logoen allerede nevnt).

Hjernen din vil skille mellom objektene den anser å være i forgrunnen til et bilde (figuren eller fokuspunktet) og bakgrunnen (området som figurene hviler på). Hvor ting blir interessante er når forgrunnen og bakgrunnen faktisk inneholder to forskjellige bilder, slik:

Et enklere eksempel kan sees med dette bildet, av to ansikter som skaper en lysestake eller vase mellom dem:

Generelt vil hjernen din tolke det større området av et bilde som bakken og det mindre som figuren. Som vist på bildet ovenfor kan du skjønne at lysere og mørkere farger kan påvirke det som blir sett på som figuren og det som blir sett på som bakken.

Figur / grunnprinsippet kan være veldig nyttig når produktdesignere ønsker å markere et knutepunkt, spesielt når det er aktivt eller i bruk - for eksempel når et modalvindu dukker opp og resten av nettstedet falmer i bakgrunnen, eller når det klikkes på en søkefelt og kontrasten økes mellom det og resten av nettstedet.

Symmetri og orden

Loven om symmetri og orden er også kjent som kortfattethet , det tyske ordet for 'god figur.' Hva dette prinsippet sier er at hjernen din vil oppfatte tvetydige former på en så enkel måte som mulig. For eksempel blir en monokrom versjon av den olympiske logoen sett på som en serie med overlappende sirkler i stedet for en samling av buede linjer.

Her er et annet godt eksempel på gestaltdesignprinsippet ' kortfattethet ':

Hjernen din vil tolke bildet til venstre som et rektangel, sirkel og trekant, selv når omrissene av hver er ufullstendige fordi de er enklere former enn det generelle bildet.

Felles skjebne

Samtidig som felles skjebne var ikke opprinnelig inkludert i gestaltteorien, den har siden blitt lagt til. I UX-design kan ikke bruken av den overses. Dette prinsippet sier at folk vil gruppere sammen ting som peker på eller beveger seg i samme retning.

I naturen ser vi dette i ting som fugleflokker eller fiskeskoler. De består av en haug med individuelle elementer, men fordi de tilsynelatende beveger seg som en, grupperer hjernen vår dem og anser dem som en eneste stimulans.

Dette er veldig nyttig i UX ettersom animerte effekter blir mer utbredt i moderne design. Merk at elementer faktisk ikke trenger å bevege seg for å dra nytte av dette prinsippet, men de må gi inntrykk av bevegelse.

Gestalt-prinsipper i UX-design

Som med ethvert psykologisk prinsipp, kan læring å innlemme de visuelle oppfatningsprinsippene for gestalt i designarbeidet ditt forbedre brukeropplevelsen. Å forstå hvordan den menneskelige hjerne fungerer og deretter utnytte en persons naturlige tendenser skaper en mer sømløs interaksjon som får brukeren til å føle seg komfortabel på et nettsted, selv om det er deres første besøk.

Gestaltprinsipper er relativt enkle å innlemme i omtrent hvilket som helst design og kan raskt heve et design som virker tilfeldig eller som om det kjemper for brukerens oppmerksomhet mot et som gir en sømløs, naturlig interaksjon som leder brukerne mot handlingen du vil at de skal utføre.

• • •

Videre lesing på ApeeScape Design Blog:

• Designprinsipper: Introduksjon til hierarki
• UI Design Best Practices and Common Feil
• Hvordan bruke kraftige gestaltprinsipper i design (med infografikk)
• Den omfattende guiden til informasjonsarkitektur
• Øk UX-en din med disse vellykkede prinsippene for interaksjonsdesign

Forstå det grunnleggende

Hva er gestaltprinsippene for design?

De klassiske prinsippene for gestaltteorien om visuell oppfatning inkluderer likhet, fortsettelse, lukking, nærhet, figur / bakken og symmetri og orden (også kjent som prägnanz). Andre, som 'felles skjebne', har blitt lagt til de siste årene.

Hvorfor er gestaltteori viktig?

Gestaltprinsipper kan raskt løfte et design som virker tilfeldig eller som om det kjemper for brukerens oppmerksomhet mot et som gir en sømløs, naturlig interaksjon som gjør at nettstedet ditt føles kjent mens de veileder brukerne mot handlingen du vil at de skal utføre.

Hva er visuelt hierarki i design?

I design er visuelt hierarki tilrettelegging eller posisjonering av forskjellige designelementer for å gi dem større eller mindre betydning. De forskjellige gestaltprinsippene påvirker visuelt hierarki sterkt.

Hva er gestaltteorien om persepsjon?

Gestaltteorien om persepsjon prøver å forklare måten den menneskelige hjerne tolker informasjon om relasjoner og hierarki i et design eller bilde basert på visuelle signaler som nærhet, likhet og lukking.