Publicado por Ian Lake, Representante de desarrolladores

Desde el lugar del desarrollador, existe una amplia variedad de funciones agregadas a Android N que pueden aprovecharse, pero cuando se trata del diseño y de la creación de una IU propia, lo que más debería importar sería disponer de compatibilidad con ventanas múltiples.
El modo principal a través del cual los usuarios interactuarán con ventanas múltiples es el modo de pantalla dividida, disponible en dispositivos portátiles y tablets de mayor tamaño. En este modo, dos aplicaciones dividen el espacio de pantalla disponible y el usuario puede arrastrar la línea divisoria entre las dos pantallas separadas para cambiar el tamaño de las aplicaciones. Como podrás imaginar, este modo presenta algunos desafíos de diseño únicos que se encuentran más allá de lo que era necesario anteriormente.


Una IU aún más receptiva


Lo aprendido con versiones anteriores de Android, la Web móvil y los entornos de escritorio aún se aplica a Android N. Diseñar una IU receptiva continúa siendo un primer paso importante en el camino hacia una fabulosa experiencia con ventanas múltiples.



Una IU receptiva puede adaptarse al tamaño provisto y también seleccionar la mejor representación del contenido y los patrones de navegación correspondientes para brindar una experiencia de usuario excelente en cualquier dispositivo. Consulta la publicación del blog Cómo crear una IU receptiva para obtener información detallada sobre la manera de diseñar y crear una IU eficaz y receptiva.


Cómo adaptar tu diseño


Debido a que crearás diseños para las pantallas más grandes y pequeñas, y para todas las variantes intermedias, es importante hacer que la transición del cambio de tamaño sea pareja y perfecta, como se menciona en las pautas de diseño para pantallas divididas. Si ya dispones de un diseño similar para dispositivos móviles y tablets, verás que la mayor parte del trabajo ya está hecha.

Sin embargo, si tus diseños de dispositivos móviles y tablets son muy diferentes y no existe una manera de lograr una transición pareja entre los dos, deberás evitar la transición entre ellos al cambiar el tamaño. En lugar de ello, concéntrate en hacer que tu IU para tablets se reduzca usando los mismos patrones de IU receptiva. Esto garantiza que los usuarios no tengan que familiarizarse de nuevo con la IU al cambiar el tamaño en tu aplicación.

Ten en cuenta que los atributos de diseño minimalHeight y minimalWidth te permiten fijar un tamaño mínimo que desees informar a tu actividad, pero esto no implica que el usuario no pueda reducir el tamaño de tu actividad, sino más bien que tu actividad se recortará hasta tener el tamaño solicitado por el usuario. Esto puede desplazar elementos de tu IU de la pantalla. Intenta ofrecer compatibilidad con el tamaño mínimo de 220 x 220 dp.


Configuraciones de diseño que deben considerarse


Aunque una gran parte de los tamaños y las relaciones de aspecto posibles para ventanas múltiples son similares a los que ofrecen los dispositivos existentes (en términos de tamaño de pantalla, la tercera parte de una tablet en modo horizontal equivale a un dispositivo móvil), existen algunas configuraciones que son mucho más comunes al considerar el modo de ventanas múltiples.


La primera es la del diseño 16:9 en el modo vertical en dispositivos móviles. En este caso, el espacio vertical es extremadamente limitado. Si hay un número de elementos fijos dispuestos uno encima de otro (una barra de herramientas, contenido desplazable y una barra de navegación inferior), probablemente descubras que no hay espacio para el contenido desplazable. ¡El elemento más importante!

El segundo caso que debe considerarse es el del diseño “34,15 %” de las tablets. Las relaciones de aspecto (muy ancho en la orientación vertical o muy alto en la orientación horizontal) son superiores a las que se encuentran en los dispositivos existentes. Considera usar tus diseños para dispositivos móviles como punto de partida para esta configuración.


Patrones que deben evitarse


Cuando se trata de ventanas múltiples, hay algunos patrones que debes evitar por completo.

El primero tiene que ver con las interacciones de IU que se basan en el deslizamiento desde el borde de la pantalla. Esto ha generado inconvenientes en cuanto a la barra de navegación de la pantalla que se destaca en muchos dispositivos (como los Nexus), pero resulta más problemático en el modo de pantalla dividida. Debido a que (intencionalmente) no existe una manera de determinar si tu actividad se encuentra en la parte superior, inferior, izquierda o derecha, procura que el deslizamiento desde los bordes no sea la única manera de acceder a la funcionalidad de tu aplicación. Esto no significa que debas evitarlo totalmente, sino que te asegures de que haya una alternativa. Un buen ejemplo de esto es el panel lateral de navegación: con un deslizamiento desde el borde se abre, pero también es posible acceder a él presionando el icono de la hamburguesa de la barra de herramientas.



El segundo consiste en deshabilitar totalmente las ventanas múltiples. Aunque ciertamente existen casos en los cuales esto tiene sentido (cuando, como en un juego, la experiencia es totalmente inmersiva), también hay situaciones en las que tu actividad y cualquier actividad iniciada desde ella deban admitir ventanas múltiples de manera forzosa. Como se señala en la publicación del blog sobre cómo prepararse para ventanas múltiples, cuando admites que aplicaciones externas inicien tu actividad, esta última hereda las propiedades de ventanas múltiples de la actividad que realiza la llamada.


El diseño para ventanas múltiples debe adecuarse a cualquier dispositivo


Crear una IU receptiva que responda al espacio disponible es fundamental para lograr una excelente experiencia de ventanas múltiples, pero es una práctica que puede beneficiar a todos tus usuarios dentro de la amplia variedad de dispositivos Android.

Aprovecha esta oportunidad para #BuildBetterApps

Sigue la actividad en la Colección de patrones de desarrollo de Android para informarte más.