חדש! Elementor
Experts Network — מצאו שותפים לדרך, קדמו והגדילו את העסק שלכם

דיזיין סיסטם – החיבור המופלא בין מעצבים למפתחים

הדס גולצאקר | אוגוסט 2020

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

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

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

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

  • אלינה חזנובה, מעצבת מוצר באלמנטור שאחראית לכל הקשור לאדיטור ולמוצרים נוספים של החברה. לאלינה ניסיון של 4 שנים בעיצוב מוצר ו-UI/UX בעולמות ה-B2B וה-B2C.  
  • יונתן לב ארי, מפתח באלמנטור ובוגר לימודי עיצוב, דיגיטל וגם פסיכולוגיה. יונתן צבר ניסיון עשיר של 15 שנים בבניית ממשקים ומערכות UI בקנה מידה גדול.

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

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

מה הפירוש של דיזיין סיסטם?

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

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

מה ההבדל בין סטייל גייד לדיזיין סיסטם?

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

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

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

למה אנחנו צריכים דיזיין סיסטם?

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

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

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

מהו התהליך והעקרונות המנחים לבניית דיזיין סיסטם?

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

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

והכי חשוב – הבינו שהפרויקט הזה אינו אישי אלא צוותי. 

מהם המרכיבים ההכרחיים של דיזיין סיסטם?

ישנם כמה דברים בסיסיים שצריכים להיות במערכת של דיזיין סיסטם:

  • ספריית קומפוננטות עיצובית.
  • ספריית קוד עם רשימה של כל הקומפוננטות.
  • Spec שמדבר על הקומפוננטה ומסביר מה צריך להיות בה בצורה ויזואלית וטקסטואלית.
  • אקסטרות כמו שרטוטים, דוקומנטציה, רשימת שמות וכו'.

חשוב מאוד להבין שאין באמת סוף לתהליך של יצירת דיזיין סיסטם. התוצרים שהזכרנו כאן הם הבסיס להתחלה – ומכאן השמיים הם הגבול. 

רוצים להיות כותבים במגזין שלנו?

הדס גולצאקר

מובילת הצמיחה של אלמנטור בישראל, מעצבת, FOODIE ומעריצה של סטפן סגמייסטר

אהבתם? שתפו.
שיתוף ב facebook
שיתוף ב twitter
שיתוף ב telegram
שיתוף ב linkedin
שיתוף ב whatsapp
שיתוף ב email

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

רוצים להיות כותבים במגזין שלנו?

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

רוצים להיות חלק מאלמנטור?

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

בואו לגדול במקום הנכון - בזמן הנכון