3 שיטות שיעזרו למשתמשים שלכם להתמצא במרחב

לכל מסך ומוצר יש היררכיה וחשיבות של התוכן והכלים שנמצאים בו. בין אם זה אתר או כלי עבודה אינטרנטי. גם כשיש איפיון טוב, ישנן דרכים פשוטות מבחינה ויזואלית, שבהן אפשר להקל על ההתמצאות של המשתמש במסך.
האינדיקציה להצלחה דיי פשוטה – אם בסריקה מהירה של המסך הצלחנו להבין את הדינמיקה של הנתונים, אז המשימה בוצעה.

 

העיצוב השטוח הוא האויב

לפעמים שטוח זה לא מספיק. קשה להבחין בקומפוננטות שונות במסך כשהכל באותו רובד, במיוחד כשמדובר במערכת בהירה.

שילוב של הצללה יכולה לעזור להפריד בין חלקים ואיזורים במסך, ולא רק עבור פתיחה של תפריטים או הדגשה של כפתורים.
חשוב לזכור שמערכות שנשענות על גוונים לבנים-אפורים, לא יראו אותו הדבר בכל המסכים, ויש מקרים שבהם בקושי יראו הבדלים רקע המערכת לשטח עם נתונים.

Google Material עשוי בצורה המושלמת – שילוב בין המשטחים הפשוטים להצללות.
האפקט החדש נבע מהצורך להקל על המשתמשים.

PayPal

הקומפוננטות השונות לא ברורות ומובדלות עקב הבדלי צבע לא ניגודיים מספיק, מה גם שהמראה השטוח מקשה עוד יותר.
אם בוחרים להשאר בפלטה הבהירה הזו – הצללה של הקופסאות הייתה פותרת את הבעיה.

 

PayPal

פייפאל. העיקר שהמשלוח יגיע בזמן

בנק הפועלים

דוגמא טובה היא העיצוב החדש והמרענן של אתר בנק הפועלים.
ההרגשה הכללית היא מאוד סולידית, אבל עדיין יש טוויסטים עדכניים. אפשר להבחין בקלות בין החלקים במסך באמצעות החציצה המוצללת.

בנק הפועלים

בנק הפועלים. לפחות העמלות הולכות לממשק ואפיון טובים

ניגודיות גבוהה

קונטרסט גבוה בין איזורים במסך ישמש גם עזרה מהירה לסריקה של המסך וגם כמתן נפח עיצובי ודרמטי יותר. אם במסך כהה הכנסנו פתאום צבע בהיר [או ההיפך], העין תבחין בו גם מרחוק.  

Sendgrid

דוגמא לא מוצלחת בעיניי היא הדאשבורד של Sendgrid, שנראה כאילו הגיע מהשלגים. אמנם זה כלי עבודה וזה בסדר שהוא לבן ויבש, אבל תפריט הצד נבלע ונראה שכל המסך הוא יחידה אחת שאין בה חלוקה.

Sendgrid

Sendgrid. עיוורון שלגים

Canva

מי שדווקא כן עשה את זה טוב הם Canva, שאמנם אפשר להתווכח על אופן החלוקה, אבל האיזורים מאוד ברורים ומובדלים.

Canva

Canva. יש הרבה מה ללמוד מהם

טיפוגרפיה מתובלת

נתונים או כותרות בגופן שונה משאר המערכת, יכולים לעשות את ההבדל שנמצא בפרטים הקטנים. גם אם המערכת בנויה בOpen Sans או Roboto, אפשר להוסיף עניין עם גופן נוסף שישמש רק את המספרים למשל. הגופנים המומלצים בעיני לספרות הם Oswald או Roboto Slab, כמובן שיש עוד הרבה. 

גם הגדלה משמעותית של גופנים  של נתונים תקל על העין למצוא את השורה התחתונה.

Kickstarter

בפלטפורמת גיוס ההמונים אמנם באמת הדגישו את המספרים שהם העיקר, אבל ההלווטיקה לא מרגש.

kickstarter

קיקסטארטר. נחנקו כבר מההלווטיקה

Indigogo

מי שדווקא יצר עניין עם שילוב של שני גופנים במסך הם המתחרים, שהטמיעו גופן עם אופי [לא חוכמה ביחס להלווטיקה], שהוא לבדו מעניק ייחודיות למסך.

indigogo

Indigogo. טיפוגרפיה שמקפיצה את העיצוב

כמובן שכל מקרה הוא לגופו ולא כל הדרכים העיצוביות מתאימות.
אם מגיעים לשלב שהו ‘נתקעים’ ומשהו לא עובד, שווה לבדוק אם יש הפרדה ברורה בין החלקים ואיך.

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

שינוי גודל גופנים
ניגודיות