واجهة مستخدم لتطبيق الجري بألوان الباستيل مع تميمة الكسلان

{ "type": "نموذج واجهة مستخدم لتطبيق لياقة بدنية للهواتف المحمولة", "style": "تصميم تطبيق أنيق وعصري بألوان الباستيل، يتميز بأسطح بيج ناعمة وبيضاء دافئة مع لمسات من الأخضر المريمي الرقيق، وبطاقات وأزرار مستديرة، وظلال خفيفة، وأيقونات بسيطة رفيعة، وهوية علامة تجارية ودودة ومرحة مع تميمة كسلان، وخلفية بنية داكنة منقطة على غرار Dribbble.", "theme": "تطبيق لتتبع الجري", "layout": { "device_count": 3, "arrangement": "ثلاث شاشات هواتف ذكية طويلة جنبًا إلى جنب، متباعدة بالتساوي، عرض أمامي.", "background": "بني داكن جدًا مع نمط شبكي منقط باهت وموحد.", "screens": [ { "position": "الجانب الأيسر", "screen_type": "لوحة التحكم الرئيسية", "header": { "greeting": "صباح الخير أيها العداؤون! 👋", "left_icon": "none", "right_icon": "جرس الإشعارات" }, "hero_card": { "العنوان": "هل أنت مستعد ليوم رائع؟"، "سطر نص البطاقة الفرعية 1": "كل خطوة للأمام هي انتصار."، "سطر نص البطاقة الفرعية 2": "لنجعل كل لحظة ذات معنى. 🌱"، "الرسم التوضيحي": "كسلان لطيف، يرتدي عصابة رأس بلون كريمي وبدلة رياضية بلون أخضر نعناعي، يقف على الجانب الأيمن من البطاقة ويلوح بيده."}، "الأقسام": [ { "العنوان": "هذا الأسبوع"، "الموقع": "أعلى المنتصف"، "العدد": 3، "التسميات": [ "عدد مرات الجري"، "المسافة"، "الوقت" ]، "القيم": [ "3"، "12.6 كم"، "ساعة و45 دقيقة" ]، "العرض التقديمي": "بطاقة إحصائية واحدة ذات زوايا مستديرة تحتوي على ثلاثة أعمدة من المحتوى متساوي العرض وأيقونة دائرية خضراء فاتحة." }, { "title": "الهدف التالي", "position": "من المنتصف إلى الأسفل", "count": 1, "labels": [ "20 كيلومترًا هذا الشهر" ], "values": [ "63%" ], "presentation": "بطاقة تقدم ذات زوايا مستديرة مع شريط تقدم أخضر ورسم توضيحي صغير لكسلان يلوح بيده على اليمين." }, { "title": "الأنشطة الأخيرة", "position": "أسفل", "count": 1, "labels": [ "الأنشطة الأخيرة" ], "presentation": "الحافة العلوية للبطاقة المستديرة الأخرى مرئية، ولكنها محجوبة بشريط التنقل السفلي." } ], "bottom_nav": { "count": 4, "labels": [ "الصفحة الرئيسية", "الجري", "الجدول الزمني", "المعلومات الشخصية" ], "active": "الصفحة الرئيسية" } }, { "position": "middle", "screen_type": "ملخص الجري", "header": { "left_icon": "سهم الرجوع", "center_text": "أحسنت!", "subtext": "لقد فعلتها! حان وقت الاحتفال! 🎉", "right_icon": "مشاركة" }, "hero_illustration": "كسلان لطيف، يرتدي عصابة رأس، وبدلة رياضية خضراء فاتحة، وميدالية ذهبية، يرفع ذراعيه احتفالًا.", "stats_row": { "count": 3, "labels": [ "المسافة", "الوقت", "السرعة" ], "values": [ "5.00 كم", "32:15", "6:27" ], "presentation": "ثلاثة { "count": 1, "title": "أفضل رقم شخصي جديد! 🌟", "subtitle": "لقد كنت أسرع بدقيقة و12 ثانية من المرة السابقة التي قطعت فيها 5 كيلومترات.", "icon": "شارة ميدالية ذهبية صغيرة" }, "table_section": { "title": "التقسيم", "count": 2, "columns": [ "kilometer", "pace", "time" ], "rows": [ [ "1", "6:35", "6:35" ], [ "2", "6:23", "12:58" ] ], "presentation": "بطاقات بيضاء مستديرة بخطوط فاصلة فاتحة اللون" } }, { "position": "right side", "screen_type": "تحديد أهداف الجري", "header": { "left_icon": "إغلاق X", "center_text": "لنبدأ" { "يجري!", "نص فرعي": "يمكنك فعلها. سنأخذها ببطء. 🦥", "أيقونة اليمين": "ضبط التروس" }, "عرض الهدف المرئي": { "النوع": "محدد تقدم دائري", "التسمية العلوية": "حدد الهدف", "القيمة الرئيسية": "5.00", "الوحدة": "كيلومتر", "الحلقة": "قوس أخضر غامق على حلقة بيج فاتحة", "الرسم التوضيحي": "كسلان صغير يتمدد في الزاوية العلوية اليمنى من الدائرة" }, "خيارات الهدف": { "العدد": 4, "التسميات": [ "2 كيلومتر", "5 كيلومتر", "10 كيلومتر", "نصف ماراثون" ], "نشط": "5 كيلومتر" }, "زر الحث الأساسي": { "التسمية": "ابدأ الجري", "النمط": "زر أخضر غامق كبير مستدير" }, "الإجراء الثانوي": { "التسمية": "تتبع فقط", "الأيقونة": "الموقع" marker" }, "bottom_nav": { "count": 4, "labels": [ "الصفحة الرئيسية", "قيد التشغيل", "الجدول الزمني", "المعلومات الشخصية" ], "active": "قيد التشغيل" } } ] } }