תחילת העבודה עם פריסות מותאמות

הסביבה העסקית של Wear OS מורכבת ממכשירים עם מגוון רחב של גדלי מסכים. שימוש בעקרונות של ממשק משתמש מותאם אישית הוא חיוני כדי לספק חוויה באיכות הגבוהה ביותר לכל המשתמשים.

מהו ממשק משתמש מותאם?

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

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

גדלים של מסכים למפתחות

מידע על גדלים מרכזיים שחשוב לזכור כשאתם מעצבים חוויות חדשות

גדלי מסך

גדלים של מסכים למפתחות

סוגי הפריסות

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

דוגמה לתצוגה עם גלילה

תצוגות גלילה

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

דוגמה לתצוגה ללא גלילה

צפיות ללא גלילה

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

הוספת ערך באמצעות פריסות ותכנון דינמיים

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

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

דוגמה לפריסות רספונסיביות

תוכן נוסף במבט מהיר

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

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

יותר רכיבי תוכן גלויים

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

דוגמה לשימוש במרחב המסך כדי לשפר את הקריאה במהירות

מידע קל יותר לקריאה

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

דוגמה ליעדי הקשה גדולים יותר

נוחות שימוש משופרת

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

דוגמה לרכיבים מעודכנים

מיקומי מודעות שהוגדרה להם אופטימיזציה

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

איכות האפליקציה

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

הנחיות איכות

הנחיות איכות


מוכנים לכל גדלי המסכים

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

שנתחיל?

רספונסיביות ואופטימיזציה

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

שנתחיל?

התאמה אישית והבחנה

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

שנתחיל?


שימוש בפריסות קנוניות מוגדרות

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

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

פריסות קנוניות

פריסות קנוניות