اسم المشروع: لوحة تحكم المستثمر الزاهية (Vibrant Investor Dashboard)
وصف المشروع:
تطبيق ويب متطور لتحليل الأداء المالي والنمو السنوي، يركز على تقديم تجربة بصرية حيوية وتفاعلية للمستثمرين. يتميز التطبيق بواجهة مستخدم عصرية تعتمد على الخلفيات المتدرجة المتحركة والتصميم الزجاجي (Glassmorphism)، مما يجعله أداة جذابة وفعالة لمتابعة المبيعات والعوائد.
الميزات التقنية والبرمجية المنفذة في الكود:
نظام تحديث البيانات الفوري: برمجت وظيفة updateChart() التي تتيح للمستخدم إدخال بيانات مبيعات جديدة وتحديث الرسم البياني وإجمالي العوائد السنوية تلقائياً دون الحاجة لإعادة تحميل الصفحة.
تمثيل البيانات حركياً (Dynamic Data Visualization): دمجت مكتبة Chart.js لإنشاء منحنى نمو وتطور تفاعلي، مع تخصيص المظهر ليتماشى مع الهوية البصرية الزاهية للتطبيق.
دعم كامل لتعدد اللغات (Dual-Language Engine): طورت نظام تبديل لغات ذكي (عربي/إنجليزي) يقوم بتغيير كافة نصوص الواجهة، القوائم الجانبية، وحتى اتجاه الصفحة بالكامل (RTL/LTR) برمجياً عبر وظيفة toggleLanguage().
هندسة التصميم العصري (Advanced UI/UX):
استخدمت تقنيات CSS Animations لإنشاء خلفية متدرجة متحركة بزاوية 45 درجة تعطي حيوية للواجهة.
طبقت تأثيرات Backdrop-filter لخلق مظهر الزجاج الشفاف (Glassmorphism) للقائمة الجانبية والبطاقات الإحصائية.
تصميم متجاوب (Responsive Design): صممت الواجهة لتتكيف مع مختلف أحجام الشاشات، حيث تتحول القائمة الجانبية إلى وضع الرموز فقط في شاشات الجوال لضمان أفضل تجربة تصفح.
الأدوات والتقنيات المستخدمة:
اللغات الأساسية: HTML5, CSS3, JavaScript (ES6).
المكتبات الخارجية: Chart.js لرسومات البيانات.
الرسوم المتحركة: CSS Keyframes لتعزيز التفاعل البصري