01 od 07
Šta je vizuelni tok?
Vizuelni tok nosi posmatračko oko kroz dokument na način da svi važni elementi dobijaju istaknutost, a ništa ne prenese viziju ili prouzrokuje gledaocu da izgubi smisao. Korišćenje očiglednih elemenata protoka kao što su strelice ili brojevi je najčešći način da veb dizajneri koriste protok, ali postoje i drugi tipovi elemenata koji se mogu koristiti i pogrešno upotrebljavati kako bi usmerili čitaoce da se kreću po određenom putu. Koraci u ovom uputstvu će vam pokazati primere dobre i loše protoka i pomoći vam da naučite vokabular vizuelnog toka u dizajnu.
Vizuelni protok se može postići na više načina:
- Strelice
- Sekvencijalne slike ili elementi teksta
- Perspektiva
- Gradijenti
- Promene veličine
- Curves
- Pokret u slikama
- Lice - posebno oči
Sledeće slike će vam pokazati neke uobičajene greške u toku na Web stranama i kako ih ispraviti.
02 od 07
Zapadni tekstovi iz leve na desno
Ako ste odrastali čitajući zapadni jezik, navikli ste na razmišljanje da tekst treba da se pomera s leva na desno. Dakle, dok se oko pomiče preko linije teksta, kreće se s leva na desno.
Na gornjoj slici, vodopad teče u pravcu ulevo na lijevo, a tekst prelazi vodopad. S obzirom da svi znamo da padaju vodopadi, u pravcu protoka vode se odvija odvod teksta teksta. Gledaocko oko se pomera u pogrešnom smeru da pročita tekst.
03 od 07
Vaš tekst treba da protiče sa slikama
U ovom slučaju, slika je obrnuta tako da tekst teče u istom pravcu kao i voda. Svi elementi dovode gledaoci u oči sa protokom vode i protokom teksta.
04 od 07
Levo na desno jednako brzo
Konj na ovoj fotografiji traje odozdo na levo, ali tekst je engleski i odozgo na desno. Vizuelni uticaj trke konja u jednom smeru usporava brzinu čitavog dokumenta jer ide u drugom pravcu od teksta.
U zapadnim kulturama, jer se naši jezici kreću s lijeva na desno, dolazili smo da povezujemo vizuelni pravac levo-desno kao napred i brzo, dok je desno na levo više povratno i sporo. Kada kreirate izgled sa konotacijom brzine, trebalo bi da zapamtite ovo - i držite svoje slike u pravcu istog pravca kao i tekst.
05 od 07
Nemojte siliti očiju gledaoca da usporava
Kada konji i tekst idu u istom pravcu, implicitna brzina se povećava.
06 od 07
Gledajte oči u veb fotografijama
Mnoge veb stranice sa fotografijama čine ovu grešku - stavljaju fotografiju osobe na stranici, a osoba gleda dalje od sadržaja. Ovo se čak može videti i na veb lokaciji About.com Web Design u starom dizajnu.
Kao što vidite, moja fotografija se nalazi pored nekog teksta. Ali ja gledam dalje od tog teksta, skoro mi je okrenuo leđa. Ako ste videli taj jezik tela između dve osobe u grupi, bilo bi lako pretpostaviti da mi se ne sviđa osoba kojoj sam ja (u ovom slučaju tekst).
Mnoge studije o praćenju očiju pokazale su da ljudi vide lica na veb stranicama. I srodne studije su pokazale da će ljudi, kada gledaju slike, nesvesno prate oči kako bi videli šta slika gleda. Ako fotografija na vašoj web lokaciji gleda na ivicu pregledača, tu će vam izgledati vaši kupci, a zatim pritisnuti dugme za povratak.
07 od 07
Oči na bilo kojoj fotografiji bi trebalo da se suoče sa sadržajem
U novom dizajnu za About.com, fotografija je malo bolja. Sada mi oči gledaju napred, a malo je nagoveštaja da gledam na levo - gde je tekst.
Još jedna bolja fotografija za tu poziciju bila bi mesto gde su mi ramena bila takođe nagnuta prema tekstu. Ali ovo je mnogo bolje rešenje od prve fotografije. A, za situacije u kojima će slika biti na pravu sadržaja, kao i levo, to bi mogao biti dobar kompromis.
Zapamtite, takođe, da dok slike ljudi naglašavaju najviše pažnje, isto važi i za fotografije životinja. Na primjer, u ovom rasporedu uzorka, moje pse gledaju levo, ali slika je u pravu. Tako oni gledaju na stranu. Ovaj izgled bi se poboljšao ako bih promenio orijentaciju pasa tako da su gledali u centar ekrana.