الأخبار التكنولوجية والاستعراضات والنصائح!

فن الإقناع المحيطي: صور في تصميم الويب

ستساعدك المقالة التالية: فن الإقناع المحيطي: صور في تصميم الويب

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

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

توفر المرئيات سياقًا لتوصيل الرسائل بالطرق الثلاث: من خلال توفير المعلومات، وإثارة الاستجابات العاطفية، والتسبب في الإقناع.

فيما يلي بعض النصائح والأمثلة لطرق مختلفة لاستخدام العناصر المرئية لإقناع التحويلات.

معلوماتية

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

على أية حال، يمكن أن تساعد الصور في تقديم المعلومات وتوفير السياق وسرد قصة علامتك التجارية.

تسليم المعلومات

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

لقطة الشاشة مأخوذة في 12/06/2014 من apple.com

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

الآن كل ما يتعين على المشاهدين فعله هو التحقق من الاختلافات بين iPhone 5S و5C. هذا كل شيء. توفر العناصر المرئية فكرة فورية عن الشكل الذي تبدو عليه النماذج الثلاثة وما هي الاختلافات الرئيسية بينها، بحيث يمكن للزائرين اتخاذ القرار بسهولة.

لقطة الشاشة مأخوذة بتاريخ 12/06/2014 من موقع apple.com

توفير السياق

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

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

أحد الأمثلة على ذلك يمكن أن يكون تعليمات لربط عقد مختلفة، وهي مهمة يكاد يكون من المستحيل شرحها دون نوع من التمثيل البصري. “اربط جانب الخصلة A حول جانب الخصلة B مرتين قبل دس جانب الخصلة B خلال حلقة الجانب الأيسر” أمر معقد ويصعب تصوره، خاصة بالنسبة للمبتدئين.

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

لقطة الشاشة مأخوذة في 12/06/2014 من visual.ly

بالتأكيد، الصور رائعة. ولكن ربما تتساءل كيف يمكن أن تجني أي إيرادات عبر هذه الطريقة. يعد استخدام السياق أحد أقوى الطرق لجذب المبيعات من المستهلكين المحتملين. إن مخطط المعلومات، اختر مزاجًا للغرفة، هو بكل صراحة أعظم قطعة “سياق” صادفتها. من خلال جذب القراء المهتمين بإعادة تصميم غرفتهم، يجذب مخطط المعلومات البياني هذا انتباه المتسوقين ويظهر السياق الذي ستؤثر فيه اختياراتهم على إعادة تصميم غرفهم. ومن الملائم أن يقوم منتج المحتوى، Gate to Garage، ببيع تلك البضائع.

لقطة الشاشة مأخوذة في 12/06/2014 من موقع Gatetogarage.com

أخبر قصة

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

مثال على ذلك مستقبل مشاركة السيارات، وهي منظمة مكرسة لنشر الوعي حول فوائد مشاركة السيارات. يعد موقع الويب الخاص بها تجربة ممتعة وتفاعلية حيث يقوم المستخدمون “بالتنقل” عبر أقسام مختلفة من محتوى التمرير الأفقي.

يصف أحد الأقسام التأثير الإيجابي لمشاركة السيارة على انبعاثات ثاني أكسيد الكربون. ويتميز الإحصائية:

“في عام 2009، أدى تقاسم السيارات إلى خفض انبعاثات ثاني أكسيد الكربون العالمية بمقدار 482.170 طن. (وهذا يعادل نصف وزن جسر البوابة الذهبية!)”

هذه الإحصائية في حد ذاتها هي حقيقة مثيرة للاهتمام وغنية بالمعلومات. ولكن مع صور الجسر فوق المحيط و”الانبعاثات” في الخلفية (جنبًا إلى جنب مع تجربة القيادة عبر الموقع)، يتحول هذا المحتوى من وصف إحصائية إلى سرد قصة.

لقطة الشاشة مأخوذة بتاريخ 12/06/2014 من موقع Futureofcarsharing.com

والقصص أكثر قوة، وأكثر إلهامًا، ومن المرجح أن تحفز العمل.

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

عاطفي

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

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

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

إجراءات الزناد

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

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

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

لقطة الشاشة مأخوذة بتاريخ 12/06/2014 من http://www.wingcheng.com/

النماذج ذات العناصر المرئية الممتعة والمصممة جيدًا مثل هذه تجعل المهمة المملة أكثر إمتاعًا، مما يزيد من فرصة متابعة المستخدمين لإنجازها.

تقديم الخبرات

يمكن للسياق المرئي أن يقدم للزائرين أكثر من مجرد كتلة نصية وCTA عادي.

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

لقطة الشاشة مأخوذة في 12/06/2014 من موقع flipboard.com

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

أظهر أنك تهتم

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

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

من خلال دمج عناصر مرئية ممتعة وفريدة من نوعها في صفحة 404 الخاصة بك، يمكنك أن تُظهر للزائرين أنك بذلت وقتًا وجهدًا في الصفحة وأنك تهتم بالخطأ.

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

لقطة الشاشة مأخوذة في 12/06/2014 من موقع bellstrike.com

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

مقنع

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

يمكن أن تساعدك الصور المرئية المقنعة في إظهار جدارتك بالثقة، وإظهار الثقة، وخلق جو من السعادة.

أظهر مصداقيتك

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

كيف يمكنك بناء هذه الخبرة والسلطة لكسب تلك الثقة؟ أنت تظهر الثقة.

دراسة: تأثير النصيحة الواثقة على اتخاذ القرار

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

قبل كل تخمين، طُلب من كل متطوع اختيار واحد من مقدمي النصائح الأربعة (المتطوعين أيضًا) لشراء النصائح منهم. قدم مقدمو النصائح تخميناتهم للوزن في شكل نسبة مئوية، مع نشر البعض نصائحهم على نطاقات متعددة. على سبيل المثال، ربما قال أحد المستشارين إن هناك احتمال 60% أن يكون وزن الشخص 160-169 رطلاً، وفرصة 20% أن يكون 150-159 وفرصة 20% أن يكون 170-179. ومع ذلك، ربما قال مستشار أكثر ثقة أن هناك فرصة بنسبة 100٪ أن يكون الوزن ضمن نطاق 170-179 رطلاً.

قبل أن يختار المتطوعون مستشارهم، كانوا قادرين على رؤية النسبة المئوية لكل مستشار، ولكن ليس نطاقات الوزن المرتبطة (أي يشعر المستشار أ بالثقة بنسبة 60% في نطاق واحد، و20% ثقة في نطاق مختلف، و20% ثقة في نطاق آخر) .

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

لترجمة هذه النتيجة للويب، هذا يعني أنه من المرجح أن يثق الأشخاص بك ويتحولون معك إذا أظهرت الثقة.

استخدام العناصر المرئية لإظهار الثقة

لقطة الشاشة مأخوذة بتاريخ 12/06/2014 من facebook.com/barakobama

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

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

من خلال إقران السياق المرئي بالمحتوى بهذه الطريقة، يمكنك عرض خبرتك بطريقة حقيقية وجذابة.

خلق جو يشعر بالارتياح

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

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

لقطة الشاشة مأخوذة في 12/06/2014 من myrainbownursery.co.uk

خاتمة

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

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

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