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

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

מקור: Giphy

מקור: Giphy

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

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

סקירה של כתוביות כיום

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

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

צילום מסך של אפשרויות כתוביות באפליקציית "Amazon video"

צילום מסך של אפשרויות כתוביות באפליקציית "Amazon video"

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

אפשרויות כתובית ב־Amazon Fire TV

אפשרויות כתובית ב־Amazon Fire TV

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

לצערי זה לא בא לידי ביטוי בעיצוב שלהם (אולי הם עובדים על זה).

צילום מסך של כתוביות סטנדרטיות בנטפליקס

 

צילום מסך של אפליקציית כתוביות של נטפליקס

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

צילום מסך של אפשרויות כתוביות ב-"Google Play Movies"

 

כל אופציות הכתוביות בגוגל

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

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

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

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

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

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

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

צל - במקרים מוזרים במיוחד יש חברות שמשתמשות בהצללה במקום רקע או קו מתאר. זה עוד יותר בלתי קריא.

מהירות - הסיבה שקריאות היא כל כך חשובה בכתוביות היא כי  המשתמש צריך לקרוא אותן מהר ולהיות מוכן לכתוביות הבאות שיגיעו. הזמן הממוצע לקריאה של שורת כתוביות הוא בין 3-5 שניות.

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

הצעדים הבאים

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

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

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

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

הכתבה הופיעה במקור באנגלית בבלוג של אבי אשכנזי ב־Medium

כמה לינקים רלוונטיים:
BBC Subtitle Guidelines
Apple Tv Guidelines
Google Material Design
Netflix Timed Text Style Guide



תגובות פייסבוק