עמוד בבניה
הסטודיו לעיצוב גרפי - חווית משתמש חכמה.
אנו מאמינים בעיצוב חכם, כזה שהופך את חוויית המשתמש ליעילה פשוטה ומהנה
הסטודיו הגרפי של UI מונה כ-11 מעצבים המתמחים בעיצוב גרפי של ממשק המשתמש.
ביצענו מעל 1500 פרוייקטים:
למגוון סביבות: משרד, בית, רכב ורחוב,
למגוון פלטפורמות: PC, טאבלטים, טלפונים חכמים
למגוון מערכות הפעלה: Windows, Android, iOS, Linux
גם למערכות דסקטופיות/Native וגם למערכות ווביות
גם בגרפיקה פיקסלית וגם בגרפיקה וקטורית
למגוון של עולמות תוכן מאתרי תדמית, דרך אפליקציות ווביות לקהל הרחב, דרך אתרי מסחר אלקטרוני, דרך אפליקציות ארגוניות לארגונים גדולים, דרך אפליקציות יעודיות למומחים בתחום מסוים ועד למערכות שליטה ובקרה ברמת ראשי מדינה.
כל מוצר דורש פתרונות עיצוביים שונים, והתאמת השפה הגרפית לדרישות המשתמש, לסביבת העבודה ולמיתוג. מה שמתאים לנער בן 17 בטלפון הסלולורי, לא מתאים לטאבלט של המנכ"ל ולא מתאים למערכת המחקר של חוקר עסקי.
מהי "גרפיקה חכמה"?
אנו בסטודיו מתמחים בעיצוב גרפי "חכם". זהו עיצוב גרפי שימושי, שנועד לעשות למשתמש את החיים יותר קלים (ויפים).
אנו מאמינים שלא מספיק שהעיצוב יהיה יפה ויזואלית, אלא קודם כל עליו להיות פונקציונלי. לעזור למשתמש להבין את מבנה המסך, להבליט את מה שחשוב, לאזן נכון את העומס הויזואלי בתצוגה, להתחשב בפרמטרים כגון אפיון המשתמש, תנאי תאורה, גודל מסך ורזולוציה וכו.
מעצם היותו סטודיו גרפי בחברה להנדסת אנוש, אנו שמים דגש על עיצוב גרפי ידידותי למשתמש.
בתהליך העיצוב ניקח בחשבון את שיקולי הנדסת האנוש של המערכת, נערוך סיעור מוחות, נאסוף דוגמאות להתייחסות ולימוד (References) ונבצע חשיבה פרטנית על רכיבים ופתרונות עיצוביים נקודתיים.
אז מאיפה מתחילים? או מהו עיצוב קונספט גרפי?
השלב הראשוני ואולי החשוב מכולם הוא שלב יצירת הקונספט הגרפי. פה בעצם תוגדר השפה הגרפית הויזואלית וההתנהגותית של המוצר.
בשלב זה נציע ללקוח מספר סקיצות לעיצוב מסך מרכזי מתוך המערכת (לעיתים שלב זה יכלות גם דוגמא לאנימציה) אשר על בסיסן תעוצב שאר המערכת, הרכיבים, המסכים, האייקונים וכדומה.
מה אנו לוקחים בחשבון בבעיצוב הגרפי?
כאשר אנו מעצבים מערכת, אתר או מוצר, אנו מתבססים על שלושה שיקולים מרכזיים:
- שיקולי הנדסת אנוש (usability) - העיצוב הגרפי נועד בראש ובראשונה לעזור למשתמש להשתמש במוצר. להקל עליו את ההתמצאות, לסדר נכון את ההררכיה במסך, את המידע. להציג בצורה בהירה וקריאה את האפשרויות העומודת לפניו וכדומה. כל זה יעשה ע"י חלוקה נכונה לאזורים במסך, צבעוניות וקונטראסט, גדלי רכיבים וגדלי פונטים, תנועה וסאונד ועוד.
- שיקולים שיוויקיים \ עיצוביים - תפקיד חשוב נוסף של העיצוב הוא להיות פשוט יפה! המוצר צריך להראות עדכני, מעוצב, מתאים לשוק ולקהל היעד, תחרותי ואטרקטיבי. עולם עיצוב המערכות והאתרים מושפע ממגמות שוק (טרנדים) ומשתנה כל הזמן. אנו תמיד שואפים להעניק למוצרים שלנו מראה עיצובי עדכני .
- יכולות פיתוח - זה נכון, הפוטושופ יכול לסבול הכל. אבל בסופו של דבר צריך לזכור שאת העיצוב צריך לפתח לכדי מוצר אמיתי, ובעלות וזמן פיתוח סבירים. לכן אנו מקפידים להיות מתואמים מול צוותי הפיתוח לגבי יכולות ומגבלות מימוש, שימוש ברכיבי צד 3, סביבת הפיתוח ותאימות לפורמטים גרפיים ועוד.
זוז, קפוץ, הסתובב !
בשנים האחרונות הטכנולוגיה מאפשר לממשקים להיות הרבה יותר דינאמיים. המסך מגיב באנימציה לכל נגיעה של המשתמש. אייקונים גדלים וקטנים, מסכים מתהפכים, חלונות מופיעים והכל זז וקופץ.
ללא ספק, זה מגניב! אבל זה גם עלול להיות מעייף למשתמש.
בבואנו לעצב ולאפיין התנהגויות אנימטיביות של ממשק משתמש, עלינו לאזן בצורה חכמה בין עודף תנועה (אשר תעייף את המשתמש) לבין הצורך בממשק דינאמי אטרקטיבי. עלינו להחליט אילו רכיבים בממשק יזזו, לאן, באיזה קצב ומתי.
ההבדל בין תנועה מהירה מדי אשר מעמיסה על המשתמש, לבין תנועה איטית מדי, היוצר תחושה של מערכת מיושנת הוא גדול. פיתחנו מתודולוגיה לאפיון והגדרת אנימציות כבר משלב הקונספט הראשוני של המערכת, ועד להתנהגות אנימטיבית של רכיבים בודדים.
"זה יראה ככה גם אחרי הפיתוח?"
עיצוב המערכות שאנו מייצרים מתחשב בראש ובראשונה עם יכולות הפיתוח, על מנת שהמוצר יראה דומה ככל האפשר לעיצוב המקורי גם לאחר המימוש.
הסטודיו הגרפי של UI מתמחה בעבודת צוות עם אנשי פיתוח.כל עיצוב מבוסס בין השאר על יכולות ומגבלות סביבת הפיתוח הספציפית. אנו שואפים לאזן בין עיצוב גרפי מרשים וייחודי, לבין זמני פיתוח סבירים ליישום העיצוב הגרפי.
צברנו נסיון רב בעבודה מול מגוון רחב של סביבות פיתוח ובמרכזן WPF, .net, HTML5 ועוד.
בתחילת כל פרוייקט מוגדרת רשימת תוצרים ופורמט קבצים אותם נעביר לצוותי הפיתוח.
על כך מסך, בכל גודל - גרפיקה וקטורית
כיום, נעשה שימוש הולך וגובר בגרפקיה וקטורית. זוהי גרפיקה אשר מותאמת טוב יותר לתצוגה על מסכים בגדלים שונים, משולבת תנועה, וזולה מבחינת ביצועי מערכת.
סביבות פיתוח רבות עושות שימוש ברכיבים גפריים וקטוריים וביניהם WPF' Silverlight' Flash' Flex' HTML5 ועוד.
העיצוב הוקטורי מאפשר לנו להשתמש באיורים, אייקונים ופקדים בגדלים שונים על גבי מסכים ברזולוציה משתנה, מבלי לפגוע באיכות הגרפית.
תוצרים גרפיים מותאמים טוב יותר לשילוב תנועה , אנימציה והתנהגויות. כמו גם שילוב skins, והתאמת הממשק למצבי עבודה שונים. אנו בסטודיו מגדירים בתחילת כל פרוייקט את פורמט הקבצים שיימסרו לצוות הפיתוח, ומתכננים מראש את ההתנהגות הוקטורית של רכיבי המערכת.
עיצוב אייקונים
האייקונים אמנם קטנים, אבל יש להם תפקיד גדול. חשיבותם רבה בהפיכת הממשק לידידותי ופשוט, כמו גם בהעשרת השפה הגרפית. כיום, האייקונים גדולים מאי פעם ועיצובם משפיע מאד על מראה המערכת!
ביחד עם זאת, יצירת סדרות של אייקונים הינו תהליך לא פשוט! יש לקחת בחשבון את סוג האייקון (ניווט, פעולה, סטטוס....) את מיקמו על המסך, את תפקידו, ואת מכלול האייקונים האחרים במערכת.
כך נוכל לעצב אייקונים המייצגים בצורה בהירה את תפקידם, פשוטים להבנה, ומותאים לקו הגרפי של המוצר.
We are control freaks !
בסופו של דבר, כל מערכת הינה אוסף של רכיבים וקונטרולים.
בתהליך העיצוב של המוצר, אנו מעצבים בצורה פרטנית כל רכיב קטן כגדול, ומעניקים לו מראה גרפי המתאים לשפה הויזואלית של המערכת. אנו מגדירים את המראה הכללי של הרכיבים, ואת ההתנהגויות שלהם בשלבי האינטראקציה השונים (mouse over, disabled, motion ) ... צוותי הפיתוח יקבלו מאיתנו תאור מפורט של כל מצבי הפקדים השונים של המוצר.
כמו כן, צברנו נסיון רב בשימוש והתחשבות ברכיבי צד 3 של חברות שונות כגון Telerik, infragistics ועוד.
אפיון, עיצוב, פיתוח וייעוץ לאפליקציות מורכבות בכל הפלטפורמות. היכנסו לתיק העבודות שלנו ולמדו עוד!