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

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

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

תאורה כתנאי סביבה

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

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

בשלב המחקר המקדים

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

עיצוב ממשק משתמש UI לתנאי תאורה שונים

שלב היישום של הפתרון לתנאי תאורה שונים. בשלב זה חשוב לשים לב לכמה גורמים מרכזיים:

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

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

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

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

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

השלב האחרון, הוא בבדיקות השמישות – Usability Testing

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

תיאור מקרה (Case Study)

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

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

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

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

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

לסיכום

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