מהפיכת המובייל בהחלטת שינתה את פני הגלישה באינטרנט וכולם כבר יודעים שרוב זמן הגלישה שלנו מתבצע דרך הטלפון. זה שגרם לכמה חוקרי UI UX ללמוד כי יש לאמץ גישה חדשה. וגישה זו תשנה את תהליך החשיבה בפיתוח ממשק משתמש, והיא לחשוב קודם כל על הממשק כמותאם למובייל
על מה אדבר במאמר זה, ואילו דברים אתם תפיקו ממנו
- אימוץ הגישה של mobile first כטרנד הכי עכשווי בעולם העיצוב (נכון 07.2016). כך שיעמיד אתכם בעכשויים ולא מיושנים בעיני לקוחותיכם.
- שימוש בעקרונות עיצוב למשתמשי מובייל ליצירת עיצוב נכון ומדוייק.
- שיטות וכלים שישדרגו את העיצוב שלכם וכמובן את תהליך יצירת העיצוב בכל עבודה שתעשו.
- סיכום קצר + מה צופה לנו העתיד.
אימוץ הגישה של Mobile First
מי שחובב עיצוב בטח כבר נתקל באתרים שיש להם תפריט כזה:
האייקון הזה אומץ אצל אתרים לאחר שקיבל ביטוי גבוהה במובייל. עוד מעצבים הבינו כי השימוש במובייל ממושך יותר וזמין יותר למשתמש ולכן יש צורך בחשיבות גבוהה בתכנון העיצוב. למעשה הפכו את הגישה של עיצוב אתרים והתאמה למובייל ואימצו גישה שקודם כל העיצוב יתבצע עבור משתמשי מובייל ואז נעשה התאמה לגרסת דסקטופ .
הגישה הזו גורמת להשפעה גדולה לעיצוב לדסקטופ ומקבלת ביטוח בעיקר באזור התפריט ואורך הגלילה (מה שלא היה קיים בשנים שלפני המובייל). חשוב לציין כי הגישה גורמת למעצבים לחשוב על פרטים נוספים במובייל ולפעמים גם להתעלם מפרטים אלו בגראסת המחשב. למשל: אין הוברים המובייל, המסך צר, כפתורים גדולים ושימוש רב באייקונים ועוד... ואז שמגיעים לעיצוב המותאם למחשב, לפעמים מקבלים אתרים מאוד מאוד מנימלסטים, לרוב זה נעים וכייף למשתמש כך לפעמים מקשה עליו גם מונע ממנועי החיפוש לאנדקס את האתר כמו שצריך (ראו פוסטים על קידום אתרים ואוטימיזציה אם נושא זה מעניין אתכם).
שימוש בעקרונות עיצוב למשתמשי מובייל ליצירת עיצוב נכון ומדוייק.
עיצוב למובייל דורש דיוק רב יותר, מכוון שאנחנו יודעים כי המשתמשים הם הרבה יותר עסוקים ולא יושבים מול מחשב רגועים עם זמן לקרוא מה האתר שלכם מציע, במובייל המשתמש לרוב בדרך או מצפה למצוא משהו במהירות. יותר מזה יש לנו אתגר נוסף, שמחייב אותנו להתמודד עם מסך של 5-6 אינץ. במסך הזה אנחנו צריכים להעביר את המסר בשביל שהגולש שלנו יבצע את הפעולה הרצויה. אז מה עושים? קודם כל הייתי ממליץ לקרוא את המדריך לעיצוב אפליקציות. שם אני מדבר גם על העקרונות הללו אבל כמובן שאחזור עליכהם כי יכול להיות שגם אתם בטלפון באמצע הדרך לאנשהו ולא בא לכם לקרוא מדריך שלם, אלא לקבל את התועלת ממאמר זה.
- אין הוברים (mouse hovers) - בגלל שאין הוברים, אנחנו לא יכול להלציג מידע נוסף שהינו קל וזמין. אבל אנחנו יכולים להשתמש בפופאפים או טול טיפים שאותם המשתמש יכול להפעיל בלחיצה (למשל אייקון של סימן שאלה) ויפתח להם פופאפ קטן עם המידע הרלוונטי עבורו. חשוב מאוד שהמשתמש לא יעבור מסך ושיהיה לו מאוד קל לסגור את הפופאפ.
- כפתור חזור- נכון שיש לאתרים ולמתמשי אנדרואיד אפשרות לחזור, אבל עדיין לשים חיץ מובנה באתר שיחזיר את הגולש אחורנית, תיתן לו הרגשה של אפליקציה ותשפר את החוויה שלו (לרוב למתמשי אייפון).
- תפריטים - הרבה מתכנתים עושים תפריט מותאם בסיסי, כאילו "לצאת ידי חובה" אך זה בעיה הרצינית, מכוון שהגולש רוצה לנווט באתר, תפריט מבולגן לא יתן תוצאה טובה. יש להשקיע מחשבה בנושא התפריט (דוגמה טובה אפשר לראות באתר של יד 2).
שיטות וכלים שישדרגו את העיצוב שלכם וכמובן את תהליך יצירת העיצוב בכל עבודה שתעשו.
השיטה הכי טובה היא השראה. חפשו אתרים שיכולים לתת לכם השארה לפרויקט שלכם. יש לדאוג לשמור את ההשראות שמצאתם במסמך ואפילו לרשום מה האהבתם \איזה חלק מהעיצוב יכול לשמש אתכם לפרויקט החדש.
להלן 3 אתרים שאני אוהב במיוחד:
- pttrns.com
- inspired-ui.com
- pinterst.com
עוד דבר שיש לעשות, הוא לסיים עיצוב של מסך או שניים שהינם עקריים, לשלוח לעצמכם במייל ולבדוק איך זה נראה בפועל, אפילו לשלוח לחבר או שניים ולשאול אותם אם הדברים מובנים ואם לא שיתארו מה בדיוק מפריע להם.
סיכום קצר + מה צופה לנו העתיד.
אוקי אז לסיכום, עיצוב למובייל חד משמעית יותר משפיע בעיצוב האתר הרגיל ולכן תשקיעו יותר בעיצוב למובייל! עוד יותר מזה! הגישה החדשה אומרת להתחיל מעיצוב למובייל וכן שהעיצוב ישפיע על עיצוב האתר. כך שהאתר יהיה דומה יותר לשימוש במובייל.
העתיד כרגע נמצא עדיין בטלפונים. טכנולוגיות חדשות כמו שעונים חכמים, או מציאות רבודה, עוד לא מראים סיבה להעמיק בהם. מה שכן יש לשים לב, זה לשינויים החלים על המובייל, דפדפנים וסוגי מכשירים. טרנדים עיצוביים חדשים ועוד..
בהצלחה!
יש לך מה להגיד? אשמח לתגובה