תוֹכֶן
כשהתחלתי את הקריירה הייתי מעצב אתרים. עבדתי בעיצוב אתרים במשך ארבע שנים, התחלתי באתרי עסקים קטנים ובסופו של דבר עברתי ללקוחות גדולים יותר. גיליתי שלא העיצוב הגרפי מעניין אותי, וגם לא עובד למען מותגים גדולים יותר. התעניינתי יותר בדפוסי עימוד, באופן שבו אנשים קיימו אינטראקציה עם צורות ודברים כמו ביצועים נתפסים מאשר בעיצוב חזותי של דף אינטרנט.
כשצפיתי בסרטי מדע בדיוני הייתי מסתכל על הממשקים. וכאשר שיחקתי במשחקי וידיאו הייתי מתבונן באופן שבו התפריטים נערכים. אם אחת מהתכונות הללו נשמעת לך מוכרת, ייתכן שאתה גם מעצב ממשק משתמש בנשמה.
עזבתי את עבודתי בסוכנות והקמתי חברה משלי. בדף הלינקדאין שלי ניסיתי לסכם את מטרת הקריירה החדשה שלי: להפוך את התוכנה הטובה ביותר שאפשר. עברו ארבע שנים מאז שהתחלתי כעצמאי, והמסע שלי לא נעצר. בימים אלה אני עוזר בניהול חברת עיצוב UI קטנה בשם מונו. לאחרונה קבלנו את חברנו הצוות הרביעי.
במאמר זה אני רוצה לתאר איך זה להיות מעצב ממשק משתמש, כולל מה בדיוק העבודה כוללת, היכן למצוא את משאבי הלמידה הטובים ביותר, ואיך להשתפר במלאכה שלך.
מה עושה מעצב ממשק משתמש?
אני מוצא שבאופן כללי ניתן לחלק את עבודתו של מעצב ממשקי משתמש לארבע קטגוריות. אתה מתקשר עם הלקוח, אתה חוקר, אתה מעצב ואבות טיפוס, ואתה מתקשר עם המפתחים. בואו נסתכל על כל אחד מהשלבים הללו ביתר פירוט.
תקשורת לקוח
תקשורת לקוח כל עניינה הבנת הבעיה של הלקוח. המטרה היא להתמודד עם העסק של הלקוח שלך, כך שההתחלה של פרויקט מהווה בדרך כלל הרבה דיבורים. זה בסדר לא לדעת יותר מדי על התחום של הלקוח שלך כשאתה מתחיל - אתה יכול להסתכל על העסק שלהם בצורה רעננה בזמן שאתה חוזה פתרונות עיצוביים אפשריים.
כדי להיות מעצב ממשק משתמש טוב, אתה צריך להיות מסוגל לחשוב בסופו של דבר עם העסק של הלקוח שלך. לדוגמה, הלקוח שלך עשוי להיות בתחום התעופה. עבודה אצלם תביא אותך בסופו של דבר לבקיאות בענף זה. לכן, טיפ לאושר שלך כאן הוא לבחור את הענפים שאתה עובד איתם בחוכמה, כדי שלא תהיה מומחה במשהו שלא אכפת לך או שאין לך שום עניין בו.
במהלך פרויקט, התקשורת לא נפסקת. כמעצב, תציג את עבודתך ללא הרף. בחברתנו אנו צוות מרוחק, כך שאין לנו הרבה פגישות אישיות. במקום זאת אנו משתמשים בכבדות בשיתוף מסך באמצעות ועידות וידאו. בכל יום משתמשים בכלי תקשורת כמו Skype ו- Slack.
כדאי לשלב שיטות תקשורת סינכרוניות ואסינכרוניות. שיחה נהדרת אם אתה זקוק למידע רב במהירות, אך עליך להיות בסביבה באותו זמן. אנו רואים את Slack כ"מקרר המים הווירטואלי "שלנו ומשתמשים ב- Basecamp לניהול פרויקטים של עיצוב מורכב. כאשר אנו מעצבים אבות טיפוס באמצעות HTML ו- CSS, אנו משתמשים ב- GitHub Issues כדי לדון בקוד ישירות.
מחקר
כמו גם תקשורת לקוחות, תעשה הרבה מחקר. זה יכול לכלול לימודי שטח, סדנאות עם הלקוח, ניתוח התחרות או הגדרת אסטרטגיה - למעשה, כמעט כל דבר שיעזור לך להבין את הבעיה העומדת בפניך.
המחקר הוא המודיע על בחירות העיצוב שלך. זה מאמר שקראת פעם, או הדבר החדש שאפל הוציאה זה עתה. כשהגיע הזמן להסביר מדוע בחרת בעיצוב מסוים, המחקר שלך מגבה אותך.
המחקר יכול להיות רחב מאוד. לעתים קרובות אני בודק מכשירים חדשים למטרות מחקר או נרשם לאפליקציית אינטרנט חדשה כדי ללמוד על ממשק המשתמש שלה.
עיצוב ואבות טיפוס
כמעצב, סביר להניח שתשקיע את מרבית זמנך בעבודות עיצוב ואבות טיפוס. פרויקט תכנון ממשק משתמש יכול להתקדם בכל מספר דרכים, החל משרטוט, לתכנון מפורט ועד קידוד.
השיטה בה אתה משתמש תלויה במידה רבה בסוג הפרויקט. מה אתה מעצב? האם זה אתר אינטרנט, או שאתה מעדיף לקרוא לו אפליקציה? האם הוא משתמש בטכנולוגיה מקורית? האם זה עיצוב מחדש או שאתה מתחיל מאפס?
בחברתנו אין תהליך קבוע, אך מרבית הפרויקטים עוקבים אחר אותו סדר מחוספס: הם מתחילים בשרטוטים ובמסגרות קוויות, עוברים לעיצוב חזותי ואינטראקציה מפורט ומסתיימים באב טיפוס.
כמעצבים אנו מקדישים זמן רב לחשוב על הכלים שלנו. אמנם כלים נהדרים הם חשובים, אך הם אינם הדבר החשוב ביותר. היכולת להשתמש ב- Adobe Creative Suite ובאפליקציות כמו Sketch במיומנות היא המקבילה ליכולת להשתמש בעיפרון כדי לצייר או במברשת לצייר. אתה עדיין צריך להכין את הציור.
עם זאת, עניין בריא בכלים הוא דבר טוב. אני אוהב לנסות כלים חדשים שיכולים לעזור לי להיות פרודוקטיביים יותר. כלי העריכה הווקטורי המועדף עלי הוא Illustrator, אך רוב עבודות העיצוב החזותי שלי נעשות ב- Sketch בימינו. חברי צוות אחרים עברו לכלים חדשים יותר כמו Affinity Designer.
כלים הם בחירה אישית מאוד. כל עוד אנו יכולים לעבוד ביחד בקלות, כל אחד רשאי לבחור בעצמו. כדי שיהיה יותר פשוט לדבר על העיצובים שלנו עם לקוחות, אנו יוצרים אבות טיפוס באמצעות InVision. עם זאת, לצורך יצירת טיפוס מתקדם יותר אנו משתמשים ב- HTML וב- CSS. הכלי שאתה צריך תלוי בעבודה שאתה רוצה לעשות איתו.
תקשורת מפתחים
חלק שנשכח לעתים קרובות מעבודתו של מעצב ממשק משתמש הוא תקשורת מפתחים. בימים אלה אתה לא יכול לברוח רק מלשלוח את העיצובים שלך אל המפתחים ולקוות שהם יושמו כראוי. מיטב המעצבים יודעים שהאתגר הוא לא ביצירת העיצוב, אלא בתקשורת - לא רק לבעלי העניין שצריכים לתת את אישורם, אלא גם למפתחים שצריכים ליישם אותו.
תקשורת של עיצוב מגיעה בצורות רבות: מפרטים מפורטים, אספקת נכסים, סקירת העיצוב יחד. מה הגיוני לספק בכל מקרה תלוי במידה רבה אם הפרויקט הוא יליד או יישום אינטרנט.
הגישה המסורתית היא לספק נכסים לצד עיצובי המסך. ניתן להשתמש בעיצובי המסך בכדי לראות כיצד ייראה העיצוב בכללותו, בעוד שהנכסים מוכנים לשימוש PNG ו- SVG של סמלים, כך שהמפתחים לא צריכים להתמודד עם עורך גרפי.
בחברה שלנו אנו תומכים לספק יותר מזה. אנו משתמשים במדריכים בסגנון רכיבים כדי לשמור על עקביות בעיצובים שלנו. כאשר אנו עוסקים בפרויקט אינטרנטי, אנו מספקים קבוצות מפורטות של HTML ו- CSS, המתועדות חלק אחר חלק, מוכנות ליישום. אני מאמין כי בעל עין עיצובית בכל שלב בפיתוח תוכנה היא הדרך היחידה להגיע למטרה שלי ליצור תוכנה ברמה עולמית.
אינטרנט לעומת אפליקציות מקומיות
כשאתה מעצב אפליקציה מקורית לפלטפורמה (למשל iOS או Android), אתה נוטה לעמוד בהנחיות מסוימות. כשאתה מעצב לאינטרנט, אין כל כך הרבה הנחיות. מה שקורה בדרך כלל הוא שללקוח שלך יש קבוצה של הנחיות גרפיות עבור המותג שלהם שקובע איך הדברים צריכים להיראות.
עם זאת, ההנחיות הללו נוטות להיות מותאמות לאתרי שיווק, ומה שיש שם לא תמיד מוביל להחלטות טובות על ממשק המשתמש. גופנים נוטים להיבחר מסיבות שיווקיות, ולא מטעמי קריאות. הצבעים עשויים להיות מודגשים ומדהימים, מה שעובד בקמפיין מודעות, אך לא באפליקציה בה אתה משתמש יומיומי. יש לפרש את המדריכים הללו.
יש מעט הנחיות ממשק משתמש באינטרנט. אתה יכול לטעון שהאינטרנט הוא כור היתוך של סגנונות שונים. אם אתה מייצר משהו שמרגיש יותר כמו אפליקציה מאשר אתר, אתה צריך לדעת על מסגרות בשימוש נרחב כמו Bootstrap ו- ZURB Foundation. המסגרת מתחילה לקבוע כיצד הדברים צריכים להיראות, מכיוון שאינך רוצה להמציא את הגלגל מחדש. וזה כנראה דבר טוב.
בחברתנו אנו אוהבים להשתמש ב- Bootstrap. הוא מספק גדלי ברירת מחדל הגיוניים לרכיבי ממשק משתמש משותפים כמו לחצנים, טבלאות נתונים ומודלים.
בעיצוב אתרים אתה מוגבל יותר מהיכולות הטכניות של האינטרנט. פעם זה היה קשה ליישם פריחות חזותיות פשוטות כמו פינות מעוגלות באתר. הימים האלה חלפו זה מכבר - עכשיו אתה חופשי לצייר ממשקי משתמש עם הרבה צללים, מעברים, אנימציות ואפילו תלת מימד.
כמעצב, זה יותר מציאותי לקחת שליטה על התהליך והעיצוב בדפדפן. לא ראיתי הרבה מעצבי ממשק משתמש משתלטים על תכנות ממשק המשתמש של אפליקציה מקורית, אך מעצב שעושה את ה- HTML וה- CSS של אפליקציית רשת הוא תופעה שכיחה. אם תוכל לקודד את העיצובים שלך, תהיה לך יתרון על פני עמיתים שאינם מקודדים, ועבורי זו הדרך היחידה להבין באמת כיצד האינטרנט עובד.
אילוצי אינטרנט
בקרוב תגלה שלא כל הטריקים המגניבים שתלמד נתמכים בכל דפדפן, וזוהי המציאות של עיצוב לאינטרנט. זה טוב לעקוב אחר עקרונות ידועים כמו שיפור פרוגרסיבי, שם אתה טוען תוכן משופר במידת האפשר, אבל גם לחשוב איך התוכן מתכלה.
לאחרונה, 'חיתוך החרדל' הפך פופולרי. מה שמוגדר על ידי צוות האינטרנט של ה- BBC, זה כרוך בהבחנה בין דפדפנים 'טובים' ו'רעים ', ומתן חוויה מוגבלת לדפדפנים' רעים '. עם זאת, זה באמת עובד רק עבור אתרי תוכן.
כשמדובר בחוויות דומות ליישומים, אנשים רבים מגבילים את התמיכה לכמה דפדפנים מובילים בלבד, כדי להקל על הפיתוח. למרבה הצער, זה מחזיר אותנו למצב של 1996 שבו אתה זקוק לדפדפן מסוים כדי להציג תוכן.
שיפור מערך המיומנויות שלך
אז, איך אתה מתעדכן בתעשיית האינטרנט המהירה ומשפר את מערך המיומנויות שלך? בואו נסתכל על כמה שיטות שונות להגברת כישוריכם ...
ידע בפלטפורמה
חלק עיקרי בארסנל של מעצב הוא ידע בפלטפורמה. עליך לדעת על מערכות ההפעלה השונות וכיצד אנשים משתמשים בהן. כמעצבים, אנו נוטים להשתמש במחשבי מקינטוש, אך אז קל לשכוח שרוב האנשים שם משתמשים בתיבות Windows כדי לבצע את עבודתם.
אני מרגיש שאתה יכול להבין באמת רק משהו אם אתה משתמש בו בעצמך. אני מעדיף להשתמש ב- Mac שלי כדי לעצב, אבל מקדיש זמן רב להתעדכן באבולוציה של פלטפורמות שונות אחרות. יש לי כמה עותקים של Windows המותקנים ב- Mac שלי כמכונות וירטואליות. הייתי עסוק בבדיקת מבנים חדשים של Windows 10 באמצעות תוכנית Insider של מיקרוסופט כדי לבדוק את השינויים השונים בממשק המשתמש.
אני גם קונה באופן קבוע חומרה חדשה כדי לבדוק כיצד היא עובדת. קניתי Apple Watch רק כדי לבדוק את הפלטפורמה. אז מכרתי את זה כי הרגשתי שזה לא מוסיף כל כך הרבה לחיים שלי.
בהמשך לכך ניתן לראות באינטרנט את מערכת ההפעלה שלו. זה מתפתח כל הזמן, עם תכונות חדשות שמתווספות לכל ספק דפדפן מדי שבוע. כדאי מאוד לדעת על ההיבטים הטכניים של הדפדפנים, במיוחד לגבי יכולות CSS וגרפיקה. עליכם לדעת מהם SVG ו- WebGL וכיצד תוכלו להשתמש ב- API של אנימציות אינטרנט.
כל פלטפורמה מתפתחת עם הזמן וכמעצב ממשקי משתמש זו המשימה שלך להתעדכן. אחרי הכל, כל מה שאתה מעצב לא חי בבידוד, אלא הוא חלק ממערכת אקולוגית גדולה יותר של תוכנה.
חזור ליסודות
מה שאנחנו נאבקים בו היום לא כל כך שונה ממה שנאבקנו איתו לפני 20 שנה. יש המון עצות טובות בספרים. נסה עיצוב הגנתי לרשת מאת ג'ייסון פריד ומת'יו לינדרמן ואל תגרום לי לחשוב מאת סטיב קרוג בתור התחלה.
אם אתה לא יודע על מושגים כמו שיטות ועיצוב, אתה צריך לקרוא. אתה אמור להיות מסוגל להסביר מה החוק של פיטס. חוק הקרבה של הגשטלט? זהו הלחם והחמאה של עיצוב ממשק המשתמש.
קבל השראה ממשחקים וסרטים
כמעצב ממשק משתמש אני שואב מקורות השראה אחרים לעשות את עבודתי. אני מוצא הרבה השראה במשחקים. יש משחקים מורכבים מאוד, ומעצבי ממשק המשתמש נאלצו לפתור את אותן בעיות ממשק מורכבות כמו מעצב ממשק המשתמש שעובד על פרויקטים עסקיים.
משחקים יכולים גם לסמן מגמות. המינימליזם שנמצא בתפריטים של קולין מקריי ראלי מזכיר לי את הכיוון של iOS7. במובן מסוים, עיצוב האנימציה של ממשק המשתמש שנמצא כעת טרנדי הופיע במשחקים לפני שנים ושנים. המעבר מסקיאומורפיזם לממשקים חשופים ופונקציונליים ו'עיצוב שטוח 'ניכר גם במשחקים. השווה את הנשייה של 2006 עם Skyrim של 2011. שני המשחקים הם RPG באותה סדרה, אך ההבדל בולט.
הממשקים העתידניים בסרטים של מארוול כמו איש הברזל היוו גם השראה עבורי. הם לא בדיוק דוגמאות שמישות, אבל הם כן גורמים לי לחשוב יותר על המחשוב בכללותו. האם אנחנו רוצים עתיד של מסכים, או שאנחנו רוצים שהמסכים ייעלמו? זו כנראה שאלה טובה להציב בפאב מלא במעצבים.
אתה גדל כמעצב באמצעות עבודה קשה, התמדה, דיבור עם בני גילך וקריאה הרבה מאוד. לפני כשנה קראתי מאמר ב"ניו יורק טיימס "על אנשים שנמצאים בשנות ה -80 לחייהם וממשיכים לחדד את מלאכתם. אני מרגיש שאני רק מתחיל. מה איתך?
