תכנון ממשק משתמש

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

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

 

1. הדגש שינויים חשובים

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

2. בחירת צבעים

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

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

איך לבחור את הצבעים המתאימים?

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

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

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

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

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

3. התאמה אישית

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

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

4. שימוש באייקונים

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

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

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

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

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

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

לסיכום :

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