Apps, die responsive Layouts verwenden und sich automatisch an verschiedene Bildschirmgrößen anpassen, bieten Nutzern einen zusätzlichen Mehrwert und sorgen für eine produktivere und ansprechendere Nutzererfahrung.
Bei responsiven Layouts werden Elemente wie Schaltflächen, Textfelder und Dialogfelder dynamisch formatiert und positioniert, um eine optimale Nutzerfreundlichkeit zu erzielen. Nutzer Ihrer App erhalten auf größeren Bildschirmen automatisch einen Mehrwert, wenn Sie auf responsives Design setzen. Ob mehr Text auf einen Blick sichtbar ist, mehr Aktionen auf dem Bildschirm angezeigt werden oder größere, besser zugängliche Tippziele vorhanden sind – responsive Praktiken bieten Nutzern mit größeren Bildschirmen eine bessere Nutzererfahrung.
Mehrwert durch responsives Design
Dos
- Verwenden Sie die M3 Compose-Komponentenbibliothek, die integriertes responsives und adaptives Verhalten bietet.
- Verwenden Sie responsive Layouts, die sich automatisch und nahtlos an die verfügbare Bildschirmgröße anpassen.
Don'ts
- UI-Elemente wie Textfelder, Schaltflächen und Dialogfelder werden so gedehnt, dass der zusätzliche Platz ausgefüllt wird.
- Schriftgrößen erhöhen, es sei denn, sie dienen in erster Linie grafischen Zwecken.
Beispiele
Die folgenden Bilder zeigen Beispiele für responsive und optimierte Apps.
Schaltflächen am Rand
Liste der Karten
Liste der Schalter und Schaltflächen
Kachel mit Bildkarten
Liste der Karten mit Bildern
Kachel mit Diagramm
