التصميم للشاشات الكبيرة من البداية

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

عند البدء في تصميم تطبيقك، ضَع في اعتبارك حالات الاستخدام المختلفة. على سبيل المثال:

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

  • قد ينفّذ المستخدمون مهام متعددة أثناء مشاهدة فيديو في إعداد النوافذ المتعددة أو يستفيدون من الشاشة الأكبر لإجراء تعديلات أكثر تعقيدًا بعد التقاط صورة.

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

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

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

جعل تطبيق الوسائط متجاوبًا تلقائيًا

تجنَّب تجارب المستخدم غير السلسة في تطبيق الوسائط من خلال جعل تصميم تطبيقك قابلاً للتكيّف مع الهواتف والأجهزة اللوحية والأجهزة القابلة للطي وأجهزة ChromeOS.

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

التصميم وفقًا للإرشادات

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

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

تحدّد الإرشادات مجموعة شاملة من متطلبات الجودة لمعظم أنواع تطبيقات Android.

المستوى 3:

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

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

المستوى 2:

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

المستوى 1:

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

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

التصاميم المحسّنة

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

توفّر مكوّنات شريط التنقّل والدرج تنقّلاً غير مباشر لتوفير الراحة والتحكّم في واجهة المستخدم. تكمّل المكوّنات أيضًا التصاميم الأساسية (عرض على شكل قائمة مع تفاصيل والخلاصة واللوحة الثانوية) من خلال وضع وجهات التنقّل الأساسية في متناول اليد مع شغل الحد الأدنى من مساحة الشاشة.

تصاميم الوسائط

اجعل تطبيقك أكثر سهولة في الاستخدام من خلال تطبيق تصاميم خاصة بالوسائط لعرض على شكل قائمة مع تفاصيل والخلاصة واللوحة الثانوية. للحصول على معلومات عن تصاميم MDX وFlutter و Compose، يُرجى الاطّلاع على مقالة موارد التصميم.

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

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

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

للاطّلاع على مجموعة منظّمة من تصاميم الوسائط، يُرجى الاطّلاع على معرض الوسائط.

تصاميم وسائل التواصل الاجتماعي

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

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

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

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

للاطّلاع على مجموعة منظّمة من تصاميم وسائل التواصل الاجتماعي، يُرجى الاطّلاع على صفحة معرض وسائل التواصل الاجتماعي.

أفضل الممارسات لتطبيقات الوسائط على الشاشات الكبيرة

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

الاتجاه وتغيير الحجم

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

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

إنّ أي قيود على الاتجاه تقلّل من الطرق التي يمكن للمستخدمين من خلالها التفاعل مع المحتوى أو استهلاك الوسائط، ما يحدّ من استخدام تطبيقك. يمكن أن يؤثر تغيير الاتجاه في الحجم إلى حد ما، ولكنّ تغيير الحجم لن يؤدي بالضرورة إلى تغيير الاتجاه.

اختصارات لوحة المفاتيح

على شاشة أكبر، من المرجّح أن يتم استخدام اختصارات لوحة المفاتيح على لوحات المفاتيح الخارجية، مثل البدء والإيقاف والإيقاف المؤقت والترجيع والتقديم، ما يقدّم تجربة مستخدم متسقة مع لوحة المفاتيح.

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

دعم معاينة الكاميرا

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

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

لمزيد من المعلومات، يُرجى الاطّلاع على مقالة معاينة CameraX، أو معاينة Camera2.

أوضاع الأجهزة القابلة للطي

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

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