شاشة تسجيل الدخول والمصادقة (Sign In / Authentication) المصممة والمطورة بالكامل لتطبيقات الأندرويد باستخدام Jetpack Compose ولغة Kotlin.
تم تصميم الشاشة باتباع أحدث صيحات المظهر الداكن (Dark Mode) لتوفر تجربة مستخدم (UX) سلسة ومريحة للعين، مع دمج حلول برمجية آمنة ومتقدمة لإدارة حسابات المستخدمين.
?️ التقنيات والمكتبات المستخدمة في بناء الشاشة (Technical Stack):
بناء الواجهات: تم استخدام Jetpack Compose لبناء عناصر الواجهة بشكل تصريحي وديناميكي بالكامل، مما يضمن أداءً سريعاً وتجاوباً (Responsiveness) مع مختلف أحجام الشاشات.
إدارة الحالة (State Management): الاعتماد على Kotlin Flows (StateFlow) و LiveData لمراقبة حالة المدخلات (تغيير النصوص، تفعيل الأزرار، وحالات التحميل الـ Loading States) بشكل لحظي وآمن.
إدارة الهوية والمصادقة (Backend/Auth): الشاشة مهيأة للربط البرمجي مع Firebase Authentication لتمكين المستخدم من تسجيل الدخول بعدة طرق مدمجة.
المعمارية (Architecture): تطبيق معمارية MVVM لفصل الـ UI تماماً عن الـ Auth Logic داخل الـ ViewModel، مما يسهل عملية الصيانة والتعديل مستقبلاً.
? المكونات البرمجية وتفاصيل الشاشة (UI & Features Breakdown):
Top Header Bar: يحتوي على عنوان الشاشة "Account" مع زر مخصص في الأعلى للانتقال السريع إلى شاشة إنشاء حساب جديد (Signup Button) لتبسيط الـ User Flow.
Visual Illustration: دمج رسم توضيحي عصري ومخصص (Illustration) يتماشى مع هوية التطبيق البصرية بجودة عالية.
Custom Outlined TextFields: حقول إدخال مخصصة للبريد الإلكتروني والرمز السري (Email & Password) تتميز بحواف دائرية كبيرة (RoundedCornerShape) مع أيقونات دلالية (Leading Icons) ونصوص تلميحية (Placeholders) واضحة.
Primary Sign-In Button: زر تفاعلي رئيسي بلون متباين وجذاب مع تأثيرات بصرية عند الضغط (Ripple Effects).
Alternative Auth Options (OAuth): * توفير خيار إمكانية تسجيل الدخول عبر وسائل التواصل الاجتماعي (Social Auth) بالاعتماد على Google SDK و Facebook SDK.
تم بناء الأزرار بشكل مجاور (Row Layout) مع دمج الشعارات الرسمية لـ Google و Facebook بدقة بصيغة SVG/Vector.
Guest Access: زر مخصص أسفل الشاشة يتيح للمستخدمين تصفح التطبيق كزائر (Continue as a Guest) دون الحاجة لتسجيل حساب فوراً، لرفع معدل الاحتفاظ بالمستخدمين (User Retention).
? معايير الأمان البرمجي والممارسات النظيفة المتبعة (Security & Clean Code):
تأمين البيانات (Data Security): تشفير وحماية الـ Tokens المرتجعة من خدمات الطرف الثالث (Google/Facebook OAuth) لضمان عدم تسريب جلسات المستخدمين.
التحقق من المدخلات (Input Validation): فحص صحة البريد الإلكتروني وقوة كلمة المرور برمجياً في الـ ViewModel قبل إرسال الطلب للخادم لتوفير استهلاك البيانات وحماية التطبيق من الهجمات العشوائية.
الكود النظيف: كود منظم ومقسم إلى دالّات صغيرة قابلة لإعادة الاستخدام (Reusable Composable Functions).