מה לא נאמר על חוקי הגשטאלט שנסחה קבוצה של תיאורתיקנים ופסיכולוגים בראשית שנות ה-20. התיאוריה מדברת על איך אנחנו תופסים את מה שאנחנו רואים. (גשטלט בעברית זה צורה). באינטרנט תמצאו חומר רב בנושא כולל סרטונים ומאמרים. במאמר זה נראה שאנחנו יכולים לקחת את עקרונות הגשטלט וליישם אותם בתחום של עיצוב גרפי ובכלל בחווית משתמש.
בעצם, גם אם לא למדתם את החוקים האלו, אתם מיישמים חלק מהם באופן בלתי מודע כשאתם יוצרים גרפיקה כלשהי. לא משנה אם זה לוגו, ברושור או עיצוב אתר אינטרנט.
התיאוריה מתבססת על 3 עקרונות
- המח תמיד יתפוס את האובייקטים שהוא רואה בצורה הפשוטה ביותר שלהם. לדוגמה קחו עץ. אתם רואים את צמרת העץ כ"גוש" ירוק אחד וגדול ולא רואים עלה עלה. המוח מחפש מחזוריות ומחבר אלמנטים דומים אחד לשני.
- אנחנו נוטים לעקוב אוטומטית אחרי קווים ועקומות.
- המח ינסה להשלים מידע באזורים שהוא לא קיים כלל.
אז הוספתי שני סרטונים מעולים שמצאתי באינטרנט שמסבירים את החוקים + דוגמאות ויצרתי רשימה של החוקים על פי סדר שנראה לי מתאים יותר לשימוש בעיצוב גרפי.
1 חוק הקירבה Proximity
אלמנטים הקרובים אחד לשני יתפסו כיחידה אחת. בדוגמה הזו במקום לראות 10 עיגולים אנחנו רואים שני אלמנטים (קבוצת עיגולים ימנית וקבוצה שמאלית) ובכך מורידים את העומס הקוגניטיבי על הצופה. כאשר יש עומס ויזאלי / קוגנטיבי, הצופה עלול לאבד עניין וסבלנות.
2 חוק הדמיון Similarity
אובייקטים דומים (בצבע / גודל / צורה) יתפסו כקשורים אחד לשני. בדוגמה שלפנינו בצד ימין נראה שיש שני טורים שחורים ושלושה כחולים. בצד השמאלי לעומת זאת נראה שיש שלושה טורים של עיגולים גדולים ושלושה טורים של עיגולים קטנים כאשר ההפרדה שאנו עושים במח לטורים נוצרת אך ורך כתוצאה משינויי צבע או גודל.
3 נקודת מיקוד Focal Point
כאשר אנחנו רואים מבנה צורני שכל הצורות בו זהות ורק צורה אחת שונה, אוטומטית היא הופכת להיות נקודת המיקוד שאנחנו נמשכים אליה. בדוגמה זו הריבוע הקטן.
4 חוק הסימטריה Symmetry
כשצורות זהות מונחות אחת ליד השנייה, נקבל סמטריה מושלמת. לעין שלנו נוח יותר עם קומפוזיציות סמטריות, קחו לדוגמה את צורת העין או פרצוף או פרח. בדוגמה זו אפשר לראות שבעיגולים חוק הקירבה מחבר בין עיגולים ואנחנו מקבלים 4 אלמנטים שכוללים עיגול או שניים בעוד שבתמונת הסוגריים אנחנו מזהים את הצמד האמצעי המסולסל כקבוצה ואת הסוגריים המרובעות בצדדים כקבוצות נוספות. ולמרות הקירבה של הסוגריים המרובעות לשמאליות חוק הסימטריה פה מנצח.
5 חוק הפשטות Pragnanz / Simplicity
המח יפשט צורות ומבנים מורכבים למבנה הפשוט ביותר. בדוגמה זו אנחנו לא רואים המון עיגולים, אנחנו רואים צורה של לב.
6 חוק ההמשכיות Continuity
אלמנטים שמסודרים על קו רציף, יתפסו כקשורים אחד לשני (אחת השיטות להוביל את הצופה להסתכל לאזור מסויים בדף). בדוגמה הזו אפשר לראות שלמרות שהעיגולים הכחולים (שדומים במראה אחד לשני יותר מלשחורים) ממשיכים שמאלה והשחורים למטה, אנחנו מתעלמים מהשינוי הצבעוני ומייחסים יותר חשיבות להמשכיות של הצורות ולכן רואים קו רוחבי וקשת שחוצה אותו. כלומר חוק ההמשכיות חזק יותר מחוק הדמיון.
7 שטח משותף Common Region
אלמנטים שחולקים אזור משותף סגור יתפסו כקבוצה. למרות שהטורים האמצעיים דומים, אנחנו לא מקשרים את הטור השליש מימין עם הקבוצה שמשמאלו אלא אם שני אלו שמצידו הימני דווקא בגלל השטח הצהוב המשותף להם.
אם החומרים האלה מעניינים אתכם ותרצו ללמוד יותר על הטמעת החוקים הללו בעיצוב שלכם, מוזמנים ליצור קשר לשיעורים פרטיים אחד על אחד או קורס עיצוב גרפי.
8 חוק הסגירה Closure
המוח ישלים חללים ריקים באין אלמנטים לכדי צורות שלמות. בדוגמה הזו קל מאוד לראות משולש לבן ועוד משולש עם קו מתאר כחול וזאת למרות שאף אחד מהמשולשים לא היא לא צורה סגורה, העין תשלים את החסר.
9 דמות / רקע Figure / Ground
העין מבדילה בין צורה / דמות לרקע שלה. אך לפעמים החוקים נשברים והרקע "משתלט" על הדמות והופך להיות דמות נוספת לצידה או שמתחרה בה או משלימה אותה. בדוגמה הזו העיגול הכחול שנראה כמו "פאקמן עצבני" הפך להיות הרקע והדמות היא ההרים והירח.
10 חוק האיחוד Unity
אלמנטים שיש להם קשר ויזואלי יתפסו כקשורים אחד לשני. למשל בריבוע השמאלי אנחנו רואים את העיגולים השחורים כצמד ואת הכחולים כצמד. לעומת זאת בריבוע הימני למרות שהעיגולים לא השתנו, בגלל תוספת הקו, אנחנו מקשרים כל עיגול שחור עם הכחול שלידו.
רוצים להתעדכן בסרטוני הדרכה שאנו מעלים? מוזמנים להירשם לערוץ יוטיוב של גרייס דיזיין
כתיבת תגובה