Flow am Design - Layout an Artwork, déi Bewegung entwéckelt

01 vum 07

Wat ass Visual Flow?

Visual Flow trëfft de Betrag vum Betrachter duerch de Dokument, esou datt all déi wichteg Elementer d'Prominence kréien, an näischt gesinn d'Visioun gutt oder d'Betrachter vergiessen de Sënn vum Stéck ze verléieren. Mat evidenten Stroumelementer wéi Pfeiler oder Zuelen ass déi meescht üblech wéi Webdesigner benotzt Stroum, awer et ginn aner Zorte Elementer déi benotzt kënne ginn a mis-benotzt fir Är Lieser ze leeden fir op enger spezifescher Fuert ze bewegen. D'Schrëtt an dësem Tutorial weisen Iech Beispiller vu gudden a schlechtem Flëss an hëllefen Iech den Vokabulär vum visuellen Floss an der Entwécklung ze léieren.

Visual Flëss kann op ville Weeër erreecht ginn:

Déi folgend Biller weisen Iech e puer üblech Feeler am Flëss op Websäiten a wéi se se ze korrigéieren.

02 vum 07

De westleche Text fléisst vu lénks a riets

Falsch Flow. Image courtesy M Kyrnin

Wann Dir eng westlech Sprooch erwuewe gouf, sidd Dir benotzt fir ze denken datt dësen Text vu lénks op riets réckgängeg ass. Also, well d'Auge sou eng Zeil vum Text bewegt, féiert se vu lénks op riets.

An dësem Bild geet de Waasserfall an e Recht op déi lénks Richtung a gëtt den Text den Waasserfall ëmstridden. Well mer all wëssen, datt Waasserfälle sech falen, da gëtt et eng Trennung vun der Waasserfluss mat dem Stréch vum Text. Den Auteur vum Astero ass an der falscher Richtung geluegt ginn fir den Text ze liesen.

03 vum 07

Äre Text soll mat den Biller fléissen

Correct Flow. Image courtesy M Kyrnin

An dësem Fall ass d'Bild ëmgedreckt ginn, sou datt de Text an der selwechter Richtung wéi d'Waasser fléisst. All Elementer féieren den Auteur vum Auteur mat dem Flëss vum Waasser an de Flow vum Text.

04 vun 07

Lénk nach riets gläicht séier

Falsch Flow. Image courtesy M Kyrnin

D'Päerd an dësem Photo féiert vu riets op lénks, awer den Text ass englesch an sou weider bis er riets. Déi visuell Auswierkunge vum Päerd an enger Richtung verlangsamt de Tempo vum ganze Dokument, well et eng aner Richtung gëtt wéi de Text.

In westlechen Kulturen, well eis Sprooche vu riet goën a riicht goe, hu mir eng visuell Richtung vu lénks a riets associéiert wéi se virgeschloen a séier, während riets nach lénks méi rëm a lues ass. Wann Dir e Layout mam Motiv vun der Geschwindigkeit erstellt, sollt Dir iech drun erënneren - an Är Biller beweegen an der selwechter Richtung wéi de Text.

05 vum 07

Do not Force de Visite vum Eye ze lueden

Correct Flow. Image courtesy M Kyrnin

Wann d'Päerd an den Text souwuel déi selwecht Richtung ginn, gëtt d'implizit Vitesse erhéicht.

06 vum 07

Kuckt d'Aen an de Websäite kucken

Falsch Flow. Image courtesy of J Kyrnin

Vill Websäiten mat Fotoen maachen dësen Fehler - si hunn eng Foto vun enger Persoun op der Säit gespaart, an déi Persoun kuckt weg vum Inhalt. Dëst kënne souguer op der Websäit Websäiten um Site.com am alen Design gesi ginn.

Wéi Dir kënnt gesinn, ass meng Foto nawell e puer Text. Awer ech kucken vun dësem Text, ech hu bal d'Réck zréck gemaach. Wann Dir dës Kriisensprach tëscht zwee Leit an enger Grupp gesinn hutt, wier et einfach, datt ech net gefällt datt ech déi nächst Nues (an dësem Fall den Textblock).

Vill Aacht Suen vu Studien hunn gewisen datt Leit Gesichter op Websäiten gesinn. An Zesummenhang mat Studien hunn gewisen, datt wann Dir op Fotoen kuckt, dann wäerten d'Leit onbewosst den Aen no kucken fir datt d'Biller kucken. Wann e Foto op Ärer Säit de Rand vum Browser kuckt, wäerte Är Clienten kucken a klickt dann op de Back Knäppchen.

07 vum 07

D'Aen an irgend eng Foto Sollt den Inhalt hunn

Correct Flow. Image courtesy of J Kyrnin

Am neien Design fir About.com ass d'Foto e bësse besser. Awer méng Ae si méi no vir kucken, an et ass e klenge Hauch, datt ech op meng lénks kucken - wou den Text ass.

E méi bessere Foto fir dës Positioun wier ee wou d'Schëlleren och op den Text gewunnt hunn. Mä dëst ass eng besser Method wéi d'éischte Foto. An, fir Situatiounen, wou d'Bild op der Säit vum Inhalt wéi och op der Säit sinn, kann dat e gudde Kompromiss sinn.

Erënnere och datt datt d'Biller vun de Gesichter vun de Leit déi meeschte kucke sinn, déi selwecht ass fir Déierfotoen. Zum Beispill, an dësem Exemplar-Layout hunn ech Hënnen erofgeluede gesicht, awer d'Bild ass richteg. Si si vun der Säit weg. Dëse Layout wier verbessert, wann ech d'Orientatioun vun Hënnen verännert hunn sou datt se an d'Mëtt vum Écran sin.