Android-Geräte sind in verschiedenen Formfaktoren erhältlich – Smartphones, Tablets, Foldables, ChromeOS-Geräte – und haben eine Vielzahl von Bildschirmgrößen. Android unterstützt viele Anzeigemodi, darunter Multi-Window, Multi-Display, Free-Form und Bild im Bild. Foldables können sich in verschiedenen Zuständen oder Positionen befinden, z. B. im Tischmodus oder im Buchmodus.
Berücksichtige bei der Entwicklung deiner App verschiedene Anwendungsfälle. Beispiele:
Auf Geräten mit großen Bildschirmen haben Nutzer mehr Möglichkeiten, mit den Inhalten deiner Media-App zu interagieren.
Nutzer können beispielsweise Multitasking betreiben, während sie sich in einer Multi-Window-Konfiguration ein Video ansehen, oder den größeren Bildschirm nutzen, um nach der Aufnahme eines Bildes komplexere Bearbeitungen vorzunehmen.
Nutzer können ein Tablet verwenden, um über Videoanrufe in Verbindung zu bleiben und ihre Freunde und Familie detaillierter zu sehen. Deine App kann in einem benutzerdefinierten Wiedergabe-Overlay mehr Kontext zu einem Titel oder einer Szene anzeigen oder mehr Steuerungsoptionen auf dem Bildschirm bieten.
Karussells in einer Browsing-Ansicht können abwechslungsreicher gestaltet werden, um die visuelle Attraktivität zu erhöhen. Alternativ kann deine Media-App Nutzer fesseln, indem sie neben der Wiedergabe einen durchsuchbaren Feed anbietet.
Die Media-App verwendet denselben Code auf einem Standard-Smartphone, einem Foldable, einem Tablet und ChromeOS-Geräten. Daher solltest du von Anfang an bei der Entwicklung deiner App auf große Bildschirme achten. Weitere Informationen und visuelle Beispiele findest du in der Galerie für große Bildschirme.
Media-App standardmäßig responsiv gestalten
Um eine schlechte Nutzererfahrung in deiner Media-App zu vermeiden, solltest du das Layout deiner App an Smartphones, Tablets, Foldables und ChromeOS-Geräte anpassen.
Deine App sollte responsiv sein, um unterschiedlichen Bildschirmgrößen, Ausrichtungen und Formfaktoren gerecht zu werden. Ein adaptives Layout ändert sich je nach dem verfügbaren Anzeige bereich. Weitere Informationen findest du unter Unterschiedliche Bildschirmgrößen unterstützen.
Design gemäß Richtlinien
Die grundlegende App-Qualität ist die Basis aller Android-Apps, unabhängig von Bildschirmgröße, Geräteposition oder anderen gerätespezifischen Überlegungen. Deine App sollte diese grundlegenden Anforderungen erfüllen, bevor du mit dem Design für einen großen Bildschirm beginnst. Weitere Informationen findest du unter Grundlegende App-Qualität.
Deine App sollte unabhängig von Geräteform faktor, Bildschirmgröße, Anzeigemodus oder Position eine hervorragende Nutzererfahrung bieten. Gestalte deine App daher gemäß den folgenden Richtlinien der Stufen 1, 2 und 3.
Die Richtlinien definieren eine umfassende Reihe von Qualitätsanforderungen für die meisten Arten von Android-Apps.
Stufe 3:
Auf dieser grundlegenden Ebene muss deine App weiterhin die Anforderungen an Benutzeroberfläche und Grafiken erfüllen. Deine App ist für große Bildschirme geeignet und Nutzer können wichtige Aufgaben ausführen, aber die Nutzererfahrung ist nicht optimal.
Das App-Layout ist möglicherweise nicht ideal, aber die App wird im Vollbildmodus oder im Vollfenstermodus im Multi-Window-Modus ausgeführt. Sie ist nicht mit Letterboxing versehen und wird nicht im Kompatibilitäts modus ausgeführt. Die App bietet grundlegende Unterstützung für externe Eingabegeräte, einschließlich Tastatur, Maus und Trackpad. Weitere Informationen findest du unter Für große Bildschirme geeignet.
Stufe 2:
Hier implementiert deine App Layoutoptimierungen für alle Bildschirmgrößen und Geräte konfigurationen sowie eine erweiterte Unterstützung für externe Eingabegeräte. Weitere Informationen findest du unter Für große Bildschirme optimiert.
Stufe 1:
Dies ist die beste Unterstützungsstufe und bietet Nutzern die beste Erfahrung mit deiner App, da sie Premium-Funktionen und -Funktionen umfasst.
Sofern zutreffend, unterstützt die App Multitasking, Foldable-Positionen, Drag-and-drop und Stifteingabe. Auf dieser Ebene sind Apps sehr unterschiedlich. Achte daher genau auf die Richtlinien für Dinge wie Multitasking und Foldable-Positionen. Weitere Informationen findest du unter Für große Bildschirme differenziert.
Optimierte Layouts
Nutze den zusätzlichen Platz auf großen Bildschirmen, ohne Letterboxing (aufgrund von Einschränkungen der Ausrichtung) oder Strecken. Wenn du das Layout deiner App für Medien und soziale Medien optimierst, erhöhst du die Reichweite deiner App und schaffst eine bessere Nutzer erfahrung auf allen Formfaktoren mit großen Bildschirmen – Tablets, Foldables und ChromeOS-Geräte – sowie für alle Smartphone-Größen.
Navigationsleisten- und Drawer-Komponenten bieten eine unaufdringliche Navigation für mehr Komfort und Kontrolle der Benutzeroberfläche. Die Komponenten ergänzen auch die kanonischen Layouts (Liste/Details, Feed und unterstützender Bereich), indem sie primäre Navigationsziele in unmittelbarer Nähe positionieren und gleichzeitig nur wenig Platz auf dem Bildschirm einnehmen.
Medienlayouts
Mache deine App benutzerfreundlicher, indem du medienspezifische Layouts für Liste/Details, Feed und unterstützenden Bereich implementierst. Informationen zu MDX-, Flutter- und Compose-Layouts findest du unter Layoutressourcen.
Liste/Details Wenn du deine App mit einem interaktiven Medienbrowser gestaltest, können Nutzer verschiedene Medien durchsuchen, während sie sich etwas ansehen oder anhören. Medientitel werden neben einem Video oder einer Audiodatei angezeigt. Wenn sich die Geräteausrichtung ändert, reagiert ein Liste/Details Layout, um den App-Status beizubehalten. Weitere Informationen findest du unter Liste/Details-Layouts.
Feed: Bei einem Feed-Layout werden gleichwertige Inhaltselemente in einem konfigurierbaren Raster angeordnet, damit eine große Menge an Inhalten schnell und bequem angesehen werden kann, z. B. ein Musikfeed oder ein Kiosk für Filme und Serien in deiner App. Weitere Informationen findest du unter Feed-Layouts.
Unterstützender Bereich: Mit primären und sekundären Anzeigebereichen kann deine App einen unterstützenden Bereich einbetten für Kontext, Relevanz oder Referenz, z. B. eine scrollbare Liste ähnlicher Titel, veröffentlichte Rezensionen oder weitere Werke desselben Künstlers oder Schauspielers. Weitere Informationen findest du unter Layouts für unterstützende Bereiche.
Eine kuratierte Sammlung von Medienlayouts findest du in der Mediengalerie.
Layouts für soziale Medien
Auf großen Bildschirmen haben Nutzer sozialer Medien mehr Arbeitsfläche, um Inhalte zu erstellen, Multitasking zu betreiben, Inhalte zwischen Apps zu verschieben und sie zu teilen. Mit besonderen Funktionen und Möglichkeiten, die auf Geräten mit kleinen Bildschirmen nicht möglich sind, kann deine Media-App für große Bildschirme Layouts für Liste/Details, Feed und unterstützenden Bereich nutzen.
Liste/Details Dieses Layout eignet sich ideal für Messaging-Apps, Kontaktmanager oder Dateibrowser. Deine App kann beispielsweise eine Liste von Unterhaltungen neben Details anzeigen, damit Nutzer immer auf dem neuesten Stand sind. Weitere Informationen findest du unter Liste/Details-Layouts.
Feed: Häufige Komponenten in diesem Layoutstil sind Karten und Listen. Du kannst beispielsweise eine Collage von Beiträgen in einem flexiblen Rasterformat erstellen oder Größe und Position verwenden, um auf wichtige Beiträge aufmerksam zu machen. Nutzer können schnell große Mengen an Inhalten ansehen. Weitere Informationen findest du unter Feed-Layouts.
Unterstützender Bereich: Apps für die Suche und Referenz oder eine Produktivitäts-App können von diesem Layoutstil profitieren. Die Tools zur Inhaltserstellung sind für den Nutzer immer in Reichweite. Deine App kann Nutzern beispielsweise ermöglichen, Einstellungen anzupassen, auf Farbpaletten zuzugreifen, Effekte anzuwenden, und die Änderungen sofort zu sehen. Weitere Informationen findest du unter Layouts für unterstützende Bereiche.
Eine kuratierte Sammlung von Layouts für soziale Medien findest du auf der Seite mit der Galerie für soziale Medien.
Best Practices für Media-Apps für große Bildschirme
Wenn du Best Practices für große Bildschirme verwendest, kannst du unnötige Überarbeitungen von deiner App vermeiden. Außerdem ist deine App von Anfang an auf mehr Geräten benutzerfreundlicher, insbesondere in Bezug auf Ausrichtung, Tastenkombinationen, Unterstützung für die Kamera vorschau und Foldable-Positionen.
Ausrichtung und Größenänderung
Wenn deine Media-App Einschränkungen für Ausrichtung und Größenänderung deklariert, aktiviert Android einen Kompatibilitätsmodus. Im Kompatibilitätsmodus verhält sich deine App zwar akzeptabel, aber die Benutzerfreundlichkeit ist stark eingeschränkt und die Nutzererfahrung leidet.
Wenn sich deine App beispielsweise auf einem Tablet befindet, wird das Tablet im Querformat angedockt. Wenn deine App auf das Hochformat beschränkt ist, führt dies zu Letterboxing, was für den Endnutzer nicht ideal ist. Deine App sollte Nutzern die Möglichkeit geben, ihre bevorzugte Ausrichtung zu verwenden. Nutze daher die verfügbare Größe eines großen Bildschirms in deinem Design.
Einschränkungen der Ausrichtung reduzieren die Möglichkeiten, wie Nutzer mit Inhalten interagieren können oder Medien konsumieren können, was die Nutzung deiner App einschränkt. Eine Änderung der Ausrichtung kann sich bis zu einem gewissen Grad auf die Größe auswirken , aber eine Größenänderung ändert nicht unbedingt die Ausrichtung.
Tastenkombinationen
Auf einem größeren Bildschirm werden Tastenkombinationen auf physischen Tastaturen wie „Start“, „Stopp“, „Pause“, „Zurückspulen“ und „Vorspulen“ häufiger verwendet, was zu einer einheitlichen Nutzer erfahrung mit einer Tastatur führt.
Nutzer erwarten diese Funktionen in ihren Media-Apps. Um Reibungspunkte für Nutzer zu minimieren, solltest du deine App mit einer physischen Tastatur testen. So kannst du diese wichtigen Tastenkombinationen von Anfang an in deine App aufnehmen.
Unterstützung für die Kameravorschau
Auf großen Bildschirmen kann es zu mehr Problemen mit Strecken, Zuschneiden und Drehen kommen. Du kannst also nicht davon ausgehen, dass die Größe der Kameravorschau der Größe entspricht, die die Benutzeroberfläche in deiner Media-App tatsächlich rendert.
Wenn ein Nutzer beispielsweise mit seinem Tablet ein Foto aufnimmt, es aber auf dem Tablet Bildschirm auf dem Kopf stehend gerendert wird, ist das nicht optimal. Unterstütze die Kamera vorschau für große Bildschirme.
Weitere Informationen findest du unter CameraX-Vorschau oder Camera2-Vorschau.
Foldable-Positionen
Beim Design deiner Media-App für große Bildschirme solltest du auch Foldable-Positionen berücksichtigen. Deine App, kann Nutzern beispielsweise eine Tischkonfiguration für die Medienwiedergabe ermöglichen oder ein Rückdisplay und den Dual-Screen-Modus für Vorschauen und Aufnahmen verwenden.
Wenn du Foldable-Positionen in deinen Entwicklungsplan aufnimmst, ist deine App auf mehr Geräten verfügbar und hat eine größere Wirkung. Du erweiterst die Mediennutzung für den Nutzer auf eine Weise, die auf anderen Geräten ohne Foldable-Positionen nicht möglich ist. Weitere Informationen findest du unter Foldable-Positionen.