Android-Geräte sind in verschiedenen Formfaktoren erhältlich: Smartphones, Tablets, Foldables und ChromeOS-Geräte. Sie haben eine Vielzahl von Bildschirmgrößen. Android unterstützt viele Anzeigemodi, darunter Mehrfenstermodus, Multi-Display, Freeform und Bild im Bild. Foldables können sich in verschiedenen Zuständen oder Positionen befinden, z. B. im Tischmodus oder im Buchmodus.
Berücksichtigen Sie bei der Entwicklung Ihrer App verschiedene Anwendungsfälle. Beispiel:
Auf Geräten mit großen Bildschirmen haben Nutzer mehr Möglichkeiten, mit den Inhalten Ihrer Media-App zu interagieren.
Nutzer können Multitasking betreiben, während sie sich im Mehrfenstermodus 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 per Videoanruf in Verbindung zu bleiben und ihre Freunde und Familie detaillierter zu sehen. Ihre App kann in einem benutzerdefinierten Wiedergabe-Overlay mehr Kontext zu einem Titel oder einer Szene anzeigen oder mehr Steuerungsmöglichkeiten auf dem Bildschirm bieten.
Karussells in einer Browsing-Ansicht können abwechslungsreicher gestaltet werden, um die visuelle Attraktivität zu erhöhen. Alternativ kann Ihre Medien-App Nutzer fesseln, indem sie einen durchsuchbaren Feed neben der Wiedergabe anbietet.
Beachten Sie, dass Ihre Media-App denselben Code auf einem Standard-Smartphone, einem Foldable, einem Tablet und ChromeOS-Geräten ausführt. Daher sollten Sie von Anfang an bei der Entwicklung Ihrer App auf große Bildschirme setzen. Weitere Informationen und visuelle Beispiele finden Sie in der Galerie für große Bildschirme.
Media-App standardmäßig responsiv gestalten
Vermeiden Sie eine schlechte Nutzererfahrung in Ihrer Media-App, indem Sie das Layout Ihrer App an Smartphones, Tablets, Foldables und ChromeOS-Geräte anpassen.
Ihre App sollte auf unterschiedliche Displaygrößen, Ausrichtungen und Formfaktoren reagieren. Ein adaptives Layout ändert sich je nach verfügbarem Displayplatz. Weitere Informationen finden Sie unter Unterschiedliche Displaygrößen unterstützen.
Design gemäß Richtlinien
Die grundlegende App-Qualität ist die Basis aller Android-Apps, unabhängig von Anzeigegröße, Geräteposition oder anderen gerätespezifischen Überlegungen. Ihre App sollte diese grundlegenden Anforderungen erfüllen, bevor Sie mit dem Design für einen großen Bildschirm beginnen. Weitere Informationen finden Sie unter Grundlegende App-Qualität.
Ihre App sollte unabhängig von Geräteformfaktor, Bildschirmgröße, Anzeigemodus oder Position eine hervorragende Nutzererfahrung bieten. Gestalten Sie Ihre 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 Ihre App weiterhin die Anforderungen an Benutzeroberfläche und Grafiken erfüllen. Ihre App ist für große Bildschirme optimiert und Nutzer können wichtige Aufgabenabläufe ausführen, aber die Nutzererfahrung ist nicht optimal.
Das App-Layout ist möglicherweise nicht ideal, aber es wird im Vollbildmodus oder im Vollfenstermodus im Mehrfenstermodus ausgeführt. Es ist nicht mit Letterboxing versehen und wird nicht im Kompatibilitätsmodus ausgeführt. Die App bietet grundlegende Unterstützung für externe Eingabegeräte, einschließlich Tastatur, Maus und Trackpad. Weitere Informationen finden Sie unter Für große Bildschirme optimiert.
Stufe 2:
Hier implementiert Ihre App Layoutoptimierungen für alle Bildschirmgrößen und Gerätekonfigurationen sowie eine erweiterte Unterstützung für externe Eingabegeräte. Weitere Informationen finden Sie unter Für große Bildschirme optimiert.
Stufe 1:
Dies ist die beste Unterstützungsstufe und bietet Nutzern die beste Erfahrung mit Ihrer 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. Achten Sie daher genau auf die Richtlinien für Dinge wie Multitasking und Foldable-Positionen. Weitere Informationen finden Sie unter Für große Bildschirme optimiert.
Optimierte Layouts
Nutzen Sie den zusätzlichen Platz auf großen Bildschirmen, ohne Letterboxing (aufgrund von Einschränkungen der Ausrichtung) oder Strecken. Wenn Sie das Layout Ihrer App für Medien und soziale Medien optimieren, erhöhen Sie die Reichweite Ihrer App und schaffen eine bessere Nutzererfahrung 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 (Listen-Detailansicht, Feed und unterstützender Bereich), indem sie primäre Navigationsziele in unmittelbarer Nähe positionieren und dabei nur wenig Platz auf dem Bildschirm einnehmen.
Medienlayouts
Machen Sie Ihre App benutzerfreundlicher, indem Sie medienspezifische Layouts für Listen-Detailansicht, Feed und unterstützenden Bereich implementieren. Informationen zu MDX-, Flutter- und Compose-Layouts finden Sie unter Layoutressourcen.
Listen-Detailansicht:Wenn Sie Ihre App mit einem interaktiven Medienbrowser gestalten, 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 eine Listen-Detailansicht, um den App-Status beizubehalten. Weitere Informationen finden Sie unter Listen-Detailansichten.
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 Ihrer App. Weitere Informationen finden Sie unter Feed-Layouts.
Unterstützender Bereich:Mit primären und sekundären Anzeigebereichen kann Ihre App einen unterstützenden Bereich für Kontext, Relevanz oder Referenz einbetten, z. B. eine scrollbare Liste ähnlicher Titel, veröffentlichte Rezensionen oder weitere Werke desselben Künstlers oder Schauspielers. Weitere Informationen finden Sie unter Layouts für unterstützende Bereiche.
Eine kuratierte Sammlung von Medienlayouts finden Sie 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 Ihre Media-App für große Bildschirme die Layouts für Listen-Detailansicht, Feed und unterstützenden Bereich nutzen.
Listen-Detailansicht:Dieses Layout eignet sich ideal für Messaging-Apps, Kontaktmanager oder Dateibrowser. Ihre App kann beispielsweise eine Liste von Unterhaltungen neben Details anzeigen, damit Nutzer immer auf dem neuesten Stand sind. Weitere Informationen finden Sie unter Listen-Detailansicht-Layouts.
Feed:Häufig verwendete Komponenten in diesem Layoutstil sind Karten und Listen. Sie können 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 finden Sie 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 griffbereit. Mit Ihrer App können Nutzer beispielsweise Einstellungen anpassen, auf Farbpaletten zugreifen, Effekte anwenden und die Änderungen sofort sehen. Weitere Informationen finden Sie unter Layouts für unterstützende Bereiche.
Eine kuratierte Sammlung von Layouts für soziale Medien finden Sie auf der Seite Galerie für soziale Medien.
Best Practices für Media-Apps für große Bildschirme
Wenn Sie Best Practices für große Bildschirme verwenden, vermeiden Sie unnötige Überarbeitungen Ihrer App. Außerdem ist Ihre App von Anfang an auf mehr Geräten benutzerfreundlicher, insbesondere in Bezug auf Ausrichtung, Tastenkombinationen, Unterstützung für die Kameravorschau und Foldable-Positionen.
Ausrichtung und Größenänderung
Wenn Ihre Media-App Einschränkungen für Ausrichtung und Größenänderung deklariert, aktiviert Android einen Kompatibilitätsmodus. Im Kompatibilitätsmodus verhält sich Ihre App zwar akzeptabel, die Nutzerfreundlichkeit ist jedoch stark eingeschränkt und die Nutzererfahrung leidet.
Wenn sich Ihre App beispielsweise auf einem Tablet befindet, wird das Tablet im Querformat angedockt. Wenn Ihre App auf das Hochformat beschränkt ist, führt dies zu Letterboxing, was für den Endnutzer nicht ideal ist. Ihre App sollte Nutzern die Möglichkeit geben, die bevorzugte Ausrichtung zu verwenden. Nutzen Sie daher die verfügbare Größe eines großen Bildschirms in Ihrem Design.
Einschränkungen der Ausrichtung reduzieren die Möglichkeiten, wie Nutzer mit Inhalten interagieren oder Medien konsumieren können, was die Nutzung Ihrer 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 Nutzererfahrung mit einer Tastatur führt.
Nutzer erwarten diese Funktionen in ihren Media-Apps. Um Reibungspunkte für Nutzer zu minimieren, sollten Sie Ihre App mit einer physischen Tastatur testen. So können Sie diese wichtigen Tastenkombinationen von Anfang an in Ihre App aufnehmen.
Unterstützung für die Kameravorschau
Auf großen Bildschirmen kann es zu mehr Problemen mit Strecken, Zuschneiden und Drehen kommen. Sie können also nicht davon ausgehen, dass die Größe der Kameravorschau der Größe entspricht, die die Benutzeroberfläche in Ihrer Media-App tatsächlich rendert.
Wenn ein Nutzer beispielsweise mit seinem Tablet ein Bild aufnimmt, es aber auf dem Bildschirm des Tablets auf dem Kopf stehend gerendert wird, ist das nicht optimal. Unterstützung für die Kameravorschau für große Bildschirme einbeziehen.
Weitere Informationen finden Sie unter CameraX-Vorschau oder Camera2-Vorschau.
Foldable-Positionen
Beim Design Ihrer Media-App für große Bildschirme müssen Sie auch Foldable-Positionen berücksichtigen. Mit Ihrer App kann ein Nutzer beispielsweise eine Tischkonfiguration für die Medienwiedergabe verwenden oder einen Rückbildschirm und den Dual-Screen-Modus für Vorschauen und Aufnahmen nutzen.
Wenn Sie Foldable-Positionen in Ihren Entwicklungsplan aufnehmen, ist Ihre App auf mehr Geräten verfügbar und hat eine größere Wirkung. Sie erweitern die Mediennutzung für den Nutzer auf eine Weise, die auf anderen Geräten ohne Foldable-Positionen nicht möglich ist. Weitere Informationen finden Sie unter Foldable-Positionen.