Die immersive Liste ist eine Kombination aus einer Inhaltszeile und einer Vorschau des ausgewählten Elements. Es zeigt Inhalte in einem größeren Darstellungsbereich.
Weitere Informationen
| Typ | Verknüpfen | Status |
|---|---|---|
| Design | Designquelle (Figma) | Verfügbar |
| Implementierung | Jetpack Compose | Verfügbar |
Highlights
- Vorschau des dynamischen Inhalts. Wenn ein Nutzer durch die Inhaltszeile navigiert, wird der Vorschaubereich automatisch aktualisiert und zeigt das Element im Fokus an.
- Die Komponente „Immersive Listen“ bietet einen größeren Darstellungsbereich für die Anzeige von Inhalten, sodass Nutzer die visuellen Details des fokussierten Elements leichter sehen und schätzen können.
- Immersive Listen bieten relevante und kontextbezogene Informationen zum fokussierten Element und helfen Nutzern, fundierte Entscheidungen zu treffen, ohne den Browser zu verlassen.
- Bei der immersiven Liste wird eine progressive Offenlegung verwendet, um während der Navigation durch die Nutzer mehr Details über den Inhalt preiszugeben. So wird die kognitive Belastung reduziert und die Nutzerinteraktion bleibt aufrechterhalten.
- Die Komponente „Immersive Listen“ sorgt für konsistente Interaktionen in der gesamten Anwendung und bietet Nutzern eine vertraute und vorhersehbare Erfahrung.
Anatomie
- Bildhintergrund
- Inhaltsblock
- Karte im Fokus
- Inhaltsraster
- Filmeffekt
- Poster
- Hintergrundfarbe
Technische Daten
Verhalten
Wenn du in der immersiven Liste zwischen Karten navigierst, werden die Details der ausgewählten Karte nach und nach im Hintergrund eingeblendet.
Wenn die immersive Liste im Fokus ist, wird sie vergrößert, um zusätzliche Informationen wie den Hintergrundtitel und die Beschreibung anzuzeigen, wie im folgenden Video gezeigt.
Nutzung
Verwende immersive Karussells, wenn du die Aufmerksamkeit auf angesagte oder beworbene Inhalte wie Neuveröffentlichungen, beliebte Shows oder exklusive Titel lenken möchtest. Der größere Darstellungsbereich und die dynamische Vorschau bieten eine überzeugende Möglichkeit, diese Elemente mit hoher Priorität zu präsentieren.
Bildanzeige
- Kartenfokus: Während der Nutzer durch das Karussell navigiert, wird die hervorgehobene Karte visuell hervorgehoben.Sie skaliert die Karte um 1,1 und verwendet einen Rahmen und andere visuelle Hinweise als Höhe, um ihre Auswahl anzugeben. Die Titel des Inhalts innerhalb der Miniaturansicht der Karte im Fokus müssen deutlich sichtbar und leichter zu lesen sein.
- Hintergrundbild: Wenn eine Karte im Fokus ist, wird im größeren Darstellungsbereich ein entsprechendes Hintergrundbild angezeigt. Wir empfehlen, dass dieses Hintergrundbild hochwertig und optisch ansprechend ist, da es einen immersiven und interaktiven Hintergrund für die Inhalte bietet.
Komposition
Dos
Don'ts
Damit die Bilder, die in der Komponente „Immersive List“ als Hintergründe verwendet werden, gut aussehen, sollten sie entsprechend skaliert werden, damit sie nicht unscharf oder verzerrt sind.
Seitenverhältnis
Verwenden Sie nach Möglichkeit ein Seitenverhältnis von 16:9 für Hintergrundbilder, um ein optisch ansprechendes und einheitliches Layout zu gewährleisten.
