רמה 2 – אופטימיזציה מותאמת

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

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

הנחיות

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

ממשק משתמש

Guideline ID Test IDs Description
Responsive_adaptive_layouts T-Layout_Flow

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

ממשק המשתמש של האפליקציה יכול לכלול את הרכיבים הבאים:

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

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

הטמעת פעילות מאפשרת לאפליקציות מבוססות-פעילות ליצור פריסות מרובות חלוניות על ידי הצגת פעילויות זו לצד זו.
UI_Secondary_Elements T-Layout_Flow

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

  • במסכים גדולים, גיליונות תחתונים לא תופסים את כל הרוחב. (כדאי להגדיר רוחב מקסימלי כדי למנוע מתיחה). מידע נוסף מופיע בקטע התנהגות במאמר Sheets: bottom.
  • הכפתורים לא תופסים את כל הרוחב במסכים גדולים. מידע נוסף זמין במאמר בנושא התנהגות בקטע כפתורים.
  • תיבות ומשדות טקסט לא נמתחים לרוחב מלא במסכים גדולים. מידע נוסף על התנהגות בשדות טקסט
  • תפריטים או חלונות מודאליים קטנים לעריכה לא מכסים את כל המסך, ושומרים על ההקשר של המשתמש ככל האפשר. תפריטים
  • תפריטי הקשר מופיעים לצד הפריט שהמשתמש בחר. אפשר לעיין בנושא 'תפריטי הקשר' במאמר תפריטים.
  • סרגלי ניווט אנכיים מחליפים את סרגלי הניווט כדי לשפר את הארגונומיה במסכים גדולים. פס ניווט
  • מגירות הניווט עודכנו לסרגלי ניווט מורחבים. חלונית הזזה לניווט
  • תיבות הדו-שיח עודכנו לרכיב החומר העדכני ביותר. מידע נוסף על תיבות דו-שיח
  • התמונות מוצגות ברזולוציה מתאימה, והן לא מתוחות או חתוכות.
Touch_Targets T-Touch_Targets גודל משטחי המגע הוא לפחות 48dp. אפשר לעיין בהנחיות של Material Design בנושא פריסה וטיפוגרפיה.
Drawable_Focus T-Drawable_Focus נוצר מצב ממוקד עבור רכיבים גרפיים אינטראקטיביים בהתאמה אישית. רכיב drawable מותאם אישית הוא כל רכיב חזותי בממשק המשתמש שלא מסופק על ידי מסגרת Android. אם משתמשים יכולים לבצע אינטראקציה עם רכיב drawable מותאם אישית, הרכיב צריך להיות ניתן למיקוד כשהמכשיר לא נמצא במצב מגע, וצריך להיות סימן ויזואלי ברור למצב המיקוד.

מקלדת, עכבר ומשטח מגע

Guideline ID Test IDs Description
Keyboard_Navigation T-Keyboard_Navigation זרימות המשימות העיקריות באפליקציה תומכות בניווט במקלדת, כולל ניווט באמצעות המקש Tab ומקשי החצים. איך יוצרים אפליקציות נגישות יותר
Keyboard_Shortcuts T-Keyboard_Shortcuts האפליקציה תומכת במקשי קיצור לפעולות נפוצות כמו בחירה, גזירה, העתקה, הדבקה, ביטול וביצוע מחדש. כאן אפשר לראות את התאימות של הקלט.
Keyboard_Media_Playback T-Keyboard_Media_Playback אפשר להשתמש במקלדת כדי לשלוט בהפעלת מדיה. לדוגמה, מקש הרווח מפעיל ומשהה מדיה.
Keyboard_Send T-Keyboard_Send מקש Enter במקלדת מבצע את הפונקציה שליחה באפליקציות תקשורת.
Context_Menus T-Context_Menus אפשר לגשת לתפריטי הקשר באמצעות לחיצה ימנית רגילה בעכבר או במשטח מגע (הכפתור המשני בעכבר או הקשה משנית).
Content_Zoom T-Content_Zoom אפשר לשנות את מרחק התצוגה של התוכן באפליקציה באמצעות גלגל הגלילה של העכבר (בצירוף לחיצה על המקש Control או Ctrl) ועל ידי תנועות צביטה על משטח המגע.
Hover_States T-Hover_States לרכיבים בממשק המשתמש שמעודדים את המשתמשים לעשות משהו יש מצבי ריחוף (במקרים המתאימים) כדי להראות למשתמשים בעכבר ובמשטח מגע שהרכיבים אינטראקטיביים.

בדיקות

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

ממשק משתמש

Test ID Guideline IDs Description
T-Layout_Flow Responsive_adaptive_layouts,
UI_Secondary_Elements

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

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

באפליקציות שמשתמשות בהטמעת פעילות, צריך לבדוק אם הפעילויות מוצגות זו לצד זו במסכים גדולים, או זו מעל זו במסכים קטנים.
T-Touch_Targets Touch_Targets מוודאים שמשטחי המגע שומרים על גודל ומיקום עקביים ונגישים, ושלא מוסתרים או מוסווים על ידי רכיבי ממשק משתמש אחרים בכל הגדלים וההגדרות של התצוגה. מידע על נגישות זמין במאמר בנושא Accessibility Scanner.
T-Drawable_Focus Drawable_Focus בכל מסך אפליקציה שמכיל פריט גרפי אינטראקטיבי בהתאמה אישית, מוודאים שהפריט הגרפי שניתן להזזה ניתן למיקוד באמצעות מקלדת חיצונית, לחצני החיצים (D-pad) או מכשיר אחר שמאפשר להתמקד ברכיבי ממשק משתמש. מוודאים שיש אינדיקציה חזותית ברורה למצב המיקוד. מידע נוסף מופיע במאמר בנושא מצב מגע.

מקלדת, עכבר ומשטח מגע

Test ID Guideline IDs Description
T-Keyboard_Navigation Keyboard_Navigation מנווטים בין הרכיבים שניתן למיקוד באפליקציה באמצעות מקש Tab ומקשי החיצים במקלדת חיצונית.
T-Keyboard_Shortcuts Keyboard_Shortcuts אפשר להשתמש במקשי קיצור במקלדת חיצונית כדי לבצע פעולות כמו בחירה, גזירה, העתקה, הדבקה, ביטול פעולה וביצוע מחדש של פעולה.
T-Keyboard_Media_Playback Keyboard_Media_Playback אפשר להשתמש במקלדת חיצונית כדי להתחיל, להפסיק, להשהות, להריץ אחורה ולהריץ קדימה את הפעלת המדיה.
T-Keyboard_Send Keyboard_Send משתמשים במקש Enter במקלדת חיצונית כדי לשלוח או להגיש נתונים.
T-Context_Menus Context_Menus כדי לגשת לתפריט ההקשר של רכיבים אינטראקקטיביים, משתמשים בלחצן המשני בעכבר או בתכונה של הקשה משנית במשטח המגע.
T-Content_Zoom Content_Zoom כדי להגדיל או להקטין את התוכן, משתמשים בגלגל הגלילה של העכבר (יחד עם המקש Control או Ctrl) ובתנועות צביטה בלוח המגע.
T-Hover_States Hover_States מציבים את סמן העכבר או משטח המגע מעל רכיבי ממשק משתמש שאפשר לבצע בהם פעולה כדי להפעיל את מצב הריחוף של הרכיב.