UXtasy
  • ראשי
  • UX בישראל
  • אודות
  • צרו קשר
  • ראשי
  • UX בישראל
  • אודות
  • צרו קשר
UXtasy
  • ראשי
  • UX בישראל
  • אודות
  • צרו קשר
  • ראשי
  • UX בישראל
  • אודות
  • צרו קשר
ראשי » אתרים מגניבים (עמוד 2)

אתרים מגניבים

נתבאג

השבוע, באדיבות אייפייליוקול (הר הגעש בעל השם הלא יוזבילי), נאלצתי לבקר באתר נתב"ג, שזו תמיד חוויה די מפוקפקת. קודם כל, כן חייבים להודות שהאתר מושקע. רואים שהוא מושקע. אחד הדברים שתמיד אהבתי בו זה ההודעה על זה שהוא לא תומך בדפדפנים אחרים מלבד אקספלורר. אני אומר את זה ללא טיפה של ציניות -– אם כבר החלטתם לעשות אתר מוגבל, כנראה עקב סיבות של עלות וזמן פיתוח, אז מן הראוי לחסוך מהמשתמשים את החוויה המעיקה של השימוש בדפדפנים לא נתמכים, ולהגיד להם את זה על ההתחלה. בצורה כזו המשתמש לא יצטרך לקלל ולהיאבק באתר, ויסתפק רק בלקלל (וגם זה רק האידיאולוגיים שביננו). אין הרבה אתרים שיש להם את האומץ לחסום לחלוטין את הגישה לדפדפנים לא נתמכים, הרוב אומרים שהמשתמש יסתדר, ואולי הוא בכלל לא ישים לב. ייתכן שהאומץ נובע מן העובדה שהאתר הוא למעשה מונופול ואין דרך נוחה אחרת להשיג את המידע, וייתכן גם שההחלטה לחסום נובעת ממחיר הטעות – האתר מספק מידע בעל חשיבות רבה, ואם משהו יתפקשש בגלל חוסר תאימות דפדפנים, זה לא ייגמר טוב, וראשים יעופו. נו טוב, שום ראשים לא יעופו, אבל יפרסמו כתבה ב-ynet ושם בתגובות ירשמו "אקספלורר שולטטתת!!11" ואף אחד לא רוצה לראות את זה.

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

הבעיה הראשונה צצה בכל פעם שאני צריך להגיע אל האתר של נתב"ג. העניין הוא שאני אוהב לנחש כתובות. יש לי מין קטע כזה, שאני מאמין שכתובות של אתרים חשובים צריכות להיות הגיוניות או לפחות זכירות. פעם, בבלוג אחר, שאלתי: מה מפריע לאנשי נתב"ג לרכוש את אחד הדומיינים הבאים: www.bengurion.com, www.bengurionairport.com, www.bengurionairport.co.il? כנראה שלא הרבה, כי שלושת האתרים פנויים לרכישה מידי מתנחלים וירטואליים (או שיש תרגום עברי ל-cybersquatters ללא קונוטציות פוליטיות?). ורוב הסיכויים שנתב"ג יכול להרשות את זה לעצמו. מכאן אני נאלץ להסיק, שלדעתם הכתובת http://www.iaa.gov.il/Rashat/en-US/Airports/BenGurion/ היא הרבה יותר מובנת, זכירה ואינטואיטיבית מאשר הכתובות שציינתי.

מישהו בתגובות הסביר לי שניתן להגיע אל האתר בכתובת ben-gurion-airport.co.il, מה שהעלה אצלי שאלה אחרת – איך אני אמור לדעת את זה? לא הצלחתי להקליד בגוגל חיפוש שייתן לי את הכתובת הזו, וגם לא באתר עצמו. כנראה שזו כתובת חד-כיוונית – אתה יכול להקליד אותה, אבל לא למצוא אותה.

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

image

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

image

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

image

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

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

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

image

