ממשק שעובדים איתו כל יום

עיצוב UX/UI למערכות ולמוצרים דיגיטליים

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

מה נכנס לפרויקט

  • מחקר משתמשים ותהליכים
  • זרימות וארכיטקטורת מידע
  • שלדי מסכים ואב-טיפוס
  • מערכת עיצוב

בנינו עם זה

אנחנו מעצבים ממשקים למערכות ניהול, לאפליקציות ווב ולמוצרי SaaS - מהמחקר ועד המסירה למפתחים. העבודה מתחילה בצפייה באנשים שישתמשו במערכת בפועל, ממשיכה במיפוי זרימות ובשלדי מסכים (wireframes), ומסתיימת באב-טיפוס (prototype) לחיץ שבודקים עם משתמשים לפני שנכתבת שורת קוד. כל עיצוב נבנה לעברית ולכיווניות ימין-לשמאל (RTL) מהיסוד, ועומד בתקן הנגישות הישראלי. ומכיוון שב-VOOPS המעצבים והמפתחים הם אותו צוות, מה שאושר באב-טיפוס הוא מה שעולה לאוויר - בלי שכבת תרגום באמצע.

מה זה כולל

מה נכנס לפרויקט עיצוב UX/UI

מחקר משתמשים ותהליכים

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

זרימות וארכיטקטורת מידע

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

שלדי מסכים ואב-טיפוס

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

מערכת עיצוב

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

עברית, RTL ונגישות

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

מסירה לפיתוח וליווי

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

למי זה מתאים

מתי כדאי לפנות אלינו

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

טכנולוגיות

מה שאנחנו עובדים איתו

  • Figma
  • FigJam
  • Design Tokens
  • Storybook
  • Microsoft Clarity
  • axe / Lighthouse
  • WCAG 2.1 / ת"י 5568

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

מהשטח

פרויקטים שבנינו בתחום הזה

לכל תיק העבודות
foody.oweb.co.il/restaurant/hummus-erez-rishon
צילום מסך: FOODIES

FOODIES

מערכת הזמנות וניהול למסעדות

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

beautyhightech.co.il
צילום מסך: Beauty Hightech

Beauty Hightech

יולי רבר - קוסמטיקאית מדיקלית

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

vcard.voops.co.il
צילום מסך: VOOPS Vcards

VOOPS Vcards

מערכת SaaS לכרטיסי ביקור דיגיטליים

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

תהליך העבודה

איך זה עובד בפועל

01

שיחת היכרות

שיחה קצרה שבה אנחנו מבינים מה העסק עושה, מה הבעיה ומה נחשב הצלחה. בלי עלות ובלי התחייבות.

02

אפיון והצעה

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

03

עיצוב ואישור

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

04

פיתוח ובדיקות

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

05

עלייה לאוויר וליווי

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

שאלות נפוצות

שאלות שחוזרות על עיצוב UX/UI

מה ההבדל בין UX ל-UI, ומה מהם אתם עושים?

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

למה לא להתחיל ישר בפיתוח ולתקן את העיצוב תוך כדי?

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

אתם מעצבים גם למערכת שמפתחים במקום אחר?

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

מה שונה בעיצוב ממשק בעברית?

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

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

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

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

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

דברו איתנו

נדבר על הפרויקט שלכם

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

נא להזין שם מלא

נא להזין מספר טלפון ישראלי תקין

נא לכתוב כמה מילים על הפרויקט

הפרטים נשלחים כהודעת וואטספ ל־050-701-0358. ההודעה תיפתח מוכנה - רק ללחוץ שליחה.

שירותים קשורים

מה עוד קשור לזה

פיתוח מוצרי SaaS

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

להעמקה

מאמרים בנושא