سارة بتنزّل ٣ منشورات في الأسبوع على انستقرام متجرها. التصاميم شيك جداً: خلفيات هادية، وخط أنيق، وصور منتجات متصوّرة كويس. الفريق بيحبها، والمتابعين بيعلّقوا “تحفة”. بس المنشورات الممولة نسبة النقر عليها ضعيفة، والمبيعات من انستقرام ثابتة من شهور. لما فتحت التصاميم على موبايلها وعدّت بصباعها بسرعة التمرير اللي بتعدّي بيها على أي حساب، اكتشفت إنها هي نفسها مش بتقف عندها. التصميم الحلو مش هو التصميم اللي بيوقّف التمرير.
تصميم منشورات السوشيال ميديا اللي توقف التمرير بيتبني على هوك بصري واحد يتفهم في جزء من الثانية: عنصر بطل واحد واضح، وتباين عالي بينه وبين الخلفية، ورسالة قصيرة تتقري من غير ما العين تدوّر عليها، وصيغة رأسية تملا شاشة الموبايل. وبعد كده، القرار بين تصميمين ما بيتاخدش بالذوق. بيتاخد باختبار A/B على نفس الجمهور ونفس الميزانية، وبتقيس نسبة النقر وتكلفته، مش اللايكات.
هذا المقال جزء من التصميم التسويقي: تصاميم تبيع لا تُعجب فقط، وتركيزه على المنشور الواحد في الفيد: إزاي يوقّف التمرير وإزاي تختبره. أما اختيار ألوان الهوية نفسها، فليه مقال سيكولوجية الألوان في السوق السعودي.
لماذا لا يكفي أن يكون التصميم جميلاً؟
ابدأ من هنا: المتابع مش بيبص على منشورك. هو بيعدّي على الفيد، ومنشورك واحد من عشرات بيعدّوا قدامه في دقيقة.
في بحث نشرته Facebook سنة ٢٠١٧ من إعداد Fors Marsh Group، الناس قدروا يفتكروا محتوى الفيد على الموبايل بنسبة ذات دلالة إحصائية بعد تعرّض مدته ٠.٢٥ ثانية بس. ونفس المصدر قال إن الناس بيمرروا الفيد على الموبايل أسرع بـ٤١٪ من الديسكتوب.
الرقمين دول قديمين نسبياً، والمنصات اتغيرت من ساعتها. لكن الفكرة اللي بيثبتوها لسه صحيحة: قرار الوقوف عند منشور بيتاخد في جزء من الثانية، وبيتاخد على الموبايل. يعني تصميمك بيتقيّم في اللحظة دي، مش لما حد يفتحه ويتأمله.
التصميم “الجميل” بيتعمل عشان يتشاف على شاشة المصمم، كبير وثابت. التصميم اللي بيبيع بيتعمل عشان يتشاف صغير، وبيتحرك، وفي جزء من الثانية. ودول هدفين مختلفين.
ما هي عناصر الهوك البصري التي توقف التمرير؟
الهوك البصري هو العنصر اللي بيوقّف الصباع. ومش بيتبني على “إبداع”، بيتبني على ٥ عناصر تقدر تقيسها وتراجعها.
عنصر بطل واحد
كل منشور ليه بطل واحد: منتج، أو رقم، أو وش، أو جملة. لو فيه ٣ عناصر بنفس الحجم والأهمية، العين مش هتعرف تبدأ منين، فهتكمّل تمرير. اسأل نفسك: لو حد شاف المنشور ربع ثانية، هيفتكر إيه؟ الإجابة دي هي البطل، والباقي يصغر.
تباين عالي
البطل لازم يكون واضح جداً عن الخلفية، في اللون والإضاءة. ولو فيه كلام في التصميم، استخدم حدود التباين في معيار WCAG 1.4.3 كحد أدنى: ٤.٥:١ للكلام بالحجم الطبيعي، و٣:١ للكلام الكبير. الكلام اللي جوه المنشور بيتشاف صغير على الموبايل، فالتباين الضعيف بيخلّيه مش مقروء.
رسالة تتقري في نظرة
الكلام جوه التصميم مش مكان للشرح. جملة واحدة قصيرة، والشرح يروح في الكابشن. والمتابع العربي بيبدأ يقرا من اليمين، فخلّي الجملة أو العنصر الأهم في المكان اللي العين بتبدأ منه.
صيغة رأسية تملا الشاشة
انستقرام غيّر شبكة البروفايل من مربعات لمستطيلات رأسية في يناير ٢٠٢٥، وآدم موسيري قال إن السبب إن أغلب الصور والفيديوهات اللي بتترفع رأسية أصلاً. التصميم الرأسي بياخد مساحة أكبر من شاشة الموبايل، يعني فرصة أكبر إنه يوقّف العين. وخلّي العناصر المهمة بعيد عن الأطراف، لأن المعاينات والشبكة ممكن تقص منها. واتأكد من المقاسات الحالية من مركز مساعدة المنصة وقت التصميم، لأنها بتتغير.
كسر النمط
لو كل المنافسين في فئتك بينزّلوا خلفيات بيضا ومنتج في النص، أي منشور شبهه هيدوب وسطهم. شوف آخر ٢٠ منشور لأقرب ٥ منافسين، وحدد النمط المكرر، واكسره في عنصر واحد بس: اللون، أو الزاوية، أو الحجم.
مقارنة – تصميم يُعجب مقابل تصميم يبيع
| العنصر | تصميم بيعجب | تصميم بيبيع |
| نقطة البداية | “عايزينه شيك” | “عايزين إيه يتفهم في ربع ثانية؟” |
| العناصر | منتج ولوجو وكلام وزخرفة بنفس الأهمية | بطل واحد، والباقي أصغر بوضوح |
| الكلام في التصميم | فقرة أو أكتر | جملة واحدة، والشرح في الكابشن |
| التباين | هادي ومتناسق | البطل واضح جداً عن الخلفية |
| المقاس | مربع أو أفقي | رأسي بيملا الشاشة |
| بيتراجع إزاي | على شاشة كبيرة | صغير، على الموبايل، وهو بيتمرر |
| القرار | ذوق الفريق | اختبار A/B بأرقام |
| القياس | لايكات وتعليقات | نسبة النقر وتكلفته، والحفظ والمشاركة |
كيف تراجع تصميم المنشور قبل نشره؟
قبل ما تعتمد أي تصميم، عدّيه على ٣ اختبارات:
- اختبار التصغير: صغّر التصميم لحجم بيقرب من حجمه في الفيد، أو افتحه على الموبايل. لو البطل والجملة مش واضحين، التصميم محتاج تعديل.
- اختبار الربع ثانية: اعرض التصميم على حد مش من الفريق لحظة واحدة، واسأله: شفت إيه؟ لو الإجابة مش هي البطل اللي إنت قاصده، الهوك مش شغال.
- اختبار الفيد: حط التصميم وسط لقطة شاشة من فيد حقيقي فيه منشورات منافسين. لو مش باين وسطهم، هيعدّي.
مثال توضيحي – كيف تقرر بين تصميمين بالأرقام؟
ده مثال توضيحي بأرقام افتراضية، والحسابات معمولة بكود. متجر عمل اختبار A/B على تصميمين لنفس المنتج، بنفس الجمهور ونفس الميزانية:
| المؤشر | التصميم (أ): هادي وشيك | التصميم (ب): بطل واحد وتباين عالي |
| مرات الظهور | ٢٠٬٠٠٠ | ٢٠٬٠٠٠ |
| النقرات على الرابط | ١٨٠ | ٣٠٠ |
| نسبة النقر | ٠.٩٠٪ | ١.٥٠٪ |
| الصرف | ١٬٠٠٠ ر.س | ١٬٠٠٠ ر.س |
| تكلفة النقرة | ٥.٥٦ ر.س | ٣.٣٣ ر.س |
التصميم (ب) جاب نقرات أكتر بنسبة ٦٧٪ على نفس الصرف، وتكلفة النقرة نزلت تقريباً ٤٠٪. والفرق هنا مش صدفة، لأن اختبار الفرق بين نسبتين على العيّنة دي بيطلّع قيمة z حوالي ٥.٥، وده أعلى بكتير من حد الدلالة المعتاد ١.٩٦.
بس خلّي بالك من حجم العيّنة. لو نفس النسب دي طلعت على ١٬٠٠٠ ظهور بس لكل تصميم (٩ نقرات مقابل ١٥)، قيمة z بتنزل لحوالي ١.٢، يعني الفرق ممكن يكون صدفة ومتقدرش تعتمد عليه. متقفلش الاختبار بدري لمجرد إن تصميم “باين إنه كسبان”.
كيف تختبر تصاميم المنشورات خطوة بخطوة؟
- حدد هدف المنشور: نقرة على المنتج، ولا حفظ، ولا رسالة. المؤشر اللي هتقيسه بيتحدد من الهدف.
- اختار متغير واحد تختبره: البطل، أو الخلفية، أو الجملة. لو غيّرت كله، مش هتعرف إيه اللي فرق.
- صمّم نسختين نفس المقاس ونفس الكابشن، وبيفرقوا في المتغير ده بس.
- استخدم أداة اختبار A/B في Meta Ads Manager عشان الجمهور يتقسم من غير تداخل بين النسختين.
- ثبّت الجمهور والميزانية والمدة للنسختين.
- استنى لحد ما العيّنة تكفي. الأداة اللي في آخر المقال بتحسبلك قيمة z، ومتعتمدش النتيجة لو أقل من ١.٩٦.
- اعتمد التصميم الكسبان، واكتب في سجل التجارب إيه المتغير وإيه النتيجة.
- ابدأ الاختبار اللي بعده على متغير جديد، فوق التصميم الكسبان.
ما الذي يجب تجنّبه في تصاميم المنشورات بالسعودية؟
التصميم اللي بيوقّف التمرير لازم يكون سليم نظامياً، وإلا هيوقّفك إنت.
- علم الدولة وشعارها: وزارة التجارة منعت استخدام علم المملكة وشعار الدولة وصور القادة والمسؤولين وأسمائهم في التعاملات التجارية، ومنها التصاميم والمنشورات، في كل الأوقات بما فيها المناسبات الوطنية.
- العلامات التجارية للفعاليات: الهيئة العامة للترفيه حذّرت من استخدام علامات موسم الرياض تجارياً من غير موافقة كتابية. ونفس المنطق ينطبق على أي علامة مش بتاعتك.
- التخفيضات: أي منشور فيه تخفيض محتاج ترخيص من وزارة التجارة ورقمه يظهر.
- عبارات الندرة: متكتبش “آخر الكمية” أو “العدد محدود” عشان توقّف التمرير، إلا لو ده حقيقي.
- المؤثرين: لو التصميم فيه مؤثر في إعلان مدفوع، لازم يكون معاه رخصة «موثوق» من الهيئة العامة لتنظيم الإعلام.
قائمة التحقق
☐ حددت هدف المنشور قبل التصميم: نقرة، أو حفظ، أو رسالة.
☐ المنشور ليه بطل واحد، والباقي أصغر منه بوضوح.
☐ الكلام في التصميم جملة واحدة، والشرح في الكابشن.
☐ الجملة أو العنصر الأهم في المكان اللي القارئ العربي بيبدأ منه.
☐ تباين الكلام مع الخلفية معدّي ٤.٥:١، أو ٣:١ للكلام الكبير.
☐ التصميم رأسي، والعناصر المهمة بعيد عن الأطراف.
☐ اتأكدت من المقاسات الحالية من مركز مساعدة المنصة.
☐ عدّى اختبار التصغير على الموبايل.
☐ عدّى اختبار الربع ثانية مع حد من برة الفريق.
☐ عدّى اختبار الفيد وسط منشورات المنافسين.
☐ مفيش علم أو شعار دولة أو علامة تجارية مش بتاعتك.
☐ أي تخفيض في التصميم ليه ترخيص ورقمه ظاهر.
☐ اختبار A/B بمتغير واحد، والنتيجة ما اتعتمدتش غير لما قيمة z عدّت ١.٩٦.
الخطوة اللي بعد تصميم المنشور
التصميم اللي بيوقّف التمرير محتاج هوية لونية ثابتة يتبني عليها، فابدأ من سيكولوجية الألوان في السوق السعودي. ولو بتجهّز قوالب للمواسم، شوف المحتوى اللحظي وإزاي تركب موجة الحدث بذكاء. وبعد ما المنشور يجيب النقرة، صفحة المنتج هي اللي لازم تكمّل البيع.
وعشان القرار بين تصميمين ما يبقاش ذوق، جهّزنا لك هدية فيا المجانية — مقيّم تصميم المنشور ومتتبع اختبارات A/B: ملف إكسل بتراجع فيه كل تصميم على عناصر الهوك البصري، وتسجّل نتايج الاختبارات، فيحسبلك نسبة النقر وتكلفته وقيمة z ويقولك الفرق حقيقي ولا صدفة.
لو عايز حد يراجع تصاميم منشوراتك بالأرقام قبل ما تزوّد الميزانية، احجز تحليلك الذكي المجاني.
المنشور اللي بيبيع مش الأجمل في عين الفريق. هو اللي بيتفهم في ربع ثانية على شاشة موبايل وهي بتتمرر. ابنيه على بطل واحد وتباين عالي وجملة واحدة، وخلّي الأرقام هي اللي تختار بين تصميمين. ساعتها كل ريال على الإعلان بيروح لتصميم أثبت إنه بيوقّف الصباع.
أسئلة شائعة
- إزاي أصمم منشور انستقرام يوقف التمرير؟
ابني المنشور على بطل واحد واضح، زي منتج أو رقم أو جملة، بتباين عالي مع الخلفية، وجملة قصيرة تتقري في نظرة، وصيغة رأسية بتملا الشاشة. وراجعه صغير على الموبايل قبل النشر، مش على شاشة المصمم.
- إيه هو الهوك البصري؟
هو العنصر اللي بيوقّف عين المتابع وهو بيمرر الفيد. غالباً بيكون عنصر بطل واحد بتباين عالي، أو كسر للنمط اللي المتابع متعود يشوفه في فئتك. هدفه إن المنشور يتفهم في جزء من الثانية.
- أنهي مقاس أنسب لمنشورات انستقرام؟
الصيغة الرأسية بتاخد مساحة أكبر من شاشة الموبايل، وانستقرام غيّر شبكة البروفايل لمستطيلات رأسية في يناير ٢٠٢٥. خلّي العناصر المهمة بعيد عن الأطراف، واتأكد من المقاسات الحالية من مركز مساعدة المنصة لأنها بتتغير.
- كام كلمة أكتب جوه تصميم المنشور؟
مفيش رقم ثابت، لكن القاعدة إن الكلام جوه التصميم يتقري في نظرة واحدة: جملة قصيرة، والشرح في الكابشن. ولازم تباينه مع الخلفية يعدّي ٤.٥:١ للكلام بالحجم الطبيعي حسب معيار WCAG.
- إزاي أعرف أنهي تصميم أنجح من التاني؟
اعمل اختبار A/B بمتغير واحد، بنفس الجمهور ونفس الميزانية، وقارن نسبة النقر وتكلفته. واحسب قيمة z للفرق بين النسبتين، ومتعتمدش النتيجة غير لما تعدّي ١.٩٦، عشان تتأكد إن الفرق مش صدفة.