كيف ستصمم Peggy Olson للتفاعل

في عصر Mad Men ، كان المسوقون يعرفون بالضبط كيف سيتم استهلاك عملهم. سيرى الجمهور المستهدف الإعلان على التلفزيون ، ويسمعونه في الراديو ، ويرونه في مجلة أو على لوحة إعلانية ، وربما يأتي في صندوق البريد (الحلزون). إذا كنت تخطط لإعلان مطبوع أو قطعة بريدية ، فأنت تعلم الحجم الدقيق للعقار الذي تصمم من أجله ، وقمت بتحسين إعلانك ليناسب هذه المساحة. سيرى المستهلك هذا المحتوى تمامًا كما تخيلته عند تصميمه.

إذا كانت Peggy Olson تصمم إعلانًا اليوم ، فسيتعين عليها التفكير في سياق كيفية عرض هذا الإعلان ، وكيف سيتفاعل جمهورها المستهدف معه. لن يكون هناك ما يضمن أن يُنظر إلى عملها بالطريقة التي تخيلتها ، لذلك ستحتاج إلى تحسين تخطيطها وتصميمها بحيث يكون لها تأثير بغض النظر عن كيفية عرضها. كان عليها أن تتأكد من أن عبارة الحث على اتخاذ إجراء (CTA) كانت واضحة وموجزة وقابلة للفك شفرتها - حتى على شاشة بحجم ثلاث بوصات.

يعد تصميم صفحات الويب والصفحات المقصودة ورسائل البريد الإلكتروني اليوم أكثر تعقيدًا مما كان عليه في أيام Mad Men. اليوم لديك البعد الإضافي للعناصر التفاعلية ، ولا تعرف على الجهاز الذي سيتم عرض المحتوى. قد يكون التصميم الذي يبدو مثاليًا على شاشة كمبيوتر كاملة الحجم عبارة عن فوضى كاملة عند عرضها على جهاز لوحي أو هاتف ذكي. يمكن أن تؤدي CTA غير الواضحة أو الموضوعة في مكان خاطئ إلى قتل معدل مشاركتك.

ثلاثة من أفضل ممارسات التصميم التفاعلي الرئيسية

يتمتع معظم المستهلكين اليوم بمدى اهتمام البعوض. لديك حوالي ثانيتين لجذبهم عندما ينقرون على المحتوى الخاص بك قبل أن يقرروا ما إذا كانوا سينقرون أم لا على شيء أكثر إثارة للاهتمام. من الضروري أن تفهم هذه المفاهيم الثلاثة عند تصميم بريد إلكتروني أو صفحة مقصودة أو صفحة ويب:

1. كيف يؤثر التخطيط على المشاركة: تعرف على كيفية تخطيط العناصر على الصفحة لتحقيق أقصى قدر من المشاركة
2. كيف يؤثر المحتوى على التفاعل: اعرف ما الذي سيجبرني على التفاعل مع المحتوى الخاص بك
3. ما مدى أهمية الوقت: لديك ثانيتان لجذب انتباهي

تبدو بسيطة ، أليس كذلك؟ إذا كان الأمر بهذه البساطة ، فلن أكتب هذا! لا يمكنني إخبارك بعدد أجزاء المحتوى التي أواجهها يوميًا والتي تحبطني لدرجة الضغط على زر الرجوع. أنا أتحدث عن الشركات الكبيرة ذات الجيوب العميقة ، ولكن ليس لها معنى في التصميم.

لذلك دعونا نكون عمليين. تابع القراءة للحصول على بعض النصائح البسيطة جدًا التي ستساعدك على تحسين تخطيطات صفحتك للمشاركة على أي نظام أساسي.

كيف تقوم العين بمسح الصفحة

