أحتاج إلى تصميم وتطوير موقع طقس احترافي وعصري مشابه للتصميم المرفق، يعرض حالة الطقس الحالية والتوقعات القادمة بشكل جذاب وسهل الاستخدام.
الموقع سيكون مناسبًا لعرض:
درجات الحرارة
حالة الطقس اليومية
توقعات الأيام القادمة
البحث عن المدن
واجهة استخدام حديثة ومتجاوبة
مميزات الموقع المطلوبة:
تصميم احترافي وعصري مشابه للتصميم المرفق.
شريط تنقل Navbar يحتوي على:
الصفحة الرئيسية
الأخبار
الكاميرات المباشرة
الصور
التواصل
Search Bar للبحث عن المدن أو المواقع.
عرض:
درجة الحرارة الحالية
حالة الطقس
أيقونات الطقس
توقعات الأيام القادمة
تصميم Responsive متوافق مع:
الموبايل
التابلت
الكمبيوتر
إمكانية الربط مع API حقيقي للطقس مثل:
OpenWeather API
WeatherAPI
استخدام Animations وتأثيرات حديثة لتحسين تجربة المستخدم.
كود نظيف ومنظم وقابل للتطوير مستقبلاً.
تحسين الأداء والـ SEO الأساسي.
يرجى العلم أن هذه الخدمة محددة بالتفاصيل التالية لضمان الشفافية الكاملة:
1. عدد الصفحات ونوعها:
الخدمة تشمل تنفيذ صفحة واحدة فقط (Single Page) وهي الصفحة الرئيسية التي تظهر في العرض، وليست موقعاً متعدد الصفحات.
2. تفاصيل الأقسام ومصدر البيانات:
بيانات الطقس: سيتم ربط الصفحة بـ API خارجي مجاني (مثل OpenWeatherMap) لجلب البيانات حياً وتلقائياً؛ الخدمة تشمل عملية الربط البرمجي، ويلتزم العميل بتوفير مفتاح API (سأساعدك في استخراجه مجاناً).
قسم الأخبار (News): هو قسم تصميمي ثابت (Static) يعرض نماذج للأخبار. الخدمة لا تشمل لوحة تحكم لإضافة أخبار، ويتم تعديل النصوص برمجياً من خلال الكود.
قسم الكاميرات المباشرة (Live Cameras): سيتم وضع صور رمزية أو روابط فيديو ثابتة (Embed) تعبر عن الفكرة؛ الخدمة لا تشمل توفير بث مباشر حقيقي أو كاميرات خاصة، بل هي هيكل برمجي جاهز لاستقبال روابط البث الخاصة بالعميل.
قسم الصور (Photos): قسم لعرض مجموعة صور ثابتة يتم إدراجها ضمن الكود.
3. إدخال البيانات ومحتوى الصفحة:
سأقوم بإدخال البيانات الأساسية الموضحة في النموذج لمرة واحدة.
مصدر الصور: سيتم استخدام صور مجانية وعالية الجودة من مصادر مفتوحة (مثل Unsplash) ولا تشمل الخدمة شراء صور مدفوعة.
4. التسليم والملفات:
تسليم الملفات المصدرية (HTML, CSS, JavaScript) منظمة تماماً.
التصميم متجاوب بالكامل مع الشاشات المختلفة.
5. ما لا تشمله الخدمة:
لا تشمل الخدمة استضافة أو دومين.
لا تشمل الخدمة إنشاء أي صفحات فرعية (مثل صفحة منفصلة لكل خبر أو كاميرا).
يفضل استخدام:
HTML / CSS / JavaScript
أو
React / Next.js Tailwind CSS
وسيتم تسليم المشروع كامل مع الملفات المصدرية.
