החיים אחרי הvisio - כלים חדשים ליצירת מסמכי אפיון
08 בנובמבר 2009 מאת ליאור יאיר
הרבה פעמים שואלים אותי באיזו תוכנה אני משתמש כדי לייצר מסמכי אפיון ומי ששאל אותי עד עכשיו יודע שאני מעדיף להשתמש ב visio. אבל לא עוד. כבר זמן מה שאני מרגיש שחייבת להיות דרך אחרת, טובה יותר לייצר מסמך אפיון. אני מכיר את הסביבה של visio, וכבר השקעתי שם לא מעט עבודה כדי להפוך אותה לכלי שמתאים לצרכים שלי ובכל זאת אני לא יכול להרשות לעצמי להישאר מאחור. המסע למציאת סביבת עבודה חדשה ליצירת אפיון החל.
מסמך האפיון - הגדרה
התוצר הסופי של תהליך האפיון. המסמך מכיל את התוכן, ההיררכיות והפונקציונאליות של כל אחד מהעמודים המוגדרים. זהו לא מסמך עיצוב - אך מהווה את השלד הראשוני והמחייב שסביבו נעצב.
מסמך האפיון חייב להיות ברור ואסטטי ולהעביר את הרעיונות והמסקנות שלנו מתהליך האפיון בצורה הטובה ביותר. חשוב לא להתבלבל בין עיצוב לאסטטיקה, מסמך האפיון לא יכול להעביר עיצוב וחשוב שנעשה את ההפרדה הזאת. אחד האתגרים המרכזיים שעומדים מול מסמך אפיון הוא היכולת שלו להיות ברור ופשוט. אני נתקל מדי פעם במסמכי אפיון שנפסלים על הסף רק מהסיבה שקשה להבין אותם. בנוסף, המסמך חייב להכיל את כל המידע והמצבים השונים. אני יודע שעשיתי עבודה טובה אם המעצב/המפתח/איש הQA לא מדברים איתי מהרגע שמסמך האפיון מוכן, מכיוון שהם מוצאים את כל התשובות שהם צריכים במסמך.
הסביבה שבה אנו יוצרים את מסמך האפיון משפיעה רבות על איכותו ועל השגת המטרות שהצבנו. לכן ברור ששווה להשקיע את הזמן ולמצוא סביבה כזו שתענה על כל הצרכים שלנו בתור מאפיינים. במסגרת המהלך שלי למציאת סביבת אפיון חדשה עברתי על לא מעט סביבות עבודה וריכזתי את הסביבות שהיו הטובות ביותר לטעמי. בהמשך הפוסט תמצאו את רשימה הסביבות שבחרתי ואת ההתרשמות הראשונית שלי מכל סביבה.
Balsamiq
אם אתם מחפשים לאפיין משהו במהירות (תוך כדי פגישה עם לקוח לדוגמה) הסביבה של balsamiq יכולה להתאים לכם. היא מאוד אינטואיטיבית וקלה לשימוש ומציעה מגוון רחב של קומפוננטות קיימות לשימוש מהיר, פשוט לגרור ולהציב.
במובן מסוים השימוש בה מאוד דומה להרכבת פאזל שכל חלקיו כבר קיימים ורק צריך לדעת איפה למקמם, זהו היתרון וגם החסרון שלה. מצד אחד כל הקומפוננטות כבר קיימות, מה שחוסך המון זמן, מצד שני יהיה קשה ליצור בה משהו חדשני.
iPlotz
היתרון הבולט שיש ל iPlotz טמון באפשרויות הניהול והשיתוף של תהליך האפיון. כך לדוגמה נוכל לשתף את האפיון, לרכז הערות בצורה נוחה ומסודרת ולהמשיך ולנהל את הפרויקט מול הלקוח באותה סביבת העבודה גם בשלבים מתקדמים יותר. בנוסף, גם פה קיים מספר לא מבוטל של רכיבים מוכנים, התוצרים אינטרקטיבים והממשק קל ופשוט לשימוש. אפשרות נוספת ששווה להזכיר היא יצירת מסמך אפיון מקיף (כחוברת) בקליק, המסמך יכיל את פירוט העמודים על כל מאפיניהם ותכתובות מלאות של כל ההערות הקשורות לאותו העמוד ויוצג בפורמט של מסמך אפיון מלא.
מאוד נהנתי לשחק עם סביבת האפיון של flairbuilder מהסיבה הפשוטה - הרבה מהרכיבים המוכנים שלהם הם אינטרקטיבים בהגדרה. כך לדוגמה מיקמתי בקלות נגן youtube ורכיב googlemaps אקטיבים בתוך מסמך האפיון. לצערי הפיצ'ר הנחמד הזה לא היה מספיק בשביל לגרום לי להמשיך ולעבוד בסביבה זו, שלא כוללת אפשרויות שיתוף מתקדמות או חוויה נוחה במיוחד.
התחברתי מיד לסביבת העבודה של protoshare. הממשק אינטואיטיבי ומעבר מהיר על האפשרויות המוצעות מגלה סביבה מרשימה מאוד. רשימת האוביקטים המוצעים ארוכה והאובייקטים עצמם עשירים בהתנהגות, קיימות גם פה אפשרויות שיתוף מתקדמות ויצירת מסמך אפיון ברגע. בנוסף, הסביבה מייצרת בכל רגע נתון את מפת האתר בצורה אוטומטית מה שמאוד עוזר להבנה עמוקה יותר של היררכית התכנים בפרויקט.
עם כל זאת לסביבת העבודה של protoshare יש חסרון בולט, אין אפשרות לעבוד על האפליקציה לוקלית. כלומר אנו מחוייבים להתחבר לאינטרנט אם נרצה לעבוד על מסמך האפיון.
המשימה של Pencil Project היא ליצור סביבת עבודה חינמית על גבי קוד פתוח וזהו גם היחוד שבהם. האפליקציה אמנם מציעה מספר לא מבוטל של אפשרויות מוכנות, אך מבוססת על ממשק office מסורבל ואינה מתחרה ראויה מול החלופות בכל הקשור לאפשרויות מתקדמות והתנהגות עשירה.
axure
axure מציע לנו הכל: סביבה נוחה, אובייקטים מוכנים ואפשרויות שיתוף. האפליקציה של axure מוכרה מאוד בתעשיה והיא זוכה ללא מעט שבחים. לטעמי היא לא מספיק מהנה ומעניינת אך היא בהחלט עושה את העבודה. אני יכול להבין למה הרבה אנשי מקצוע בתחום עושים בה שימוש ובהחלט שווה לבדוק אותה לפני שמחליטים אך באותה נשימה שווה לבדוק גם כמה אפליקציות נוספות.
visio
אחת התוכנות הנפוצות כיום בכל הקשור ליצירת מסמכי אפיון. התוכנה מבית Microsoft office מה שמעיד על יתרונות וחסרונות ברורים. ההתממשקות בין התוכנות לאותו הבית פשוטה יחסית והממשק מוכר אך עם זאת מסובך. ה-visio לא פותחה במקור בתור תוכנת office אלא נקנתה מחברה חיצונית ועברה הסבה לתוך החבילה מה שגורם לה עד היום לסבול מלא מעט באגים (לא כולל הבאגים שהוספו כאשר הפכה להיות חלק מחבילת הoffice) בנוסף, התוכנה בהחלט מכילה לא מעט אפשרויות אך את רובן איני צריך והן מכבידות עלי ועל ממשק העבודה שלי.
עד עתה הייתי משתמש קבוע בvisio ופוסט זה נולד (כפי שאתם יודעים) מהצורך שלי למצוא חלופה טובה יותר. visio הפכה לתוכנה ארכאית ומנותקת מצרכי המשתמשים שהתפתחו והשתנו בעוד היא נשארה מאחור. למרות שהתוכנה גמישה יחסית היא אינה מציעה רכיבים מוכנים שלא לדבר על התנהגות עשירה ואם נרצה להפוך את האפיון לאינטרקטיבי נצטרך לעבוד קשה. בנוסף, אין שום אפשרות לשיתוף ולניהול נכון של שלב האפיון.
דף ועפרון
כלי מהפכני זה נוצר בהשפעת זרם המינימליזם. אין צורך להתקין שום דבר אבל יכול להיות שתצטרכו לרכוש גם מחק.
אני משרטט את רוב האפיונים שלי תחילה על גבי דף ועפרון ורק לאחר מכן מעביר אותם לvisio אבל ישנם מאפיינים רבים שמשאירים את האפיון ברמת השרטוט הידני. שיטה מעניינת בהקשר הזה נקראת "שיטת כפפת האגרוף", בשיטה זו אנו משרטטים על גבי פתקית נצמדת (post-it) את כל אחד מהעמודים בפרויקט ומדביקים אותם בסדר המתאים ובכך יוצרים אפיון ותרשים זרימה בבת אחת. כמובן שהשיטה לא מתיימרת להחליף מסמך אפיון מלא אבל היא נקודת פתיחה מעולה לכל פרויקט.
לסיכום
עדיין לא נבחר יורש אבל אנחנו בכיוון הנכון. אני יודע שלא נגעתי במגוון נושאים (מחיר, הטמעה, עבודה עם עברית) ונושאים אלו בהחלט יעלו בהמשך. בשלב הבא נבחן שימוש מסיבי בכמה סביבות נבחרות- iplotz, protoshare ו-axure כדי להבין מי מהן הטובה ביותר על פי קרטריונים שיקבעו מראש. צפו לפוסטים בנושא.
למי שיש מה לחדש או להמליץ על סביבת עבודה שלא הוזכרה וגם על אלו שכן, אנחנו נשמח לשמוע וללמוד גם מהניסיון שלכם.
אחלה סקירה. ואפשר גם להמליץ על כלי/אתר חדש: mockingbird
מנסיון של יותר משלוש שנים אני יכול להמליץ בלב שלם על אקסיור. היא מאוד מוכוונת למאפייני ווב והבונוס הגדול הוא שהיא מייצרת פרוטוטייפ HTML-י אינטראקטיבי שמאוד עוזר למאפיין אבל בעיקר עוזר ללקוח. אין תחליף ללראות אפיון אינטראקטיבי בתוך דפדפן. כמו כן זה מקל מאוד בביצוע בדיקות שימושיות.
אקסיור כל הזמן משפרים את התוכנה והם מאוד קשובים לקהילת המאפיינים הפעילה. יש בה את כל התכונות הטובות של ויזיו ועוד הרבה דברים שאין.
התשלום שמשלמים הוא שהאפיון המהיר של ויזיו הופך לפעמים להרבה עבודת "תכנות" הפרוטוטייפ.
בכל מקרה מומלץ מאוד.
ליאור, סקירה מעניינת מאוד!
נחמד לשמוע על כלים אחרים, אבל אישית, אני משתמשת באילוסטרייטור והוא ממש נוח לי.
אשמח לשמוע מדוע אתה בטוח חושב שאני טועה…
אגב, לא נראה לי שהייתי מסוגלת לעבוד עם iplotz ולו רק בגלל השם שלו.. :)
סקירה מצויינת, תודה!
Mockingbird שיואב הזכיר הוא מהמשפחה של protoshare, כלומר אפשר לעבוד עליו רק דרך הרשת. הוא גם בגירסה מאוד ראשונית, אין אפילו דרך ליישר טקסט. קשקשתי קצת עם הצוות שמפתח אותו (2 אנשים בלבד!) במייל, נשמעים מאוד רציניים, כך ששווה לעקוב אחרי החבר הזה ולראות איך הוא מתקדם.
לא ציינת כאן את Fireworks, הכלי של Adobe שמגיע יחד עם ה-Creative Suite. הוא יותר גראפי באופי שלו, אבל גם לו יש ספריות בשפע שאפשר להוריד מהרשת, והוא מתממשק ישירות עם פוטושופ ואילוסטרייטור.
לא מעט אנשים עושים Wireframing עם Powerpoint. אני אישית לא מת על זה, אבל יש בזה שימוש.
וכמובן, יש את ה-Expression של מיקרוסופט, וה-Catalyst של אדובי, שניהם מיועדים ל-Prototyping שמחובר ישירות לסביבת הפיתוח, ומאפשרים גם יצירה של פלט סטאטי (JPEG וכו') וגם אב-טיפוס חי, אינטראקטיבי ובועט. ה-Expression מתחבר ל-Silverlight וה-Catalyst ל-Flash/Flex כמובן, ושניהם נראים כמו כיוון מצויין לעתיד, לפחות עבורי.
שווה להזכיר את הסקירות של אמיר דותן על Axure ועל iPlotz מלפני כמה חודשים
http://www.amirdotan.com/blog/?p=962
http://www.amirdotan.com/blog/?p=982
אהבתי את השם "שיטת כפפת האגרוף", אני חשבתי שזה יהיה יותר בכיוון של ניהול brainstorming יעיל: לא אוהבים את הרעיונות שלי? תכירו את כפפת האִגרוף שלי :-)
היה יכול להיות שימושי מאוד אם הייתם מוסיפים לסקירה בקצרה אילו תומכים בעברית (או לא), ואילו בתשלום (או לא).
:)
סקירה טובה מאוד, תודה על המידע המועיל.
תודה רבה על התגובות,
ארז - אני בהחלט מסכים ש-axure היא תוכנה שבאמת שווה לבדוק וכך באמת גם נעשה. צפה לפוסט בנושא בקרוב.
מיכל - אני יכול להבין למה אילוסטרייטור מאוד נוח לך, את מכירה את הסביבה. אבל אילוסטרטור היא לא תוכנה יעודית להכנת מסמכי אפיון וכמו הויזיו חסר לה הרבה מהכלים שיכולים לעשות את העבודה שלנו להרבה יותר פשוטה ואיכותית. (ולגבי iplotz - גם לנו היה קשה להתרגל לשם…)
ברק- תודה על התגובה המושקעת. כחלק מהתהליך בחרתי להציג בפוסט זה את הסביבות שנראו לי (אחרי עבודה קצרה מאוד איתן) כטובות ביותר והמטרה היא כמובן למצוא את הסביבה הטובה ביותר. עברתי על הכלים שהזכרת במסגרת המחקר שלי אבל קיבלתי את התחושה שהם אמנם טובים אבל לא נבנו בשביל להתאים לצרכים המיוחדים שלי בתור מאפיין ווב. מה אתה חושב?
שרית - בהחלט נוסיף את המידע הזה בהמשך, ברגע שנבחון לעומק את הסביבות שבחרנו.
היי,
עוד תוכנה מגניבה שכתבתי בזריזות לפני שנה בערך, אי אפשר להשוות אותה ברצינות לכלים שהצעת, אבל בכל זאת תוכנה כחול לבן. :)
http://usabilitytalking.blogli.co.il/download/
סקירה מענינת.
אני אישית משתמש ב Balsamiq.
כאשר הצורך הוא ליצירה של APPLICATION UI
(בניגוד ל WEB UI) ה Balsamiq הוא כלי מעולה!
דבר אחד די בולט בו, הוא כלי שממש כייף להשתמש בו.
קשה להאמין אבל הכלי פותח בידי אדם אחד!
סוף סוף מישהו מדבר על הנקודה הזאת.
רציתי לדעת אם התוכנות האלה מותאמות לעבודה עם עברית?
שנים שאני עובד על powerpoint ולפעמים על balsamiq וגם אני מרגיש שהן פשוט לא מספיקות לי. חיפשתי בזמנו תוכנה אחרת אבל התייאשתי מהר בגלל שאף אחת מהתוכנות שבדקתי לא עברה כמו שצריך עם פונטים עבריים.
שלום ירון,
עברית היא תמיד נקודה בעייתית ואני בהחלט מתכוון להתייחס אליה בסקירות המלאות של סביבות העבודה שהוצגו. תשובות בקרוב.
התחלתי לעבוד לאחרונה על axure ואני מאוד מאוד מרוצה.
התוכנה קלה לשימוש וניתן לייצר Interactive Prototypes במהירות ובקלות.
עוד יתרון הוא ספריות הקומפוננטים שניתן להוריד מהאתר שלהם:
http://www.axure.com/communityLibraries.aspx
מעבר להורדת ספריות ניתן לייצר ולשמור ספריות.
זה יתרון ענק למעצבי In house שיכולים לחזור ולהשתמש באותם קומפוננטות שוב בהתאם ל look & feel של החברה שבה הם עובדים.
תודה על הסקירה. ובכל זאת, מה מהכלים האלה מתאים למאפיין web מתחיל?
הי מעוז,
אני הייתי ממליץ על balsamiq למאפיין מתחיל. יש בו את כל הקומפוננטות הדרושות, הוא מאוד ידידותי והמחיר שלו סביר.
אקסיור, אקסיור, אקסיור.
בויזיו אין אפילו דרך נוחה להגדיר גודל בפיקסלים. אין מה להשוות את חוויית העבודה. כשאני מגישה מסמך HTML עובד, עם פופ אפים, לינקים, תצוגות מתחלפות, מקרים שונים - אנשים פותחים לסתות. פשוט עובד.
אבל יקר.. :)
יאללה מחכים לפוסט הבא בסדרה!!!
If you are a Mac user, I'd recommend Omnigraffle. It's very powerful yet extremely easy to use. You can create prototypes and test them in the "presentation mode" (though the proto will only run on Graffle and not on a browser). You can find stencils for just about anything and create beautiful deliverables quickly.
Plus, it's really not expensive compared to the alternatives.
Axure is an extremely powerful tool but I find that when a static wireframe is all I need, Graffle does a better job.
Mac it:
There is a Mac Alpha version of Axure aka MAxure
about to release a beta in Feb
http://www.axure.com/downloadbeta.aspx?src=tum
http://www.axureformac.com
I've been hearing only good things on omnigraffle that mentioned above, will go for it, Tx.
[...] כלים ליצירת מסמכי אפיון [...]