Babus- Public Transportation iPhone app.
- 1. בּאבּוּס
אפליקציית אייפון לשימוש בתחבורה ציבורית
סיכום פרויקט במסגרת קורס עיצוב חוויית משתמש לסמארטפון
בהנחיית ברק דנין ועידוא שביט. יוני 1102
כל הזכויות שמורות ליניב שריג © 1102
www.35east.com
אפיון: יניב שריג
- 2. שלבי עבודה
« מחקר משתמשים ומחקר שוק
« רשימת יכולות
« פרסונות
« סיפורי משתמש
« סקיצות מהירות למסך פתיחה )(6up
« ארכיטקטורת מידע
« עיצוב מסכים שלדיים
כל הזכויות שמורות ליניב שריג © 1102
www.35east.com
« בדיקות שמישות
cc flickr photo mgarbowski
- 3. « ביצוע מחקר משתמשים ומחקר שוק
מחקר השוק כלל סקירה של אפליקציות מהארץ ומהעולם, שמטרתה להבין את מגוון הפתרונות הקיימים בשוק. הניתוח כלל
הצבעה על חוזקים וחולשות בכל אחד מהפתרונות, והתחקות אחר מניעים מאחורי החלטות בעיצוב האפליקציה.
כל הזכויות שמורות ליניב שריג © 1102
- 4. « ביצוע מחקר משתמשים ומחקר שוק
ראיונות עם משתמשים נעשו בכדי להבין את הצרכים השונים של אוכלוסיות שונות ובכדי לזהות את קהל היעד
המרכזי לאפליקציה, את אופי השימוש שלו בתחבורה ציבורית, בטכנולוגיה, את סדר היום ואת המקום שיכולה למלא
האפליקציה בתוך סדר יום זה. הראיונות הוקלטו ונותחו.
כל הזכויות שמורות ליניב שריג © 1102
יניב שריג © 1102
- 5. יערה כחלון
תלמידת כיתה י"א
סיפור רקע
גרה ברמת השרון עם ההורים, תלמידה בבית ספר תלמה ילין לאומנויות בגבעתיים. מסתובבת באופן קבוע עם אייפון,
מחברת סקיצות ומשקפי שמש )גם בחורף(.
שימוש בתחבורה ציבורית
קמה בבוקר ב 51:70. הולכת ברגל לתחנת האוטובוס )5 דקות( בכדי לתפוס את האוטובוס של 04:70 -אוטובוס דן-קו 57
)"אם אני מפספסת אותו יש לי עוד אחד ב 55:70 ואחרי זה עוד אחד לא זוכרת מתי"(. תמיד נוסעת לבד בבוקר, שמה
אוזניות ושוקעת במושב. נוסעת 53 דק' )"לפעמים שעה – תלוי בפקקים"( לבית הספר. מסיימת את הלימודים כל יום
בשעה אחרת. הולכת לתחנה ליד בית הספר ומחכה לאוטובוס חזרה. לפעמים 01 דקות, לפעמים 02 דקות. הנסיעה
הביתה יותר קצרה. אחר הצהריים אצל חברה )"יש לי חברות בתל אביב, ברמת גן ואפילו אחת בעפולה"(, מתחילה עם
אותו קו כמעט תמיד, לפעמים צריכה להחליף קו בקניון או בתחנה מרכזית. משתמשת בכרטיסיה של 01 נסיעות )"זה הכי
משתלם לי"(
קבלת מידע
בנסיעות ארוכות )עפולה( אני מתכננת באינטרנט בבית זמני אוטובוסים ותחנות. בנסיעה אני מבקשת מהנהג שיגיד לי
תכל'ס, אין לי ברירה.
איפה לרדת )"אני צריכה להזכיר לו כי הוא תמיד שוכח"(. אני גם מתקשרת למודיעין בטלפון )"יש לי אותם במועדפים"( אין לי רכב ויש לי מלא
לברר על קווים או זמנים, לפעמים אפילו כשאני בתחנה עצמה.
עיסוקים. אצלי מודיעין
תסכולים דן כבר במספרים
אני לא מבינה למה אין מודיעין אחד לכל חברות האוטובוסים. למצוא קו זה כמו לעשות תשבץ. לפעמים גם במודיעין לא
יודעים מסלולים וזמנים. גם אף פעם אין לי את כל המידע יחד. חוץ מזה, קצת מטריף אותי לשבת בתחנה ולא לדעת אם המועדפים בטלפון
האוטובוס עבר או לא. זה קצת מיושן העסק הזה.
יעדים לשימוש במוצר
פעמיים ביום תדירות
לקבל מידע מהימן ומהיר על תכנון נסיעה ועל זמני אוטובוסים בפועל.
03 דק' לכל כיוון זמן נסיעה
מוטיבציה
הרצון להיות יותר יעילה עם הזמן שלי, לא לפספס את האוטובוס. הצורך לתכנן מסלולי נסיעה ליעדים שאני לא מכירה. «פרסונות
החוויה האידיאלית
הפרסונה מסכמת את המידע שנאסף במחקר המשתמשים. המידע מוצג בצורת דמות ארכיטיפית, בעלת צרכים ספציפיים, אשר 21 דק' זמן המתנה
תשלום תבנית כרטיסיהמסוימת בתחבורה הציבורית ובטלפון אני עולה. איפה אני רוצה לרדת ומתי, ופשוט ייחוסתשובה: איזה קווים אני צריכה לקחת )"לא
הייתי רוצה להגיד איפה החכם, הפרסונה משמשת כנקודת לקבל בצמתי החלטה שונים בהמשך שימוש לה
אחד והעיצוב. בפרויקט מעניין אותי של איזה חברה הםבפרסונה ראשית רוצה להגיע לתחנה ולדעת כמה זמן אני צריכה לחכות ומה לעשות
זה הוחלט לעשות שימוש "(, ובאיזה שעות. אני אחת. תהליך הפיתוח או שניים
קווים
כל הזכויות שמורות ליניב שריג © 1102
אם פיספסתי את האוטובוס שלי.
בטלפון מודיעין
יניב שריג © 1102 אייפון סמארטפון
- 6. « רשימת יכולות
בתהליך של סיעור מוחות קבוצתי נקבעה רשימת היכולות האפשריות לאפליקציה.
כל הזכויות שמורות ליניב שריג © 1102
יניב שריג © 1102
- 7. יערה כחלון תסריטי משתמש
קמתי היום באיחור. אני יוצאת עכשיו מהבית ברגל לכיוון התחנה. פותחת את האפליקציה בכדי לראות מתי מגיע
קו 71 לתחנה. עוד 2 דק'. כדאי שאמהר.
1
אני בטלפון עם רונה. היא מזמינה אותי אליה מחר בבוקר לראשון לציון לשופינג. קבענו בקניון, רונה שולחת לי
את המיקום של הקניון דרך גוגל. אני משתמשת בלינק ששולח אותי לאפליקציה שם אני רואה איזה אוטובוסים
אני צריכה לקחת כדי להגיע בשעה שקבענו. אני שומרת את התוכנית למחר וקובעת תזכורת ליציאה מהבית, 51
דק לפני הגעת האוטובוס.
2
קמתי באיחור. אני יוצאת רק עכשיו מהבית לכיוון התחנה. פותחת את האפליקציה לראות מתי מגיע האוטובוס
שלי לתחנה. מבינה שאני מפספסת אותו. רואה שהאוטובוס הבא רק עוד חצי שעה. בודקת אלטרנטיבות
לתחנות אחרות באזור או לקווים אחרים. מוצאת קו אחר שמגיע ממש עכשיו. אבל תחנת הירידה קצת רחוקה 3
מהקניון. מחליטה לקחת אותו.
הגעתי לתחנה, האוטובוס מגיע עוד 2 דק'. אני קונה בינתיים כרטיס דרך הטלפון. עולה לאוטובוס, מציגה את
הקוד שעל המסך לקורא הכרטיסים באוטובוס ומקבלת קבלה. מתיישבת במושב ושומעת מוסיקה. 4
אני בנסיעה באוטובוס, נכנסת לאפליקציה כדי לשתף את רונה במיקום שלי שתראה איפה אני בדיוק ומתי אני
אני משתמשת בלינק מגיעה לתחנה של הקניון. אני מקבלת תזכורת שאני צריכה לרדת בתחנה הבאה.
5
ששולח אותי לאפליקציה יצאתי מהקניון מדלת אחרת ועכשיו כבר ערב. אין לי מושג איפה התחנה שירדתי ממנה וגם רונה לא יודעת. אני
שם אני רואה איזה פותחת את האפליקציה להבין לאן אני צריכה ללכת. האפליקציה זוכרת את הקו האחרון שנסעתי בו ומראה לי
6
את הכיוון והמרחק לתחנה הקרובה ביותר, כמו גם מתי מגיע האוטובוס הקרוב. אני מקבלת הצעה לרכישת
אוטובוסים אני צריכה כרטיס ומקבלת אותה.
לקחת כדי להגיע בשעה
אני בבית. שבת. מחר אני צריכה להגיע לתל אביב למרכז השירות של אורנג'. אני לא יודעת את הכתובת.
שקבענו.. פותחת את אתר אורנג' ומעבירה את הכתובת לאפליקציה. האפליקציה מזהה את הכתובת וטוענת שאין קווים
זמינים. אני סוגרת את האפליקציה ונכנסת לאתר של אורנג' לראות אם יש שם קוי אוטובוס שמגיעים למרכז
השירות
7
תסריטי אני באוטובוס, כיוונתי תזכורת לירידה מהאוטובוס תחנה אחת לפני היעד, נרדמתי והאפליקציה איבדה אות
משתמש «
ג'י.פי.אס. עברתי את התחנה בהרבה. עכשיו אני יורדת בתחנה אחרת ואצטרך לקחת אוטובוס חזרה.
סיפורים תסריטי אני יוצאת מהבית. בודקת תרחישיםמתי מגיע האוטובוס. עוד 7 דק'. אני עוצרתשימוש באפליקציה. התסריטים הם
שימוש נועדו לתאר באפליקציה בהם עושה הפרסונה הראשית לקנות לחמניה ושוקו במכולת.
או בכישלון. קצרים של משפטלתחנה, רואה המתארים התרחשות בזמן ובמקום מסוימים.. הסיפור יכול להסתיים בהצלחה
יוצאת שוב או שניים עוד 5 דק'. מגיעה לתחנה ומסתבר לי שהאוטובוס עבר כבר מסתבר שהטלפון שלי
איבד קישוריות לאינטרנט והמידע האחרון שהתקבל קפא על המסך.
התסריטים ממקדים את רשימת היכולות של האפליקציה תוך מתן דגש על סדר עדיפויות ובחינת מקרי קצה.
כל הזכויות שמורות ליניב שריג © 1102
- 8. «סקיצות מהירות
סקיצות שונות למסך הפתיחה המציגות דגשים שונים באפליקציה. המטרה היא לעבוד לרוחב ולהציג רעיונות שונים
הנותנים מענה לתסריטי שימוש שונים. הסקיצות מאפשרות לבחון בצורה מהירה את היתרונות והחסרונות של כל
כל הזכויות שמורות ליניב שריג © 1102
פתרון ולהחליט על כיוון ושפה גרפית לפני כניסה לעיצוב המסכים בפועל.
- 9. מאשר שימוש לא
הפעלת
במיקום נוכחי ?
אפליקציה
)פעם אחת(
כן
לא
יש נסיעה
פעילה?
מידע זמן אמת על כן מסך תכנון
שינוי תחנה
מועדפים תחנה הגדרות אפליקציה נסיעה
חיפוש / מפה
קרובה/מועדפת טקסט/מפה
מידע על בחירת מוצא,
קנה כרטיס
לא מיקום וזמן יעד, זמן
התחנה הגעה משוער
רלוונטית? ליעד
תוצאות
בחירת מספר חיפוש
כרטיסים כן
הוראות הגעה
בחירת קו צא לדרך!
לתחנה
תצוגת כרטיס
)קוד (QR
שמירה
שיתוף נסיעה
למועדפים
« תרשים זרימה
תרשים זרימה המתאר את המסכים השונים במערכת בכל רגע נתון, את אפשרויות הבחירה. על בסיס התרשים ניתן
לאמוד את היקף העבודה, את סוג המסכים הנדרש ואף את האלמנטים השונים שיכללו במסכים.
כל הזכויות שמורות ליניב שריג © 1102
- 10. « אפיון מסכים שלדיים - סקיצות
סקיצות שונות של אלמנטים באפליקציה: חיפוש, מיון, תצוגת רשימה, דפדוף בין רשומות וכד'. הסקיצות עוזרות
לבחון את סידור האלמנטים על המסך, את יצירת ההיררכיה בין האלמנטים השונים ואת השפה לבניית האפיון.
כל הזכויות שמורות ליניב שריג © 1102
- 11. « אפיון מסכים שלדיים - סקיצות
סקיצות של מסכים שונים במערכת, בחירה של מסכים להמשך עיצוב, שרטוט האינטראקציה בין המסכים השונים.
כל הזכויות שמורות ליניב שריג © 1102
- 12. « אפיון מסכים שלדיים
מסך הכניסה לאפליקציה –מציג רשימה של אוטובוסים המגיעים לתחנה הקרובה. הרשימה ממוינת לפי זמן ההגעה
לתחנה. ניתן לשנות את התחנה המוצגת באופן ידני או דרך הגדרות המערכת. המסך מציג גם זמן הליכה וכיוון
ממיקום נוכחי לתחנת המוצא. ממסך זה ניתן לבחור קו מסוים בכדי לראות פרטים על מסלול הקו ועל תחנות
כל הזכויות שמורות ליניב שריג © 1102 ספציפיות במסלול.
- 13. « אפיון מסכים שלדיים
מסך פירוט לקו ספציפי – מסך זה מפרט בצורה טקסטואלית או על-גבי מפה את מסלול הקו, התחנות השונות ומידע
נוסף לגבי התחנות כגון נגישות לנכים או קישור לתחנת רכבת. ממסך זה ניתן לשנות את כיוון הנסיעה הרצוי, לבחור
כל הזכויות שמורות ליניב שריג © 1102
מידע לגבי תחנה אחרת או להמשיך לקניית כרטיס נסיעה.
- 14. « אפיון מסכים שלדיים
מסך רכישת כרטיס – פירוט הקו, תחנת המוצא והיעד וזמן הנסיעה המשוער.
ממסך זה ניתן לבחור את מספר הכרטיסים ולהמשיך לביצוע רכישת כרטיס. הכרטיס מוצג כקוד QRאותו צריך להציג
כל הזכויות שמורות ליניב שריג © 1102
בעלייה לאוטובוס .
- 15. « אפיון מסכים שלדיים
מסך תכנון נסיעה – מסך זה מאפשר תכנון נסיעה מנקודה א' ל-ב' בזמן מסוים. תכנון הנסיעה יכול להתבצע באופן
טקסטואלי או על-גבי מפה. שדות החיפוש מאפשרים הכנסת כתובת באופן ידני, מספר הכתובות של הטלפון, נקודות
כל הזכויות שמורות ליניב שריג © 1102
עניין. בנוסף, מציג מסך זה חיפושים אחרונים שבוצעו במערכת.
- 16. « אפיון מסכים שלדיים
מסך הצגת תוצאות חיפוש – מסך זה מציג תוצאות של חיפוש קווים המגיעים מנקודה א' לנקודה ב' בזמן נתון.
ניתן למיין את התוצאות על-פי שעת יציאה או הגעה ליעד, משך נסיעה ומרחק מתחנת מוצא/יעד. הטבלה מציגה
באופן גרפי וטקסטואלי את זמן היציאה, משך הנסיעה, מספר הקו, החלפות קווים, זמן הגעה ליעד.
פעולות נוספות מאפשרות בחירת אחת מהתוצאות, ניווט רגלי לתחנה, שמירת נסיעה למועד מאוחר יותר ושיתוף
כל הזכויות שמורות ליניב שריג © 1102
התוצאות.
- 17. « בדיקות שמישות
בדיקת השמישות נועדה לזהות האם תפעול של תסריטי השימוש המרכזיים נעשה בצורה נכונה על-ידי משתמשים.
כל המסכים נסגרו כקבצי ,htmlהועלו לשרת ונשמרו על מכשיר האייפון כאפליקציה לכל דבר.
בעזרת תוכנת לכידת מסך, הוקלטו בדיקת שמישות אמיתית. הבדיקות העלו נקודות רבות לשיפור החל מטרמינולוגיה,
צורת כפתורים, מיקום כפתורים, זרימת המידע במערכת וכד'
כל הזכויות שמורות. © 1102- www.35east.com
- 18. « בדיקות שמישות
תסריט 1: "את יוצאת מהבית לכיוון תחנת האוטובוס. קו 71 מגיע עוד 2 דק'. את כבר לא תספיקי להגיע. בדקי
באפליקציה מתי מגיע קו 71 הבא לתחנה"
כל הזכויות שמורות. © 1102- www.35east.com
- 19. בּאבּוּס
אפליקציית אייפון לשימוש בתחבורה ציבורית
סיכום פרוייקט במסגרת קורס עיצוב חוויית משתמש לסמארטפון – יולי 1102
ברק דנין ועידוא שביט
אפיון: יניב שריג
ניתן להוריד את הפרוטוטייפ ולהתנסות באפליקציה כאן: http://www.35east.com/sandbox/iprototype/babus
)יש לפתוח את הלינק דרך מכשיר אייפון 4 בספארי(
או ישירות מכאן:
צור קשר:
כל הזכויות שמורות. © 1102 www.35east.com
cc flickr photo mgarbowski