سنتحدث في هذا المقال عن طريقة إستخدام التصميم لتحقيق مبادئ ايدا AIDA التسويقة ولعل يخطر ببالنا( أوبرا عايده ) لتشابه الإسم 🙂 , ايدا هو إختصار ل 4 مبادئ استخدمت في الدعاية والتسويق التي توضح مجموعة من الأحداث المشتركة التي قد تحدث عند تفاعل المستخدم مع صفحات الهبوط والاعلان .
وهذه الخطوات الأربعة لعملية البيع ل إلياس سان تيلمو وهو من قام بإنشاء هذه المدرسة الفكرية . ايدا يمكن أن تطبق في حالات مختلفة والتى تتضمن بيع المنتجات والخدمات .ولكن في هذا المقال سنركز علي تحقيق كل خطوات ايدا في تصميم الويب.
مبادئ ايدا مهمة جدا في تصميم صفحات الهبوط حيث يرتبط التسويق بتصميم الويب . وصفحات الهبوط عامة تهدف الي بيع منتج او خدمة او اشتراك.
A: Attention (لفت الانتباه)
هي أول وأهم خطوة حيث تعتمد بقية الخطوات عليها , فكيف ستجعل الزائر يتفاعل اذا لم تجذب انتباهه ؟!!
ان التصميم الجيد والمتميز من أهم عوامل جذب الإنتباه .
استخدام العناصر الفردية في التصميم لتوجيه تركيز المستخدم لاماكن معينة في صفحة الويب, ومن الخطأ استخدام العديد من العناصر لجذب انتباه المستخدم فهذا يعطي انطباع خاطئ لدي المستخدم وسيجعله يشعر بعدم الإرتياح.
وان طرق جذب انتباه المستخدم عامة تتغير طول الوقت مع تغير التكنولوجيا . وهذه بعض الطرق المشهورة والتي تستخدم حاليا .
النصوص الكبيرة
يمكننا القول ان استخدام النصوص الكبيرة سائد منذ فترة من الوقت في تصميم الويب بشكل كبير. وهو عادة ما يستخدم في كتابة جملة مميزة على سبيل الترحيب او شرح طبيعة الموقع. وتوضع غالبا هذه الجملة في اعلى التسلسل الهرمي لتوزيع المساحات بالصفحة امام الزائر .
السلايدرات (sliders)
سلايدرات الجافا اسكربت (Javascript sliders) أصبح لها شعبية كبيرة في خلال الأعوام القليلة الماضية . وهذه بعض الامثلة في موقع Themeforest وسنلاحظ أن هذه الأمثلة ممتازة في جذب الإنتباه وعمل انطباع أول قوي . وهي تقوم بمزج الصور مع الحركات والتأثيرات لتضمن أفضل فرصة لجذب انتباه المستخدم .
التأثيرات المتحركة (Animation)
قديما كنا نعتمد علي الفلاش في عمل التاثيرات المحتركة , أما اليوم فلم تعد التأثيرات المتحركة مشكلة مع وجود تاثيرات السي اس اس “CSS3 animations ” التي انتشرت سريعا .واذا استخدمت التأثيرات الحركية بشكل صحيح فستكون طريقة ممتازة لجذب الانتباه الي موقعك.
وهذه بعض الأمثلة علي ذلك :
I: Interest (الإهتمام)
الاهتمام وهو ثاني مبدأ في ايدا . وفي هذه الخطوة نكون قد جذبنا انتباه المستخدم بالفعل والان نريده أن يهتم بما نقدم فكيف نفعل ذلك؟!
*بدلا من عرض المنتج أو الخدمة التي نقدمها . فعلينا أن نشرح الفوائد والمميزات الخاصة به .فهذا يساعد علي زيادة تركيز المستخدم في الحكم والتعرف علي المنتج بصفة شخصية وتحديد أهميتها له
*توضيح الفوائد والمميزات باختصار . فالمستخدمين لايريدوا أن يقرأوا فقرات طويلة لا يفيدهم فيها الا نقاط قليلة.
* الخطوات والقوائم والأيقونات والنقاط إلخ …. نستطيع إستخدامها في توصيل المعلومة بسرعة
وهذه بعض الأمثلة :
Evernote تظهر 3 فوائد كبيرة الي جانب الصور بمجرد تحميل الصفحة.
صفحة الهبوط ل Basecamp تدخل في صلب الموضوع مباشرة من خلال توضيح 3 فوائد رئيسية.
ونري صفحة Sparrow تستخدم أقسام محدده وواضحة لعرض فوائد تطبيقهم.
D: Desire (الرغبة)
والأن وقد حصلنا علي انتباه وتركيز المستخدم , نريدهم أن يرغبوا ويريدوا فيما نعرض , فيجب أن نولد لديهم الرغبة بذلك .
توليد الرغبة يعتبر امر اساسي ، فالشركات توظف خبراء متخصصين في التسويق لخدمة اهداف حملاتها لتحقيق هذه الرغبة. وسوف نركز حول كيفية تطبيق هذا من خلال تصميم الويب.
وفي هذه المرحلة يكون المستخدم مستعد لقضاء وقت أكثر في الموقع وقراءة المزيد وهذا يتطلب عرض معلومات تفصيلية اكثر سواء كانت في شكل صور أو فيديو أو نص . ولا داعي لأن نتسرع في هذه الخطوة.
على هذه الخطوة ان تمر دون ان تعلن حاجتك لعرض منتجك في ابهى صورة. فسوف يحكم الزوار على جمال التصميم والمستوى الراقي للجودة التي لمسوها به. ولهذا يجب الا يقل مستوى جودة عرضك للمنتج عن جودة تصميم الموقع من الاساس.
الجودة العالية ، الصور التوضيحية المميزة ومقاطع الفيديو الجيدة تسهم بالتأكيد في اظهار منتجك بشكل جيد. على سبيل المثال ، نجح متجر ابل في عرض كل منتجاتهم من خلال استخدام صورة كبيرة ذات تأثير حركي.
فكر مليا في افضل طريقة لعرض منتجك او خدمتك. هؤلاء من يبيعون الخدمات الرقمية ، مثل التطبيقات او تصميم الويب ، غالبا ما يعسكون انفسهم في صور اجهزة كمبيوتر ، شاشات او حواسب محمولة او حتى اجهزة جوال.
التأثير الإجتماعي
يعد من أشهر واقوي الوسائل لتوليد الرغبة . ويمكن ان تأتي بأشكال متعددة يمكن ان تقابلها خلال حياتك اليومية بصور مختلفة.
الدليل الاجتماعي يمكن ان نربطه اكثر بالجانب النفسي ، لكنه في الاساس يصف لنا اتباع افراد لأشخاص آخرون في اجراء ما او في اتجاه معين.
عمليات الاستقصاء والاستعراض والتعليقات تمثل خير مثال على ذلك ، لأنها تعرض حالات مسبقة لها خبرة بهذا المنتج او الخدمة ورأيهم الذي كونوه حوله. فمعرفة ان هناك اشخاص جربوا هذا المنتج وينصحوا به ، يزيل شعور المخاطرة لدى المستخدم ويزيد من تحفيز الرغبة.
ومن الأفضل أن يحتوي المنتج أو الخدمة علي وجهة نظر ورأي الخبراء والمشاهير فهذه الطبقة تملك قاعدة كبيرة من متابعيها فلديهم الخبرة والمصداقية وتمثل أرائهم قيمة كبيرة لديهم وهذا يجعل المستخدمين يثقون بالمنتج أو الخدمة التي تقدمها.
نفس المفهوم تجده واضحا حين تشاهد تصميم ناجح ومميز لمنطقة العملاء لدى الشركات الكبرى، او حين يعرض الكاتب بفخر كيف برز عملهم وتطور.
والجودة مهمة فاستخدمها لصالحك واستغل العدد الكبير لصالحك ,و هذا يمكن حين تظهر عدد متابعي تويتر واعجابات الفيسبوك او روابط RSS .
A: Action(التفاعل)
والأن قد وصلنا الي الخطوة الاخيرة التفاعل . وهو الهدف النهائي لصفحة الهبوط وتحويل المستخدم الي مشتري أو مشترك واخر شيئ نريده هو الفشل في الخطوة الأخيرة
عملية الطلب
عناصر اتمام عملية الطلب ليست بالصعبة ، فهي تكون عادة عبارة عن ازرار تدعوك لتأخذ قرار ما او فعل معين مثل “اشتري الآن” او “سجل”. تبدو سهلة وبسيطة جدا لكن يجب الحذر اثناء تصميمها …..!
-وبالنسبة لاي عنصر يدعو الي التفاعل والطلب يجب أن يكون ظاهر للمستخدم وواضح حبث يستطيع التفاعل معه بسهولة والازرار متوقع أن تاخذ شكل معين من حيث العمق والوضوح.
ونستطيع اضافة تمييز لعنصرالطلب عن طريق استخدام اساليب متنوعة كإستخدام الالوان ،الحجم ، والمساحات الواسعة البيضاء تعزز من ابراز هذه العناصر بشكل لافت.
استخدم الكلام المباشر في الازرار لتشجيع الفعل وخلق شعور بالأهمية والالحاح. واجعل الكلام واضح ومختصر .
وأيضا اجعل من السهل للمستخدم القيام بالفعل, عن طريق توفير أكثر من فرصة للقيام بالفعل .وينبغي ادراج عنصر الفعل مع (الزر ) مع التصميم من البداية وجعله واضحا في الصفحة .
ومع ذلك من المهم الحفاظ علي التوازن . فنحن لا نريد إرباك المستخدم وجلعه يشعر بالضغط باي طريقة . وان اظهار العديد من عناصر الفعل سوف يظهركفعل إنتهازي وقد ياتي بتاثير سلبي . ومن الأفضل استخدام 2 او 3 من العناصر التي تحث المستخدم علي الفعل .
طريقة العرض Z
طريقة العرض Z هي طريقة بسيطة ومثالية لتنفيذ مبادي ايدا .فهي طريقة مؤثرة تقود المستخدم خلال كل خطوة لتوصله في النهاية لعنصر الفعل .
ومن اهم ميزات هذا التخطيط كونه قابل للتكيف والإستخدام بطرق متنوعة. فبنية طريقة العرض Z ليست بالجامدة لكنها قادرة على التوسع لتشمل مناطق متعددة من المحتوى المعروض. ولهذا سوف تشاهد امثلة متنوعة لهذا التخطيط قد تبدو مختلفة بعض الشيء عن بعضها.
وفي النهاية :
يمكن ان تمثل معرفة مباديء نظرية AIDA وكيفية تنفيذها خطوة بخطوة فائدة كبيرة لمصممي الويب.
وعلى الرغم من سهولة وبساطة النقاط التي تمت مناقشتها في اعلى المقالة ، الا انها تتطلب مهارة خاصة في اخراجها بشكل ناجح وفعال.
أسامة محمد
موضوع مفيد جدا ومهم تسلم ايدك 🙂
محمد ماهر
شكرا علي مرورك الكريم
lmomtaz
مقال رائع جدا
محمد ماهر
شكرا علي مرورك 🙂
muha sy
مشاء الله أخي محمد موضوع ممتاز ومبسط بطريقة ذكية ومن ايدين شخص محترف
محمد ماهر
شكرا
محمد قطاج
مشكور أستاذ محمد على الموضوع المميز. هل من الممكن توضيح جزئية “أسلوب العرض Z” بشكل أوضح من فضلك؟ لم أفهمها جيدا بعد.
تحياتي لك ولفريق العمل
محمد ماهر
شكرا علي مرورك أستاذ محمد وهذا مقال يشرح بالتفصيل طريقة العرض Z
Z-Layout
http://webdesign.tutsplus.com/articles/understanding-the-z-layout-in-web-design–webdesign-28
ان شاء الله سيتم التحدث عنه بالتفصيل قريبا