שיטות מומלצות לשימוש בכרטיסיות

עיצוב על גבי שחור

חשוב מאוד לעצב על רקע שחור ב-Wear OS משתי סיבות עיקריות:

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

פעולה

תמיד צריך להגדיר את צבע הרקע לשחור.

אל תעשו את זה

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

כוללים רק את הרכיבים הנחוצים

כשמאשרים את ההסכמה (לדוגמה, באמצעות ProtoLayout Material3 PrimaryLayout), מערכת Wear OS תציג באופן אוטומטי את סמל האפליקציה הקבוע, שיוצג באופן אוטומטי כשהמשתמש גולל בקרוסלה של המשבצות. אסור לעצב את סמל האפליקציה ולהוסיף אותו כחלק מהכרטיס.

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

פעולה

ייתכן שסמל האפליקציה יוצג ב-Wear OS באופן אוטומטי כשהמשתמש גולל בקרוסלה של המשבצות. אין צורך להוסיף את סמל האפליקציה לעיצוב המשבצת.

אל תעשו את זה

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

הסתרת שמות האפליקציות כדי להבטיח יעדי הקשה מינימלי

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

פעולה

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

אל תעשו את זה

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

כדאי לבחור תרחיש לדוגמה אחד בלבד שתרצו להדגיש

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

פעולה

המשבצת הספציפית הזו יעילה כי היא מספקת אוסף קטן של אפשרויות, ואז יש אפשרות לראות אפשרויות נוספות

אל תעשו את זה

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

צריך לכלול לפחות מאגר אחד

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

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

פעולה

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

אל תעשו את זה

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

להפוך את הפעולות לברורות באופן מיידי

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

פעולה

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

אל תעשו את זה

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

תיעדוף חזותי של פעולות

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

  • כדאי להשתמש בצבעים ראשיים בלחצני הפעולה הראשיים.
  • שימוש בצבעים משניים או שלישיים בפעולות משניות

פעולה

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

אל תעשו את זה

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

הפשטה לפחות קונטיינרים

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

פעולה

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

אל תעשו את זה

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

שימוש בקונטיינרים למטרות פונקציונליות

כדי שהמשתמשים יוכלו לדעת מה יקרה כשהם ילחצו על כל רכיב ב-Tile, אנחנו לא ממליצים להשתמש בקונטיינרים למטרות דקורטיביות או מבניות, כדי למנוע לחיצות שלא גורמות לשום דבר.

פעולה

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

אל תעשו את זה

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

הצגת ייצוגים של גרפים ותרשימים שאפשר לראות במהירות

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

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

פעולה

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

אל תעשו את זה

הצגת מידע מספרי או סטטיסטי מפורט בכרטיס