أول شيء يجب أن تفهمه هو كيفية تتبع العين البشرية عبر جزء من المحتوى. عندما كنت أدرس الإعلان في الكلية ، قيل لنا أن العين يتم تتبعها عبر صفحة على شكل حرف Z كبير ، بدءًا من أعلى اليسار. أنا متأكد من أن هذه النظرية قد تم ابتكارها من خلال دراسة تضمنت موضوع اختبار يبحث في أجزاء من المحتوى بينما حاول رجل يرتدي معطفًا أبيض رسم نمط حركات العين على قطعة من الورق. كان هذا قبل وقت طويل من تقنية الخرائط الحرارية المتاحة على نطاق واسع والتي تُستخدم لمعرفة كيفية تتبع الأشخاص عبر الصفحات التي يتم عرضها على الإنترنت. ولا تنس أن الأشخاص يقومون بالمسح الضوئي للطباعة بشكل مختلف قليلاً عن المحتوى عبر الإنترنت.

الإجماع في هذه الأيام هو أن العين تتعقب في نمط F كبير عند عرض جزء من المحتوى عبر الإنترنت ، ولا يزال يبدأ في أعلى اليسار. تتتبع عينك عادةً أفقيًا عبر الشريط العلوي لـ F أولاً ، ثم الشريط الثاني من F ، وأخيراً من أعلى إلى أسفل أسفل الجذع الرأسي لـ F.

فماذا يعني هذا؟ هذا يعني أن CTA الخاص بك يجب أن يكون في مكان ما في نمط F الكبير ، أو تحتاج إلى وضع شارب على طفل. اتخذ قرارًا تصميميًا واعًا لوضع CTA الرئيسي في مكان يلفت انتباه المشاهد في أول ثانيتين.

كوارث التصميم الحقيقي

لذلك دعونا نلقي نظرة على كارثة التصميم الحقيقية التي ساعدني أحد زملائي هنا في Act-On في إنشائها. يؤسفني أن أقول إن المثال أدناه مأخوذ من محتوى حقيقي صادفته عبر الإنترنت. لقد استخدمت شركة وهمية تدعى Actomatic لتوضيح الأخطاء الأكثر شيوعًا التي يرتكبها الناس وكيفية تصحيحها.

مثال 1: لا تجعلني أقوم بالتمرير لرؤية CTA

إن أكثر الفرص الضائعة شيوعًا التي أراها هي جزء من المحتوى بدون أي طريقة للمشاركة أو مشاركة الأزرار المدفونة في أسفل الصفحة أسفل الجزء المرئي من الصفحة. الطي هو ذلك الخط الخيالي في الجزء السفلي من الشاشة. (يأتي المصطلح من الأيام التي كانت فيها الصحف مطوية إلى النصف ؛ وكان وضع "الجزء المرئي من الصفحة" في موضع أفضل ، وقراء أفضل.) في شاشة كمبيوتر محمول متوسطة الحجم ، قد يكون الطي 480 بكسل من أعلى الشاشة ، ولكن في وضع التشغيل iPhone قد يكون عند 100 بكسل من الأعلى. كن على علم بذلك عند تخطيط محتوى صفحتك.

إذا كنا نتحدث عن مدونة أو مقالة متعددة الصفحات ، فأنا أجرؤ على تخمين أن معظم الأشخاص مستعدون للمشاركة بعد قراءة العنوان الرئيسي (إذا كان جيدًا) وأول جملتين من جزء من المحتوى ، لأنهم يريدون لتكون أول من يخرج من البوابة. يحب الأشخاص مشاركة محتوى جديد ، وليس محتوى شاهدوه بالفعل شاركه أقرانهم خمس مرات.

أقترح وجود أزرار مشاركة في الجزء العلوي والسفلي من المحتوى ، أو مشاركة الأزرار التي تطفو بجانب المحتوى عند التمرير.

لقد عملت مع شركة معروفة جدًا وجدت ، عندما أضافوا أزرار المشاركة في الجزء العلوي من المقالة وكذلك في الجزء السفلي ، ارتفع معدل المشاركة بأكثر من 400٪.

