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

דוגמא לאב-טיפוס של אתר תיירות שנבנה בתוכנת Axure
המטרות בבניית אב טיפוס
לבניית אב טיפוס יש מספר מטרות:
- זיהוי בעיות במוצר ובתהליכים העיקריים בו לפני שמתחילים בעיצוב ופיתוח המוצר. הכוונה במילה "מוצר" היא לאתָר או לאפליקציה. שימוש באבטיפוס חוסך בזמן ובעלויות.
איתור בעיות בשלבים מאוחרים יותר יחייב חזרה אחורה תוך איבוד משאבים וזמן או מציאת פתרון "פשרה" שלא בהכרח יטפל בבעיה.אי-זיהוי בעיות אלו במוצר יכולות להכשיל אותו – כאשר המשתמשים יחלו להשתמש במוצר ויגלו כי המוצר לא שמיש (לדוגמה: תהליך רישום ארוך ומייגע) הם ייזנחו אותו, ועבודה של חודשים תרד לטמיון.
את תהליך הרישום ניתן לתקן גם בדיעבד, אבל את הפגיעה במהלך השיווקי לקראת ההשקה יהיה קשה לתקן, ואת המשתמשים שנטשו יהיה מאתגר להחזיר. - שימוש באב הטיפוס למבחני שימושיות – בהמשך לסעיף הקודם – הדרך הטובה ביותר לזהות בעיות בשימוש במוצר היא לתת למשתמשים אמיתיים לבחון אותו. במהלך מבחני השימושיות המשתמשים מקבלים משימות ומתבקשים לבצעם על אב הטיפוס.
- תיאום ציפיות עם הלקוחות – אב הטיפוס מאפשר להראות ללקוח את הפונקציונאליות של המוצר לפני תחילת העבודה על העיצוב והפיתוח.
- אב הטיפוס כחלק ממסמך האפיון המיועד לצוותי הפיתוח והבדיקות – אב הטיפוס משמש גם להעברת אפיון המערכת לצוות הפיתוח בצורה מדויקת ומפורטת יותר. פרטים מסוימים בהתנהגות המוצר ברורים יותר משימוש באב-טיפוס מאשר מקריאת טקסט המתאר אותם. חלק מתוכנות ה-prototyping אף מאפשרות ייצוא של אב הטיפוס למסמך וורד.
- הצגת המוצר למשקיעים.
בניית אב טיפוס – פונקציונאליות לעומת עיצוב
בניית אב טיפוס מתייחסת לשני מימדים עיקריים: פונקציונאליות ועיצוב.
פונקציונאליות
מטרת מימד זה היא לבדוק עד כמה הפונקציונאליות של אב הטיפוס מתנהגת כמו המוצר עצמו (אינטראקטיביות).
להשקעה בפונקציונאליות באב הטיפוס יש יתרונות וחסרונות.
היתרון העיקרי הוא שככל שאב הטיפוס קרוב בפונקציונאליות שלו למוצר האמיתי – כך יותר קל לדמות כיצד המשתמש ישתמש במוצר האמיתי, וכך לזהות בעיות בשלב מוקדם. החיסרון העיקרי הוא זמן ועלויות – במהלך היצירה הראשונית ובמהלך העדכונים.
סכנה נוספת היא שהגדרה מדויקת של פונקציונאליות בשלב ראשוני של תהליך התכנון עשויה לקבע את צוות האפיון על פתרון מאוד ספציפי.
עיצוב
מימד העיצוב מתייחס לעד כמה העיצוב באב הטיפוס מתקרב למוצר הסופי.
בדומה לפונקציונאליות גם לעיצוב אב טיפוס ברמה גבוהה יש חסרונות ויתרונות:
החיסרון העיקרי הוא שכאשר אב טיפוס מעוצב אך העיצוב אינו העיצוב הסופי, הוא עלול להשפיע על בחינת אב הטיפוס. צבעים, כותרות, תמונות ורכיבים עיצוביים אחרים משפיעים על הבולטות ההיררכיה של רכיבים בדף, כלומר על הסדר שבו המשתמש יראה אותם בדף.
בנוסף, הלקוח עלול "להתאהב" בעיצוב האב טיפוס או חילופין להעיר על אלמנטים גרפיים מתוך מחשבה שמדובר בעיצוב האמיתי ויותר מזה: מי שאינם אנשי מקצוע לרוב מתקשים להפריד בין העיצוב לבין הפונקציונאליות, וכאשר הם רואים אב-טיפוס לא מעוצב הם מתקשים להגיב על הפונקציונאליות בצורה עניינית.
מסיבה זו מאפיינים נוהגים להימנע מצבעוניות במהלך בניית האב טיפוס ומשתמשים בסקאלת צבעים אפורה כחלחלה.
היתרון העיקרי בעיצוב ברמה גבוהה הוא שכאשר העיצוב קרוב לגרסתו הסופית, בדיקות שמישות שיתבצעו על המוצר יתנו הדמיה טובה יותר למה שיקרה במוצר הסופי מאשר אב-טיפוס לא מעוצב. בנוסף, באב-טיפוס מעוצב אין ללקוח את הבעיה של הפרדה בין פונקציונאליות לעיצוב אשר הוזכרה קודם לכן.
במוצרים מסוימים קיים שיקול נוסף: כאשר העיצוב הוא חלק בלתי נפרד מהמוצר, השימוש באב-טיפוס לא מעוצב הוא בעייתי. דוגמא לכך היא מוצר המספק סביבה תלת-ממדית. לסביבה תלת-ממדית יש השפעה רבה עם בּוֹלטוּת של אובייקטים ולכן אב-הטיפוס צריך להיות קרוב ככל שניתן למוצר הסופי, הן מבחינת העיצוב והן מבחינת הפונקציונאליות.
דוגמא: אב-טיפוס Low fidelity לעומת Hi fidelity
לפנינו דוגמא של אתר תיירות הלקוחה מאתר Axure.
מצד ימין מופיע אב טיפוס המוגדר כ Low fidelity – כלומר , כאב טיפוס בעל רמת פירוט נמוכה. באב-טיפוס זה אין למעשה עיצוב . את מקום האימג'ים מחליפים מרובעים.
גם רמת הפירוט הפונקציונאלית נמוכה: לחיצה על אובייקט על המסך תפתח חלון טקסט המתאר מה יקרה בלחיצה על האובייקט (יפתח חלון, יופיע פול דאון עם אופציות).
באב-טיפוס זה רק הקישורים הבסיסיים ביותר עובדים (עזרה, Login).
מצד שמאל מופיע אב טיפוס המוגדר כ High fidelity – כלומר, כאב טיפוס בעל רמת פירוט גבוהה. עיצוב ופונקציונאליות נוספו לאב-טיפוס על מנת לקרב אותו למוצר הסופי.
באב טיפוס זה מופיעים אימג'ים ויש צבעוניות. מבחינת פונקציונאליות, חלונות הפופ אפ מופיעים בלחיצה, יש אפקט רול-אובר כאשר עולים עם העכבר על כפתורי התפריט הראשי ואפשרויות הפול-דאון מופיעות. לחיצה על האפשרויות השונות מובילה למסכים עם אופציות ופקדים אינטראקטיביים.
לצפייה בדוגמה החיה באתר Axure לחצו כאן
אז איזה אב-טיפוס לבנות?
כאשר חושבים על בנית אב הטיפוס עולה השאלה: מה רמת הפונקציונאליות ורמת העיצוב שיש להטמיע באב הטיפוס? התשובה היא : תלוי במורכבות מוצר, במטרות אב הטיפוס ובמשאבים והזמן העומד לרשותכם.
ישנם אבי-טיפוס העשויים להיות חלקיים (low fidelity – רמת פירוט נמוכה), משום שהם בודקים רק תהליכים מסוימים או חלק מסוים במוצר שעלול להיות בעייתי. לדוגמא: מבנה וארגון המסך בדף הבית.
שיקול חשוב נוסף בבחירת אב-הטיפוס הוא המשאבים והזמן העומדים לרשותכם, כאשר התקציב נמוך ו/ או לוח הזמנים קצר ניתן לשקול במקרים מסוימים בנית אב-טיפוס מנייר.
עוד על בחירת אב הטיפוס ניתן לקרוא כאן:
באיזה כלי להשתמש בבניית האב טיפוס (Prototype)
עוד על פונקציונאליות מול עיצוב
ניתן למצוא כאן: Integrating Prototyping Into Your Design Process
תודה מיוחדת לברק דנין על הסיוע בעריכת המאמר
הי יוסי. ברוך הבא לכותבים ב-UXI !
מספר נשאים נוספים שכדאי להתייחס עליהם בהקשר של בניית אב טיפוס למערכות:
מטרות:
בנוסף למטרות שציינת, יש שימוש נוסף, עקרוני מאוד, לבניית אב טיפוס –
גיבוש קונספט, מבנה, תכולה ואינטראקציה במערכת.
עוד לפני שמגיעים לשלב ההצגה ללקוח או לשלב הבדיקות, עוד לפני שמגבשים מסמך אפיון סופי, עושים שימוש באב טיפוס כחלק מתהליך העבודה על תשתית האפיון והעיצוב.
סוגים שונים של תרשימים (אינטראקטיביים / סטאטיים ועקרוניים / מעוצבים) משמשים את צוותי העבודה בכדי לבצע קונקרטיזציה של ההחלטות שעולות מהמחקר המקדים ומישיבות האפיון, עוד לפני שלקוח או משתמש כלשהו רואה את המערכת.
Fidelity (אמינות / דיוק / גימור):
נושא ה- Fidelity איננו רלוונטי רק לצד הגראפי, אלא גם לאינטראקציה. למעשה, ניתן להתייחס לרמת ה-Fidelity כשילוב של עד כמה אב הטיפוס אינטראקטיבי ועד כמה הוא מעוצב בדומה לתוצר הסופי. קיימים אבות טיפוס שמשלבים כול אחת מרומות הגימור של מדדים אלו. יכול להיות אב טיפוס ברמת Fidelity נמוכה בשתי המדדים, כגון wireframe שמכיל רק מבנה עקרוני של המערכת וללא שום אינטראקציה, או Fidelity נמוך בעיצוב ובינוני באינטראקציה (click through wireframe) או גבוהה בעיצוב ונמוך באינטראקציה (מסכים מעוצבים סטאטיים) וכו'.
טרמינולוגיה:
יש כיום מגוון תוצרים (Deliverables) הנופלים תחת הקטגוריה הכוללנית של "אב טיפוס". השימוש בעברית בשילוב עם מינוח מקצועי מקובל, רק מחמיר את חוסר הבהירות.
כשמדברים על אב טיפוס, חשוב להבהיר למה בדיוק מתכוונים. (ע"ע http://uxi.org.il/talk/topic/54 ). כפי שציינתי, התוצרים יכולים לנוע על כל הספקטרום של רמות דיוק וגימור שבין תרשים שקושקש על גב מפית ועד מערכת מעוצבת לגמרי, אינטראקטיבי ופועלת, שמהווה למעשה גרסה מוגבלת של התוצר הסופי. יש שמחשבים כ"אב טיפוס" רק מערכות שמציגות רמה מסוימת של אינטראקטיביות, ויש שמכילים את הטרמינולוגיה על כל סוג של תרשים או הדמיה של המערכת.
זה נושא חשוב, שאפשר (וכדאי) להרחיב עליו עוד את הדיבור.
תודה רן על התוספות החשובות
אב-הטיפוס אכן מסייע לגיבוש הקונספט, המבנה והתכולה כחלק מתהליך העבודה גם עבור צוות העבודה עצמו.
לגבי הטרמינולוגיה, המונחים אכן מבלבלים. בדומה לפוסט שהפנית אליו, גם אני נוטה להתייחס למוקאפ כתוצר סטטי חסר אינטראקטיביות ולאב-טיפוס כתוצר אינטראקטיבי כאשר האינטראקטיביות יכולה לבוא לידי ביטוי גם באב-טיפוס מנייר (לדוגמא: הנחת חלון לוגין עבור המשתמש כאשר המשתמש לוחץ על כפתור לוגין בדף הראשי).
כהמשך למאמר הנ"ל, מומלץ לראות הרצאה של ניק פינק בנושא:
http://live.visitmix.com/MIX10/Sessions/DS04
וגם אצלי אפשר לקרוא פוסט קצר בנושא:
http://usabilityinfo.wordpress.com/2009/10/05/prototyping/