חשוב לעצב את הווידג'טים בצורה יעילה כדי ליצור חוויית משתמש עקבית ומושכת מבחינה ויזואלית. בקטע הזה נסביר את המושגים והטכניקות העיקריים להגדרת הצבע והטיפוגרפיה כדי ליצור ווידג'טים מועילים ומושכים ל-Android.
צבע
השתמשו בצבע כדי לבטא סגנון ולהעביר משמעות. הגדרת צבעים מתאימים לווידג'ט חשובה מאוד כדי שהטקסט יהיה קריא, כדי להתאים אישית את הווידג'ט וכדי לבטא את זהות המותג של האפליקציה.
כדי לעמוד בהנחיות הנגישות בנושא ניגודיות ולתמוך בתכונות של צבעים דינמיים, כמו צבעים שנוצרו על ידי משתמשים וערכות נושא כהות או בהירות, צריך להשתמש בטוקנים ובתפקידי צבעים של Material.
אפשר להשתמש בתפקידי הדגשה כדי ליצור היררכיה חזותית עם ניגוד בולט בין הרכיבים, או ליצור עיצוב מותאם אישית שובב יותר שמבטא את המותג שלכם.
מידע נוסף על תפקידי צבע זמין בהנחיות הצבעים של Material Design.
צורה
הצורה של הווידג'ט משפיעה על האווירה שלו. בווידג'טים מלבניים, משתמשים במאפיין רדיוס הפינות של המערכת. המאפיין הזה יוצר עקביות בין מכשירים שונים ועוזר למנוע חיתוך של תוכן הווידג'ט.
אם הווידג'ט שלכם מציג תוכן נתונים מינימלי, כמו תמונה, מזג אוויר או השיר הנוכחי שמופעל, כדאי לנסות להפוך את כל הווידג'ט לצורה בעלת משמעות כדי להוסיף אנרגיה מרגשת למסך הבית של המשתמש. אם הפריסות והנתונים שלכם מורכבים יותר, כדאי להשתמש בצורות מובנות כדי ליצור היררכיה חזותית, להדגיש תוכן חדש או קריאה לפעולה.
מידע נוסף זמין במאמר הטמעה של פינות מעוגלות.
עיצובים דינמיים
החל מ-Android 12, ווידג'ט יכול להשתמש בצבעי העיצוב של המכשיר עבור לחצנים, רקעים ורכיבים אחרים. כך מושגת עקביות ויזואלית בין הווידג'טים השונים, הסמלים במסך הבית והטפטים, והמשתמשים ב-Android נהנים מחוויית משתמש מגובשת יותר. השימוש בטוקנים של הצבעים שסופקו עוזר לווידג'ט להיראות משולב בעיצובים של מכשירים שסופקו על ידי יצרני מכשירים שונים, ובעיצובים דינמיים שהוגדרו על ידי המשתמש.
עיצוב בהיר ועיצוב כהה
עיצוב כהה הוא גרסה של ממשק המשתמש של המכשיר שמוצגת בתאורה חלשה, ובה מוצגים בעיקר צבעים כהים. יותר ויותר משתמשים עוברים לעיצוב כהה כדי לשפר את חיי הסוללה ולהקל על העיניים. אם הווידג'ט לא מותאם לעיצוב הכהה, הוא ייראה לא שייך ויכול להיות שזה יתסכל את המשתמשים.
טיפוגרפיה
טיפוגרפיה עוזרת להפוך את הכתיבה לקריאה וליפה. כדאי להשתמש בגדלים ובמשקלים שונים של גופנים כדי ליצור היררכיה ברורה, שתעזור למשתמש להתמקד באלמנטים הכי חשובים. כדי לשפר את הקריאות, במיוחד כשמציגים טקסט קטן יותר במרחב המוגבל של הווידג'ט, חשוב לשים לב לריווח השורות ולריווח בין האותיות (kerning).
היררכיה
ההיררכיה מועברת באמצעות הבדלים במשקל הגופן, בגודל, בגובה השורה ובריווח בין האותיות. הסולם המעודכן של סוגי הטקסט מסדר את סגנונות הטקסט בחמישה תפקידים ששמם מתאר את המטרה שלהם. חמשת סגנונות הטקסט הם: תצוגה, כותרת, כותרת, כותרת משנה וגוף. התפקידים החדשים לא תלויים במכשיר, ולכן קל יותר להשתמש בהם במגוון תרחישים לדוגמה.
למרות שהווידג'טים משתמשים בגופנים של המערכת, עדיין אפשר להוסיף פרטים משמעותיים באמצעות סולמות גופנים דרמטיים: אפשר להשתמש בגופנים בולטים יותר בכותרות, בתוויות ובנתונים.