‫UXtasy‬

‫על ימים לא ברורים‬

‫ויטלי מיז'יריצקי‬ — Sat, 12 May 2012 12:47:36 +0000

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

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

תרימו יד כל מי שחושב שהוא פועל בימים א', ב', ו-ד'. תודה, אפשר להוריד.

עכשיו שירים יד כל מי שחושב שהוא פועל בימים ג',ה', ו' ובשבת. תודה.

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

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

המסך הראשון בתהליך הגדרת התוכנית, זה שמגדירים בו את השעה – וזה שקודם למסך מעלה – נראה כך:

אילו הייתי עורך את ההצבעה כאן, היינו מקבלים תוצאות חד משמעיות – כולם היו אומרים שהימים הפעילים הם א', ב', ו-ד'. והם היו צודקים.

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

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

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

כשיש לנו פריט פעיל אחד מתוך כמה שאינם פעילים, חיינו די קלים. פשוט נותנים לו צבע אחד, ולכל הפריטים הכבויים – צבע אחר. את הפוסט הזה אני כותב בתוכנת Windows Live Essentials, וב-Ribbon שלה אני רואה למשל את החלק הבא:

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

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

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

– או באמצעות קו המתאר (אייבורי מחשבים)

– או אפילו בקו אופקי קטן שאינו באמת מחבר את הטאב לתוכן, אלא רק ממחיש את הקשר בין הטאב הפעיל לטאב הלא-פעיל (Play.google).

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

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

זה בדיוק מה שעשו במסך השני, ועשו את זה טוב.

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

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

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

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

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

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

In other news

א' – אני ממשיך לחפש מעצב/ת לצוות שלי. הנחה לקוראי הבלוג ולחבריהם. על כן, הגישו והפיצו.

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

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

פוסטים קשורים

‫דרוש/ה מעצב/ת ממשק‬

‫ויטלי מיז'יריצקי‬ — Wed, 02 May 2012 06:29:54 +0000

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

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

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

יתרון נוסף הוא היכרות טובה עם טיפוגרפיה.

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

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

נדרשת היכולת לעבוד בצורה עצמאית.

על התפקיד

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

על החברה

Mediamind (לשעבר Eyeblaster) היא חברת היי-טק ישראלית-שהפכה-לבינלאומית המספקת פתרונות ניהול וניטור של קמפיינים פרסומיים ברשת. במדיהמיינד מועסקים קרוב ל-500 עובדים. לפני כשנה נרכשה מדיהמיינד ע"י ענקית הפרסום האמריקאית DG, שעוסקת בתחומים מקבילים בתעשיית הטלוויזיה, הרדיו והפרינט. משרדי מדיהמיינד בארץ יושבים כאמור בהרצליה, ובחו"ל קיימים משרדים ב-40 ערים נוספות בכל העולם.

מה צריך להעביר

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

פוסטים קשורים

‫בלשות בלשנית‬

‫ויטלי מיז'יריצקי‬ — Wed, 04 Apr 2012 08:04:52 +0000

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

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

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

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

לטובת דוברי הרוסית שבקהל:

המקור באנגלית אומר "Customers also bought".

בכמה דקות של מחקר לא הצלחתי להבין מאיפה זה מגיע. בהתחלה חשבתי שהם הלכו לגרסה הרוסית של אמאזון והעתיקו משם, אבל א' – באמאזון רשום "Customers who bought this item also bought", כלומר ללא אזכור של ספרים, וב' – מסתבר שאין לאמאזון ממשק ברוסית.

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

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

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

בקיצור, אין לי מושג. אשמח לשמוע תאוריות .

פוסטים קשורים

‫צנח לו צלצל‬

‫ויטלי מיז'יריצקי‬ — Sat, 31 Mar 2012 18:15:17 +0000

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

ישראלים שרוצים לרשום באנגלית מילה עברית המכילה "צ", משתמשים במגוון טריקים – רושמים את האות Z, או את הצירופים TS או TZ. שני האחרונים די מובנים כי הם מפיקים צליל די דומה למה שנדרש. הרעיון להשתמש ב-Z הגיע כנראה מגרמנית, שבה כך באמת הוגים את האות (ולכן המילה zimmer הולידה את "צימר" הישראלי – כשבגרמנית פירושה הוא פשוט "חדר", לאו דווקא עם ארוחת בוקר או ג'קוזי מג'וייף).

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

