إنشاء موقع إلكتروني احترافي لجريدة / صحيفة إخبارية عربية
وظيفة البرومبت:
هذا البرومبت مخصص لإنشاء موقع إلكتروني كامل لجريدة أو صحيفة إخبارية عربية، بواجهة حديثة، متجاوبة مع الجوال والتابلت والكمبيوتر، تدعم اللغة العربية واتجاه الكتابة من اليمين إلى اليسار، وتحتوي على أقسام الأخبار، المقالات، الأخبار العاجلة، صفحة تفاصيل الخبر، البحث، التصنيفات، الكُتّاب، النشرة البريدية، والإعلانات.
الأداة الأنسب للتنفيذ:
الأفضل تنفيذه على ChatGPT Codex أو Claude عند الرغبة في إنتاج كود كامل للموقع، ويمكن استخدام Google Stitch أو Gemini لتوليد تصور بصري أولي للواجهة قبل البرمجة.
تنبيه مهم
لضمان أعلى درجة ممكنة من الدقة وصحة الإخراج، يجب تزويد الذكاء الاصطناعي يدويًا بكل البيانات الموثقة المتاحة لديك قبل تنفيذ البرومبت أو ضمن نصه نفسه؛ لأن جودة المخرجات ترتبط مباشرة بجودة المدخلات، فالذكاء الاصطناعي — كأي نظام تحليلي أو برمجي — إذا بُنِي على بيانات صحيحة وموثقة ومنظمة، كانت نتائجه أقرب إلى الصحة والدقة والاعتمادية، أما إذا كانت البيانات ناقصة أو غير دقيقة أو غير موثقة، فإن المخرجات ستتأثر بذلك مهما كانت قوة النموذج.
تحذير حقوقي
هذا البرومبت متاح للاستخدام التعليمي، والأكاديمي، والعلمي، أو للاستخدام الشخصي فقط، مع وجوب ذكر المصدر عند الاستفادة منه. ولا أُحلّل ولا أُبيح استخدامه لأغراض تجارية أو ربحية، أو إعادة نشره بصياغة أخرى، أو بيعه، أو استخدامه لكسب المتابعين، أو إنجاز أعمال مهنية للغير دون إذن. أما الاستخدام التجاري أو الربحي داخل السعودية فهو مسموح بشرط دفع قيمة البرومبت وهي 50 ريالًا سعوديًا، والأمر متروك لأمانتك وصدقك.
طريقة الاستخدام
انسخ البرومبت التالي وضعه في ChatGPT Codex أو Claude إذا كنت تريد كودًا كاملًا قابلًا للتشغيل. أما إذا أردت تصميم الواجهة فقط قبل البرمجة، فضعه في Gemini أو Google Stitch واطلب منه إخراج تصور بصري أولي، ثم استخدم التصميم الناتج كمرجع عند بناء الكود.
ضع لايك / إعجاب وتعليق ومتابعة
البرومبت الكامل الجاهز للنسخ انسخ النص التالي كما هو:
اسم المشروع الداخلي: kamel3lom
تصرف كمصمم واجهات أمامية محترف، ومهندس برمجيات متخصص في بناء مواقع الصحف والمنصات الإخبارية الرقمية. أريد منك إنشاء موقع إلكتروني كامل لجريدة / صحيفة إخبارية عربية حديثة، يدعم اللغة العربية بالكامل واتجاه الكتابة من اليمين إلى اليسار RTL، ويكون مناسبًا للنشر الصحفي الجاد، وليس مجرد قالب بسيط أو صفحة تجريبية.
المطلوب الأساسي:
أنشئ موقعًا إخباريًا احترافيًا كاملًا لجريدة عربية باسم:
"جريدة المستقبل"
ويمكن تغيير الاسم لاحقًا بسهولة من ملف إعدادات واحد.
التقنيات المطلوبة:
استخدم أحدث إصدار مستقر من React أو Next.js، مع TypeScript إن أمكن، وTailwind CSS للتنسيق. اجعل الكود منظمًا في مكونات واضحة قابلة لإعادة الاستخدام. إذا كانت البيئة لا تدعم Next.js، استخدم React عاديًا مع تنظيم احترافي للملفات.
اتجاه اللغة:
يجب أن يكون الموقع عربيًا بالكامل، واتجاهه RTL، وجميع النصوص، القوائم، الأزرار، البطاقات، النماذج، والتخطيطات يجب أن تظهر بشكل صحيح من اليمين إلى اليسار.
الهوية البصرية:
صمم الموقع بهوية صحفية عربية حديثة تجمع بين الرسمية والوضوح والفخامة. استخدم لوحة ألوان مناسبة لجريدة موثوقة، مثل الأبيض، الأسود، الرمادي، الأزرق الداكن، والأحمر للأخبار العاجلة. لا تجعل التصميم مزدحمًا أو صاخبًا. يجب أن يشعر المستخدم أنه أمام صحيفة محترفة لا أمام مدونة شخصية.
الصفحات المطلوبة:
1. الصفحة الرئيسية:
- ترويسة علوية تحتوي على شعار الجريدة، التاريخ، زر البحث، وروابط التواصل.
- شريط تنقل رئيسي للأقسام.
- شريط أخبار عاجلة متحرك أو واضح بصريًا.
- خبر رئيسي كبير Hero News.
- شبكة أخبار جانبية للأخبار المهمة.
- أقسام منظمة: السياسة، الاقتصاد، الرياضة، التكنولوجيا، الثقافة، الرأي، التحقيقات.
- قسم الأكثر قراءة.
- قسم آخر الأخبار.
- مساحة إعلانات أعلى الصفحة ووسطها وأسفلها.
- قسم الاشتراك في النشرة البريدية.
- فوتر شامل.
2. صفحة تفاصيل الخبر:
- عنوان الخبر.
- صورة رئيسية.
- اسم الكاتب.
- تاريخ النشر.
- وقت القراءة.
- تصنيف الخبر.
- محتوى الخبر.
- وسوم الخبر.
- أزرار مشاركة.
- أخبار ذات صلة.
- صندوق الكاتب.
- تعليقات شكلية أو قسم تفاعل بسيط.
3. صفحة القسم:
- عنوان القسم.
- قائمة أخبار القسم.
- فلترة بسيطة أو ترتيب حسب الأحدث والأكثر قراءة.
- تصميم بطاقات متناسق.
4. صفحة المقالات والرأي:
- عرض مقالات الكُتّاب.
- صورة الكاتب.
- اسم الكاتب.
- نبذة قصيرة.
- عنوان المقال.
- تاريخ النشر.
5. صفحة الكُتّاب:
- شبكة تعرض أسماء الكُتّاب وصورهم وتخصصاتهم وروابط مقالاتهم.
6. صفحة البحث:
- مربع بحث كبير.
- نتائج بحث تجريبية.
- رسالة واضحة عند عدم وجود نتائج.
7. صفحة من نحن:
- تعريف بالجريدة.
- رسالتها.
- رؤيتها.
- سياسة التحرير.
8. صفحة اتصل بنا:
- نموذج اتصال يحتوي على الاسم، البريد، الموضوع، الرسالة.
- معلومات التواصل.
- روابط التواصل الاجتماعي.
المكونات المطلوبة:
- Header احترافي.
- Navbar.
- BreakingNewsBar.
- NewsCard.
- FeaturedArticle.
- SectionBlock.
- Sidebar.
- MostRead.
- LatestNews.
- AdBanner.
- NewsletterBox.
- AuthorCard.
- ArticlePage.
- Footer.
- SearchOverlay أو SearchPage.
المحتوى التجريبي:
أنشئ بيانات أخبار عربية تجريبية داخل ملف مستقل، ولا تستخدم نصوص Lorem Ipsum. يجب أن تبدو العناوين عربية واقعية ومناسبة لصحيفة، مثل أخبار سياسية واقتصادية وثقافية وتقنية. لا تنشر أخبارًا حقيقية منسوبة لأحداث واقعية حديثة حتى لا يبدو الموقع كأنه يختلق أخبارًا. اجعلها عناوين تجريبية عامة.
أمثلة للأقسام:
- سياسة
- اقتصاد
- محليات
- رياضة
- تكنولوجيا
- ثقافة
- رأي
- تحقيقات
- عالم
متطلبات التصميم:
- تصميم متجاوب بالكامل مع الهاتف، التابلت، والكمبيوتر.
- وضوح ممتاز للخط العربي.
- مسافات داخلية منظمة.
- بطاقات أخبار أنيقة.
- صور خبرية تجريبية باستخدام placeholders آمنة أو تدرجات لونية إن لم تتوفر صور.
- عدم ازدحام الواجهة.
- إبراز الخبر الرئيسي بوضوح.
- شريط الأخبار العاجلة يجب أن يكون ظاهرًا دون أن يزعج المستخدم.
- الإعلانات يجب أن تظهر كمساحات منظمة لا تشوه التصميم.
- الفوتر يجب أن يكون غنيًا ومنظمًا.
متطلبات تجربة المستخدم:
- سهولة الوصول للأقسام.
- سرعة التصفح.
- وضوح التسلسل البصري.
- إمكانية قراءة الأخبار بسهولة.
- أزرار مشاركة واضحة.
- بحث ظاهر وسهل الاستخدام.
- تصميم مناسب لكبار السن والقراء العاديين، وليس فقط للمصممين.
متطلبات SEO:
أضف بنية HTML دلالية Semantic HTML قدر الإمكان.
استخدم عناوين H1 وH2 وH3 بطريقة صحيحة.
أضف metadata أساسية إن كانت البيئة تدعم ذلك.
اجعل صفحة الخبر مهيأة لمحركات البحث.
أضف alt text مناسبًا للصور التجريبية.
جهّز بنية قابلة لاحقًا لإضافة Open Graph وSchema NewsArticle.
متطلبات الأداء:
- استخدم مكونات خفيفة.
- تجنب الأكواد المتكررة.
- اجعل البيانات التجريبية منفصلة عن المكونات.
- استخدم lazy loading للصور إن كان ممكنًا.
- لا تستخدم مكتبات ثقيلة بلا ضرورة.
متطلبات الوصول Accessibility:
- تباين ألوان جيد.
- أزرار واضحة.
- عناصر قابلة للتصفح بلوحة المفاتيح قدر الإمكان.
- تسميات واضحة للنماذج.
- لا تعتمد على اللون وحده لتوضيح المعنى.
لوحة الإدارة:
إذا أمكن، أنشئ صفحة Admin تجريبية بسيطة غير متصلة بقاعدة بيانات، تحتوي على:
- جدول أخبار.
- زر إضافة خبر شكلي.
- زر تعديل شكلي.
- زر حذف شكلي.
- إحصاءات بسيطة مثل عدد الأخبار، عدد الأقسام، عدد الكُتّاب.
وإذا كان ذلك سيعقّد المشروع، اجعلها صفحة تجريبية منفصلة ببيانات وهمية منظمة.
المخرجات المطلوبة منك:
1. اعرض هيكل الملفات المقترح.
2. اكتب الكود كاملًا لكل ملف.
3. لا تترك ملفات ناقصة.
4. لا تكتب شرحًا طويلًا خارج الكود إلا عند الضرورة.
5. ابدأ مباشرة ببناء المشروع.
6. تأكد أن الموقع يعمل من أول تشغيل.
7. لا تستخدم بيانات خارجية أو API حقيقية إلا إذا طلبت منك ذلك لاحقًا.
8. اجعل المشروع قابلًا للتوسيع إلى نظام إدارة محتوى CMS مستقبلًا.
قيود مهمة:
- لا تجعل الموقع باللغة الإنجليزية.
- لا تستخدم اتجاه LTR.
- لا تجعل التصميم شبيهًا بمدونة شخصية.
- لا تختصر الموقع في صفحة واحدة فقط.
- لا تضع نصوصًا ركيكة أو عناوين غير واقعية.
- لا تكرر نفس البطاقات بشكل عشوائي.
- لا تستخدم أخبارًا حقيقية حساسة أو منسوبة لجهات واقعية.
- لا تضع علامة مائية بصرية داخل الموقع، لكن اترك في تعليق داخلي منظم داخل الكود عبارة:
Project Signature: kamel3lom
ابدأ الآن بإنشاء موقع الجريدة كاملًا وفق هذه المواصفات.
#تصميم_مواقع
#برمجة
#مواقع_إخبارية
#صحافة_رقمية
#kamel3lom
🚨 جربت كل برامج AI و حبيت اقولكم وش افضل برنامج مجاني انصحكم في استخدمه ✍🏻 :
🌟 بالمركز الأول : Copilot 🏆
💥 بعد تجربه طويله لكثير من AI اقدر اقول Copilot بتصميم الصور المجانيه و كتطبيق مجاني بالكامل هوا الافضل بينهم كلهم رغم ادري في حاقدين عليه لنه من Microsoft ✅
2- المركز الثاني : Meta AI 🥈
💥 هذا ممتاز في ان يعمل لك فيديوهات و صور بشكل مجاني 💯
3- المركز الثالث : Gemini 🥉
💥 هذا ممتاز في المحادثات و انك توخده منه معلومات ولكن كبرنامح مجاني لتصميم الصور فهوا الاسوا بينهم كلهم 💯
4- المركز الرابع : ChatGPT 🎖️
💥 هذا كويس و يمكن يكون افضلهم لو دفعت عليه فلوس ولكن هوا اسواهم من الناحيه المجانيه 💯
💫 هذا التقييم لتطبيق بشكل مجاني يعني بدون ما تدفع عليه فلوس و يمكن ناس تختلف معي بالرأي ولكن هذا تقييمي حسب تجربتي لهم كلهم ✍🏻
#PC
#Xbox
#Playstation
🎁🎁🎁🎁🎁🎁
👇👇👇👇👇👇
شرح كيف تحصل على Promot من أي صورة كانت مصممه بالذكاء الاصطناعي أو صوره حقيقيه (تفاصيل الصورة)
▪️ترجمة النص
▪️التعديل عليه
التطبيق المطلوب تحميله
Imageto Prompt
مخصص للايفون
https://t.co/Kiff5rD2O5
الشرح
صوموا عن كل ما يحط من كرامة الانسان ويقلل من انسانيته
إن كان هدف الصوم هو تهذيب النفس وتربية الجسد،فإن صومكم عن الشرور قبل الطعام أفضل وأفيد.
صوموا عن الجهل تصحوا
وكل سنة وانتم طيبين والى الله اقرب .. !!