בואו נהיה לארג'ים ונתעלם מהתהייה מהו אחוז האנשים באוכלוסיית היעד שמבינים מה זה קריטריון בהקשר של חיפוש. אבל מה הסיפור עם הכוכבית האדומה מימין לכפתור החיפוש? מה, אתם יודעים שמקובל לשים כוכבית ליד שדה שיש בו שגיאה, אבל אין פה שדה ספציפי כזה, אז החלטתם לשים אותה במקום אקראי בטופס? או שההגיון מאחורי ההחלטה היה "חלה שגיאה בחיפוש אז צריך לסמן את כפתור חיפוש"? או שזה לטובת כל אלה שלא עלה בידם לפענח את הטקסט? פעם ראיתי באתר TED הרצאה של איזה מתכנן ערים אקסצנטרי. הוא הראה תמונה של בניין גדול וממש מדכא ללא חלונות, ואמר משהו בסגנון של "אני לא יודע מי היו האנשים בדיון בו הוחלט על העיצוב הזה, ואני לא יודע היכן הוא התקיים או כמה זמן הוא נמשך. יש רק דבר אחד שאני יודע על הדיון הזה – שהמשפט האחרון בו היה 'Oh, fuck it'". אני סתם מספר את זה, בלי קשר.

ועוד כמה דברים שהצטברו:

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

אתר מגניב ביותר נמצא בכתובת הפשוטה www.IJustMadeLove.com. בניגוד לאיך שזה נשמע, האתר הוא די חופשי מתכני זימה ותועבה, ואנשים נכנסים אליו מטעמים סטטיסטיים גרידא, כלומר במטרה להעשיר את בסיס נתוני המשגל העולמי. כולל גיאוטאגינג (geotagging), כלומר זיהוי מיקום המשתתפים והצגתו על המפה. יצא לי קצת לעבוד עם אפליקציות מבוססות מפה, ואני חייב להודות שבשימוש כזה מעולם לא נתקלתי. כשלראשונה גיליתי על האתר ועל הקונספט שלו, הייתי בטוח שזה עוד סוג של צ'אט רולט, שנבע מהשיעמום של איזה תיכוניסט. אבל האתר הפתיע אותי לטובה – הוא מאוד מרשים ומעוצב למופת. גם התכנים הבעייתיים יותר (תציצו באזור הסטטיסטיקות) מוצגים בצורה משעשעת ובהחלט לא נגיד "חסודה", אבל סטרילית למדי.

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

אפריל 28, 2010 4 תגובות

על צ'קבוקסים ועל פְרסים

(מי שאין לו כוח לניתוחי UI מוזמן לדלג לחלק האמנותי החווייתי של הפוסט)

ניתוחי UI

אחד הדברים הראשונים שלמדתי כשהתחלתי להתעסק באפיון מפורט של מערכות desktop מורכבות, היה להעריך את אפיון התוכנות של מיקרוסופט. לפני כן קצת הפריע לי שבכל פעם שנדרש לאפיין מנגנון כלשהו, פשוט מעתיקים אותו אוטומטית מאפליקציית האופיס המתאימה. וזה לא קשור לסטנדרטים או להרגלי השימוש המוּכרים  – אפשר לתפור פתרון ייעודי ללקוח תוך כדי הקפדה על הסטנדרטים גם בלי שזה יהיה זהה לאוטלוק. אבל ברגע שמתחילים לאפיין ברמה באמת מפורטת, כזו שבסוף התהליך מתגלה שחסכת ל-QA חצי מעבודת כתיבת התרחישים, אז נאלצים לנתח לעומק את הפתרונות של אופיס ולהבין את ההגיון שמאחורי הדברים. ואז מורגשות אותן אלפי שעות אדם שהחברה משקיעה בהנדסת האנוש של הפרטים הכי קטנים של הממשקים שלהם. זה לא שהכל מושלם (למשל אני עדיין חושב שהפתרון הגראפי של כפתור "שולחן העבודה" מהפוסט הקודם הוא גרוע), אבל רוב הדברים המורכבים מאופיינים למופת.

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

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

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

אפשרויות גופן בוורד

ואתמול נתקלתי בדוגמא נוספת: כשמגדירים כללים באוטלוק, ובוחרים באפשרות "למחוק לצמיתות", היא אוטומטית מדליקה גם את הצ'קבוקס "הפסק לבצע כללים נוספים" (מכיוון שההודעה הולכת להימחק, ולא ניתן יהיה לבצע עליה פעולות נוספות). זה לא נדיר שיש תלות בין שני צ'קבוקסים, אבל במקרים כאלה בדרך כלל יש לזה גם ביטוי גראפי בצורת הזחה (indendation) או קישור אחר כלשהו. כאן לא ניתן היה לנקוט בפתרונות המקובלים משום שהתיבה הנשלטת יכולה לפעול גם בזכות עצמה, או בצירוף עם תיבות אחרות. זאת גם הסיבה לכך שבעוד שהדלקת התיבה הראשונה מדליקה את השנייה, כיבויהּ של הראשונה אינו מכבה את השנייה – המערכת אינה יודעת מדוע השנייה דולקת, וייתכן שהמשתמש הדליק אותה בעצמו בכוונת תחילה.