והיית חושב שזה די ברור ולא אמור להפתיע אף אחד, אבל לא – אני די בטוח שזה כן יפתיע את בעליה של חנות אינטרנט מסוימת למכירת טלפונים סלולריים. הוא רצה שם מתחם טוב וזכיר שמשדר לעולם "אני מוכר טלפונים סלולריים". בפועל, הוא קיבל שם שמשדר "אל תתקרבו לחנות שלי, אנחנו מתייחסים חרא ללקוחות". www.zilzul.co.il. אין על זילזול, הכי טובים.

פוסטים קשורים

‫נעשה תקליט מגניב‬

‫ויטלי מיז'יריצקי‬ — Sat, 24 Mar 2012 21:25:26 +0000

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

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

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

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

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

פוסטים קשורים

‫אלבום תאילנד‬

‫ויטלי מיז'יריצקי‬ — Sat, 17 Mar 2012 11:13:44 +0000

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

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

גם זה בשדה התעופה.

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

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

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

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

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

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

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

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

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

1. למה אין קו תחתון מתחת ללינק יצירת קשר?

2. אה, רגע, זה לא יכול להיות לינק. אז למה אין מספר טלפון?

3. יש פה בעיית kerning (ריווח אותיות) קשה, המרחק בין שתי המילים הוא כמו המרחק בין האותיות במילה.

4. למה האותיות מופנות אל החוף? מי שרואה את זה מהחוף כבר נמצא פה גם ככה, אבל מי שמגיע בסירה יראה את זה בכתב ראי.

ואז הרוח הסיטה את הדגל, וסליחה על זה שהתמונה יצאה מרוחה.

5. פאק.

6. ביליתי הרבה יותר מדי זמן בהתעסקות עם אתרים.

פוסטים קשורים

‫תמרורים חדשים‬

‫ויטלי מיז'יריצקי‬ — Sat, 18 Feb 2012 16:01:27 +0000

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

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

את ההדגמה נעשה על האתר היפהפה הבא:

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

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

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

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

לחשוב קדימה

תראו את תפריט הניווט הראשי.

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

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

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

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

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

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

לא לחשוב קדימה

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

בראש האתר אפשר לראות שדה חיפוש. חוץ מלראות אי אפשר לעשות איתו הרבה, כי זו רק תמונה, הנה היא:

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

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

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

פוסטים קשורים

‫כינוס איגוד האינטרנט הישראלי‬

‫ויטלי מיז'יריצקי‬ — Mon, 13 Feb 2012 20:44:09 +0000

הודעת מערכת: קוראי הבלוג זכאים ל-20% הנחה בקניית כרטיס לכינוס האינטרנט הישראלי. לקבלת ההנחה יש להתקשר למרכז הרישום בטלפון 03-9727406, לציין את קוד ההנחה 233900, ולעבור מבחן קצת בהיכרות עם הבלוג (לא באמת). הכינוס מתקיים ב-21.02.2012 בירושלים. התכנית בלינק למעלה.

ועכשיו שמישהו יסביר לי מדוע כולם עושים כנסים, ורק איגוד האינטרנט הישראלי עושה כינוסים .

פוסטים קשורים

‫נעשה אתר מגניב‬

‫ויטלי מיז'יריצקי‬ — Fri, 10 Feb 2012 21:47:56 +0000

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

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

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

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

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

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

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

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

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

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

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

אבל הגרסה העברית של ההודעה מנוסחת כך:

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

פוסטים קשורים

‫על אפסים‬

‫ויטלי מיז'יריצקי‬ — Sat, 28 Jan 2012 14:09:41 +0000

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

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

השאלה הציתה תהליך קצר של reverse engineering לשתי המקלדות, שאותו אני רוצה לסכם (טוב, למעשה להרחיב) כאן בצורה יותר קוהרנטית.

מדוע הספרות במחשב מסודרות דווקא בצורה הזו?

