App bar and charms bar in Windows 8

1 ביולי 2012

אין תגובות

בפוסט הנוכחי אני אסקור בקצרה את ה-app bar ואת ה-charms bar, ומה מטרת כל אחד מהם בחווית המשתמש. בפוסטים הבאים אני אפרט על ה-charms bar, ועל ה-contracts שאפשר לממש כדי לאפשר לאפליקציית ה-Metro שלנו לעבוד מול מערכת ההפעלה.

אחת המטרות העיקריות של ה-app bar וה-charms bar הוא לתת חווית משתמש אחידה, פשוטה ועקבית בכל אפליקציות ה-Metro שהיוזר יפעיל.

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

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

 

App bar

ה-app bar מכיל application commands, פעולות שהאפליקציה מבצעת ב-Scope הפנימי שלה ואשר קשורות ללוגיקה הפנימית שלה.

יש להפריד את ה- application commands לשני סוגים:

  • Global commands – פעולות כלליות לא תלויות הקשר
  • Contextual commands – פעולות תלויות הקשר

Global commands יש למקם בצידו הימני של ה-app bar, ו- Contextual commands יש למקם בצידו השמאלי של ה-app bar.

Contextual commands הן פעולות שתתאפשרנה ע"פ המיקום והמצב בו נמצא היוזר באפליקציה כרגע (כל אפליקציית Metro יכולה להוסיף ל-app bar את הפעולות שהיא זקוקה להן). פעולות אשר אינן רלוונטיות באותו רגע, פשוט לא יופיעו, מה שמשאיר את האפליקציה נקיה ובהירה.

לדוגמא, אם היוזר מסמן פריט ברשימה, ה-app bar יכיל פעולות כגון Edit, Delete וכו' אשר רלוונטיות לביצוע רק כאשר יש פריט מסומן. פעולות אלו לא יופיעו ב- app bar כאשר היוזר נמצא במקום אחר באפליקציה.

 

דוגמא ל-app bar (מסומן בחץ האדום):

App bar

 

Charms bar

ה- charms bar מכיל system commands, פעולות שהאפליקציה מבצעת מול מערכת ההפעלה:

  • Search
  • Share
  • Start
  • Devices
  • Settings

הכפתורים בו נקראים charms והם משמשים לביצוע פעולות שכיחות כגון Search ו- Share בצורה אחידה בכל אפליקציות ה-Metro אשר מממשות את ה-Search contract ו/או את ה-Share contract. כאמור, אפרט עליהם בהרחבה בפוסטים הבאים.

דוגמא ל-charms bar (מסומן בחץ האדום):

Charms bar

 

דוגמא ל-Share דרך ה-charms bar (מסומן בחץ האדום):

Share through Charms bar

הוסף תגובה
facebook linkedin twitter email

כתיבת תגובה

האימייל לא יוצג באתר. (*) שדות חובה מסומנים