Nutzererfahrung mit der Google Cast-Plattform
Mit Sammlungen den Überblick behalten
Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.
Mit Google Cast können Android-, iOS- und Chrome-Web-Apps Inhalte wie Video, Audio und Bildschirmfreigabe (Spiegelung) auf Cast-kompatible Geräte streamen, z. B.:
- Google Chromecast
- Fernseher, die mit Google Cast funktionieren
- Lautsprecher, die mit Google Cast funktionieren
- Smart Displays (tragbarer LCD-Touchscreen-Monitor, der als Thin Client verwendet wird)
- Android-Tablets
Im Google Cast-Interaktionsmodell ist das Smartphone, Tablet oder Laptop der Sender, der als Fernbedienung zur Steuerung der Wiedergabe dient. Der Fernseher, das Display oder das angedockte Tablet ist der Empfänger, der Anweisungen vom Sender empfängt und die Inhalte über die Internetverbindung des Empfängers anzeigt. Alle Nutzeraktionen (Tippen und Wischen) können sowohl auf dem Sendergerät als auch auf dem Webempfänger erfolgen.
Das Streaming erfordert die Koordination zwischen zwei oder mehr Bildschirmen – der Benutzeroberfläche des Senders und der des Empfängers. Wenn Sie beispielsweise auf einem Mobilgerät eine Taste drücken, um die Inhalte zu pausieren, sollte auf dem Fernseher angezeigt werden, dass die Wiedergabe pausiert ist. Auf dem Mobilgerät sollte hingegen eine Wiedergabetaste angezeigt werden, um die Wiedergabe fortzusetzen.
Hinweise
Aufgrund von Hardware- und Ressourceneinschränkungen gelten für Google Cast-fähige Apps bestimmte Einschränkungen:
- Das Übertragungsgerät ist ein energiesparendes Gerät mit Speicher-, CPU- und GPU-Einschränkungen. Daher sollte die Web Receiver-App so klein wie möglich sein.
- Für Cast- und Google Cast-Interaktionsmodelle können Tabs, Fenster oder Pop-ups sowohl im Webreceiver als auch in der Sender-App erstellt werden. Außerdem können Nutzereingaben wie Tippen oder Wischen direkt akzeptiert werden. Beispielsweise kann die Web Receiver App auf einem angedockten Tablet oder Display eine Pausenschaltfläche anzeigen und den Tipp eines Nutzers empfangen. So müssen alle Aktionen in der Anwendung entweder von einem Webempfänger oder einer Senderanwendung ausgelöst werden.
- Smart Displays unterstützen die Nutzereingabe über eine Sender-App oder per Touchbedienung auf der Benutzeroberfläche.
- Der Web Receiver ist ein Chrome-Browser, der für die Videowiedergabe optimiert ist. Daher werden WebGL und Chrome Native Client (NaCL) sowie Chrome-Erweiterungen derzeit nicht unterstützt.
- Cast unterstützt die gleichzeitige Wiedergabe eines einzelnen Medienstreams in den
<audio>- und <video>-Tags oder mehrere Audiotracks mit der WebAudio API. Im DOM darf immer nur ein Videoelement aktiv sein.
Außerdem werden Zusammensetzung, Bearbeitung, Transformationen, Drehungen und Zoomen von Videos nicht unterstützt.
Allgemeine Designprinzipien
Beachten Sie beim Entwickeln der Benutzeroberfläche Folgendes:
Web-Empfängeroberfläche:
- Der Webreceiver kann sowohl interaktive als auch informative Elemente enthalten, um den Status der App zu beschreiben, z. B. „angehalten“ oder „wiedergegeben“ oder Fehlermeldungen. Die Nutzerinteraktion kann über den Cast-Sender (Smartphone, Tablet oder Chrome-Browser) oder den Webempfänger (Fernseher, Displays oder Tablets) erfolgen.
- Denken Sie daran, dass die Videoaktion in der Mitte des Fernsehbildschirms stattfindet und dass Ihre UI-Elemente die Präsentation nicht beeinträchtigen sollten. Platziere die UI-Elemente im unteren Drittel des Webreceiver-Displays und lasse einen Rand von 10 % an den Rändern des Displays für einen möglichen Overscan.
- Sofern möglich, sollten Übergänge von einem Bildschirmstatus zum nächsten flüssig und filmisch wirken. Verwenden Sie anstelle abrupter Übergänge von Status zu Status Übergänge wie Ein- und Ausblenden. Beispielsweise bleibt der Ladevorgang des Inhalts auf dem Bildschirm und verschwindet dann langsam in der Medienwiedergabe.
Absenderoberfläche:
- Der Absender unterstützt Nutzeraktionen und der Webempfänger zeigt Statusinformationen an.
Wenn Inhalte beispielsweise angehalten werden, sollte der Fernseher dies anzeigen, während auf dem Mobilgerät angezeigt wird, dass die Wiedergabe gestartet werden kann (z. B. durch eine Wiedergabeschaltfläche).
- Geschwindigkeit ist alles. Nutzer müssen die Übertragungssteuerung schnell finden und die Inhalte sofort auf dem großen Bildschirm abspielen können. Erstelle während des Ladevorgangs animierte Ladeanzeigen und verwende Übergänge, damit die App schneller geladen wird.
Ob deine Cast-App diesen Prinzipien entspricht, kannst du am einfachsten prüfen, indem du deine Benutzeroberfläche anhand der Design-Checkliste für Cast durchführst und deine Cast-Apps testest.
Markenrichtlinien
Die folgenden Google Cast-Markenrichtlinien richten sich an App-Entwickler und konzentrieren sich auf die zusätzlichen Anforderungen, die Sie bei der Beschreibung Ihrer App erfüllen müssen.
Markenrichtlinien für Cast-Geräte finden Sie im Marketing-Hub für Partner.
Sie können andere darüber informieren, dass Ihre App mit Google Cast funktioniert, indem Sie den Begriff „für Google Cast optimiert“ verwenden. Ihre App muss jedoch den zusätzlichen Nutzungsbedingungen für Entwickler des Cast SDK und der Design-Checkliste entsprechen. Außerdem muss die Verwendung von „Mit Google Cast“ unseren Branding-Richtlinien entsprechen.
Entsprechend können Sie ein Google Cast-Logo verwenden, sofern Ihre App oder Ihr Gerät unseren Kennzeichenrichtlinien entspricht. Google behält sich das Recht vor, Sie aufzufordern, das Logo zu ändern oder die Verwendung einzustellen, wenn es nicht den Markenrichtlinien entspricht.
„Google Cast“ im Text
- Wenn Sie eine App (kein Hardwareprodukt) als für Google Cast optimiert beschreiben, verwenden Sie den Begriff „für Google Cast optimiert“. Beispiel: „Diese App ist für
Google Cast optimiert.“
- Verwenden Sie bei der Beschreibung eines Cast-kompatiblen Hardwareprodukts eines Drittanbieters die Formulierungen „Dieser {Fernseher} funktioniert mit Google Cast“ oder „Diese {Lautsprecher} funktionieren mit Google Cast“.
- „Google“ und „Cast“ werden großgeschrieben.
- In allen Marketing-Assets, in denen „Google Cast“ im Text oder im Logo verwendet wird, muss der folgende rechtliche Hinweis enthalten sein: „Google Cast ist eine Marke von Google LLC.“
- Fügen Sie den Begriff „Google Cast“ nicht in den Titel der App ein (z. B. XYZ Google Cast App).
Nachrichten in für Google Cast optimierten Apps
So können Sie für Ihre App werben:
- „XYZ ist eine für Google Cast optimierte App, mit der Sie Ihre Lieblingsunterhaltung von Ihrem Mobilgerät auf Ihren Fernseher streamen können.“
- „Die XYZ-App ist jetzt für Fernseher verfügbar, die mit Google Cast funktionieren.“
- „Die XYZ App ist jetzt für alle Google Cast-Produkte verfügbar, einschließlich Google Chromecast, Google Cast Audio sowie Fernseher und Lautsprecher, die mit Google Cast kompatibel sind.“
- „Die XYZ-App ist für Google Cast optimiert. Sie können also alle Ihre Lieblingssendungen, -filme, -musik und -spiele auf Ihrem Fernseher ansehen, der mit Google Cast kompatibel ist.“
- „Die App XYZ unterstützt jetzt Google Cast, sodass Nutzer Inhalte von ihrem Smartphone auf ihren Fernseher streamen können, der mit Google Cast kompatibel ist.“
Google Cast-Logo
Sie können die Logos „Google Cast“ auf Ihrer Website, in Ihrem App-Shop-Eintrag, in Marketingmaterialien und Werbematerialien verwenden, um die Kompatibilität mit Geräten zu zeigen, die das Cast-Protokoll verwenden.
- Ändern Sie weder die Farbe noch die Proportionen, den Abstand oder andere Aspekte des Logos.
- Wenn das Google Cast-Logo zusammen mit Logos für andere Technologien verwendet wird (z. B. Bluetooth, Spotify Connect, AirPlay), muss es mindestens so groß sein wie diese.
- Das Logo darf nicht das Hauptelement auf Ihrer Seite sein.
- Lassen Sie etwas Abstand zwischen dem Logo und anderen Logos und Symbolen auf Ihrer Seite.
- Verwenden Sie ein schwarzes Logo, wenn es auf einem weißen, hellen oder mittelhellen Hintergrund verwendet wird.
- Verwenden Sie das weiße Logo, wenn es auf einem schwarzen oder dunkel getönten Hintergrund verwendet wird.
- Verwenden Sie das Logo nicht auf Seiten, die Inhalte nur für Erwachsene enthalten oder anzeigen, für Glücksspiele werben, Gewalt fördern, Hassreden enthalten, mit dem Verkauf von Tabak oder Alkohol an Personen unter 21 Jahren in Zusammenhang stehen, gegen andere geltende Gesetze oder Bestimmungen verstoßen oder in anderer Weise unzulässig sind.
Verknüpfung mit Logos
Bei der Onlinenutzung muss das Google Cast-Logo mit einem der folgenden Elemente verknüpft sein:
- Liste der für Google Cast optimierten Apps und Produkte von Google unter g.co/castapps
- Eine Liste der von Ihnen veröffentlichten Produkte.
- Eine bestimmte, von Ihnen veröffentlichte Produktdetailseite.
- Eine Liste der von Ihnen veröffentlichten Apps.
- Eine von Ihnen veröffentlichte App-Detailseite bei Google Play oder im Apple App Store.
Google Cast-Logo-Assets herunterladen
Das Downloadpaket enthält die Formate Portable Network Graphics (.png), Adobe Illustrator (.ai) und Encapsulated Postscript (.eps).
Vorschau der Google Cast-Logos ansehen
Auf der Seite Richtlinien für Logos im Partner Hub finden Sie alle verfügbaren Logos und eine Anleitung zur Verwendung.
Sofern nicht anders angegeben, sind die Inhalte dieser Seite unter der Creative Commons Attribution 4.0 License und Codebeispiele unter der Apache 2.0 License lizenziert. Weitere Informationen finden Sie in den Websiterichtlinien von Google Developers. Java ist eine eingetragene Marke von Oracle und/oder seinen Partnern.
Zuletzt aktualisiert: 2025-07-25 (UTC).
[null,null,["Zuletzt aktualisiert: 2025-07-25 (UTC)."],[[["\u003cp\u003eGoogle Cast enables streaming of content like video and audio from Android, iOS, and Chrome to compatible devices.\u003c/p\u003e\n"],["\u003cp\u003eThe sender device (phone, tablet, laptop) acts as a remote, while the receiver device (TV, speaker, display) plays the content.\u003c/p\u003e\n"],["\u003cp\u003eBoth sender and receiver UIs must be coordinated for a seamless user experience, with actions reflected on both.\u003c/p\u003e\n"],["\u003cp\u003eWeb Receiver applications should be lightweight due to device limitations, and interactive elements should be strategically placed for optimal viewing.\u003c/p\u003e\n"],["\u003cp\u003eGoogle Cast branding guidelines must be followed when promoting app compatibility, including using the approved badge and messaging.\u003c/p\u003e\n"]]],["Google Cast enables content streaming from sender devices (phones, tablets, laptops) to receiver devices (Chromecast, Cast-enabled TVs/speakers/displays). Senders act as remote controls, while receivers display content from their internet connection. Both sender and receiver UIs coordinate actions like pausing/playing. Design considerations include lightweight receiver apps, UI placement within the lower third of the screen, and smooth transitions. Apps can be described as \"Google Cast-enabled\" and use a Google Cast badge, following specific branding guidelines and linking requirements.\n"],null,["# User Experience With the Google Cast Platform\n\nGoogle Cast allows Android, iOS, and Chrome web apps to \"stream\" content ---\nlike video, audio and screen sharing (mirroring) --- to Cast-ready devices\nlike:\n\n- Google Chromecast\n- TVs that work with Google Cast\n- Speakers that work with Google Cast\n- Smart Displays (a portable touchscreen LCD monitor used as a thin client)\n- Android Tablets\n\nIn the Google Cast interaction model, the mobile phone, tablet or laptop is the\n**sender** which acts as a remote control to control the playback, and the TV,\ndisplay or docked tablet is the **receiver** which receives instructions from\nthe sender and displays the content from the receiver's Internet connection. All\nthe user actions (taps and swipes) can take place on **both** the sender device\nor the Web Receiver.\n\nCasting relies on the coordination between two or more screens; the sender UI\nand the receiver UI --- they must work together. For example, if you press a\nbutton on a mobile device to pause the content, the TV should indicate that it\nis paused, while the mobile device should provide a play button to resume\nplayback.\n\nConsiderations\n--------------\n\nDue to hardware and resource limitations, there are certain restrictions placed\non Google Cast-enabled applications:\n\n- The Cast device is a low-power device with memory, CPU and GPU limitations, so the Web Receiver application should be as lightweight as possible.\n- For Cast and Google Cast interaction models, tabs, windows or popups can be created in both the Web Receiver or sender app, as well as directly accept user input, such as taps or swipes. For example, the Web Receiver app on a docked tablet or display can display a pause button and receive a user's tap. In this way, *all* actions on the application must be triggered from either a Web Receiver or sender application.\n- Smart Displays support user input through a sender app or via touch on the UI.\n- The Web Receiver is a Chrome browser optimized for video playback. As such, WebGL and Chrome Native Client (NaCL) are not currently supported, nor are Chrome extensions.\n- Cast supports a single concurrent media stream playback in the `\u003caudio\u003e` and `\u003cvideo\u003e` tags, or multiple audio tracks using the WebAudio API. Only one video element may be active in the DOM at any time. Additionally, video compositing, manipulation, transformations, rotations or zooming are not supported.\n\nOverall design principles\n-------------------------\n\nKeep the following in mind as you develop your user interface.\n\n**Web Receiver interface:**\n\n- The Web Receiver can have both interactive elements and informational elements to describe the state of the app, such as paused or playing, or error messages. User interaction can take place on the Cast sender (phone, tablet, or Chrome browser) or the Web Receiver (TV, displays, or tablets).\n- Remember that the video action is happening in the middle of the TV screen, and your UI elements should not interfere with the presentation. Place UI elements within the lower third of the Web Receiver display, leaving a 10% margin from the edges of the screen for possible [overscan](/cast/docs/caf_receiver/customize_ui#overscan).\n- When possible, transitions from one screen state to another should be smooth and feel cinematic. Rather than abrupt moves from state to state, use transitions like fade-in and fade-out. For example, the content-loading state lingers on-screen and fades into the media playing experience.\n\n**Sender interface:**\n\n- The sender supports user actions and the Web Receiver displays state information. For example, if content is paused, the TV should indicate that it is paused, while the mobile device indicates it is ready to start playing (for example, showing the user a play button).\n- Speed matters. Users need to be able to quickly locate the casting control and see content start playing immediately on the large screen. While content is loading, provide animated loading indicators and use transitions to help make things feel faster.\n\nThe easiest way to ensure that your Cast application follows these principles is\nto review your user interface with the Cast [Design Checklist](/cast/docs/design_checklist)\nand [test your Cast applications](/cast/docs/testing).\n\nBrand guidelines\n----------------\n\nThe following Google Cast brand guidelines are for app developers and focus on\nthe additional requirements you must comply with to describe your app in text.\nFor Cast devices brand guidelines see the\n[Partner Marketing Hub](https://partnermarketinghub.withgoogle.com/brands/google-cast/overview/brand-introduction/).\nYou can let others know that your app works with Google Cast by using\nthe term \"Google Cast-enabled\". However be sure that your app complies\nwith the Cast [SDK Additional Developer Terms of Service](/cast/docs/terms)\nand the [Design Checklist](/cast/docs/design_checklist), and that your\nuse of \"Google Cast-enabled\" complies with our branding guidelines.\n\nYou can similarly use a [Google Cast badge](#google_cast_badge)\nas long as your app or device complies with our badging guidelines. Google\nreserves the right to request that you modify or cease your use of the badge if\nit does not comply with the brand guidelines.\n\n### \"Google Cast\" in text\n\n- When describing an app (not a hardware product) as being Cast-enabled, use the phrase \"Google Cast-enabled\". For example: \"This app is Google Cast-enabled\".\n- When describing a Cast compatible third-party hardware product, use \"This {TV} works with Google Cast\", \"These {speakers} work with Google Cast\".\n- When written in text, \"Google\" and \"Cast\" should be capitalized.\n- In any marketing asset that uses \"Google Cast\" in text or the badge/logo, you must include the following legal attribution: Google Cast is a trademark of Google LLC.\n- Don't put Google Cast in the title of the app (such as XYZ Google Cast App).\n\n### Google Cast-enabled app messaging\n\nYou can promote your app as follows:\n\n- \"XYZ is a Google Cast-enabled app which lets you stream your favorite entertainment from your mobile device to your TV.\"\n- \"The XYZ app is now available for TVs that work with Google Cast.\"\n- \"The XYZ app is now available for all Google Cast products including Google Chromecast, Google Cast Audio, and TVs and speakers that work with Google Cast.\"\n- \"The XYZ app is Google Cast-enabled, allowing you to enjoy all your favorite shows/movies/music/games on your TV that works with Google Cast.\"\n- \"The XYZ app now has Google Cast support, allowing users to stream content from their phone to their TV that works with Google Cast.\"\n\n### Google Cast badge\n\nYou can use the \"Google Cast\" badges on your website, app store listing,\nmarketing materials and promotional materials to display compatibility with\ndevices that use the Cast protocol.\n\n- Don't modify the color, proportions, spacing or any other aspect of the badge image.\n- When used alongside logos for other ingredient technologies (for example, Bluetooth, Spotify Connect, AirPlay, etc.), the Google Cast badge must be of equal or greater size.\n- Don't make the badge the primary element on your page.\n- Keep some distance between the badge and other logos and icons on your page.\n- When used on white, light, or medium-toned background, use a black badge.\n- When used on a black or dark-toned background, use the white badge.\n- Don't use the badge on a page that contains or displays adult content, promotes gambling, promotes violence, contains hate speech, involves the sale of tobacco or alcohol to persons under twenty-one years of age, violates other applicable laws or regulations or is otherwise objectionable.\n\n### Badge linking\n\nWhen used online, the Google Cast badge must link to one of the following:\n\n- Google's list of Google Cast-enabled apps and products at [g.co/castapps](http://g.co/castapps).\n- A list of products published by you.\n- A specific product detail page published by you.\n- A list of apps published by you.\n- A specific app detail page published by you, on Google Play, or in the Apple App Store.\n\n### Download Google Cast badge assets\n\nThe download bundle includes Portable Network Graphics (.png), Adobe\nIllustrator (.ai), and Enapsulated Postscript (.eps) formats.\n\n- [Partner Hub Downloads page](https://partnermarketinghub.withgoogle.com/brands/google-cast/downloads/)\n\n### Preview Google Cast badges\n\nRefer to the [Partner Hub Badges Guidelines page](https://partnermarketinghub.withgoogle.com/brands/google-cast/visual-identity/visual-identity/#badge-guidelines)\nfor all available badges and instructions on usage."]]
