הזרימה החזותית נושאת את עינו של הצופה דרך המסמך באופן שכל היסודות החשובים מקבלים עליו חשיבות, ושום דבר אינו מקפיץ את החזון או גורם לצופה לאבד את תחושת היצירה. שימוש באלמנטים זרימה ברור כמו חצים או מספרים היא הדרך הנפוצה ביותר מעצבי אינטרנט להשתמש זרימה, אבל ישנם סוגים אחרים של אלמנטים שניתן להשתמש בהם לרעה כדי לכוון את הקוראים שלך לעבור לאורך נתיב מסוים. השלבים במדריך זה יראו לך דוגמאות של זרימה טובה ורעה ולעזור לך ללמוד את אוצר המילים של זרימה חזותית בעיצוב.
מהי זרימה חזותית?
זרימה חזותית יכולה להיות מושגת בדרכים רבות:
- חצים
- תמונות רצופות או רכיבי טקסט
- פרספקטיבה
- גרדיאנטים
- שינויים בגודל
- עיקולים
- תנועה בתמונות
- פנים - במיוחד את העיניים
התמונות הבאות יראו לכם כמה טעויות נפוצות בזרימה בדפי אינטרנט וכיצד לתקן אותן.
02 of 07זרימת טקסט מערבית משמאל לימין
אם אתה גדל לקרוא שפה מערבית, אתה רגיל לחשוב כי הטקסט צריך לנוע משמאל לימין. אז, כמו העין נע על פני שורה של טקסט, זה נע משמאל לימין.
בתמונה שלמעלה, המפל זורם בכיוון ימין לשמאל, והטקסט זורם במעלה המפל. מכיוון שכולנו יודעים כי מפלים נופלים, יש נתק לכיוון זרימת המים עם זרימת הטקסט. עינו של הצופה נע בכיוון הלא נכון כדי לקרוא את הטקסט.
03 מתוך 07הטקסט שלך צריך לזרום עם תמונות
במקרה זה, התמונה התהפכה כך שהטקסט זורם באותו כיוון כמו המים. כל האלמנטים מובילים את העין של הצופה למטה עם זרימת המים ואת זרימת הטקסט.
04 of 07משמאל לימין שווה מהר
הסוס בתצלום הזה פועל מימין לשמאל, אבל הטקסט באנגלית ושמאל לימין. ההשפעה החזותית של הסוס מירוץ לכיוון אחד מאטה את קצב המסמך כולו כי זה הולך לכיוון שונה מאשר את הטקסט.
בתרבויות המערב, משום שהשפות שלנו נעות משמאל לימין, באנו לקשר כיוון חזותי משמאל לימין כאל קדמי ומהר, ואילו מימין לשמאל הוא יותר מפגר ואיטי. כאשר אתה יוצר פריסה עם קונוטציה של מהירות, אתה צריך לזכור את זה - ולשמור את התמונות שלך נעים באותו כיוון כמו הטקסט.
05 מתוך 07אל תכריח את עין הצופה להאט
כאשר הסוס ואת הטקסט הן הולכים באותו כיוון, את מהירות מרומזת הוא גדל.
06 מתוך 07צפה בעינים בתמונות אינטרנט
אתרי אינטרנט רבים עם תמונות לעשות את זה טעות - הם לשים תמונה של אדם על הדף, והאדם הוא מסתכל הרחק מהתוכן. זה אפילו יכול לראות באתר האינטרנט About.com עיצוב בעיצוב הישן.
כפי שניתן לראות, התמונה שלי ממוקמת ליד טקסט כלשהו. אבל אני מסב את מבטי מהטקסט הזה, וכמעט גבו אליו. אם ראית את שפת הגוף בין שני אנשים בקבוצה, זה יהיה קל להניח שאני לא אוהב את האדם שאני ליד (במקרה זה את גוש הטקסט).
מחקרים רבים על מעקב העין הראו שאנשים רואים פרצופים בדפי אינטרנט. ומחקרים קשורים הראו כי כאשר מסתכלים על תמונות, אנשים לאחר מכן באופן לא מודע בצע את העיניים כדי לראות מה התמונה מסתכלת. אם תמונה באתר שלך מביטה בקצה הדפדפן, שם ייראו הלקוחות שלך, ולאחר מכן לחץ על הלחצן 'הקודם'.
07 מתוך 07העיניים בכל תמונה צריך להתמודד עם התוכן
בעיצוב החדש עבור About.com, התמונה היא קצת יותר טוב. עכשיו העיניים שלי נראות יותר קדימה, ויש רמז קל שאני מסתכל לשמאלי - איפה הטקסט.
תמונה טובה יותר עבור מיקום זה יהיה אחד שבו הכתפיים שלי היו גם זווית כלפי הטקסט. אבל זה פתרון הרבה יותר טוב מאשר את התמונה הראשונה. וגם, במצבים שבהם התמונה תהיה בצד ימין של התוכן כמו גם את השמאל, זה יכול להיות פשרה טובה.
זכרו גם, כי בעוד תמונות של פניהם של אנשים למשוך את תשומת הלב ביותר, אותו הדבר נכון של תמונות בעלי חיים. לדוגמה, בפריסה זו מדגם, יש לי הכלבים שלי להסתכל שמאלה, אבל התמונה היא סומק ימין. אז הם מסתכלים על הדף. פריסה זו תשתפר אם אשנה את האוריינטציה של הכלבים, כך שהם יסתכלו על מרכז המסך.