تتألف منظومة Wear OS المتكاملة من أجهزة ذات أحجام مختلفة للشاشات. من الضروري استخدام مبادئ واجهة المستخدم التكيُّفية لتوفير تجربة بأعلى مستويات الجودة لجميع المستخدمين.
ما هي واجهة المستخدم التكيُّفية؟
يتم تمديد واجهات المستخدم التكيُّفية وتغييرها للاستفادة إلى أقصى حدّ ممكن من كل مساح الشاشة المتاحة، بغض النظر عن حجم الشاشة التي يتم عرضها عليها.
تتغيّر واجهات المستخدم التكيُّفية استجابةً للتغييرات، وذلك باستخدام المكوّنات والأساليب المضمّنة مباشرةً في منطق التنسيق. وتستخدم هذه التنسيقات أيضًا نقاط فاصل حجم الشاشة، ما يؤدي إلى تطبيق تصميم مختلف على أحجام شاشات مختلفة، وذلك لتوفير تجربة أكثر ثراءً للمستخدمين.
أحجام الشاشة الرئيسية

التعرّف على الأحجام المرجعية الرئيسية التي يجب أخذها في الاعتبار عند تصميم تجارب جديدة
أنواع التنسيقات
عند تصميم تنسيقات قابلة للتكيّف على الشاشة المستديرة، يكون لكل من طرق العرض التي تتيح الانتقال للأعلى أو للأسفل وتلك التي لا تتيح ذلك متطلبات فريدة لتوسيع عناصر واجهة المستخدم والحفاظ على تنسيق ومكوّنات متوازنة.

يجب تحديد كل الهوامش العلوية والسفلية والجانبية بالنسب المئوية لتجنُّب الاقتصاص وتوفير مقياس نسبي للعناصر.

يجب تحديد جميع الهوامش كنسب مئوية، ويجب تحديد القيود الرأسية بحيث يمكن التمديد للمحتوى الرئيسي في الوسط لملء المساحة المتاحة.
إضافة قيمة من خلال التنسيقات والممارسات التصميمية التكيُّفية
عند تصميم تنسيقات قابلة للتكيّف على الشاشة المستديرة، يكون لكل من طرق العرض التي تتيح الانتقال للأعلى أو للأسفل وتلك التي لا تتيح ذلك متطلبات فريدة لتوسيع عناصر واجهة المستخدم والحفاظ على تنسيق ومكوّنات متوازنة.
الصور التالية هي اقتراحات عامة، والأمثلة مخصّصة لأغراض توضيحية فقط. يمكنك الاطّلاع على كل مكوّن أو صفحة عرض للحصول على إرشادات مفصّلة وسياقية ومتوافقة مع مختلف الأجهزة.

تسمح التنسيقات السريعة الاستجابة بعرض المزيد من الشرائح والبطاقات وخطوط النص والأزرار على شاشة واحدة.

استخدِم تنسيقات جديدة يتم تطبيقها عند نقاط فاصل محدّدة لحجم الشاشة، للسماح بعرض محتوى جديد كلما أمكن ذلك، ما يقدّم للمستخدم قيمة إضافية على الأجهزة التي تتضمّن شاشات أكبر حجمًا.

استخدِم مساحة إضافية على الشاشة لتوفير حاويات أكبر ونص أكبر وحلقات أكثر سمكًا ورسومًا بيانية أدق لتوفير إمكانية اطّلاع أفضل للمستخدمين.

استخدِم مساحة إضافية على الشاشة لتوفير أهداف أكبر للنقر، وتسلسل هرمي مرئي أكبر، ومساحة إضافية بين عناصر المحتوى لتسهيل التفاعل مع الواجهات.

استخدِم المكوّنات والقوالب المعدّلة لتوفير مظهر وأسلوب أفضل لواجهات المستخدم على جميع أحجام الشاشات.
جودة التطبيق

يتم تنظيم إرشادات الجودة في ثلاثة مستويات. يمكنك توفير أفضل تجربة ممكنة للمستخدمين من خلال استيفاء الإرشادات في جميع الفئات الثلاث.
التوافق مع جميع أحجام الشاشات |
التوافق مع مختلف الأجهزة وتحسين الأداء |
متوافقة ومتمايزة |
استخدام تنسيقات أساسية راسخة

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