مثال 2: يا عيني!

هل سبق لك أن وصلت إلى جزء من المحتوى كان مشغولاً للغاية لدرجة أنك لم تعرف أين تبحث؟ ربما كان لديه مقطع فيديو لمشاركته ، نموذج لملئه ، بعض النسخ ، بعض الروابط هنا وهناك. إذا وصلت إلى الصفحة أدناه ، فلن أعرف من أين أبدأ ، لذلك ربما لن أشارك على الإطلاق. لا يعطيني هذا المثال أي إشارة إلى ما هو أكثر أهمية في هذه الصفحة. لديك ثانيتان أو أقل لجذب انتباهي وإشراكني ، وقد فقدتني للتو.

إذا كان لديك العديد من عبارات الحث على اتخاذ إجراء ، فقم بتوضيح الترتيب المنطقي لتلك العناصر. تهجئها باستخدام وسائل شرح مرقمة إذا كان عليك ذلك. إذا جئت إلى هذه الصفحة ، فسأطرح الأسئلة التالية:

يبدو التصميم غير مخطط له وقذرًا مع وجود مساحة بيضاء عشوائية وخطوط فردية. عبارات الحث على اتخاذ إجراء هي بالتأكيد في الجزء السفلي غير المرئي من الصفحة.

إذا كنت أسدي نصيحة إلى Actomatic ، فسأبدأ بسؤالهم عما يأملون في تحقيقه من خلال هذه الصفحة. ما هو الهدف هنا؟ أفترض أن الأهداف الرئيسية هنا هي حث الأشخاص على الاشتراك في المدونة ومشاهدة مقطع فيديو قصير ومشاركته. إذا كان الأمر كذلك ، فنحن بحاجة إلى إجراء بعض التغييرات.

1. تأكد من وجود CTA الرئيسي في الجزء المرئي من الصفحة. يوجد كل من أزرار المشاركة وزر الاشتراك أسفل الجزء المرئي من الصفحة.
2. وضح أنك تريد من الزائرين الاشتراك في المدونة ومشاركة الفيديو
3. أضف بعض المعلومات عن الشركة

حسنًا ، دعنا نلقي نظرة الآن:

يحتوي الإصدار الجديد والمحسّن على تصميم مختلف قليلاً ، وعدد أقل من الخطوط ، ودليل قصير عن الشركة والفيديو ، وحاجز أقل للاشتراك في المدونة. لقد أضفت أيضًا روابط في الأسفل وزر اتصال. لاحظ كيف قمت بتحسين التخطيط لزيادة مقدار المعلومات التي قد يراها القارئ في أول ثانيتين باتباع الطريقة التي تمسح بها العين الصفحة بشكل طبيعي. تقول نظرية النمط F أن هذا هو الترتيب الذي سيأخذ به المشاهد العناصر الموجودة على الصفحة:

1. شعار الشركة
2. عناوين الصحف
3. أزرار المشاركة والاشتراك
4. قسم الاستكشاف في الأسفل

أعطني سبب للتفاعل

الآن بعد أن حصلت على التنسيق الخاص بك ، يجب أن تعطيني سببًا للتفاعل مع المحتوى الخاص بك. إذا كنت تريد مني ملء نموذج أو مشاركة المحتوى الخاص بك ، فيجب أن يكون هناك سبب مقنع للقيام بذلك. دعني أسألك ما الفائدة من ذلك؟

إذا كنت لا تعرف إجابة هذا السؤال ، فأنت لم تقم بأداء واجبك.

السبب الرئيسي لتفاعل الناس مع المحتوى هو أنهم يحصلون على نوع من الرضا منه عاطفياً أو مادياً. إذا كان المحتوى الخاص بك جيدًا ، فسأشاركه لأنه يجعلني أبدو على اطلاع جيد أمام زملائي. أحصل على تعزيز للأنا إذا كنت أول من اكتشف عنصر واجهة مستخدم جديد قمت بإصداره للتو ، لذلك بالطبع سأشارك حقيقة أنني تمكنت من رؤيته أولاً.

