Tipps und Tricks zum Designen für Multi-Window

Multi-Window in Android N: So klappt das Design
Kommentare

In den ersten Developer-Previews der kommenden Android-Version Android N wurden bereits viele neue Features vorgestellt. Dazu gehört zum Beispiel Multi-Window. Damit ist es möglich, auf kleinen Displays zwei Apps nebeneinander anzuzeigen; auf TV-Geräten kann auch ein Bild-in-Bild-Modus genutzt werden. Keine Frage also, dass der Split-Screen-Modus eine ganz neue Design-Herausforderung für Entwickler werden könnte.

So geht Ian Lake davon aus, dass User künftig vor allem über den Split-Screen-Modus mit Multi-Window interagieren werden; darum sollte der Fokus vor allem auf die Entwicklung für Split-Screen gelegt werden. Im Android-Entwicklerblog hat er einige Tipps und Tricks zum Designen für Multi-Window zusammengestellt.

Neue Design-Herausforderung Multi-Window

Mit Multi-Window kann ab Android N ein neuer Split-Screen-Modus genutzt und zwei Apps parallel angezeigt werden. Getrennt werden die einzelnen App-Fenster durch einen Divider, mit dessen Hilfe die jeweiligen Apps in ihrer Darstellungsgröße angepasst werden.

Ein solcher Split-Screen stellt App-Entwickler damit vor ganz neue Herausforderungen. Wie auch bei Mobile-Websites ist darum ein möglichst durchdachtes responsives User Interface essentiell, um beim Nutzer für eine gute User Experience zu sorgen. Bereits für frühere Android-Versionen gibt es ausführliche Anleitungen, worauf beim Erstellen von Responsive UIs zu achten ist.

In jedem Fall ist es wichtig, die Übergänge zwischen einzelnen Darstellungsgrößen möglichst flüssig darzustellen. Auf einem geteilten Bildschirm ist das umso notwendiger, da sich die Appgröße auch im Multi-Window-Modus anpassen lässt. Ist das App-Layout für Tablet und Smartphone bereits ähnlich aufgebaut, sollte das Design für Multi-Window relativ problemlos und einfach sein; gibt es dort große Unterschiede ist für die Anpassung des Layouts für den Split-Screen ein wenig mehr Fingerspitzengefühl gefragt. Dabei rät Lake davon ab, den Übergang zwischen Tablet- und Smartphone-Layout bei der Größenanpassung zu forcieren. Stattdessen empfiehlt er:

focus on making your tablet UI scale down using the same responsive UI pattern

Beim Design für Multi-Window kann man sich zudem an bestehenden Konfigurationen und Seitenverhältnissen von Devices orientieren, allerdings sollte man bedenken, dass bei vielen fixen Elementen nur wenig Platz für scrollbaren Content in der App bleibt, wenn diese im Split-Screen-Modus ausgeführt wird. Gerade auf Mobile Devices mit kleinen Displaygrößen wird das schnell zum Problem.

Welche Pattern sollte man vermeiden?

Während es durchaus ratsam ist, das bestehende Mobile-Layout als Ausgangspunkt zu nehmen, gibt es allerdings auch einige Pattern, auf die man bei der Umsetzung verzichten sollte. Dazu gehört vor allem, dass viele UI-Interaktionen von einem Swipen aus einer der Displayecken heraus abhängig sind. Da sich nicht feststellen lässt, an welcher Stelle die Useraktivität stattfindet, sollten User nicht nur per „Edge-Swipe“ auf die App-Funktionalitäten zugreifen können, sondern zumindest eine alternative Navigationsmöglichkeit haben.

Auch das komplette Deaktivieren des Multi-Window-Supports ist nicht ratsam. So gibt es bestimmte Aktivitäten, die Multi-Window gezwungenermaßen unterstützen müssen. Dazu sagt Lake:

when you support external apps launching your activity, your activity inherits the multi-window properties of the calling Activity

Mehr Informationen dazu bietet auch ein Blogpost von Lake, in dem er einige weitere Tipps zur Vorbereitung auf die Entwicklung für Multi-Window gibt.

In jedem Fall gilt, dass sich Entwickler bereits frühzeitig mit den Anforderungen des App-Designs für Split-Screens vertraut machen sollten, um ihren Nutzern auch mit Multi-Window eine gute User Experience bieten zu können.

Aufmacherbild: Wooden cartoon panels for game UI, including yes/no and Ok buttons von Shutterstock / Urheberrecht: Lilu330

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -