את עידו דן מציג בפני הקהל בתחילת הערב אמיר נבון, אחד מבעלי סטודיו 6B. זהו ערב מיוחד אשר מהווה את ההתחלה של חלום נושן של סטודיו 6B – לאפשר לימודי המשך עבור תלמידי עבר של המכינה ובית הספר המקצועי וכך הוקם 6B PRO – בית ספר ללימודי המשך למעצבים, שעידו הוא חלק ממנו. במסגרת קורסים שיתקיימו בבית הספר מעצבים יוכלו להתעדכן ולהתקדם.
סדרת הקורסים הראשונה במסגרת לימודי ההמשך תהיה סביב תקשורת חזותית, כיוון שזהו המקצוע המתעדכן ביותר שיש וגם לאחר התואר, עדיין המעצב לא יודע כל מה שהוא צריך לדעת.
עידו דן עומד בראש מסלול זה.
עידו, מרצה בכיר במכון הטכנולוגי ושנקר. בעל ניסיון רב בתחום, בייעוץ ובעיצוב חוויית משתמש ועבד רבות בתעשייה בארץ ובחו”ל.
Design for delight. עצם התרגום של delight – קשה לעצב עונג, התענגות (לוקח למקומות כחולים משהו). על כן, נקרא לזה בעברית – דלייט. על מנת שהקהל ירגיש מעונג – מחלקים קצפת עם תות במהלך ההרצאה.
נתייחס ל-2 היבטים עיקריים בעיצוב דלייט:
- 10 דרכים להוסיף דלייט למוצרים
- איך מצדיקים השקעה בדלייט – ההשקעה של כל דלייט שכזה דורש הרבה מאוד השקעה. על כן, עידו מציין שתמיד יש לנסות לשכנע את האחראים לכך בסוף התהליך.
10 דרכים ליצירת דלייט בעיצוב:
1. גימור ויזואלי visual polish:
כולנו, כמעצבים שונים ומגוונים עושים זאת. ההתייחסות בעיצוב ויזואלי אינה “יפה” או “לא יפה” אלא מידה של עד כמה זה מוקפד.
דוגמאות: נתייחס לאתרים Kyan ו- Path (פת’ מאוד מאוד דומה לפייסבוק, ההבדל שיש בו עיצוב מדהים).
- האתר קיין Kyan:
– גלילה עד סוף העמוד בקלות רבה. מעצבים רבים כיום מעצבים “לגובה”.
– ישנה ירידה לפרטים בצורה דקדקנית ומוקפדת. המוצרים בעמוד עולים ויורדים בכל פעם שעוברים בין עמודים, למשל. זהו פוליש ויזואלי אשר מביא דלייט. אין כאן משהו שנעשה באופן רגיל. החל ממעבר העמודים, תמונות בעלות זווית מעניינת, אפילו המעבר בין האנשים אשר אחראים על העשייה נעשה באופן גרפי שעובר ביניהם ומגדיל בכל פעם את האדם וכתוב מי הוא ומה הוא עושה. ישנה הקפדה אדירה על פרטים.
- האתר פת’:
פת’, היא אפליקציית אייפד. השקיעו הרבה מאוד בויז’ואל טאץ’. עיצוב עמוד הבית הוא פריים ראשון בתוך הסרט שלהם (עליו ניתן ללחוץ).
2. סקאומורפיזם skeuomorphism:
סקאומופרפיזם = אלמנט עיצוב של מוצר חדש המבוסס על העיצוב של המוצר המקורי.
כל המוצרים של אפל בעלי היבט זה (המייל נראה כמו בול אמיתי, הרדיו הוא אייקון של גיטרה אמיתית, המילון הוא אייקון של מילון קונקרטי וכו’).
דוגמאות:
דוגמאות:
- ישנה אפליקציה של תופים בשם “בונגו”.
- באייפד, כאשר קוראים ספר ומעבירים דף רואים קיפול בצורה דיגיטלית (לקח “רק” פחות משלושה חודשים לפתח). זהו מקרה קלאסי ששילמו למעצבים ליצור זאת כיוון שחשבו שהדבר יגרום לאנשים לקרוא ספר בפלטפורמה דיגיטלית.
- מוצגת הדמית תלת מימד של המטוס הפרטי של סטיב ג’ובס. המטרה של הפרויקט הייתה עבור האפליקציה של ה I calendar. הוראתו של ג’ובס הייתה שזה יראה כמו יומן מנהלים ולכן ביקש ממעצבי האפליקציה שיכנסו למטוס המנהלים שלו ויחקו את העיצוב של המטוס מנהלים שלו. היה סקאומורפיזם רב באפל ואף ניתן לומר שג’ובס הוביל את הסקאומורפיזם.
למרות שבסופו של דבר האנושות אכן תתקדם למקום שבה רק נשענים על העולם הדיגיטלי, ישנה תקופת מעבר שבה מסתגלים – לדעת עידו, זהו המקום שבו הסקאומורפיזם מתקיים.
3. התחכמילות microcopy:
הרעיון הוא להשתמש בטקסט במקומות קטנים במוצר בכדי להתחכם ולגרום לחיבור עם המשתמש.
דוגמאות:
- פליקר – כל פעם שמתחברים לפליקר הוא אומר שלום בשפה אחרת.
- באתר mint כאשר הדף לא פנוי נאמר שג’סטין אכן פנוי (תמונה של בחור להכיר).
- באם אתר אינטרנט לא עולה, שמו במקום תמונה של ארנב קטן באמירה ש”חדשות רעות קל להפיג עם חיות חמודות”. ובמילים אחרות – השימוש בהומור מאוד משמעותי.
4. פטיש, fetishism:
פטיש = האנשה של חפצים.
כמו מישהו שרואה ברכב שלו – בן אדם. אלו אנשים שמחוברים לחפצים שלהם. זהו חיבור מאוד חזק ולכן חברות מחפשות חיבור כזה. הדרך לעשות זאת היא לקחת חפצים מעולם המוצר וליצור איתם משהו שמאזכר עולם אנושי.
דוגמה: mailchimp, חברת מיילים מוצלחת שהפכה דמות של קוף ל”דמותג” בשם פרדי.
5. משוב תחושתי, tactile controls:
טקטיליטי = מה שקורה לנו בראש מאוסף החושים. מדובר בעיקר בחוש המישוש. כאשר משהו הוא טקטילי זה יהיה כאשר אנו רואים משהו בדיוק בגודל הנכון ובמשקל הנכון שאנו מצפים.
המעצבים מודעים לצורך בטקטיליות זו, ולכן מעצבים בהתאם לכך. למשל, הן למשטח המטעין לפלאפונים, והן לאייפונים עצמם הוכנס משקל מפוברק כדי לתת את התחושה הטקטילית. כאמור, התחושה של המוצרים, מעבר לפעולתם גרידא היא העוד “משהו” הזה.
יצירת אותו פידבק פיזי נעשה בטכניקות רבות ומוזרות.
דוגמאות:
- פת’ path:
– ישנו לחצן של הוספת אלמנטים, פעולות ואותו לחצן עושה צליל. הגיעו לצליל הזה לאחר 755 צלילים. וממש רשמו עליו פטנט.
– המעבר מטה בעמוד נעשה באמצעות לקיחת עיגול ומתיחתו עם ההזזה מטה. בעצם יש כאן שילוב הן של סקאומורפיזם והן של טקטיליות (רצון לבדוק את הקצה, את המתיחה, לראות עוד). המתיחה הזאת היא לא רק אסתטית אלא לפני העניין הוויזואלי, יש כאן מחשבה איך לגרום למשתמש להבין שהוא צריך למתוח את זה.
– המעבר מטה בעמוד נעשה באמצעות לקיחת עיגול ומתיחתו עם ההזזה מטה. בעצם יש כאן שילוב הן של סקאומורפיזם והן של טקטיליות (רצון לבדוק את הקצה, את המתיחה, לראות עוד). המתיחה הזאת היא לא רק אסתטית אלא לפני העניין הוויזואלי, יש כאן מחשבה איך לגרום למשתמש להבין שהוא צריך למתוח את זה.
- פייסבוק facebook:
הצ’ט – משחקים איתו, מעבירים אותו מצד לצד, הפכו אותו למעין יצור חי. את העניין הזה לקח לפתח יותר זמן מהצ’ט עצמו.
המעצבת, קייט, ישבה עם מארק צוקרברג והוא הפך אותה לhead of design. קייט לקחה את הנושא של הדלייט למקום אחר. היא אמרה שכל מה שעמד לנגד עיניה בפיצ’ר החדש של הצ’ט היה דלייט. כמות נכבדת של היצירה הייתה של “דברים שלא צריכים” לכאורה.
המעצבת, קייט, ישבה עם מארק צוקרברג והוא הפך אותה לhead of design. קייט לקחה את הנושא של הדלייט למקום אחר. היא אמרה שכל מה שעמד לנגד עיניה בפיצ’ר החדש של הצ’ט היה דלייט. כמות נכבדת של היצירה הייתה של “דברים שלא צריכים” לכאורה.
6. אינטראקציות, interaction:
אין הכוונה למסך מגע אלא לעכבר ומקלדת בלבד. במילים אחרות – ניתן לייצר דלייט בלי האייפד והאייפון.
דוגמאות:
- The Twelve, studio creatif – האלמנטים של האתר כולו פועלים רק כאשר אנו מגיעים אליהם (כאמור יש לנו שליטה).
- Web bleed – אתר שבו לקחו חמישה צבעים והפכו אותם לחוויה של גלילה מטה (הצבעים נעים מטה יחד עם הגלילה ומשתנים תוך כדי).
- Adidas – השליטה באתר היא של המשתמש, המעבר באתר והתנועה בו מוצגת כמעין תנועה תלת מימדית כאשר כל שכבה זזה בזמן אחר. המדהים הוא שכל זה קורה בלבד במעבר של העכבר – הגלילה.
7. שוברי קרח, ice breakers:
כלי ההומור הוא מאוד חזק ועוצמתי. ניתן לבשר באמצעותו בשורה רכה ולייצר תחכום. באופן מעניין, לרוב הומור מפורש כתחכום וחוכמה.
דוגמאות:
- mailchimp – הקוף מתבדח ומספר בדיחות כל הזמן. במידה וכותבים במנגנון החיפוש “תפסיק כבר” הוא מפסיק את הבדיחות.
- Yahoo – כאשר מכניסים פרטים ליאהו בכדי הירשם, ובטעות כותבים תאריך לידה שעוד לא היה – זה כותב “האם אתה באמת מהעתיד?”.
8. אפיקומנים :surprise
הכוונה להיבטים מפתיעים שהמעצבים שמו אותם ונהיו מעיין משחק של המשתמש לחפש ולמצוא אותם.
דוגמאות:
- בכתיבת המילה askew בגוגל – כל המסך נע ימינה.
- בכתיבת המילה Zerg rush בגוגל – מספר ספרות של אפסים נופלים במסך ומורידים את כל הטקסט ומרקדים על המסך.
- אתר Tweet 1 – לוחצים על מישהו ורואים את הטוויט הראשון שעשה בחייו. המעניין ביותר הוא שיש עננים מאחורי אדם על המסך והם אינם נעים באותו קצב (דווקא העננים הביאו הכי הרבה עניין לאתר).
- פרלקס – ריצת סוס על קרטון וכאשר הולכים רואים סוס רץ. ישנו אתר המציג תמונות אלו וכאשר מגדילים ומקטינים מסך עם תמונות אלו זה נראה כאילו הסוס רץ.
- האור של העכבר של אפל נקרא בשם מייטי מאוס והוא עושה אור של חתול. זוהי התחכמות של המפתח שרצה לעשות שהעכבר והחתול במצב תמידי של מרדף ובריחה.
יש לא מעט הפתעות כאלו בגוגל. מסתמן שהפתעות אלו ייצרו קאלט של אנשים שעוקבים אחריהן ולכן עצם יצירת ההפתעות מייצר מעיןמרקטינג אפקט.
9. מסרים חבויים:
בעולם העיצוב הגרפי ישנן דוגמאות רבות למסרים חבויים.
דוגמאות:
- הלוגו של פייסבוק – שימוש בנגטיב ספייס בלוגו של פדקס (חץ אשר נוצר בין האותיות E ו X). נגטיב ספייס הוא עניין מאוד עוצמתי. הוא נכנס לתת מודע. האמת היא שאין שום גופן בעולם אשר מספק חץ שכזה מהצמדת האותיות – על כן יצרו לכך גופן מיוחד.
- הדוב החבוי בתוך ההר שבלוגו של הטובלרון.
- Northwest airlines – האות W ו N שנוצרים מנגטיב ספייס בלוגו, אך יותר מכך, האותיות בתוך עיגול ולכן נוצר מצפן אשר מצביע צפון מזרח.
- Facebook places – פייסבוק העתיקו מחברה מסוימת (פורת’סוול) וכן העתיקו חלק מהלוגו שלהם בשימוש עם האות 4 כדי ליצור בלבול אצל הלקוחות הפוטנציאלים.
10. המשכיות unbiquity:
המוצר מתעדכן באופן מושלם ומתוחכם בין הפלטפורמות השונות. ההמשכיות מתבטאת בכך שהתוכן נמצא בכל המקומות וגם שהתוכן מתאים את עצמו בכל המקומות (עניין שנקרא “ריספונסיב”).
ריספונסיב – כאשר אנחנו נמצאים בפלטפורמה, יש להגיב בהתאם.
כדוגמת time magazine. כאשר משנים את הגודל של המסך, ההעמדה עצמה של התוכן משתנה בצורה הולמת (נראה כמו אתר >> כמו אייפד >> כמו אייפון).
קצת פוליטיקה:
ההיבטים הרבים והשונים הללו, בעצם מעידים שמישהו ישב בחברה כלשהי והחליט שיש להשקיע כאן כסף. עם זאת, יש לזכור שתמידיש לתעדף, יש להבין מה כדאי ולא כדאי וכן להיענות לתקציב.
כיצד ניתן לשכנע את אותם “בוסים” לעשות דילייטים אלו?
דלייט שמלייט:
· לא נמצא בחזית ההחלטות העסקיות
· קשה להצדיק אותם
>>>> עידו מציע להתחיל מההפך – להגיד שהדבר אינו מחייב, אך ייתכן השקעה שלילית כאשר אין דלייט.
כיום, ישנו גודש של מוצרים שעובדים מצוין ולכן האדם מצפה לדבר הבא. להמצאות טכנולוגיות. עידו מתייחס לסינים כאנשים אשר מעתיקים טכנולוגיה בצורה מושלמת ומהירה. הדבר גורר מצב שגם הטכנולוגיה אינה מרגשת אותנו. על כן, החשיבות היא אילו מוצרים מייצרים ריגוש וחיבור רגשי עם הלקוחות. הדבר אינו טריוויאלי כלל.
למה להשקיע בדלייט?
- התרגשות ממוצר עם דלייט גוררת התחברות למותג (שיווק של האדם עצמו)
- מאיצה שימושים חוזרים
- זכירות ואפקט פה לאוזן
- דלייט שאינו מוסתר תורם לשיווק ומכירות
דון נורמן, הינו אבי חוויית המשתמש בעולם. הוא קולגה של ממציא העכבר. לדבריו, הגיע הזמן שמעבר לבניית המוצרים, החברות צריכות להכניס FUN ויופי למוצרים.