Share
The Golden Ratio brukes i grafiske layouter av alle slag, spesielt for å balansere innhold som er tekst tungt. Det kan hjelpe designere til å lage hierarki og tegne brukeres øyne til bestemte områder. Ta en titt på følgende nettsideeksempler og se hvordan designere bruker det!
The Golden Ratio er et matematisk forhold, ofte funnet i naturen, og brukes i klassisk designteori for å skape balansert komposisjoner. Den er omtrent lik 1.6180, er også kjent som "Golden Mean", "Golden Section", og refereres til av det greske bokstaven Phi "φ".
En "Gyllen rektangel" er et rektangel som har en lengde på 1.6180 ganger bredden. For eksempel a div som har en side på 300px og en annen på 300 * 1,6180 ≈ 485px kan sies å være en gylden rektangel.
Hvis du hugger av et perfekt firkant fra dette gyldne rektangel, blir du igjen med et annet gyldent rektangel.
Du kan gjøre det samme til det mindre rektangelet, så det samme igjen, uendelig, noe som gir deg dette kjente bildet:
Fibonacci Sequence er lik Golden Ratio, men ikke akkurat så. Det er en rekke tall hvor neste nummer i sekvensen er summen av de to foregående. For eksempel: 0, 1, 1, 2, 3, 5, 8
Hvis vi begynner med et perfekt torg, legger vi til det en annen, vi får et rektangel:
Fortsett å legge til firkanter langs lengste lengdeDeretter legger vi til et annet firkant, som er lik den lengste lengden av den totale formen:
Så igjen og igjen:
Dette kan gå på ubestemt tid, noe som gir oss samme effekt som vår gyldne rektangel, men denne gangen oppbygges i stedet for å hakke ned. Både Golden Ratio og Fibonacci Sequence gir oss tilsvarende tiltalende proporsjoner.
La oss nå analysere noen nettsteder hvor vi kan se dem i aksjon.
yourlocalstudio.dk"Ditt Lokale Studio" er et design- og utviklingsstudio basert i København, Danmark. De er spesialister på å jobbe med visuelle konsepter i noen form for å skape erfaringer som forbedrer omgivelsene.
Nettstedet bruker her den gyldne gjennomsnittet for to av sine tre sider. Hjemmesiden er en konseptuell oversikt over viktige arbeidsstykker. Men når du besøker studio siden, blander det litt av det tradisjonelle weboppsettet med gylne middelrektangulære former mens du ruller nedover siden.
Vil du skille seg ut i mengden? Yourlocalstudio (YLS) har gjort det ved å utnytte det gyldne forholdet i deres webdesign. Designet har et progressivt utseende med et bestemt gridsystem. Du kan hevde at i disse dager ealt ser ut som bootstrap... holde øye med flere og flere nettsteder som ønsker å fange oppmerksomhet med en mer strukturelt dynamisk utforming.
mashable.comMashable er et nytt nettsted; en kilde til informasjon, kunnskap og ressurser for "tilkoblet generasjon".
Jeg har brukt Golden Ratio-testen fra UX Triggers for å demonstrere hvordan Mashable bruker Fibonacci-sekvensen i layoutet. Innholdsoppsettet er fleksibelt, med overskriften til venstre og lenker til flere nyheter til høyre, skilt av gridene.
The Golden Ratio er effektiv her, da det gir et veldig innholdsrettet nettsted å gi typografi pusterom. Lignende nettsteder kan vises mer tett pakket med innhold, ved hjelp av tradisjonelle gridoppsett, men Mashable demonstrerer at Golden Ratio kan være effektivt selv når det er usynlig..
www.jandk.frJackson & Kent er et nettproduksjonsbyrå fra Frankrike. De spesialiserer seg på digitale tjenester som HTML5, CSS3, Drupal, Wordpress, PHP / MySQL, Flash etc.
Skjermbildet over viser hvordan utformingen i stor grad består av tidligere klientarbeid. Den har også en blokk med innhold om selve byrået og en navigeringslinje midt på skjermen. Kontaktknappen, som vist nedenfor, bruker også det gyldne gjennomsnittet som et rutenett for å organisere oppsettet på en unik måte.
Eksemplet her oppfordrer deg til å panorere gjennom nettstedet og utforske innholdet horisontalt. Den rissede visningen og blokker av forskjellig størrelse gjør innholdet mer visuelt interessant. Siden brukere sannsynligvis vil se innholdet på et skrivebord (så vel som en nettbrett), er det paginasjonsnumre på navigasjon med horisontal akse. Dette er en nyskapende måte å vise hvert innhold av, men også brukergrensesnittet som helhet.
Det gyldne forholdet fører naturlig til brukerens øye til bestemte punkter i et brukergrensesnitt. Som et konsept kan det hjelpe deg å tenke på plassering av innhold og bruke hierarki effektivt. Kombinasjonen av layout, typografi, farge og overordnede prinsipper vil bidra til å ta designene dine til neste nivå.
Accentsconagua