تطبيق جهاز الاستقبال الذي لا يعمل باللمس
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
يُشغّل جهاز الاستقبال المحتوى ويعرض حالته للمستخدم.
يجب أن يستجيب المستلم على الفور للإجراءات في تطبيق المُرسِل . على سبيل المثال، عندما يتم إيقاف المحتوى مؤقتًا على جهاز الاستقبال، يتم عرض رمز الإيقاف المؤقت، وعندما ينقر المستخدم على زر التشغيل في تطبيق الجهاز المرسِل، يبدأ جهاز الاستقبال في تشغيل المحتوى ويزيل رمز الإيقاف المؤقت.
أمثلة على ملاحظات واجهة مستخدم جهاز الاستقبال:
- قيد التشغيل
- متوقف مؤقتًا
- موضع التشغيل / البحث
- جارٍ التخزين المؤقت…
مطلوب
أ ضَع معظم عناصر واجهة المستخدم في الربع السفلي من الشاشة
وحافِظ على اتساقها مع تجارب المستخدم الأخرى.
ب لا تعرِض العناصر كعناصر تحكّم تفاعلية. على سبيل المثال، لا تعِد إنتاج واجهة مستخدم المرسِل على واجهة مستخدم المستلِم.
أفضل الممارسات
- استخدِم الانتقال (التلاشي) والشفافية والفروق الدقيقة لتخفيف التأثير المرئي.
- ضَع في اعتبارك أنّ المستخدمين يريدون الاطّلاع على أكبر قدر ممكن من المحتوى. يوقف المستخدمون المحتوى مؤقتًا في كثير من الأحيان لفحصه، لذا حاوِل إخفاء عناصر واجهة المستخدم غير الضرورية عند الإمكان.
Android
واجهة مستخدم المرسِل
واجهة مستخدم الجهاز المتلقّي
iOS
واجهة مستخدم المرسِل
واجهة مستخدم الجهاز المتلقّي
Chrome
واجهة مستخدم المرسِل
واجهة مستخدم الجهاز المتلقّي
تظهر شاشة خاملة على جهاز الاستقبال عندما يكون متصلاً بجهاز إرسال ولكن لا يتم البث.
مطلوب
A تحديد تطبيق الاستقبال الذي يتم تحميله
أفضل الممارسات
- استخدِم شاشة الاستراحة للترويج للمحتوى أو الميزات من تطبيق المرسِل.
- غيِّر المحتوى كل 30 إلى 60 ثانية لعرض المزيد من المحتوى وتجنُّب احتراق الشاشة.
- إلغاء الربط بتطبيق الاستقبال وإيقافه إذا لم يتم استخدامه لمدة 5 دقائق
عند إيقاف البث، تظهر الشاشة الرئيسية لجهاز الاستقبال، ما يساعد في منع احتراق الشاشة.
Android
مربّع حوار البث، تم الاتصال ولكن لا يتم البث
تم تحميل تطبيق المستلِم / في وضع الخمول
iOS
مربّع حوار البث، تم الاتصال ولكن لا يتم البث
تم تحميل تطبيق المستلِم / في وضع الخمول
عندما يتصل المستخدم بجهاز استقبال، يجب أولاً تحميل تطبيق جهاز الاستقبال قبل أن يتمكّن من عرض حالة عدم نشاط التطبيق أو بدء تشغيل المحتوى.
مطلوب
أ تحديد تطبيق الاستقبال الذي يتم تحميله من خلال عرض
شعار التطبيق
ب تحديد أنّ تطبيق الاستقبال يتم تحميله من خلال عرض
عجلة التحميل المتحركة
Android
جارٍ ربط جهاز المُرسِل
جارٍ تحميل تطبيق الجهاز المتلقّي
iOS
جارٍ ربط جهاز المُرسِل
جارٍ تحميل تطبيق الجهاز المتلقّي
Chrome
جارٍ ربط جهاز المُرسِل
جارٍ تحميل تطبيق الجهاز المتلقّي
بعد تحميل تطبيق الاستقبال، يمكن بدء بث المحتوى إلى جهاز الاستقبال.
مطلوب
أ حدِّد المحتوى الذي يتم تحميله من خلال عرض عنوان المحتوى أو العمل الفني
ب حدِّد أنّ المحتوى قيد التحميل من خلال عرض
عجلة تحميل متحركة
أفضل الممارسات
عند استئناف المحتوى الذي تم إيقافه مؤقتًا، ارجع إلى الخلف بمقدار 5 إلى 10 ثوانٍ لكي لا يفوت المشاهد أي جزء
أثناء الانتقال من الجهاز المرسِل إلى الجهاز المستقبِل.
Android
جارٍ تحميل محتوى المرسِل
جارٍ تحميل المحتوى على الجهاز المستقبِل
iOS
جارٍ تحميل محتوى المرسِل
جارٍ تحميل المحتوى على الجهاز المستقبِل
Chrome
جارٍ تحميل محتوى المرسِل
جارٍ تحميل المحتوى على الجهاز المستقبِل
إجراء مطلوب
أ تحديد المحتوى الذي يتم تشغيله عند بدء تشغيل المحتوى
ب تحديد موضع التشغيل عند تعديل الموضع
ج تحديد أنّ جهاز الاستقبال يبحث عن المحتوى عند تغيير موضع التشغيل، ولكن لم يبدأ التشغيل بعد
Android
تعديل موضع التشغيل من قِبل المُرسِل
بحث جهاز الاستقبال عن المحتوى
iOS
تعديل موضع التشغيل من قِبل المُرسِل
بحث جهاز الاستقبال عن المحتوى
Chrome
تعديل موضع التشغيل من قِبل المُرسِل
بحث جهاز الاستقبال عن المحتوى
مطلوب
أ تحديد أنّ المحتوى متوقف مؤقتًا من خلال عرض رمز الإيقاف المؤقت وموضع التشغيل
ب تحديد المحتوى المتوقف مؤقتًا من خلال عرض عنوان المحتوى أو العمل الفني
ج تحديد تطبيق الاستقبال الذي تم تحميله من خلال عرض شعار التطبيق
أفضل الممارسات
- يوقف المستخدمون المحتوى مؤقتًا في كثير من الأحيان لفحصه، لذا يجب إخفاء عناصر واجهة المستخدم غير الضرورية عند إيقاف المحتوى مؤقتًا لبضع ثوانٍ من خلال عرض رمز الإيقاف المؤقت.
- يجب ألا يواصل تطبيق الاستقبال تشغيل المحتوى إلا إذا تلقّى طلبًا صريحًا من المستخدم لبدء التشغيل، مثل استئناف التشغيل أو تخطّي عنصر في قائمة الانتظار.
- إلغاء الربط بتطبيق الاستقبال وإيقافه عن العمل في حال عدم استخدامه لمدة 20 دقيقة
عند إيقاف البث، تظهر الشاشة الرئيسية لجهاز الاستقبال، ما يساعد في منع احتراق الشاشة. يجب تخزين الموقع الجغرافي الذي تم إيقاف التشغيل فيه مؤقتًا حتى يتمكّن المستخدم من استئناف التشغيل من هذا الموقع في وقت لاحق.
Android
أوقف المُرسِل العملية مؤقتًا
تم إيقاف محتوى المستلِم مؤقتًا
أوقف المُرسِل العملية مؤقتًا
تم إيقاف البث مؤقتًا على جهاز الاستقبال بعد 5 ثوانٍ
iOS
أوقف المُرسِل العملية مؤقتًا
تم إيقاف محتوى المستلِم مؤقتًا
أوقف المُرسِل العملية مؤقتًا
تم إيقاف البث مؤقتًا على جهاز الاستقبال بعد 5 ثوانٍ
Chrome
أوقف المُرسِل العملية مؤقتًا
تم إيقاف محتوى المستلِم مؤقتًا
أوقف المُرسِل العملية مؤقتًا
تم إيقاف البث مؤقتًا على جهاز الاستقبال بعد 5 ثوانٍ
يحدث التخزين المؤقت على جهاز الاستقبال عندما يؤدي وقت استجابة الشبكة أو عوامل أخرى إلى تأخير في التشغيل.
مطلوب
حدِّد أنّ جهاز الاستقبال يخزّن مؤقتًا بعد بضع ثوانٍ من خلال عرض مؤشر تحميل. سيؤدي الانتظار لبضع ثوانٍ للإشارة إلى التخزين المؤقت إلى منع ظهور مؤشر التخزين المؤقت بشكل متكرّر جدًا في حال ضعف الشبكة.
أفضل الممارسات
حدِّد المحتوى الذي يتم تخزينه مؤقتًا إذا استمر التخزين المؤقت بعد 5 ثوانٍ.
Android
المُرسِل يشير إلى التخزين المؤقت لدى المستلِم
تخزين المحتوى مؤقتًا على جهاز الاستقبال
iOS
المُرسِل يشير إلى التخزين المؤقت لدى المستلِم
تخزين المحتوى مؤقتًا على جهاز الاستقبال
Chrome
المُرسِل يشير إلى التخزين المؤقت لدى المستلِم
تخزين المحتوى مؤقتًا على جهاز الاستقبال
عندما يتوقف التشغيل أو تنتهي مهلته، يجب أن تروّج واجهة مستخدم الجهاز المستقبِل لمحتوى أو ميزات أخرى متوفرة في تطبيق الجهاز المرسِل.
مطلوب
تحديد تطبيق الاستقبال الذي يتم تحميله أو الذي يكون في وضع الخمول من خلال
عرض شعار التطبيق
أفضل الممارسات
- استخدام شاشة الاستراحة بعد التشغيل لاقتراح محتوى أو ميزات من تطبيق المرسِل استنادًا إلى المحتوى الذي تم بثه للتو
- تغيير محتوى شاشة وضع الخمول كل 30 إلى 60 ثانية لمنع احتراق الشاشة
- إلغاء الربط بتطبيق الاستقبال وإيقافه إذا لم يتم استخدامه لمدة 5 دقائق
عند إيقاف البث، تظهر الشاشة الرئيسية لجهاز الاستقبال، ما يساعد في منع احتراق الشاشة.
Android
تطبيق المُرسِل غير نشِط
تطبيق الاستقبال غير نشط
تم فصل جهاز المُرسِل
بثّ الشاشة الرئيسية
iOS
تطبيق المُرسِل غير نشِط
تطبيق الاستقبال غير نشط
تم فصل جهاز المُرسِل
بثّ الشاشة الرئيسية
Chrome
تطبيق المُرسِل غير نشِط
تطبيق الاستقبال غير نشط
تم فصل جهاز المُرسِل
بثّ الشاشة الرئيسية
الصور المستخدَمة في دليل التصميم هذا
مقدمة من مؤسسة Blender Foundation، وهي تتم مشاركتها بموجب حقوق الطبع والنشر أو رخصة المشاع الإبداعي.
- Elephant's Dream: (c) حقوق الطبع والنشر 2006، مؤسسة Blender / معهد هولندا للفنون الإعلامية /
www.elephantsdream.org
- Sintel: (c) حقوق الطبع والنشر لمؤسسة Blender Foundation | www.sintel.org
- Tears of Steel: (CC) Blender Foundation | mango.blender.org
- Big Buck Bunny: (c) copyright 2008, Blender Foundation / www.bigbuckbunny.org
إنّ محتوى هذه الصفحة مرخّص بموجب ترخيص Creative Commons Attribution 4.0 ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.
تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\u003cp\u003eReceiver UIs should be minimally intrusive, displaying playback status and content information primarily in the lower quarter of the screen, without replicating sender app controls.\u003c/p\u003e\n"],["\u003cp\u003eWhen the receiver is idle or loading, clear app identification and loading indicators are crucial for a smooth user experience.\u003c/p\u003e\n"],["\u003cp\u003eContent loading and playback states should be clearly communicated to the user, with provisions for buffering and seeking.\u003c/p\u003e\n"],["\u003cp\u003eThe receiver should transition to an idle state when paused or playback is complete, displaying app branding and potentially promoting content to avoid screen burn-in.\u003c/p\u003e\n"],["\u003cp\u003eThroughout all states, visual feedback such as icons, spinners, and content metadata contribute to an intuitive and responsive user interface.\u003c/p\u003e\n"]]],["The receiver displays content and mirrors its state based on sender actions. Key actions include playing, pausing, seeking, and buffering, each visually represented on the receiver. When idle, the receiver shows the app logo and may promote content. When the app is loading or content is loading, it also displays its logo along with a loading spinner. When the receiver stops casting, it reverts to an idle state promoting other content or features.\n"],null,["# Non-Touch Receiver App\n\nThe receiver plays content and reflects its state to the user.\nThe receiver must respond immediately to actions in the sender app . For example, when content is\npaused on the receiver, it displays a pause icon and when the user presses play on the sender app,\nthe receiver starts playing the content and removes the pause icon.\n\nExamples of receiver UI feedback:\n\n- Playing\n- Paused\n- Playback position / seeking\n- Buffering\n\n### [Receiver UI](#receiver-ui-elements)\n\n\n**Required**\n\n\nA Place most UI elements within the lower 1/4 of the screen\nand keep it consistent with your other UX's.\n\n\nB Do not present elements as interactive controls. For\nexample, do not reproduce the sender UI on the receiver UI.\n\n\n**Best practices**\n\n- Use transition (fade), transparency, and nuance to soften the visual effect.\n- Consider the fact that users want to see as much of the content as possible. Users will often pause content to examine it, so fade away unnecessary UI when possible.\n\n### Android\n\nSender UI \nReceiver UI \n\n### iOS\n\nSender UI \nReceiver UI \n\n### Chrome\n\nSender UI \nReceiver UI \n\n### [Receiver app idle](#receiver-ui-idle)\n\nAn idle screen is displayed on the receiver, when the receiver is connected to a sender but not\ncasting.\n\n\n**Required**\n\n\nA Identify which receiver app is loaded\n\n**Best practices**\n\n- Use the idle screen to promote content or features from the sender app.\n- Change the content every 30-60 seconds to display more and prevent screen burn.\n- Disconnect from the receiver app and stop it from running if idle for 5 minutes. When stopped, the receiver home screen appears and will help prevent screen burn.\n\n### Android\n\nCast dialog, connected but not casting \nReceiver app loaded / idle \n\n### iOS\n\nCast dialog, connected but not casting \nReceiver app loaded / idle \n\n### [Receiver app loading](#receiver-player-loading)\n\nWhen a user connects to a receiver, the receiver app must first load before it can display the\napp idle state or begin playing content.\n\n\n**Required**\n\n\nA Identify which receiver app is loading by displaying the\napp logo\n\n\nB Identify that the receiver app is loading by displaying\nthe animated loading spinner \n\n### Android\n\nSender connecting \nReceiver app loading \n\n### iOS\n\nSender connecting \nReceiver app loading \n\n### Chrome\n\nSender connecting \nReceiver app loading \n\n### [Receiver content loading](#receiver-content-loading)\n\nOnce the receiver app has loaded, content can begin streaming to the receiver.\n\n\n**Required**\n\n\nA Identify what content is being loaded by displaying the\ncontent title or artwork\n\n\nB Identify that content is loading by displaying an\nanimated loading spinner\n\n\n**Best practices**\n\n\nWhen resuming paused content, rewind playback 5-10 seconds so the viewer doesn't miss anything\nduring the transition from sender to receiver. \n\n### Android\n\nSender content loading \nReceiver content loading \n\n### iOS\n\nSender content loading \nReceiver content loading \n\n### Chrome\n\nSender content loading \nReceiver content loading \n\n### [Receiver playback](#receiver-ui-seek)\n\n\n**Required**\n\n\nA Identify what is playing when content starts\n\n\nB Identify playback position when position is adjusted\n\n\nC Identify that the receiver is seeking content when the\nplayback position is changed, but not yet playing \n\n### Android\n\nSender adjusting play position \nReceiver content seeking \n\n### iOS\n\nSender adjusting play position \nReceiver content seeking \n\n### Chrome\n\nSender adjusting play position \nReceiver content seeking \n\n### [Receiver paused](#receiver-ui-pause)\n\n\n**Required**\n\n\nA Identify that content is paused by displaying a paused\nicon and playback position\n\n\nB Identify what content is paused by displaying content\ntitle or artwork\n\n\nC Identify which receiver app is loaded by displaying an\napp logo\n\n**Best practices**\n\n- Users will often pause content to examine it, so have unnecessary UI fade away when paused for a few seconds by displaying a pause icon.\n- The receiver app should not continue content playback unless there is an explicit request from the user to begin playback such as resume, or skipping an item on the queue.\n- Disconnect from the receiver app and stop it from running if idle for 20 minutes. When stopped, the receiver home screen appears and will help prevent screen burn. Store the paused location so that the user can resume playback from that point at a later time.\n\n### Android\n\nSender paused \nReceiver content paused \nSender paused \nReceiver paused, after 5 seconds \n\n### iOS\n\nSender paused \nReceiver content paused \nSender paused \nReceiver paused, after 5 seconds \n\n### Chrome\n\nSender paused \nReceiver content paused \nSender paused \nReceiver paused, after 5 seconds \n\n### [Receiver buffering](#receiver-ui-buffer)\n\nBuffering on the receiver happens when network latency or other factors cause a delay in playback.\n\n\n**Required**\n\n\nA Identify that the receiver is buffering after a few\nseconds by displaying a buffering spinner. Waiting a few seconds to indicate buffering will\nprevent the buffering spinner from appearing too frequently under bad network conditions\n\n\n**Best practices**\n\n\nIdentify what content is buffering if buffering continues after 5 seconds. \n\n### Android\n\nSender indicates receiver buffering \nReceiver content buffering \n\n### iOS\n\nSender indicates receiver buffering \nReceiver content buffering \n\n### Chrome\n\nSender indicates receiver buffering \nReceiver content buffering \n\n### [Receiver stops cast](#receiver-ui-complete)\n\nWhen playback stops or times out, the receiver UI should promote other content or features\navailable in the sender app.\n\n\n**Required**\n\n\nA Identify which receiver app is loaded or idle by\ndisplaying an app logo\n\n**Best practices**\n\n- Use the idle screen after playback to recommend content or features from the sender app, based on what was just cast\n- Change the idle screen content every 30-60 seconds to prevent screen burn\n- Disconnect from the receiver app and stop it from running if idle for 5 minutes. When stopped, the receiver home screen appears and will help prevent screen burn.\n\n### Android\n\nSender app idle \nReceiver app idle \nSender disconnected \nCast home screen \n\n### iOS\n\nSender app idle \nReceiver app idle \nSender disconnected \nCast home screen \n\n### Chrome\n\nSender app idle \nReceiver app idle \nSender disconnected \nCast home screen \n\n**Images used in this design guide**\nare courtesy of the Blender Foundation, shared under copyright or Creative Commons license.\n\n- Elephant's Dream: (c) copyright 2006, Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org\n- Sintel: (c) copyright Blender Foundation \\| www.sintel.org\n- Tears of Steel: (CC) Blender Foundation \\| mango.blender.org\n- Big Buck Bunny: (c) copyright 2008, Blender Foundation / www.bigbuckbunny.org"]]
