Share
Design er fullt av "usynlige krefter", som alle bidrar til ren og klar kommunikasjon. Så mye som du kan bli fristet til å beseire over å få akkurat den riktige skrifttypen, eller velge akkurat den rette kombinasjonen av farger, vil designet ditt mislykkes dårligere hvis du ikke tar hensyn til disse usynlige kreftene.
Dette er den første i en tredelers serie om disse styrkene, så la oss begynne med justering, retning og fokus.
For å virkelig tenke gjennom de usynlige kreftene i design, må du slutte å tenke på design som fonter, farger, bilder og tekst, og begynn å tenke på alle disse tingene som "elementer".
Hvert av overskriftene dine er et "element", hvert avsnitt av kroppstext er ett stort "element", og hvert bilde er et "element".
Innenfor hvert av elementene er et annet element - du kan også kalle dem "delelementer". Din logo kan ha et "symbol" -element, og et "tekst" -element. Og hvert brev i tekstdelen kan betraktes som eget element.
Alt dette elementet snakker gjør meg til å tenke på kjemi klasse (som jeg aldri tok), men det er egentlig riktig. Når du ordner elementer riktig, får du noe eksplosivt som hopper av siden. Når du ordner dem tilfeldig, får du en dud.
Design er utfordrende fordi du må ta en kjedelig todimensjonal plass, og gjør det interessant, mens du kommuniserer tydelig. Spesielt i dag, med små mobil- og bærbare skjermer, er det viktig å gjøre dette så effektivt som mulig. Hver lille piksel må gjøre jobben sin.
Derfor er justering så viktig. Ved å tilpasse elementer med hverandre kan du si mye.
For eksempel er disse rutene alle justert.
Og hvis vi endrer måten de er justert, endrer sammensetningen helt.
Og hvis vi bryter den justeringen, ser den ut som kaotisk.
Hvis vi i stedet for kvadrater bruker sosiale medier, kan du se hvordan justeringen blir nyttig. Hva om disse sosiale medier-ikonene:
I stedet så slik ut:
Når du justerer elementer, oppretter du en følelsesretning med en imaginær linje. Fancy designere kaller denne imaginære linjen en "akse". Tenk på det som en akse på et hjul: Alt vekten av hjulet spinner rundt den aksen. Den må balanseres. På samme måte bidrar en akse til å kontrollere balansen i en sammensetning.
Se alle disse elementene som er kantet opp? Du kan kalle dem en akse på denne sammensetningen.
Hvis du justerer andre elementer nær den aksen, dominerer den fremdeles og styrer sammensetningen.
Bestefaren din hadde rett: du må være forsiktig med øksene dine. For eksempel unngå å blande midtlinjert tekst med en "asymmetrisk" sammensetning.
Men du ordner teksten din: sentrert, flush til venstre eller flush til høyre (unngå å begrense typen på nettet), og du lager en akse langs denne justeringen.
Når du senterer tekst, lager du en akse, og hele vekten på teksten snurrer rundt den aksen. Resten av sammensetningen vil også være sentrert rundt den aksen.
Så, hvis du kaster litt flush venstre tekst ved siden av den sentrale teksten, begynner sammensetningen å bli forvirrende. Nå har du to akser som kjemper hverandre, og det er ikke så skummelt?
Unntaket til dette er når et senterjustert element spenner over sammensetningens bredde, og flush venstre eller flush høyre elementer er innenfor denne sammensetningen. Da kjemper ikke aksene hverandre.
Legg merke til at begge kolonnene av innhold er satt flush til venstre.
Dette er et mønster du vanligvis ser i mobildesign. I dette skjermbildet av Yelp-appen har de øverste og nederste menylinjene en sentrert orientering, mens resten av skjermen er satt i spyling igjen.
Eller du kan lage en akse ut av randen ved å lage en kolonne flush riktig, og den andre kolonnen spyles til venstre.
Så langt har jeg konsentrert seg om vertikale akser. Du kan også ha horisontale akser (eller diagonal, men det vil være sjeldent i web- og mobildesign).
Når to sterke akser krysser, vil du vanligvis skape et fokusområde. Øyet følger naturlig sterk sterk akse, så hvis to akser skjærer, vil øyet bruke mye tid på det stedet.
På et hvilket som helst tidspunkt i et web- eller mobildesign, er det sannsynlig noe du vil at brukeren skal konsentrere seg om, slik at du kan bruke akser som skjærer for å trekke oppmerksomheten til dette stedet, for eksempel i denne destinasjonssiden:
Skyllen i venstre tekst skaper en akse, og justeringen av "Kjøp nå" -knappen med bildet skaper en annen. Der de krysser, har det skapt et fokusområde.
Ved å bruke justering for å bygge akser, styreretning og etablere fokusområder, kan du bedre oppfylle dine designmål: om det øker lesbarheten eller kjører en konvertering.
Hold deg til min neste artikkel, der jeg snakker om hvordan du kan justere størrelsen på elementene dine for å lage design som er harmonisk, vakker og klar.
Accentsconagua