Mealify: Interactive Food Recipe Platform

قمت بتطوير موقع Mealify وهو موقع وصفات متكامل، باستخدام HTML وCSS فقط، مع التركيز على بناء واجهة مستخدم منظمة وجذابة تحاكي تصميمًا احترافيًا.

اعتمدت في هذا المشروع على تحسين تجربة المستخدم من خلال تصميم متجاوب وتفاعلي يعمل بكفاءة على مختلف الأجهزة.

أهم المميزات التي قمت بتنفيذها:

• تصميم متجاوب بالكامل (Responsive) لجميع الشاشات

• استخدام Flexbox لتنظيم وتوزيع العناصر بشكل احترافي

• شريط تنقل ثابت (Fixed Navbar) لتسهيل التصفح أثناء التمرير

• تطبيق تأثيرات Hover لتحسين التفاعل مع العناصر

• إضافة تأثيرات Transform & Transition لعمل حركات سلسة

• تنفيذ حركة Shake Animation عند التفاعل مع الصور

• دعم الوضع الليلي (Dark Mode) مع إمكانية التبديل

• استخدام Layer فوق الصور لعرض النصوص بشكل واضح

• تضمين خريطة باستخدام iframe لإثراء المحتوى

التقنيات المستخدمة:

• HTML5

• CSS3 (Flexbox – Transitions – Transform – Animations)

ما يميز هذا العمل:

• كود منظم وسهل القراءة والتطوير

• دقة في تنفيذ التصميم ومحاكاته

• اهتمام بتجربة المستخدم والتفاصيل البصرية

• قابلية تطوير المشروع وإضافة ميزات مستقبلية

هذا المشروع يعكس مهاراتي في بناء واجهات Front-End من الصفر باستخدام HTML وCSS، مع التركيز على التصميم المتجاوب والتفاعلي.