איפיון ועיצוב מוצר: 6 כלים מומלצים שיעשו לכם חיים קלים

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

random user

הפוסט נכתב על ידי עמרי אוירי, VP Product ב-Hippotec המתמחה בפיתוח אפליקציות מובייל.

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

#1 – Random User

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

randomuser

#2 – Balsamiq

אנחנו תמיד מתחילים עם דף ועפרון, לא מצליחים להשתחרר מזה, אבל מהר מאוד כשיש קונספט, העניינים צריכים לתפוס תאוצה ופה נכנס Balsamiq לתמונה. כל מי שמתעסק באפיון ועיצוב ממשקים מכיר את Balsamiq, המאפשרת ליצור אבי טיפוס לממשקי מובייל ו-web ביעלות רבה. אנחנו בחרנו לעבוד עם בלסמיק למרות שקיימות לא מעט אופציות אחרות כמו Axure, Omnigraffle ואפילו Visio שישרתו את אותה מטרה. לכל אחת מהן יתרונות וחסרונות משלה. אנחנו מקפידים לשרטט כל מסך בכל וריאציה אפשרית. זה בדרך כלל עוזר ללקוח להבין שאין לו ״אפקליציה קטנה של עשרה מסכים״, שה-Onboarding Experience חשוב לא פחות ושחייבים למצוא פתרון מתאים למסכים ריקים מתוכן.

 

Balsamiq

#3 – Design Duet

כשלקוח מקבל עיצוב למסכי האפליקציה שלו אנחנו תמיד מדגישים לו: ״אל תסתכל על זה במחשב, תשמור את זה בסמארטפון שלך ותסתכל שם״. המנטרה הזו שלנו מלווה גם אותנו בתהליך העבודה. אנחנו אף פעם לא מקבלים החלטה או אפילו מביעים דעה על עיצוב אלא אם הוא מוצג בפלטפורמה אליה הוא מיועד. Design Duet הוא פלאג-אין קטן וגאוני ל-Photoshop אשר עובד יחד עם אפליקציה תואמת לאייפון (בקרוב גם לאנדרואיד), אחרי הגדרה ראשונית וסינכרון על גבי רשת ה-WiFi, כל מה שאתם עובדים עליו בפוטושופ, יוצג באפליקציה התואמת בסמארטפון בסנכרון מושלם. זה עוזר לנו לבדוק אופציות, להציג מצבים שונים של כפתורים ומסכים והכל בזמן אמיתי מבלי ליצא אינספור קבצי JPG שאחר כך יש להעביר לסמארטפון ולבדוק.

Design Duet

#4 – PNG Express

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

חיתוך ידני של כל אלמנט ושכבה יכול לקחת שעות עד ימים (תלוי בגודל הפרויקט), ומלבד זאת, מדובר בשלב שכל מעצב אוהב לקטר עליו. PNG Express פותר בדיוק את הבעיה הזו, מדובר בתוסף לפוטושופ המבצע חיתוך אוטומטי ויצוא הקבצים בכל הפורמטים הדרושים לכל הפלטפורמות יחד עם היכולת לייצר Design Specs למפתחים תוך דקות בודדות.
PNG Express

#5 – invision

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

invision מאפשרת לנו להעלות את כל מסכי האפליקציה וליצור מהם mockup מתפקד אותו יכול הלקוח לנסות ב-mobile וב-desktop (לאחרונה השיקו invision גם פיצ׳ר שיודע לשאוב אוטומטית את המסכים מתוך הפוטושופ ובכך חוסכת לנו גם את יצוא המסכים ל-JPG), הכל מאפשר ללקוחות לייצר הערות על כל אלמנט במסך ולנו את האפשרות לנהל איתם דיון נפרד על כל הערה.

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

invision

#6 – חביב הקהל – Adobe Kuler

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

Adobe Kuler

הכתבה בחסות HIPPOTEC

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

Avatar

כתב אורח

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

הגב

4 תגובות על "איפיון ועיצוב מוצר: 6 כלים מומלצים שיעשו לכם חיים קלים"

avatar
Photo and Image Files
 
 
 
Audio and Video Files
 
 
 
Other File Types
 
 
 

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

סידור לפי:   חדש | ישן | הכי מדורגים
חיים
Guest

יפה מאוד, אכן בארגון אצלנו משתמשים בחלק מהדברים שהוצגו בכתבה.

ניד
Guest

אחלה כתבה.

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

לא ניד
Guest

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

ניד
Guest

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

תהיה בטוח שאפשר לכתוב כתבה מהסוג שתארתי.

wpDiscuz

תגיות לכתבה: