מאמר

DesignPatterns
יאיר גולן

|

דפוסי עיצוב בחוויית המשתמש

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

 

מהו דפוס עיצובי בחוויית משתמש?

 

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

 

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

הפיתרון: דפוס עיצובי מוכר של הוספה לעגלת הקניות.

 

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

 

breadCrumbs

 

דוגמה טובה לדפוס עיצובי הם פירורי הלחם (Breadcrumbs). בואו נבחן רגע את דפוס העיצוב הזה:  

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

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

 

איך עושים את זה בממשקים מורכבים ועמוסי מידע?

 

– דפוסי עיצוב יכולים להתניע לנו את העיצוב במהירות.

– קודם כל עלינו לאסוף את כל המידע הזה.

– אנחנו צריכים לסדר ולמיין את המידע על מרכיביו השונים

– עכשיו מתחילים לזהות דפוסים ומכנים משותפים בין פיסות המידע השונות

 

למה דפוסי עיצוב טובים לי כמאפיין חוויית משתמש?

 

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

 

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

 

 

למה דפוסי עיצוב טובים למשתמשים שלי?

 

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

 

 

איך לא להשתמש בדפוסי עיצוב

 

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

 

eatingBread

 

 

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

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

 

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

Jenifer Tidwell UI Patterns  

UI Patterns 

Web & Mobile Patterns 

Yahoo Pattern Library 

 

 

לא שכחתי את המעצבים!

 

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

PatternTap

MobilePatterns

Inspired-UI

Pttrns.Com

 

מכירים עוד אוספי דפוסי עיצוב מומלצים? אמרו לנו בתגובות וחלקו את הידע!

אולי יעניין אותך גם: