שימוש באב טיפוס (Prototype)

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

דוגמא לאב-טיפוס של אתר תיירות שנבנה בתוכנת Axure

המטרות בבניית אב טיפוס

לבניית אב טיפוס יש מספר מטרות:

1. זיהוי בעיות במוצר ובתהליכים העיקריים בו לפני שמתחילים בעיצוב ופיתוח המוצר. הכוונה במילה "מוצר" היא לאתָר או לאפליקציה. שימוש באבטיפוס חוסך בזמן ובעלויות.
   איתור בעיות בשלבים מאוחרים יותר יחייב חזרה אחורה תוך איבוד משאבים וזמן או מציאת פתרון "פשרה" שלא בהכרח יטפל בבעיה.אי-זיהוי בעיות אלו במוצר יכולות להכשיל אותו – כאשר המשתמשים יחלו להשתמש במוצר ויגלו כי המוצר לא שמיש (לדוגמה: תהליך רישום ארוך ומייגע) הם ייזנחו אותו, ועבודה של חודשים תרד לטמיון.
   את תהליך הרישום ניתן לתקן גם בדיעבד, אבל את הפגיעה במהלך השיווקי לקראת ההשקה יהיה קשה לתקן, ואת המשתמשים שנטשו יהיה מאתגר להחזיר.
2. שימוש באב הטיפוס למבחני שימושיות – בהמשך לסעיף הקודם – הדרך הטובה ביותר לזהות בעיות בשימוש במוצר היא לתת למשתמשים אמיתיים לבחון אותו. במהלך מבחני השימושיות המשתמשים מקבלים משימות ומתבקשים לבצעם על אב הטיפוס.
3. תיאום ציפיות עם הלקוחות –  אב הטיפוס מאפשר להראות ללקוח את הפונקציונאליות של המוצר לפני תחילת העבודה על העיצוב והפיתוח.
4. אב הטיפוס כחלק ממסמך האפיון המיועד לצוותי הפיתוח והבדיקות –  אב הטיפוס משמש גם להעברת אפיון המערכת לצוות הפיתוח בצורה מדויקת ומפורטת יותר. פרטים מסוימים בהתנהגות המוצר ברורים יותר משימוש באב-טיפוס מאשר מקריאת טקסט המתאר אותם. חלק מתוכנות ה-prototyping אף מאפשרות ייצוא של אב הטיפוס למסמך וורד.
5. הצגת המוצר למשקיעים.

בניית אב טיפוס – פונקציונאליות לעומת עיצוב

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

פונקציונאליות

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

להשקעה בפונקציונאליות באב הטיפוס יש יתרונות וחסרונות.

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

עיצוב

מימד העיצוב מתייחס לעד  כמה העיצוב באב הטיפוס מתקרב למוצר הסופי.

בדומה לפונקציונאליות גם לעיצוב אב טיפוס ברמה גבוהה יש חסרונות ויתרונות:

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

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

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

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

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

דוגמא: אב-טיפוס Low fidelity לעומת Hi fidelity

לפנינו דוגמא של אתר תיירות הלקוחה מאתר Axure.

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

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

מצד שמאל מופיע אב טיפוס המוגדר כ High fidelity – כלומר, כאב טיפוס בעל רמת פירוט גבוהה. עיצוב ופונקציונאליות נוספו לאב-טיפוס על מנת לקרב אותו למוצר הסופי.

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

לצפייה בדוגמה החיה באתר Axure לחצו כאן

אז איזה אב-טיפוס לבנות?

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

ישנם אבי-טיפוס העשויים להיות חלקיים (low fidelity  – רמת פירוט נמוכה), משום שהם בודקים רק תהליכים מסוימים או חלק מסוים במוצר שעלול להיות בעייתי. לדוגמא: מבנה וארגון המסך בדף הבית.

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

עוד על בחירת אב הטיפוס ניתן לקרוא כאן:

באיזה כלי להשתמש בבניית האב טיפוס (Prototype)

עוד על פונקציונאליות מול עיצוב
ניתן למצוא כאן: Integrating Prototyping Into Your Design Process

תודה מיוחדת לברק דנין על הסיוע בעריכת המאמר