שגיא היה הראשון לזהות את סקצ’ כדבר הבא בתחום העיצוב לUI, ווב ולדיגיטל.

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

המחשה של מעבר מפוטושופ לסקצ’

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

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

1. Protoship teleport (Beta)

בעיה נפוצה שקשורה לעבודה על אתרים קיימים – לך תבנה אותם עכשיו מאפס רק בשביל תיקון קטן או הוספה של אזור חדש. נכון שיש עזרים כמו csspeeper(מומלץ) . אבל חייבת להיות דרך קלה יותר. אז כן, יש. להפתעתי הקוד הפתוח של סקצ׳ מאפשר לא רק אקספורט של עיצוביםלhtml אלא גם להפך. התוסף הזה משגר אליכם את עמוד הHTML בלי שתצטרכו לדבר עם המפתח או לשבור את הראש ולדגום צבעים. חובה למעצבי ווב. כמובן שזה בטא ויש לו בעיות עם תמונות ואייקונים- קחו בחשבון.

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

2. Sketch 2 AE

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

למזלי גם אדם פלאף, אנימטור מגוגל, שאחראי על לא מעט פלאגינים באפטר (כולל ריג מעולה בשם rubberhose), גם התרגז ויצר בשנה האחרונה פלאגין שעושה מעבר ללא בעיה מסקצ׳ לאפטר. כמה פשוט? זה פשוט כמו copy-paste – וזה נהיה חשוב במיוחד לאלו מאיתנו שעובדים עם לוטי.

3. Sketch Material

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

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

sketch material plugin

4.   auto-layout – Anima

אם אתם לא מכירים את autolayout, כנראה אתם עוד עובדים קשה בלהזיז פיקסלים.

 

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

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

בהחלט גאווה ישראלית.

5. Sketch Mesure

חברים,  כל מי שלא רוצה לעבוד עם זפלין או אינויזן יש פתרון אוף-ליין! spec for sketch!

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

6. Automate Sketch

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

7. craft

טוב, אז זה באמת סט הכלים אולי הכי שימושיים שיש, חלק יותר וחלק פחות. עד ל2017, invision התרכזו מאד סביב סקצ’. הם פיתחו (או רכשו) סט של כלים שמאפשר לשדרג את העבודה בסקצ ולעבוד עם דאטה או design system, או לבנות prototypes באינויזן. הכלים הכי שימושיים כאן עבודי הם דווקא  Data  וduplicate. אבל הסט השלם הוא עולם ומלואו. יש לאינויזן לא מעט באגים והייתי חושב פעמיים לפני עדכון, אבל עוד לא מצאתי ״מג׳נרט״ תוכן/תמונות טוב משלהם.

8. syntax highlighter

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

9. sync to slides

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

10. rename it

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

11.Sketch isometric

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

איזומטרי

למטיבי לכת

יש עוד המון כלים שפשוט עוד לא הספקתי לעבוד איתם..

30 Essential Free Plugins for Sketch App

 

30 free Sketch plugins to grab right now

 http://sketchhunt.com/plugins/  

עוד רשימות של פלאגינים (חלק מהמוזכרים כבר לא רלוונטי):

 https://awesome-sket.ch

https://v1.designcode.io/sketch-plugins