Indholdsfortegnelse
Lær betydningen af designbegrebet white space, og hvordan det kan bruges i grafisk design.
Udtrykket white space betegner det hvide, tomme rum mellem designelementer i layouts og sideillustrationer og afstanden mellem enkelte læsbare bogstaver og tegn. I nogle tilfælde kaldes det hvide rum for Negative Space. Udtrykket stammer fra trykte designprojekter, hvor der blev brugt hvidt papir til at trykke designkampagnerne.
Det kan umiddelbart virke mærkeligt, at den tomme hvide baggrund betragtes som et designelement. Alligevel kan en strategisk placering af hvidt rum forbedre sammensætningen af en kampagne eller et design dramatisk. Det hvide rum giver øjet og hjernen mulighed for at behandle og hvile sig fra den store mængde af information og visuelt indhold.
Ved at anvende white space reduceres den kognitive belastning af seeren betydeligt, idet store informationsblokke organiseres, så de stadig er let fordøjelige for seeren ved at optimere læsbarheden af indholdet betydeligt.
Den strategiske implementering af hvidt rum er det ideelle værktøj til at lede beskuerens øje; det er ikke spild af plads!
Hvidt rum er ikke bare et ubetydeligt tomrum; det kan blive et vigtigt designelement, hvis det bruges strategisk. Den gennemsnitlige opmærksomhedsspændvidde hos seeren bliver stadig kortere, hvilket gør det vigtigt at bruge hvidt rum smart!
De forskellige typer af hvidt område:
Inden for paraplybegrebet white space er der fire definerede underkategorier:
Makro Whitespace:
Makro white space er mellemrummet mellem designelementer, såsom tekst, billeder og grafiske designelementer. Det primære formål med makro white space er at forbedre layoutet af dit websted og gøre det lettere at forstå og navigere på. En betydelig mængde makro white space omkring et designelement kan magnetisk tvinge beskueren til at kigge på det pågældende designelement.
Der kan findes eksempler på makro-hvidrum:
- I margenerne på et websted
- Omkring logoet i ikonerne
- I heltebilleder
- I Adskillelse af hovedindhold og sidebar
- Omkring CTA-knapper
Micro Whitespace
Mikro-hvidrum er mellemrummet mellem mindre layoutelementer, f.eks. mellemrummet mellem bogstaver, afstanden mellem afsnit, mellemrummet mellem linjer (kerning) og linjehøjden (leading).
Det primære formål med mikro-hvidrum er at forbedre læsbarheden og læsbarheden af dit indhold. Vigtigheden af mikro-hvidrum i bogstavafstanden bør ikke undervurderes, da aspektet af kerning og liniehøjde i tekstens krop og de enkelte bogstaver har stor betydning for tekstens generelle læsbarhed. En blanding af små og store bogstaver er f.eks. meget lettere at læse.læses bedre end kun store bogstaver på grund af variationen i det negative mellemrum mellem dem.
Det aktive hvide rum
Aktivt hvidt rum betyder, at indholdet på et websted eller i en trykkampagne flyder godt, at læseren let kan finde frem til alle CTA-elementer (Call to action), og at læserens fokus er stabilt og velorienteret.
Det passive hvide rum
Passiv hvid plads er den plads, der automatisk følger af placeringen af grafiske elementer eller tekst. Bogstaver og designbilleder har brug for en vis afstand. Ellers ville disse elementer overlappe hinanden og gøre kampagnen eller webstedet ulæseligt.
Hvad er forskellen mellem hvidt og negativt rum?
For at besvare spørgsmålet er der ingen forskel; disse to udtryk kan bruges i flæng.
Udtrykket white space stammer fra trykte kampagner eller layouts. De dele af det hvide papir, der ikke var trykt, blev kaldt white space. Whitespace space er ikke begrænset til den hvide farve og kan bestå af alle farver, der kan opfattes af det menneskelige øje.
Udtrykket negativt rum stammer fra fotografiet. Defineret som positivt rum er objekter, der fanger opmærksomheden, mens det negative rum består af baggrundselementer.
Sådan bruger du hvidt mellemrum
Strategisk brug af hvidt rum kan ændre det visuelle fokus og seerens retning. Masser af hvidt rum omkring et designelement, en tekst eller et enkelt bogstav kan isolere elementet visuelt og dermed fange seerens umiddelbare opmærksomhed.
Et hvidt rum kan være afgørende for en virksomheds branding eller for de fleste luksusmærker. Websites, layouts eller reklamekampagner, der f.eks. indeholder et stort hvidt rum, opfattes som klare, sofistikerede og luksuriøse.
I næste del af dette designtip vil vi vise dig nogle gode eksempler på strategisk brug og placering af hvidt rum i layouts, bogstaver og logodesign, de såkaldte white space-logoer.
Hvorfor hvidt rum bruges i design:
Sådan fremhæver du skjulte elementer i logoer
Hvidt rum er et designelement, der også kan bruges i logodesign; her er et par glimrende eksempler:
En af de mest berømte anvendelser af negativt rum er FedEx' logo. Det negative rum mellem bogstaverne "d" og "E" er et strategisk designelement. Det negative rum mellem bogstaverne "E" og "x" skaber en pil, der peger mod højre.
Billedkilde: vaccodadesign.com
Et andet genialt design af et white space-logo er logoet fra WWF (Øjnene danner straks pandaen i den visuelle opfattelse; det hvide rum er så glimrende gennemført, at man næsten overser, at det er skabt med negativt rum.
Billedkilde: Inspirationfeed.com
For at henlede brugerens opmærksomhed på bestemte objekter
Nedenfor kan du se to eksempler på en virkelig mesterlig brug af hvidt rum.
Billedkilde: impactplus.com
Her kan du se en massiv mængde hvidt rum omkring produktet og dets navn, hvilket giver beskueren intet andet valg end at beundre designet af den nye MacBook Air. Det hvide rum giver det fængslende heltebillede en central plads og erstatter de vandrette linjer i bogstaverne "A" og "R".
Billedkilde: Pinterest.co.uk
Se også: Sådan gemmer du dine filer i VectornatorI dette mesterlige design til en plakat for filmen Snehvide og de syv dværge kan man se, at det hvide rum kan bruges til at skabe et andet billede. Tomheden danner pludselig et grafisk billede i beskuerens øje.
Sådan gør du teksten mere læsbar
Uorganiserede layouts suger glæden ud af enhver læser. Tag et kig på den trange, rodet layout-side nedenfor. Ser det ud som en fornøjelig læsning for dig? Når du ser på det, bliver du anspændt, og du vil hellere smide bladet i skraldespanden end at læse artiklen.
Billedkilde: barnyardmarketing.com
Se nu på det organiserede layout af det samme indhold med hvidt rum:
Billedkilde: barnyardmarketing.com
Se også: Anvend skygge i designAaahh, så meget bedre; man har straks lyst til at fiske bladet op af skraldespanden, sætte sig ned og læse artiklen, hvilket illustrerer den utrolige kraft af godt white space design! Den visuelle tyngde og det visuelle kaos er blevet fjernet! Indholdet bliver straks tiltalende og let fordøjeligt!
Det visuelle hierarki
Visuelt hierarki er et begreb, der beskriver, hvordan beskuerens øje bevæger sig. Ideen om visuelt hierarki er baseret på Gestaltprincipperne. De første Gestaltprincipper blev udviklet i 1920'erne af de tyske psykologer Max Wertheimer, Kurt Koffka og Wolfgang Kohler, som ønskede at forstå, hvordan mennesker generelt opnår meningsfulde opfattelser af de kaotiske stimuli omkring dem.
Det visuelle hierarki er en kompositionsteknik, der systematisk leder beskuerens øje hen.Lær mere om det visuelle hierarki i bogstaver og designlayout i denne video med designer Will Paterson.
Visuelt hierarki kan lede beskueren gennem hvidt rum, farver, symmetri, bevægelse, gruppering, kontrast og mange andre designaspekter.
Læs mere på vores blog om, hvordan designere kan bruge visuelt hierarki strategisk i grafisk design.Loven om nærhed
Loven om nærhed er et af Gestaltprincipperne og fastslår, at objekter tæt på hinanden opfattes som mere beslægtede end objekter, der er langt fra hinanden.
I dette tilfælde hjælper den systematiske brug af hvidt rum med at gruppere relaterede indholdselementer for at lette orienteringen og navigationen af indholdet for beskueren.
Denne teori bør især tages i betragtning ved implementering af white space i UX- og UI-design og informationsvisualisering. Ved at bruge white space-teknikken til at gruppere UX- og UI-relaterede elementer forbedrer du den generelle læsbarhed og navigation. Ved at bruge denne teknik hjælper du beskueren med at forbinde prikkerne ved at gruppere de forbundne prikker (alias designelementer) tættere sammen.
Læs mere på vores blog om Gestaltprincipperne og loven om nærhed.Konklusion
Hvidt rum er et afgørende designelement til at lede beskuerens øje, organisere indholdet og til at give beskueren kognitiv hvile. Aspektet med hvidt rum forbedrer indholdets generelle læsbarhed, sætter tonen i design og branding og skaber fokus og opmærksomhed.
Før vi kan gøre information fordøjelig, må vi forstå betydningen og den rette brug af hvidt mellemrum. Den systematiske brug af hvidt mellemrum kan betragtes som "kunsten at skabe optisk afstand".
Du skal ikke være bange for rummet; brug det til din fordel!
