Przepływ wizualny przenosi wzrok widza przez dokument w taki sposób, że wszystkie ważne elementy zyskują na znaczeniu, i nic nie porwie wizji ani nie zmusi widza do utracenia sensu utworu. Używanie oczywistych elementów przepływu, takich jak strzałki lub liczby, jest najczęstszym sposobem korzystania z przepływu przez projektantów stron internetowych, ale istnieją inne typy elementów, które mogą być używane i niewłaściwie używane w celu skierowania czytelników do poruszania się po określonej ścieżce. Kroki w tym samouczku pokażą przykłady dobrych i złych przepływów i pomogą ci nauczyć się słownictwa wizualnego przepływu w projektowaniu.
Czym jest Visual Flow?
Przepływ wizualny można osiągnąć na wiele sposobów:
- Strzały
- Sekwencyjne obrazy lub elementy tekstowe
- Perspektywiczny
- Gradienty
- Zmiany rozmiaru
- Krzywe
- Ruch w obrazach
- Twarze - szczególnie oczy
Poniższe zdjęcia pokażą niektóre typowe błędy w przepływie na stronach internetowych i sposoby ich poprawiania.
02 z 07Tekst zachodni płynie od lewej do prawej
Jeśli dorastałeś czytając język zachodni, jesteś przyzwyczajony do myślenia, że tekst powinien poruszać się od lewej do prawej. Tak więc, gdy oko porusza się po linii tekstu, porusza się od lewej do prawej.
Na powyższym zdjęciu wodospad płynie w kierunku od prawej do lewej, a tekst płynie w górę wodospadu. Ponieważ wszyscy wiemy, że wodospady spadają, następuje rozłączenie w kierunku przepływu wody wraz z przepływem tekstu. Oko widza przesuwa się w niewłaściwym kierunku, aby przeczytać tekst.
03 z 07Twój tekst powinien płynąć wraz z obrazami
W takim przypadku obraz został odwrócony, aby tekst płynął w tym samym kierunku co woda. Wszystkie elementy kierują wzrok widza strumieniem wody i strumieniem tekstu.
04 z 07Od lewej do prawej to szybko
Koń na tym zdjęciu biegnie od prawej do lewej, ale tekst jest angielski, a więc od lewej do prawej. Wizualny wpływ wyścigi konnej w jednym kierunku spowalnia tempo całego dokumentu, ponieważ zmierza w innym kierunku niż tekst.
W kulturach zachodnich, ponieważ nasze języki poruszają się od lewej do prawej, doszliśmy do powiązania kierunku wizualnego od lewej do prawej jako do przodu i do przodu, podczas gdy prawo do lewej jest bardziej zacofane i powolne. Gdy tworzysz układ o konotacji prędkości, powinieneś o tym pamiętać - i utrzymywać zdjęcia w ruchu w tym samym kierunku co tekst.
05 z 07Nie zmuszaj spojrzenia widza do spowolnienia
Kiedy koń i tekst idą w tym samym kierunku, sugerowana prędkość wzrasta.
06 07Oglądaj oczy w zdjęciach internetowych
Wiele stron internetowych ze zdjęciami popełnia ten błąd - umieszczają zdjęcie osoby na stronie, a dana osoba patrzy z dala z treści. Można to nawet zobaczyć na stronie internetowej About.com w starym projekcie.
Jak widać, moje zdjęcie jest umieszczone obok tekstu. Ale odwracam wzrok od tego tekstu, prawie odwracam się do niego plecami. Jeśli zobaczysz ten język ciała pomiędzy dwiema osobami w grupie, łatwo będzie założyć, że nie podoba mi się osoba, którą jestem obok (w tym przypadku blok tekstu).
Wiele badań śledzenia oczu pokazało, że ludzie widzą twarze na stronach internetowych. A podobne badania wykazały, że patrząc na zdjęcia ludzie nieświadomie podążają za wzrokiem, aby zobaczyć, na co patrzy obraz. Jeśli zdjęcie w Twojej witrynie spogląda poza krawędź przeglądarki, to właśnie tam będą wyglądać Twoi klienci, a następnie kliknij przycisk Wstecz.
07 z 07Oczy w każdym zdjęciu powinny zmierzyć się z treścią
W nowym projekcie witryny About.com zdjęcie jest trochę lepsze. Teraz moje oczy patrzą bardziej naprzód i jest drobna wskazówka, że patrzę w lewo - tam, gdzie jest tekst.
Jeszcze lepszym zdjęciem dla tej pozycji byłoby takie, w którym moje ramiona również były pochylone w stronę tekstu. Ale jest to o wiele lepsze rozwiązanie niż pierwsze zdjęcie. A w sytuacjach, w których obraz znajduje się po prawej stronie zarówno treści, jak i lewej, może to być dobry kompromis.
Pamiętaj też, że podczas gdy obrazy twarzy ludzi przyciągają najwięcej uwagi, to samo dotyczy zdjęć zwierząt. Na przykład w tym przykładowym układzie, moje psy patrzą w lewo, ale obraz jest wyrównany. Więc patrzą na stronę. Ten układ byłby lepszy, gdybym zmienił orientację psów tak, aby patrzyły w środek ekranu.