ربما تكون مؤسسة غير ربحية والمحتوى الخاص بك عبارة عن قصة تبعث على الشعور بالسعادة عن شخص فعل شيئًا غير عادي ، وسأشارك هذا المحتوى لأنه يجعلني أشعر بالرضا والعمل الخيري. امنحني فرصة للفوز بجهاز iPad إذا ملأت نموذجًا وسأعطيك على الأرجح معلوماتي الشخصية.

الحيلة هي معرفة ما الذي يجبر جمهورك على المشاركة. هل هي مكافأة عاطفية أم مكافأة مادية أم كلاهما؟ ضع نفسك مكانهم وأنشئ استراتيجية تفاعل موجهة نحو جمهورك.

أبقيها بسيطة

تحدثت مؤخرًا في مؤتمر حيث قدمت دراسة حالة لحملة تسويق اجتماعية ناجحة. ارتديت قميصًا مطبوعًا على المقدمة: #KeepItSimple. أحاول أن أمارس ما أعظ به.

لقد عملت مع العملاء الذين أنشأوا محتوى تفاعليًا معقدًا للغاية ، وآخرين أبقوه بسيطًا بشكل لا يصدق ، ويفوز البساطة في كل مرة تقريبًا. إليك كيفية إبقائها بسيطة:

• اختر وجوه الخطوط مثل Trebuchet التي يسهل قراءتها عبر الإنترنت.
• لا تخلط بين وجوه وأحجام خطوط كثيرة في الصفحة. حجم واحد للعناوين وحجم واحد للنص الأساسي.
• احتفظ بها في عبارة واحدة واضحة للحث على اتخاذ إجراء إن أمكن.
• احتفظ بالأشياء المهمة في الجزء المرئي من الصفحة.
• اجعل حاجز الدخول إلى أدنى مستوى ممكن (لا تسأل عن الطفل البكر لشخص ما إذا كان كل ما تحتاجه حقًا هو عنوان بريده الإلكتروني)

واجبك المنزلي

انتظر لحظة ، لم تقل أبدًا أنه سيكون هناك واجب منزلي في نهاية هذا المقال! لو أخبرتك أنه سيكون هناك واجب منزلي هل كنت ستقرأ هذا الآن؟ اه هاه. أود منك أن تلقي نظرة على إحدى صفحاتك المقصودة بعين ناقدة وأن تسأل نفسك ما إذا كان هناك مجال للتحسين.

• اعرض إحدى صفحاتك المقصودة على جهاز كمبيوتر محمول وجهاز محمول. هل يجب عليك التمرير للوصول إلى CTA؟ هل يتم عرضها بشكل جيد على جهاز محمول؟
• اطلب من صديق لا يعرف شيئًا عن شركتك أن يشاهد إحدى صفحاتك المقصودة ، واطلب منه تقديم ملاحظات صريحة أثناء مشاهدته لها. اطلب منهم إخبارك بما يلاحظونه أولاً ، وما الذي تفعله شركتك ، وما هو CTA الرئيسي على الصفحة.
• تحقق مما إذا كانت جميع العناصر المهمة موجودة داخل النمط F.
• اختبر صفحاتك في أكبر عدد ممكن من المتصفحات على أكبر عدد ممكن من المنصات. لا يعرض Safari عناصر مثل Chrome. لا يعرض Firefox عناصر مثل Internet Explorer (IE). ويمكن للإصدارات المختلفة من IE عرض المحتوى بشكل مختلف تمامًا.

ليس عليك أن تكون حاصلاً على شهادة في تخطيط وتصميم الإعلان لتنجح في تحقيق ذلك. ولكن عليك أن تكون على استعداد للنظر في المحتوى الحالي الخاص بك بعين ناقدة.

إنه يستحق كل هذا الجهد.