בית  >  כתבות  > 10 טיפים ליצירת טבלאות תמחור מוצלחות

10 טיפים ליצירת טבלאות תמחור מוצלחות

יעל קריידרמן, 16/5/2012. 2 תגובות.

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

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

אז איך מתמודדים עם המשימה הזו?

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

1. לא יותר מדי ולא פחות מדי

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

long-table
זו, למשל, דוגמא לטבלה ארוכה מאוד: כאשר המשתמש מגיע לתחתית הטבלה, הוא כבר לא זוכר את תחילתה. מקור: צילום מסך מאתר clickz.com

shopify priving  10 טיפים ליצירת טבלאות תמחור מוצלחות
הטבלה הזו של Shopify, מצליחה להציג לא מעט נתונים ויחד עם זאת לשמור על תשומת הלב של המשתמש. מקור: צילום מסך

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

2. הדגישו את ההבדלים ולא את המשותף

בדרך כלל, המשתמש מגיע לדף התמחור לאחר שקיבל מידע ראשוני על המוצר או השירות והוא מבין באופן כללי מה מציעים לו. בשלב זה הוא רוצה להבין מה ההבדל בין המסלולים ומה הוא מקבל בתמורה למחיר בכל אחד מהם. לכן, רצוי תחילה להציג את ההבדלים במסלולים ורק אחר כך, במידה ויש מאפיינים זהים שחשוב לכם להראות, להציג גם אותם.
difference table  10 טיפים ליצירת טבלאות תמחור מוצלחות
המאפיינים השונים מופיעים בראש הטבלה והמאפיינים הזהים מוצגים בהמשך ומסומנים ב-V בלבד.
מקור: צילום מסך מאתר compuber.net

3. הדגישו אפשרות אחת

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

emphasize one  10 טיפים ליצירת טבלאות תמחור מוצלחות
מסלול "זהב" מודגש ביחס לאחרים ומסומן כ"Most Popular”. מקור: treehouse.com

4. אל תחביאו את המחיר

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

price table  10 טיפים ליצירת טבלאות תמחור מוצלחות
בטבלה הזו, המחיר אמנם מופיע בפונט מודגש וקל למצוא אותו כאשר סורקים את הדף, אך הוא אינו האלמנט העיקרי והגדול ביותר בטבלה. מקור: צילום מסך מאתר theresumator.com

5. אל תשכחו את הקריאה לפעולה

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

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

6. תמכו בהצעה על ידי הוכחה חברתית

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

social proof  10 טיפים ליצירת טבלאות תמחור מוצלחות
מתחת לטבלת המחירים מופיע טלפון בו ניתן ליצור קשר, המלצה של משתמש ורשימת שאלות נפוצות. מקור: צילום מסך מאתר scribe

7. התחשבו בכל הגולשים

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

responsive pricing table  10 טיפים ליצירת טבלאות תמחור מוצלחותמקור: צילום מסך מאתר codecanyon

8. הימנעו מרעש מיותר

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

9. הישארו נאמנים לעיצוב הכללי

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

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

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

 

visual size  10 טיפים ליצירת טבלאות תמחור מוצלחותגודל העיגול משתנה בהתאם למחיר וגודל החבילה. מקור: צילום מסך מאתר mailermailer

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

תוסף לוורדפרס

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

 wordpress pricing table  10 טיפים ליצירת טבלאות תמחור מוצלחותמקור: צילום מסך מאתר התוסף

עיצובים מוכנים

ברשת קיימים הרבה מקורות בהם תוכלו למצוא עיצובים מוכנים מראש ל-Pricing Tables. לעתים הם מגיעים כחלק מערכת עיצוב או ערכת UI ולעתים בנפרד. הנה כמה דוגמאות והפניות:

 pricing-table-psd1
באתר Best UI PSD תמצאו את ערכת העיצוב הזו וטבלאות נוספות להורדה בחינם

pricing-table-psd2
את העיצוב של הטבלה הזו תוכלו להוריד בחינם באתר duckfiles.com

pricing table psd3  10 טיפים ליצירת טבלאות תמחור מוצלחות
בבלוג designshareblog.com יש אוסף גדול של טבלאות תמחור ואלמנטים נלווים נוספים כמו תגים ותגיות מחיר למיניהן (ניתן להורדה בחינם).

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

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

מקורות וקריאה נוספת:
http://www.smashingmagazine.com/2008/10/13/pricing-tables-showcase-examples-and-best-practices/

http://www.clickz.com/clickz/column/2166117/designing-effective-pricing-tables

http://uxmovement.com/content/7-useful-design-strategies-for-a-successful-pricing-table/

http://uxmovement.com/content/useful-techniques-for-user-friendly-tables

כתבות בנושאים דומים



תגובות

2 תגובות לכתבה

כתיבת תגובה

לא יוצג בשום מקום

לא חובה

רוצים שהתמונה שלכם תופיע עם התגובה? העלו אותה ל-Gravatar.

שלח