עיצוב ממשקים ממוקדים עבור משתמש טוב יותר

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

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

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

לכידת החידוש

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

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

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

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

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

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

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

טיפוגרפיה

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

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

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

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

בדוק את הבלוג Quick Sprout עבור דוגמה לסגנון הכתיבה. התוכן נכתב על ידי ניל פאטל והוא לעתים קרובות כותב תוכן longform מאוד, אבל הוא מפרק את הסעיפים לתוך 1-3 משפטים כל אחד.

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

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

תמונות המושכות את העין

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

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

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

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

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

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

אלמנטים מנוגדים

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

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

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

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

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

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

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

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

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

עודד אינטראקציה עם משתמשים

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

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

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

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

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

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

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

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

• משתמש Onboarding טקטיקה כדי להגדיל את ההתחייבות (thinkapps.com)
• שיעור בהשתתפות הדרגתית (uxbooth.com)
• אל תניח שמשתמשים חדשים רוצים ללמוד כיצד להשתמש במוצר שלך (uxdesign.cc)