הגדרת כללים באוטלוק

החלק האמנותי החווייתי של הפוסט

קודם כל, המון המון ברכות לחברת אינקוד-הייפרה על הזכייה בקטגוריה "האתר הנבחר של היום" באתר TheFWA (Favourite Website Awards). למי שלא מכיר, מדובר כנראה באתר המשפיע ביותר בתחום עיצוב אתרים, עם יותר משלושה מיליון ביקורים בחודש. בכל יום הם בוחרים אתר אחד מכל רחבי הרשת, ומציינים אותו בזכות עיצוב "חדשני, יצירתי ופורץ גבולות". לאחר מכן בוחרים מתוכם את אתר החודש ואת אתר השנה.

ב-19 למרץ, החנות האינטראקטיבית למכירת פוסטרים מותאמים אישית, canv-as.com, שעוצבה ופותחה ע"י אינקוד-הייפרה, נבחרה לאתר היום. (תיקון – החנות פותחה ע"י אינקוד-הייפרה ע"פ העיצוב המקורי של בעלי החנות, יהודה אזולאי).

canvas

ולבסוף, אם כבר מדברים על חוויית משתמש, אני רוצה לציין את אתר השבוע האישי שלי – http://lab.andre-michelle.com/tonematrix. אין הרבה מה להגיד עליו חוץ מזה שהוא פשוט ממש ממש כיפי. תוודאו שהרמקולים פועלים. אפשר להקליק ואפשר לגרור עם העכבר. תתחילו באלכסונים. ותהנו.

מרץ 24, 2010 4 תגובות

קישורים

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

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

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

אגב, lynx הוא סוג של חתול-פרא ממש עצבני, שנראה כך:

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

ובכן, הקישורים:

1. אתר ההיכרויות האמריקאי okcupid עוסק הרבה בסטטיסטיקה על-מנת להציע ללקוחותיו את בני-הזוג הפוטנציאליים הטובים ביותר. לפני כמה ימים הם פרסמו מחקר הבוחן את בני הזוג המועדפים על הלקוחות מבחינת טווח הגילאים. הממצאים אינם מהפכניים במיוחד, אבל הגרפים יפים ונגישים מאוד, וגם הנתונים מעניינים. ויש גם מסר חינוכי, כי מְחַברת הפוסט מנסה להוכיח סטטיסטית שאל לנו לגברים לפסול נשים מבוגרות יותר.  מומלץ בעיקר בזכות הגרפים. OKCupid – The Case For An Older Woman.

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

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

פברואר 20, 2010 תגובה אחת
  • 1
  • 2

ux_by_examples

www.bit.ly/uxbe8

מערכת המדיה של אל-על היא ברו מערכת המדיה של אל-על היא ברורה, אינטואיטיבית, חדשנית, לא מפרה שום כלל יואקסי חשוב, ו... בלתי ניתנת לשימוש בעליל. ויש מצב שאפילו עברה בדיקות שמישות. דברים שקורים בשמיים.
חג ח(פי)רות שמח חברים! חג ח(פי)רות שמח חברים!
Follow on Instagram
ויטלי מיז'יריצקי

מנהל, חוקר ומאפיין חוויית משתמש, עוסק בתחום משנת 2006 וכותב עליו מ-2007.

מרצה בקורס הUX של הטכניון בתל אביב. עונה בשמחה על שאלות לגבי הקורס ובכלל.

ממייסדי UXI -- חוויית משתמש ישראל.

מנטור UX ב-Google for Startups.

בעל תואר שני בפסיכולוגיה קוגניטיבית. לא עשה הסבת מקצוע.

יצירת קשר
UXtasy
עדכונים באימייל

uxtasy.com © כל הזכויות שמורות.
We WordPress
גלילה לראש העמוד