למי שעדיין לא מכיר, Sketch היא תוכנה למעצבי חווית משתמש שיצאה לשוק לפני כ-5 שנים. התוכנה מתחילה לתפוס תאוצה גדולה יותר ויותר וכ- 40% אחוז ממעצבי חווית משתמש ברחבי העולם כבר עובדים איתה. אנחנו ב- Create יודעים בדיוק למה אנחנו מאוהבים בה. אבל מה מעצבים אחרים חושבים?
לצורך הכנת הכתבה ראיינו מעצבים וראשי צוותים מובילים בתעשייה שעשו את המעבר מחבילת התוכנות של אדובי ל- Sketch.
בהכנת הכתבה השתתפו:
עמרי דביר – מעצב חווית משתמש Facebook
רן סגל – Co-Founder, Product at The nuSchool
עדי דידי ענבר – Product designer, Gett
עוז פנחס – מעצב UX בצוות Waze Carpool בגוגל
אייל צורי – Co Founder & CCO @ Muzli
ניר קוסובר – UX studio manager, Wix
מאיה שוורץ – Senior Designer, Designit
לעבור או לא לעבור? זאת השאלה
כמעצבים אנחנו מטבענו אנשים סקרנים. חשוב לנו להישאר מעודכנים לא רק בטרנדים אלא גם בתוכנות חדשות שיוצאות לשוק ויכולות לייעל את תהליכי העבודה שלנו. העובדה שהרבה חברות מוצר גדולות בעולם עברו לעבוד עם Sketch דוחפת מעצבים ללמוד את התוכנה. חברות כמו Wix ו- Facebook הבינו שהיעילות של Sketch היא עצומה והן מעבירות הכשרות בתוך הארגון במטרה ללמד את המעצבים לעבוד איתה.
המלצות מחברים גם משפיעות על המעצבים לעשות את המעבר. דבר נוסף שחשוב למעצבים, הוא שיש ל – Sketch קהילה חזקה ואקטיבית. יוצאים עדכוני תוכנה בתדירות גבוהה, יש הרבה תמיכה ומעצבים ומפתחים יוצרים הרבה פלאגאינים על בסיס יומיומי וכמעט כולם בחינם.
ניר קוסובר מ- Wix חושב שאין ספק שהתחרות עלתה מדרגה ושיש לא מעט כלים חדשים ומסקרנים בשוק. בתוך המבחר הזה נראה ש – Sketch מתווה את הדרך ולפחות כרגע היא הכלי הכי בוגר כמוצר מבין המתחרים החדשים.
״עקבתי אחרי ההתפתחות של Sketch לאורך הרבה זמן, אחרי Sketch 3 היה נראה שהתוכנה בשלה למעבר. קשה להצביע על משהו ספציפי, אבל כשהיה נראה שברוב חברות המוצר המובילות בעולם עוברים להשתמש ב – Sketch ככלי עיקרי, הגעתי למסקנה ששווה לנסות, לא רק ככלי אישי שלי אלא ככלי מרכזי עבור הסטודיו UX שלנו הכולל קרוב ל-60 מעצבים.״ (ניר קוסובר, Wix)
״כשהתחלתי לעבוד עם התוכנה אהבתי את ההרגשה שהיא עובדת בשבילי ולא אני בשבילה, הרי כל מעצב/ת ux הרגיש/ה שפוטושופ ואילוסטרייטור אלו תוכנות שמיועדות לעיבוד תמונה ואיור והשימוש הוא בחלק קטן של התוכנות. גם עקומת הלמידה היתה סופר קצרה. הצטרפתי באמצע פרויקט של המשרד השוודי שלנו ותוך יום כבר הרגשתי שליטה מלאה בתוכנה.״ (מאיה שוורץ, Designit)
״בהתחלה ניסיתי בגלל הבאז מסביב ונשארתי בגלל היעילות ומהירות העבודה. העובדה שאפשר לראות פלואו/מוצר שלם על Board אחד ולקבל תמונה רוחבית בצורה קלה יותר מפוטושופ קנתה אותי." (עדי דידי ענבר, Gett)
"האמת שלקח לי הרבה זמן, כי אני עובד למעלה מ- 15 שנה עם פוטושופ, אבל כשיותר מדי מהחברים שלי אמרו לי שאני חייב לנסות החלטתי לבדוק את העניין. האמת שאחרי השימוש הראשון לא כל כך הבנתי ממה ההתלהבות. אבל אז חבר נוסף הזמין אותי לקפה רק כדי ללמד אותי Sketch ולהסביר לי שאני חייב לעשות את המעבר. החלטתי סוג של ״להכריח״ את עצמי ופשוט קניתי את התוכנה, אחרי זה הייתי חייב להתחיל להשתמש כדי לא להרגיש פראייר. אבל מאז אני לא יכול להסתכל אחורה." (רן סגל, The nuSchool)
הזמן שלנו יקר : מהירות, מהירות ו…מהירות
ל – Sketch יש לא מעט יתרונות מול המתחרים אבל אין ספק שאחד היתרונות המרכזיים שהמעצבים העלו הוא ש – Sketch תוכננה במיוחד עבור מעצבי חווית משתמש ולכן מה שלא רלוונטי פשוט לא נמצא בתוכנה. העובדה הזו מקלה על העומס הקוגניטיבי שלנו ובכך מפשטת מאוד את העבודה, מקצרת תהליכים וחוסכת זמן יקר.
המעצבים מאוד אוהבים את הפשטות בעבודה עם סמלים (Symbols) ותבניות מוכנות מראש (Templates) שמאפשרת עבודה יעילה ומהירה. גם העובדה שאפשר לעצב רוב הזמן עם המקלדת מאוד אהובה על המעצבים, זה מאפשר להם לערוך אלמנטים, לבחור צבעים, להעתיק סגנונות בלחיצות בודדות בצורה אינטואיטיבית.
דבר נוסף שהמעצבים ציינו לחיוב הוא שהמוצר כל הזמן מתפתח ומתעדכן, יש הרבה תוספים שמשפרים את העבודה בתוך צוותי העיצוב ואל מול אנשי הפיתוח.
"מהירות, ומהירות. אם חשוב לכם להיות פרודוקטיבים ולעבוד מהר (כמובן בהנחה שעיקר העבודה שלכם היא על ממשקים), אין שום פתרון מהיר יותר כרגע." (רן סגל,The nuSchool)
״אני מאמין שמגבלות יוצרות עיצוב טוב יותר (כולנו מכירים את השיתוק שבא עם דף לבן וחופש מוחלט). העובדה שסקץ' מכילה מספר מאוד מצומצם של כלים, במיוחד יחסית לפוטושופ, מאפשרת לי המון חופש לבנות מוצרים ביעילות. בנוסף, אני מסוגל לעבוד עם קבצים מאוד גדולים, שמכילים הרבה מסכים, ועדיין לקבל ביצועים טובים מהמחשב – דבר שבדרך כלל היה מאט ומעכב את העבודה עם פוטושופ״. (עמרי דביר, Facebook)
"הגמישות והיעילות של הסימבולים יחד עם הסטיילים והטמפלייטים מאפשר תהליך עבודה הרבה יותר מסודר ויעיל. המיקוד של סקץ׳ בעיצוב UI שבא לביטוי במינימליסטיות של הממשק, בקרבה ל html & css ובבחירה קפדנית של פיצ׳רים הופכת אותה לסביבת עבודה הרבה יותר מהירה." (ניר קוסובר, Wix)
״ל-Sketch מאגר מדהים של אקסטנשנים ואינטגרציות עם מוצרים שונים שהופכים את החיים לקלים.״ (אייל צורי, Muzli)
תהליך העבודה : פוקוס על העיצוב ולא על התוכנה
לכל פרויקט שאנחנו עובדים עליו יש דד ליין. במסגרת הדדן ליין אנחנו נאלצים להתמודד גם עם הצד הטכני של העבודה. השאיפה שלנו, המעצבים, היא להתעסק בכמה שפחות עבודה טכנית וכמה שיותר לעבוד על גרסאות שונות לעיצוב. לכן, חשוב לנו מאוד שהחלק הטכני בתהליך יהיה חלק, מסודר ויעיל.
אייל צורי מאמין שהחלק המרכזי בקיצור זמני הפרוייקט הוא פיצוח הקונספט ועבודה מול הלקוח/בוס. עם זאת, הוא חושב ש – Sketch בהחלט הופכת את העבודה הטכנית לחלקה ומסודרת יותר. ברגע שאנחנו מצמצמים את העבודה הטכנית למינימום אנחנו יכולים להשקיע יותר זמן בעיצוב של גרסאות נוספות לקונספט ובכך לשפר את המוצר שלנו.
״העבודה ב – Sketch כמעט והורידה לחלוטין את שלב ה-Wireframing עבורי. המהירות שבה אני מסוגל לעצב מסכים ברמת דיוק וגימור גבוהה גורמת לכך שאין צורך להפריד בין שלב התכנון לשלב העיצוב. מאחר ואני יכול לעבוד מהר, אני מסוגל לחקור הרבה יותר אפשרויות לכל מסך; אם בעבר הייתי מנסה 3-4 כיוונים, היום אני מסוגל לייצר עשרות אפשרויות שונות בזמן מאוד קצר וכך לבסוף לבחור את העיצוב הנכון ביותר״. (עמרי דביר, Facebook)
"העבודה עם Sketch יעילה מאוד! אפשר להתרכז יותר בעיצוב עצמו ופחות בתוכנה. כמובן שגם הטעינה של הקבצים יותר מהירה, יש פחות תפריטים, קיצורי הדרך יותר אינטואיטיבים, יצוא קבצים בגרירה ישר למייל או ל- Slack, וכמובן Zeplin!!" (מאיה שוורץ, Designit)
״העבודה עם Sketch בהחלט ייעלה את תהליך העבודה שלי. היכולת לבצע את רוב הפעולות הנפוצות עם מקלדת פשוט שווה הכול (מעבר בין שכבות, ניווט פנימה לתוך צורות מורכבות ועוד).״ (עוז פנחס, Google ,Waze)
"כשעובדים עם תבניות וסמלים העבודה הופכת להיות יותר מהירה ופשוטה בעיקר כשיש צורך להתרחב למסכים חדשים״. (עדי דידי ענבר, Gett)
הפיצ'רים שהופכים את Sketch לעוצמתית
כששאלנו את המעצבים מהו הפיצ׳ר הכי מדהים של Sketch התשובות היו חלוקות והתחרות הייתה קשה. אין ספק שאחד הפיצ׳רים המדהימים הוא ה- Resizing החדש שמאפשר שליטה באלמנטים בקבוצות כמו מתיחה, קיבוע, שינוי גודל וציפה. הפיצ׳ר הזה מספק המון ערך בעיקר בעבודה על פרויקטים מרובי רזולוציות.
בנוסף, המעצבים אוהבים מאוד את העובדה שהתוכנה מאפשרת יכולות מדידה ויישור של אובייקטים באופן אוטומטי בתהליך העיצוב, דבר המאפשר להגיע לרמת דיוק גבוהה באופן אוטומטי.
גם האפשרות לשחזור גרסאות ישירות מתוך התוכנה חשובה מאוד למעצבים. אך אין ספק שהפיצ׳ר האהוב ביותר הוא יצוא של מסכים וחיתוכים בקלות לכל הרזולוציות והפורמטים הנחוצים.
"ה- Resizing החדש! -ביצוע מינימליסטי ופשוט לפיצ׳ר מאוד נדרש, שעדיין בתחילת הדרך אבל כבר מספק המון ערך." (ניר קוסובר, Wix)
"ייצוא חומרים. כל כך פשוט ומהיר. רק זה שווה את המעבר." (רן סגל, The nuSchool)
״בעבר העברתי הרבה זמן במדידות ושינויים קטנים בכדי להגיע לרמת דיוק גבוהה. סקץ' נותן יכולות מדידה, מרחקים ויישור של אובייקטים, שמשתלבות באופן טבעי בתהליך העיצוב. אני מסוגל להתנסות ולהזיז אלמנטים כל הזמן ועדיין לשמור על מרחקים שווים ומדויקים, כך שבסוף העבודה אין לי צורך לחזור ולבדוק את כל הרווחים.״ (עמרי דביר, Facebook)
"קיצורי המקלדת, חד משמעית". (עוז פנחס, Google, Waze)
״היכולת לייצא מסכים וקבצים בקלות בכל רזולוציה ופורמט אפשרי״ (מאיה שוורץ, Designit)
פלאגינים : החברים הטובים ביותר של המעצבים
אחד היתרונות האדירים של Sketch הוא שיוצאים פלאגינים חדשים ספציפית עבורה באופן יומיומי. הפלאגינים פותרים מגוון בעיות שאנו מתמודדים איתן, כך שבכל פעם שיוצא פלאגין חדש יש לפחות מעצב אחד מאושר יותר.
אחד האתגרים שלנו, המעצבים, הוא העבודה מול המפתחים האחראיים על מימוש העיצובים שלנו. פה בדיוק Zeplin נכנסת לתמונה. האפליקציה מאפשרת יצירה של StyleGuide איכותי, מסודר וחשוב מכל – אוטומטי, דבר שחוסך לנו שעות רבות של עבודה טכנית. אין ספק שזהו ה – Plugin האהוב ביותר על המעצבים.
למקום השני הגיע Craft, שהוא התוסף האולטימטיבי לעדכון נתונים וטקסטים בקלות באופן רוחבי בכל עמודי הפרויקט שלנו. כאשר אנחנו יוצרים אב טיפוס (Prototype) לצורך הצגה ללקוחות, לביצוע בדיקות משתמשים או לכל מטרה אחרת, אנחנו רוצים לייחס אמינות לעיצוב שלנו ולהקנות לו תחושה של מוצר אמיתי. במקום להזין את התכנים ידנית, Craft מציע לנו פיתרון מהיר וקל.
עוז פנחס יצר פלאגין שעוזר לנו לחתוך לרזולוציות שונות. הפלאגין מאפשר לייצא חיתוכים במהירות בעזרת שימוש בהגדרות מוכנות מראש עבור כל פלטפורמה ובקיצור מקלדת בשביל "לנגן" את הייצוא שוב כל פעם כשמתווספים או משנים חיתוכים.
"כל מפתח שהראתי לו את Zeplin לא הסכים לעבוד בשום צורה אחרת, היא חוסכת ימי עבודה ארוכים ומתישים של הגדרות ועוזרת לשני הצדדים להתקדם מהר. Zeplin עוזרת למפתח לקבל את המסכים בצורה מהירה עם כל המידע שהוא צריך ולמעצב לעבור הלאה לעיצוב המסכים הבאים., (מאיה שוורץ, Designit)
״כל התהליך אל מול הפיתוח שכולל יצירת Style guides וייצוא Assets גזל זמן יקר והשאיר חורים פתוחים בתקופת פוטושופ. היום עם Zeplin פשוט מעלים את הקובץ והכל עובד חלק עם המפתחים" (עדי דידי ענבר, Gett)
"ללא כל ספק Craft הוא הפלאגין הכי שימושי. אם קודם דיברנו על קיצור זמני עבודה, אז אני חושב של- Craft חלק גדול בזה. Craft הוא מזוודה של כלים סופר שימושיים שמאפשרים לך לעצב עם תוכן אמיתי, לשכפל תבניות בעיצוב ועוד" (אייל צורי, Muzli)
כולם בפנים : Sketch משפרת את תהליך העבודה של צוותים גדולים
פעמים רבות מעצבים הם חלק מצוות שכולל כמה בעלי תפקידים שעובדים על מוצר אחד. העבודה המשותפת יכולה להתנהל מול מעצבים וגם מול בעלי תפקידים נוספים כמו אנשי תוכן, אנשי שיווק ומנהלי מוצר שלהם יש מעורבות בתוצרים.
המעצבים שעובדים בצוותים מספרים ש – Sketch נותנת פתרון לפרויקטים גדולים כיוון שניתן לייצר טמפלייטים בקלות ולהטמיע אותם בקובץ העבודה וכך לשלוף ישירות אלמנטים ולשמור על אחידות המוצר. כיוון ש – Sketch מייצרת קבצים במשקל נוצה, אין צורך להחזיק המון קבצים שונים עבור סטייטים של אותו מסך. ניתן לשמור הכל בקובץ אחד.
גם היכולת להעביר מסכים וחיתוכים בקלות ל – Slack מאפשרת שיתוף פעולה בצוות ויכולת לקבל פידבק מהיר על העיצוב וכך לקדם את הפרויקט בצורה מהירה יותר עם כמה שפחות סבבי תיקונים.
"אני חושב שמעבר לעבודה משותפת עם מעצבים, Sketch מאפשר עבודה משותפת עם בעלי תפקידים נוספים בצוות, מה שמעניק לכולם יכולת להשפיע ולתרום לתהליך העיצוב. לעיתים קרובות עורכת התוכן איתה אני עובד עורכת את התוכן ישירות על קובץ ה- Sketch, או כותבת הערות על המסמך. הקלות שבה כל אחד יכול ללמוד להשתמש בתוכנה גורמת לכך שכל אחד יכול להשתתף בשלבי הבניה והעיצוב באופן אקטיבי, במקום לחכות לקובץ JPG." (עמרי דביר, Facebook)
"אנחנו נמצאים בתהליך הטמעה של Sketch ככלי עיקרי בחברה. כיום בערך חצי מהסטודיו UX שלנו משתמש ב – Sketch. אני חייב להגיד שנראה שטמפלייטים וספריות ה – UI שלנו עוזרים למעצבים לעבוד מהר יותר ומדוייק יותר." (ניר קוסובר, Wix)
"גם כשיש קונפליקטים נקודתיים עם דרופבוקס/דרייב, נורא קל להיכנס ולבדוק מה השתנה ופשוט לגנוב את הארטבורד הספציפי." (עוז פנחס, Google ,Waze)
אי בודד וקיצור מקלדת אחד
מעצבים הם חובבי קיצורי מקלדת ואפשר להבין אותם, הם מקצרים לנו את זמן העבודה ומאפשרים לנו לבצע פעולות שונות בנינוחות וללא צורך בתזוזות מיתרות. לחלקם היה קשה להחליט על קיצור מקלדת אהוב אחד.
ניר קוסובר מוויקס חושב שהקיצור הכי שימושי הוא אפשרויות הזום 2,1,0 + ⌘
ו – ⌘ + Click – לבחירת אלמנטים בתוך Group
עוד פייבוריטים של ניר הם: Control + C – – קולור פיקר, – Shift + Cmd + R – רוטייט וכמובן Cmd + D אחרי שכפול עם Alt.
קל מאוד להגדיר קיצורי מקלדת אישיים לכל פקודה ב – System Preferences של Mac וזה יתרון מדהים. את קיצור המקלדת האהוב על עוז הוא הגדיר בעצמו לאחת הפעולות הנפוצות אצלו – מרכוז בצורה אנכית או אופקית של 2 שכבות או יותר. ⌘ + [
רן סגל מעדיף את הקיצור ⌘ + Alt + Up/down כדי להעלות או להוריד שכבות
מאיה שוורץ משתמשת בהרבה קיצורי מקלדת, כאשר העיקרי שבהם הוא: ⌘ + shift + c/v.
קיצור המקלדת החביב על אייל צורי הוא Copy Style : Alt + Cmd + C, שמאפשר לנו להעתיק ולהדביק את כל הסגנונות העיצוביים בקלות ובמהירות.
"הבנייה של הסטיילים כל כך נוחה: הגדרה של stroke, fill וכו' באותה צורה (תמונה, הצללות, גרדיאנטים…), ההעתק והדבר של סטיילים זה מאסט". (מאיה שוורץ, Designit)
״אני חושב שהאותיות התחילו לדהות מכפתור ה – Alt במקלדת שלי מרוב שימוש. לחיצה על מקש ה – Alt ועל האובייקטים במסך מאפשרת תצוגה של Guidelines שמראה את המרווחים בין האובייקטים השונים על גבי מסמך העבודה. עבודה ללא האפשרות הזאת היא כמו לנסות לדייק בעיצוב לפי זווית הכוכבים או כיוון הרוח.״ (עמרי דביר, Facebook)
השורה התחתונה
כמעצבים, אנחנו מעדיפים להשקיע את הזמן שלנו בעיצוב. בדיוק בגלל זה אנחנו יודעים להעריך את מגוון הבעיות העצום ש – Sketch פתרה בתהליכי העבודה שלנו ואת המהפכה שהיא יצרה בתחום. Sketch מציעה פתרון שהוא ברמת לחיצת כפתור ללא מעט פקודות שבעבר היו מסורבלות, היא מקצרת זמני עבודה, מתאימה לעיצוב רספונסיבי מרובה פלטפורמות, מאפשרת ייצוא קבצים ואלמנטים גרפיים בצורה פשוטה ומהירה יותר, ומייעלת את תהליך העבודה מול מפתחים.
אנחנו ב – crea+e מאוד מאמינים ב – Sketch וביכולת שלה להעצים ולפשט את תהליך העבודה ואת התוצר הסופי. אנחנו מלמדים את סביבת העבודה ואת הדרך הנכונה לעבוד איתה על פי דרישה בצוותי העיצוב של החברות הגדולות בישראל.
החל משבוע הבא אנו פותחים את ההרשמה לתוכנית לימודים קצרה וממוקדת למעצבים מנוסים שרוצים להתקדם ולעבוד עם Sketch, ללמוד שיטות עבודה נכונות למוצרים דיגיטלים ולהכיר את כל הכלים המתממשקים אליה.
מי שמעוניין בפרטים נוספים ובתוכניה מלאה מוזמן ליצור איתנו קשר במייל: info@createfuture.co.il
או לשלוח אלי הודעה ישירה.
אם אתם מתעניינים ורוצים ללמוד עוד ולקבל עדכונים שוטפים על Sketch, אתם מוזמנים לעשות לייק לעמוד הפייסבוק שלנו.