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

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

1. השטח הלחיץ ומה שבניהם

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

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

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

עכשיו אפשר לדבר על המידות של אזורי הלחיצה,

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

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

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

חשוב מאוד להקפיד גם על המרחק בין אזורי הנגיעה השונים, חייב להקפיד על מינימום של 2 מילימטר בין אזורי הנגיעה השונים

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

 

2. איך מחזיקים את המכשירים השונים ומה טווח המגע של המשתמש ואם אילו אצבעות הוא משתמש

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

1. איפה למקם כפתורים חשובים

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

3. איפה למקם פרסומות

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

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

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

 

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

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

3. התמקדות העין של המשתמש במסך הסמארטפון ואיך המידע הזה עוזר בעיצוב האפליקציה

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

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

מקווה שנהניתם ונפגש בשיעור הבא של עיצוב אפליצקיות!