רקע כללי - מהו ממשק משתמש ומדוע הוא חשוב?
ממשק משתמש (User Interface או UI בקיצור) הוא מושג המתאר את הקשר שבין המערכת לבין האדם המשתמש במערכת. המכונות שאנו בונים או מפתחים מיועדות, לרוב, לשימושם של בני אדם. כדי שיהיה ניתן לתפעל את המערכות הללו בצורה האופטימלית, הקשר בין האדם למכונה חייב להיות נוח ויעיל. ממשק מסורבל יכול ליצור את ההבדל בין מערכת אפקטיבית למערכת לא נוחה ושמישה, גם אם בבסיס, שתי המערכות הן זהות ביכולותיהן. לשם המחשה, מכונית, שבה מיקום הדוושות או ההגה אינו נכון, לא תהיה מסוגלת למלא את ייעודה בצורה טובה ותוביל לתאונות ותקלות. כך גם עם תוכנות, אתרים או כל אפליקציה ממוחשבת. בנייה נכונה של ממשק המשתמש של האתר או התוכנה הינה מכפיל כח משמעותי באפקטיביות שלו. מיקום נכון ובולט של החלקים החשובים לגולש, תצוגה נוחה וברורה של האינפורמציה הרלוונטית ושימוש מושכל באלמנטים גרפיים וטקסטואליים הינם חיוניים בסביבה התחרותית של האינטרנט כיום. אתר שלא מצליח לגרום לגולש בו תחושה נוחה, ימנע מאותו גולש לשוב ולבקר באותו אתר. כך גם תוכנה שלא נותנת תחושה נוחה למשתמש, תעודד את המשתמש למצוא פתרונות חלופיים או גרוע מכך, תביא לתקלות ובעיות במהלך השימוש. יש לציין כי כיום מדברים בדר"כ על ממשקים גרפיים המכונים GUI - Graphical User Interface. השיקולים של עיצוב ממשק משתמש הינם רלוונטיים לכל טווחי האתרים והאפליקציות הקיימות - החל מאתרי תדמית בהם חשוב לבנות את האתר באופן שיציג את יתרונותיו המרכזיים של העסק ויספק אינפורמציה רלוונטית בצורה נגישה לגולש, עבור באתרי תוכן וחנויות וירטואליות, ומערכות פנים-ארגוניות, אינטרא-נט וכיוב' המיועדות לשימוש עובדים בחברה. בכל נקודה בה האדם והמכונה נפגשים, ראוי להקצות מחשבה לאופן בניית ועיצוב ממשק המשתמש.
עקרונות בעיצוב ממשק משתמש
התחום של תכנון ממשקי משתמש נמצא בתפר שבין התכנות לעיצוב ואמור לתת ביטוי ויזואלי מיטבי ליכולות הטכניות של המערכת. על המעצב לשים עצמו במקומו של גולש ממוצע, הנכנס לאתר או המערכת. האם האינפורמציה ברורה? האם תכלית האתר מיושמת כראוי? האם התפריטים, הלחצנים ושאר הרכיבים הפונקציונליים נגישים וברורים? האם במסגרת השיטוט באתר אני יכול להתמצא בקלות או שאני "הולך לאיבוד" בין שלל הדפים, המלל והתמונות? ישנם עקרונות עיצוביים מסוימים לבניית אתר או תוכנה שמסייעים ליצור שפה משותפת בין הגולש למעצב. בשנים האחרונות, מרבית התפריטים הינם עליונים ולכן זהו המקום הראשון שאליו עיני הגולשים יופנו כאשר הם מעוניינים לנווט באתר. בנוסף, מחקרים הראו כי אנשים באופן טבעי נוטים להסתכל לעבר הפינה השמאלית עליונה של האתר ולכן נראה למקם שם את שם העסק, לוגו או מידע חשוב אחר (הדבר תקף גם באתרים בעברית). אלו נקודות קטנות שיכולות להשפיע על נוחות הגלישה באתר המדגימות מדוע קיימת חשיבות לשילוב של איש מקצוע בתחום עיצוב ממשקים אחרי שאנשי התכנות סיימו את עבודתם. במהלך עבודתנו, אנו נתקלים לא מעט במערכות מורכבות ומרשימות ש"עוצבו" על-ידי מתכנתים, עובדה שגרמה לתוצר הסופי להיות מסורבל, לא נוח ולא מזמין לשימוש. קיימת לעיתים נטייה לזלזל במראה של מערכות פנימיות מכיוון שלכאורה הן לא ממלאות תפקיד שיווקי בעסק אולם החשיבות של עיצוב ממשק משתמש אסתטי ונכון אינה מתמצה רק בשיווק ומכירה; מערכת שבנויה נכון יכולה להביא לקיצור משמעותי בזמני העבודה, לניצול טוב יותר של מגוון יכולותיה, לנכונות גבוהה יותר לעבודה ולשימוש בה וללמידה מהירה יותר שלה.
פיסיולוגיה ופסיכולוגיה - ממשק המשתמש אמור לקחת בחשבון שיקולים פונקציונליים-פיזיולוגיים ופסיכולוגיים-אסתטיים. מערכת שנראית רע לא עושה חשק לעבוד איתה. כך גם לגבי מערכת שבנויה בצורה מסורבלת ולא נוחה. אם נבחן כמה אתרים מובילים מבחינת ממשקי משתמש, נוכל לגלות שלא צריך מראה עמוס גרפית או מתוחכם כדי להיות מושך. ראו את גוגל לדוגמא...
גוגל הייתה בין הראשונות שעשו שימוש בממשק מינימליסטי, ממוקד ונקי, אחת הסיבות שהפכו את אתר החיפוש שלה למוביל בעולם. גם לאחר שנוספו לגוגל שירותים רבים נוספים, כמו Gmail או Picasa, שמר מנוע החיפוש על המראה הנקי שלו. המקרה של גוגל הוא פשוט יחסית; מדובר במוצר אחד מרכזי שנמצא במרכז הבמה. מה קורה אם אנו מציעים מספר מוצרים או שירותים או שהמערכת שלנו אמורה למלא מספר רב של פונקציות? הנה דוגמא לממשק משתמש חדש ל-desktop המנסה להתחקות אחר הדרך בה השולחן שלנו נראה במציאות: http://bumptop.com/
איך ניגשים לעיצוב ממשק משתמש למערכת או אתר?
השלב הראשון בתכנון עיצוב ממשק המערכת הוא קודם כל הכנת שיעורי בית - מיפוי היכולות העיקריות או התחומים המרכזיים שאותם אנו רוצים להציג. קיימת נטייה באתרים להציג עודף אינפורמציה, אם משיקולים של ניראות במנועי חיפוש או משיקולים של הצגת התמונה כולה למשתמש בעמוד אחד. מצב זה יוצר לעיתים עומס ויזואלי שמרתיע את הגולש מלהיכנס פנימה או שמציף אותו בהרבה פרטים, והעיקר הולך לאיבוד. לכן, לפני שבכלל מציירים את הקו הראשון, יש לחשוב מהם הפונקציות העיקריות של המערכת, עם אילו רכיבים המתשמשים שלי עושים את עיקר השימוש או אילו נושאים הם בליבו של העסק והייתי רוצה להציג אותם באופן ברור בחזית. לדוגמא, עם החברה שלנו מייצרת מספר מוצרים ומספקת מספר שירותים, יש למקד את מבנה האתר בשירותי הליבה או במוצרי הדגל, שהם כנראה הסיבה שמרבית הגולשים הגיעו מלכתחילה לאתר. אם אנחנו מעוניינים בשדרוג העיצוב של ממשק מערכת של מערכת פנימית כלשהי, עלינו לברר מול המשתמשים הקיימים באילו יכולות בעיקר נעשה השימוש, וכן, אילו שיפורים הם היו מכניסים לעיצוב המערכת. המידע המגיע ממשתמשי הקצה בדרך כלל יסייע לנו להבין מהם נקודות החולשה בעיצוב הקיים ואילו שינויים דרושים. כאשר מפתחים מערכת חדשה לחלוטין, כדאי לבדוק את המבנה במערכות דומות ולהשתדל לעצב מערכת באותה "שפה". גרף הלימוד של מערכת שבנויה בצורה הדומה למערכת מוכרת הינו תלול בהרבה וקיימת נכונות רבה יותר ללמוד עליה.
השלב השני הוא ארגון סכימתי של מבנה המערכת מבחינת פונקציות, או, אם מדובר באתר, תכנון ראשוני של עמוד הבית על רכיביו. אחרי שהונחה התשתית הראשונית למערכת, ניתן לבחון האם הוחסרו יכולות קריטיות או שלא מוצג מרכיב חשוב באתר. בשלב ראשוני זה ניתן לעשות שינויים מקיפים, שינויים שבשלבים מאוחרים יותר הופכים להיות מורכבים ויקרים הרבה יותר. שינוי של מערכת קיים יכול להצריך קידוד מחדש של תבנית העיצוב, ארגון מחדש של הפונקציות השונות או כניסה מאסיבית לקוד. לכן, שלב זה הינו קריטי וראוי לתשומת לב מירבית. אם אפשר, יש לקבל חוות דעת מהמשתמשים העתידיים לפני שרצים קדימה.
אחרי שהונחה התשתית הבסיסית לעיצוב המערכת, ניתן לעבור למלאכת העיצוב עצמה ובמסגרתה, יש לתת מענה ויזואלי לדרישות המהותיות שהתבררו במהלך השלב הראשון (מהם האגפים החשובים ביותר, מהי האינפורמציה החיונית ביותר שיש להציג באופן ברור וכיוב'). לאור הקושי בביצוע שינויים לאחר אישור העיצוב, יש לוודא שניתן מענה לטווח היכולות והדרישות מהמערכת וכן, יש לצפות קדימה ולדאוג שהעיצוב הנוכחי מאפשר למערכת או לאתר "לגדול" או להשתנות יחד עם העסק או כך שבמידה ויתווספו יכולות נוספות, ניתן יהיה בקלות יחסית לצרפן לעיצוב האתר הקיים. שיקולים נוספים הם גודל מסך. ישנם עיצובים אשר הם בעלי גודל קבוע וישנם עיצובים שיכולים להתאים לטווח רחב של רזולוציות מסך. גם כאן כדאי לצפות קדימה ולא לעצב אתר המותאם לרזולוציות נמוכות מדי כאשר בעוד שנתיים-שלוש, יהיו אנשים בודדים שישתמשו ברזולוציות אלו.
