דילוג לתוכן הראשי
Globalbit

תקציר: גלובלביט תכננה ובנתה את מערכת העיצוב הרשמית של ממשלת ישראל: מאות רכיבים נגישים שנבנו ל-RTL מהיסוד, ב-React,‏ Angular,‏ JavaScript נקי ו-HTML/CSS. יותר מ-5,000 מפתחים בכל משרדי הממשלה אימצו אותה. היא עומדת ב-WCAG 2.1 AA, שוחררה כקוד פתוח, והיא התקן המחייב לכל שירות דיגיטלי של ממשלת ישראל. תקן לאומי מחייב לכל אתרי ממשלת ישראל. יותר מ-5,000 מפתחים אימצו את המערכת. מימוש ב-4 Frameworks: React,‏ Angular,‏ JavaScript נקי, HTML/CSS. נגישות WCAG 2.1 AA מובנית. ארכיטקטורת רכיבים שנבנתה קודם כול לעברית ול-RTL. שוחררה כקוד פתוח. מאות רכיבים מוכנים ל-Production. Themes מבוססי Design Tokens למיתוג של כל משרד. ערכת Figma שמשקפת את הקוד 1:1. תיעוד מקיף למפתחים.

הגדרנו איך ממשלת ישראל מדברת עם אזרחיה בדיגיטל

ממשלת ישראל · מערכת עיצוב
5,000+

מפתחים בממשלה עובדים עם המערכת

קוד פתוח

זמינה לציבור ופתוחה לתרומות מהקהילה

תקן לאומי

מחייב בכל השירותים הדיגיטליים של ממשלת ישראל

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

בונים את הסטנדרט הדיגיטלי של המגזר הציבורי בישראל

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

מה שיצא הוא יותר מספריית רכיבים. זו תשתית לאומית: סטנדרטים, רכיבים, Themes, תבניות, Design Tokens, ערכות Figma ותיעוד מקיף. מפתח בכל משרד מקבל את כל מה שהוא צריך כדי לבנות אתר ממשלתי שעובד בשביל כל אזרח, ב-Framework שהצוות שלו כבר עובד איתו. תשתית, לא קישוט.

[ מה מסרנו ]

סטנדרטים, קוד ותיעוד בארבעה Frameworks

הגדרנו את הסטנדרטים, בנינו מאות רכיבים ב-React,‏ Angular,‏ JavaScript נקי ו-HTML/CSS, יצרנו את ה-Themes והתבניות וכתבנו את התיעוד. מפתחי הממשלה מקבלים הכול, בטכנולוגיות שהם כבר מכירים.

[ 01 ]

מסגרת אחידה ל-UX ולאינטראקציה

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

שכבת מימוש לכמה Frameworks

ספריות ברמת Production ב-React,‏ Angular,‏ JavaScript נקי ו-HTML/CSS. אותם סטנדרטים, כמה סטאקים, בלי פיצול.
[ 03 ]

תבניות אחידות לשירותים ממשלתיים

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

סנכרון מלא בין עיצוב לקוד

Figma, התיעוד והקוד ב-Production נשענים על מקור אמת אחד. מעצבים ומפתחים עובדים מאותה מערכת, העיצוב והקוד לא מתרחקים זה מזה, ויש פחות שגיאות מימוש בכל המשרדים.
[ 05 ]

בקרה על Design Tokens ו-Themes

Design Tokens מרכזיים לטיפוגרפיה, ריווח, צבעים, גריד ותנועה. כל משרד שומר על המיתוג שלו, והמבנה נשאר אחיד בכל הממשלה.
[ 06 ]

מודל אימוץ ותרומה

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

ממחקר ועד פריסה לאומית ב-4 שלבים

[ 01 ]

מחקר וסקר, 3 חודשים

למדנו ממערכות עיצוב ממשלתיות בעולם: GOV.UK הבריטית, USWDS האמריקאית ו-DTA האוסטרלית. עברנו על אתרי הממשלה הקיימים בישראל ומיפינו את מה שייחודי לנו: עברית ו-RTL, חובות נגישות, בקרה משותפת לגופים רבים ותמיכה בכמה Frameworks. תוצר: מסמך דרישות וטקסונומיית רכיבים.

[ 02 ]

הגדרת סטנדרטים, 4 חודשים

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

[ 03 ]

פיתוח ספריית הרכיבים, 12 חודשים

בנינו מאות רכיבים בארבעה Frameworks: React,‏ Angular,‏ JavaScript נקי ו-HTML/CSS. כל רכיב נגיש, בנוי ל-RTL מהיסוד ומתנהג אותו דבר בכל מימוש. מעליהם Themes, תבניות ו-Design Tokens. תוצר: ספריות מוכנות ל-Production לכל סטאק טכנולוגי בממשלה.

[ 04 ]

תיעוד והשקה, 2 חודשים

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

Background

קשה לשמור על UI אחיד בין הצוותים?

בנינו מערכת עיצוב לאומית עם מאות רכיבים בארבעה Frameworks. נעשה סדר גם אצלכם.

[ למה אנחנו ]

למה ממשלת ישראל בחרה ב-Globalbit

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

[ 01 ]

סמכות מוכרת ב-UX

המנכ״ל שלנו הוא מומחה UX בעל הכרה בינלאומית. הממשלה חיפשה סמכות מוכחת בעיצוב אינטראקציה בקנה מידה גדול, ולא עוד ספק פיתוח.
[ 02 ]

מומחיות עמוקה בתשתית של מערכות עיצוב

ערכת UI היא אוסף רכיבים. מערכת עיצוב היא תשתית. ככה אנחנו מתכננים אותה מההתחלה: מודל בקרה, ניהול גרסאות, התאמה מלאה בין Frameworks ואסטרטגיית אימוץ, כשכבה שגדלה עם הארגון.
[ 03 ]

ניסיון בארגונים גדולים תחת רגולציה

אנחנו מכירים את תהליכי הרכש במגזר הציבורי, את דרישות הרגולציה, את חובות הנגישות ואת העבודה מול הרבה בעלי עניין בבת אחת. בתוך מוסדות מורכבים אנחנו יודעים להתנהל.
[ 04 ]

ביצוע בקנה מידה לאומי

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

השקנו את מה שרוב חברות הטכנולוגיה לא מצליחות אפילו להתחיל

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

תקן לאומי רשמי

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

נבנתה ליותר מ-5,000 מפתחים

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

שוחררה כקוד פתוח

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

עמידה אוטומטית בתקן הנגישות

כל אתר ממשלתי שנבנה עם המערכת עומד ב-WCAG 2.1 AA, בלי שורה אחת של עבודת נגישות נוספת. אף אזרח לא נשאר מחוץ לשירות ציבורי חיוני בגלל חסם טכני
[ צרו קשר ]

ספרו לנו מה אתם בונים.

יותר מ-250 ארגונים סומכים עלינו. נחזור אליכם תוך יום עסקים אחד.

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

קבעו שיחת היכרות ←