הכפתורים הם האינדיקטור החזותי העיקרי לפעולות של המשתמש.
עקרונות
מכוונת לפעולה: הלחצנים צריכים להבהיר שהם מפעילים פעולה.
משוב ברור: המראה של הלחצן צריך להשתנות באופן ברור במצבי אינטראקציה שונים (ריחוף, לחיצה, מיקוד) כדי לספק משוב מיידי.
עקביות: כל הלחצנים צריכים להיות בעלי שפה ויזואלית משותפת כדי שיהיה קל לזהות אותם.
גמיש: רכיב הלחצן צריך להתאים לווריאציות נפוצות, כמו הוספת סמלים וגדלים שונים, בלי לפגוע בעקביות.
שימוש ומיקום
צריך למקם לחצן קרוב לתוכן הרלוונטי שלו. אפשר למקם אותם לבד או עם רכיבים אחרים, כמו כרטיסים ורשימות.
מה מומלץ לעשות
מה אסור לעשות
מה מומלץ לעשות
מה אסור לעשות
אנטומיה
ברירת מחדל
1. מופעלת: מצב ברירת המחדל.
2. העברה של העכבר מעל
3. לחיצה
גדול
1. מופעלת: מצב ברירת המחדל.
2. העברה של העכבר מעל
3. לחיצה
התאמה אישית
הכפתורים מכילים וריאציה גדולה ווריאציית ברירת מחדל, וגם מצבי ברירת מחדל, מצב מודגש ומצב לחיצה לכל אחת מהן. אפשר להשתמש בסמלים כדי להדגיש את הלחצן, להבהיר אותו ולעזור למשתמשים לזהות אותו. גודל הכפתור יכול לעזור להדגיש את החשיבות.
ברירת מחדל
| מאפיינים | התאמה אישית | ברירות מחדל |
|---|---|---|
| צורה | כן | גדול, עיגול |
| מרווח פנימי | כן | 16 dp, 8 dp |
| גבול | כן | 2 dp, #606460 |
| טקסט | כן | גוף קטן |
| סמל מוביל | כן | 40 dp |
| סמל בסוף | כן | 40 dp |
| גודל | כן | גובה מינימלי של 56dp |
| עומק | כן | 0 |
גדול
| מאפיינים | התאמה אישית | ברירות מחדל |
|---|---|---|
| צורה | כן | גדול, עיגול |
| מרווח פנימי | כן | 20 dp, 8 dp |
| גבול | כן | 2 dp, #606460 |
| טקסט | כן | גוף קטן |
| סמל מוביל | כן | 56dp |
| סמל בסוף | כן | 56dp |
| גודל | כן | גובה מינימלי של 72dp |
| עומק | כן | 0 |
| פלטפורמה | לא |