אנחנו מאוד אוהבים מספרים עגולים. מאוד. זאת הסיבה לקיומו של עצם המושג "לעגל" – אנחנו מוסיפים או מחסירים מהמספר הקיים כך שיהיה קרוב למספר הקרוב ביותר שמסתיים ב-0. לכן נראה שהספרה המוקלדת ביותר בעולם היא 0, ואני מהמר שההפרש בינה לספרה השנייה הכי מוקלדת הוא עצום ורווי אפסים. למעשה אני לא בטוח שבכלל יש מקום שני בתחרות הזו, כי רוב הסיכויים שכל שאר הספרות מוקלדות בערך באותה התדירות. (כשחיפשתי ססטיסטיקות אמיתיות לגבי הנושא הזה – ולא מצאתי – נתקלתי במשהו שנקרא חוק בנפורד, שאומר שכשמסתכלים על מספרים בעולם, הספרה התחילית הנפוצה ביותר היא 1, אחריה 2 וכך הלאה. מסתבר שהחוק הזה משמש באיתור אוטומטי של דפוסים חשודים בדו"חות כספיים וכד'. אבל הוא מדבר רק על הספרה הראשונה במספר, ולא על תדירות הספרות באופן כללי, ו-0 בכלל לא מופיע בטבלאות האלה). בקיצור, אפס שולטטטתתת!!!000111.

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

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

מדוע הספרות בטלפון אינן מסודרות בצורה כזו?

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

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

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

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

אז מה עם ההגיון?

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

גם כאן, כמה סיבות.

דבר ראשון, בטלפון יש לנו אותיות על גבי המספרים, ובמחשב – לא. עדיף שסדר האותיות יהיה זהה לסדר הספרות – ששתי הסדרות יתקדמו באותו כיוון, ולא משנה אם זה ימינה או שמאלה. אחרת זה יהיה די מוזר אם ABC יישבו על ה-9, ו-WXYZ יישבו על ה-1. וזה משאיר לנו שתי אפשרויות – או שמתחילים את הספרות מלמעלה ומנתקים את ה-1 מה-0, או שמתחילים את האותיות מלמטה. סדר הקריאה והסריקה הרגיל שלנו הוא מלמעלה למטה, לכן אלף-בית שהולך כלפי מעלה ייראה מאוד לא טבעי. לכן האפשרות הראשונה לוקחת, האותיות מתחילות מלמעלה, ואיתן גם הספרות.

סיבה נוספת היא האחידות עם מודל החיוג שקדם למקלדת, ושמו החוגה (לכן "חיוג", אגב).

תראו איזו המצאה מפגרת:

ממש "ללכת עם (סמארטפון), להרגיש בלי".

בחוגה ה-0 הוא הספרה האחרונה ברשימה, והוא הכי רחוק מה-1. ולמה זה? זוכרים את גלגל המזל, איך שהוא הסתובב עם קליקים כאלה? בעצם על מה אני מדבר, מי שזוכר את גלגל המזל בטח זוכר גם את החוגה עצמה. אז החוגה הסתובבה ועשתה קליקים. לפי הקליקים המכשיר ידע מה המספר שחייגנו. 1 עשה קליק אחד, ו-8, בצורה לא מאוד מפתיעה, עשה שמונה קליקים. מי שנדפק בסיפור הזה היה ה-0, כי נורא קשה לעשות אפס קליקים. ומספרים 1-9 היו תפוסים, לכן הוא עשה 10 קליקים – והוא היה המספר העשירי בחוגה.

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

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

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

שבוע טוב!

פוסטים קשורים

‫מה שאנחנו לא יודעים שאנחנו יודעים‬

‫ויטלי מיז'יריצקי‬ — Mon, 02 Jan 2012 21:20:21 +0000

דונלד הנרי ראמספלד, שר ההגנה לשעבר של ארה"ב, אמר במשפט מפורסם:

There are known knowns; there are things we know we know.
We also know there are known unknowns; that is to say we know there are some things we do not know.
But there are also unknown unknowns – there are things we do not know we don't know.

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

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

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

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

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

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

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

פוסטים קשורים

‫טעות נפוצה‬

‫ויטלי מיז'יריצקי‬ — Tue, 20 Dec 2011 20:56:02 +0000

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

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

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

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

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

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

המצגת שלי ושל שאר המרצים באירוע UX on Beer השני.

המצגת שלי באירוע UX on Beer הראשון.

פוסטים קשורים

‫שינויי מזג האוויר הביאו אותי לחשוב‬

‫ויטלי מיז'יריצקי‬ — Sun, 27 Nov 2011 20:44:04 +0000

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

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

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

-What country are you from?
–What?
–"What" ain't no country I've ever heard of.

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

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

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

אז הלכתי ל-nrg.

—-

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

פוסטים קשורים

‫רכבת ההפתעות‬

‫ויטלי מיז'יריצקי‬ — Sat, 12 Nov 2011 09:50:44 +0000

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

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

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

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

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

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

פוסטים קשורים

‫אתרים מבוססי סלוטייפ‬

‫ויטלי מיז'יריצקי‬ — Mon, 07 Nov 2011 18:19:16 +0000

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

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

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

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

תסתכלו על התמונה טוב, אפילו תגדילו לכם אותה (קליק). נפל האסימון?

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