הבלוג של איתי אלון

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

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

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

המשותף בין כל מיקרו האינטראקציות הוא שכולן בנויות ומתוכננות ללוות משימה ספציפית. אחת באופן שתפיק את החוויה המקסימלית ואת הקונטקסט הנכון למשתמש.

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

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

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

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

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

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

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

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

אם יש משהו שלמדתי ממיקרו-אינטראקציות, הוא שהמשתמשים שלנו דורשים תחזוקה מאוד גבוהה.

המשתמשים שלנו חסרי סבלנות, הם הופכים להיות מתוסכלים במהירות, ואם משהו אינו ברור מיד הם שמחים לעבור למתחרה אחר בלי הנד עפעף!

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

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

דוגמאות מעניינות למיקרו אינטראקציות בחווית משתמש:

תוצאת תמונה עבור ‪micro interactions‬‏

חיוג מהיר