برنامه گیرنده غیر لمسی
با مجموعه‌ها، منظم بمانید
ذخیره و طبقه‌بندی محتوا براساس اولویت‌های شما.
گیرنده محتوا را پخش می کند و وضعیت آن را به کاربر منعکس می کند. گیرنده باید فوراً به اقدامات موجود در برنامه فرستنده پاسخ دهد. به عنوان مثال، هنگامی که محتوا در گیرنده مکث می شود، نماد مکث نمایش داده می شود و هنگامی که کاربر روی برنامه فرستنده پخش را فشار می دهد، گیرنده شروع به پخش محتوا می کند و نماد مکث را حذف می کند.
نمونه هایی از بازخورد رابط کاربری گیرنده:
- در حال پخش
- مکث کرد
- موقعیت پخش / جستجو
- بافر کردن
مورد نیاز
A اکثر عناصر UI را در 1/4 پایین صفحه قرار دهید و آن را با سایر UX های خود سازگار نگه دارید.
B عناصر را به عنوان کنترل های تعاملی ارائه نکنید. به عنوان مثال، رابط کاربر فرستنده را در رابط کاربری گیرنده بازتولید نکنید.
بهترین شیوه ها
- از انتقال (محو شدن)، شفافیت، و ظرافت برای نرم کردن جلوه بصری استفاده کنید.
- این واقعیت را در نظر بگیرید که کاربران می‌خواهند تا حد امکان محتوا را ببینند. کاربران اغلب محتوا را متوقف می کنند تا آن را بررسی کنند، بنابراین در صورت امکان، UI غیر ضروری را محو کنید.
اندروید
رابط کاربر فرستنده
رابط کاربری گیرنده
iOS
رابط کاربر فرستنده
رابط کاربری گیرنده
کروم
رابط کاربر فرستنده
رابط کاربری گیرنده
هنگامی که گیرنده به فرستنده متصل است اما در حال ارسال نیست، یک صفحه بیکار روی گیرنده نمایش داده می شود.
مورد نیاز
یک برنامه گیرنده را مشخص کنید که بارگیری شده است
بهترین شیوه ها
- از صفحه غیرفعال برای تبلیغ محتوا یا ویژگی های برنامه فرستنده استفاده کنید.
- برای نمایش بیشتر و جلوگیری از سوختن صفحه، محتوا را هر 30-60 ثانیه تغییر دهید.
- برنامه گیرنده را قطع کنید و در صورت بیکار بودن به مدت 5 دقیقه از اجرای آن جلوگیری کنید. وقتی متوقف شد، صفحه اصلی گیرنده ظاهر می شود و به جلوگیری از سوختن صفحه کمک می کند.
اندروید
گفتگوی ارسال، متصل است اما ارسال نمی‌شود
برنامه گیرنده بارگیری شد / بیکار
iOS
گفتگوی ارسال، متصل است اما ارسال نمی‌شود
برنامه گیرنده بارگیری شد / بیکار
هنگامی که کاربر به گیرنده متصل می شود، برنامه گیرنده باید ابتدا بارگیری شود تا بتواند وضعیت بیکار برنامه را نمایش دهد یا شروع به پخش محتوا کند.
مورد نیاز
با نمایش لوگوی برنامه، مشخص کنید کدام برنامه گیرنده در حال بارگیری است
B با نمایش چرخنده بارگیری متحرک، مشخص کنید که برنامه گیرنده در حال بارگیری است
اندروید
فرستنده در حال اتصال
بارگیری برنامه گیرنده
iOS
فرستنده در حال اتصال
بارگیری برنامه گیرنده
کروم
فرستنده در حال اتصال
بارگیری برنامه گیرنده
هنگامی که برنامه گیرنده بارگیری شد، محتوا می تواند شروع به پخش جریانی به گیرنده کند.
مورد نیاز
A با نمایش عنوان محتوا یا اثر هنری، محتوایی که بارگذاری می شود را مشخص کنید
B با نمایش یک چرخنده بارگذاری متحرک مشخص کنید که محتوا در حال بارگیری است
بهترین شیوه ها
هنگام از سرگیری محتوای متوقف شده، پخش را 5 تا 10 ثانیه به عقب برگردانید تا بیننده در طول انتقال از فرستنده به گیرنده چیزی را از دست ندهد.
اندروید
بارگیری محتوای فرستنده
بارگیری محتوای گیرنده
iOS
بارگیری محتوای فرستنده
بارگیری محتوای گیرنده
کروم
بارگیری محتوای فرستنده
بارگیری محتوای گیرنده
مورد نیاز
A مشخص کنید هنگام شروع محتوا چه چیزی در حال پخش است
B هنگام تنظیم موقعیت، موقعیت پخش را شناسایی کنید
C مشخص کنید که گیرنده هنگام تغییر موقعیت پخش به دنبال محتوا است، اما هنوز پخش نشده است
اندروید
فرستنده موقعیت بازی را تنظیم می کند
جستجوی محتوای گیرنده
iOS
فرستنده موقعیت بازی را تنظیم می کند
جستجوی محتوای گیرنده
کروم
فرستنده موقعیت بازی را تنظیم می کند
جستجوی محتوای گیرنده
مورد نیاز
A با نمایش نماد متوقف شده و موقعیت پخش، مشخص کنید که محتوا متوقف شده است
B با نمایش عنوان محتوا یا اثر هنری، محتوایی را که متوقف می شود، مشخص کنید
C با نمایش لوگوی برنامه، برنامه گیرنده را مشخص کنید
بهترین شیوه ها
- کاربران اغلب محتوا را برای بررسی آن متوقف می‌کنند، بنابراین با نمایش نماد مکث، رابط کاربری غیرضروری در صورت توقف برای چند ثانیه محو می‌شود.
- برنامه گیرنده نباید پخش محتوا را ادامه دهد مگر اینکه درخواست صریح کاربر برای شروع پخش مانند ازسرگیری یا رد کردن یک مورد در صف وجود داشته باشد.
- برنامه گیرنده را قطع کنید و در صورت بیکار بودن به مدت 20 دقیقه از اجرای آن جلوگیری کنید. وقتی متوقف شد، صفحه اصلی گیرنده ظاهر می شود و به جلوگیری از سوختن صفحه کمک می کند. مکان مکث شده را ذخیره کنید تا کاربر بتواند بعداً از آن نقطه پخش را از سر بگیرد.
اندروید
فرستنده مکث کرد
محتوای گیرنده متوقف شد
فرستنده مکث کرد
گیرنده پس از 5 ثانیه مکث کرد
iOS
فرستنده مکث کرد
محتوای گیرنده متوقف شد
فرستنده مکث کرد
گیرنده پس از 5 ثانیه مکث کرد
کروم
فرستنده مکث کرد
محتوای گیرنده متوقف شد
فرستنده مکث کرد
گیرنده پس از 5 ثانیه مکث کرد
بافر روی گیرنده زمانی اتفاق می‌افتد که تأخیر شبکه یا عوامل دیگر باعث تأخیر در پخش شود.
مورد نیاز
A با نمایش اسپینر بافر، پس از چند ثانیه مشخص کنید که گیرنده در حال بافر است. چند ثانیه منتظر ماندن برای نشان دادن بافر، از نمایش مکرر اسپینر بافر در شرایط بد شبکه جلوگیری می کند.
بهترین شیوه ها
اگر پس از 5 ثانیه بافر ادامه یابد، محتوای بافر را مشخص کنید.
اندروید
فرستنده بافر شدن گیرنده را نشان می دهد
بافر کردن محتوای گیرنده
iOS
فرستنده بافر شدن گیرنده را نشان می دهد
بافر کردن محتوای گیرنده
کروم
فرستنده بافر شدن گیرنده را نشان می دهد
بافر کردن محتوای گیرنده
وقتی پخش متوقف می‌شود یا زمان آن تمام می‌شود، رابط کاربری گیرنده باید سایر محتواها یا ویژگی‌های موجود در برنامه فرستنده را تبلیغ کند.
مورد نیاز
با نمایش نشان‌واره برنامه، مشخص کنید کدام برنامه گیرنده بارگیری شده یا بی‌حرکت است
بهترین شیوه ها
- برای توصیه محتوا یا ویژگی‌های برنامه فرستنده، پس از پخش، از صفحه بیکار استفاده کنید
- برای جلوگیری از سوختن صفحه، محتوای صفحه بیکار را هر 30 تا 60 ثانیه تغییر دهید
- برنامه گیرنده را قطع کنید و در صورت بیکار بودن به مدت 5 دقیقه از اجرای آن جلوگیری کنید. وقتی متوقف شد، صفحه اصلی گیرنده ظاهر می شود و به جلوگیری از سوختن صفحه کمک می کند.
اندروید
برنامه فرستنده بیکار است
برنامه گیرنده بیکار است
ارتباط فرستنده قطع شد
پخش صفحه اصلی
iOS
برنامه فرستنده بیکار است
برنامه گیرنده بیکار است
ارتباط فرستنده قطع شد
پخش صفحه اصلی
کروم
برنامه فرستنده بیکار است
برنامه گیرنده بیکار است
ارتباط فرستنده قطع شد
پخش صفحه اصلی
تصاویر استفاده شده در این راهنمای طراحی توسط بنیاد Blender ساخته شده است و تحت مجوز کپی رایت یا Creative Commons به اشتراک گذاشته شده است.
- رویای فیل: (ج) حق چاپ 2006، بنیاد بلندر / موسسه هنر رسانه هلند / www.elephantsdream.org
- Sintel: (ج) کپی رایت Blender Foundation | www.sintel.org
- Tears of Steel: (CC) Blender Foundation | mango.blender.org
- Big Buck Bunny: (ج) حق چاپ 2008، Blender Foundation / www.bigbuckbunny.org
جز در مواردی که غیر از این ذکر شده باشد،محتوای این صفحه تحت مجوز Creative Commons Attribution 4.0 License است. نمونه کدها نیز دارای مجوز Apache 2.0 License است. برای اطلاع از جزئیات، به خطمشیهای سایت Google Developers مراجعه کنید. جاوا علامت تجاری ثبتشده Oracle و/یا شرکتهای وابسته به آن است.
تاریخ آخرین بهروزرسانی 2025-07-24 بهوقت ساعت هماهنگ جهانی.
[[["درک آسان","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-24 بهوقت ساعت هماهنگ جهانی."],[[["\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"]]
