Diseño de apps I – Diferencias de flujos de navegación en apps multiplatforma
Debido a la gran variedad de smartphones que existen en el mercado, se hace casi imprescindible que nuestras aplicaciones móviles multiplataforma y su interfaz de usuario se adapten a todos estos dispositivos, permitiéndonos seguir el ritmo frenético de actualización de estos terminales. Independientemente del tamaño de la pantalla, la resolución o los píxeles lo que buscamos con esta adaptación es conseguir un correcto y fluido funcionamiento de nuestra aplicación y con ello una buena experiencia de usuario, fundamentado en un estudiado diseño de apps. En el post de hoy te vamos a contar las diferencias de navegación en apps Android, iOS y Windows Phone y los diferentes flujos que utilizan cada una de estas plataformas.
Flujos de navegación en apps
Navegación Android
Desde su versión 3.0 en adelante, la navegación en Android tiene un comportamiento global hacia adentro y hacia atrás y hacia arriba. ¿Esto en qué consiste?
La navegación de la app dispondrá de dos botones: “Up” y “Back”. El primero está ubicado en la parte inferior izquierda y obliga a la navegación a retroceder hacia arriba en el orden jerárquico establecido: y el segundo deshace cronológicamente la navegación que se ha realizado, devolviendo al usuario a la pantalla de navegación de la que procede. Por lo tanto, si llegamos a una pantalla de navegación concreta, pulsando este botón volveremos a la pantalla anterior o si esta era la pantalla de navegación principal lo que hará será redirigirnos al escritorio Android. Por su parte, el botón arriba nos llevará directamente a la pantalla inicial de la aplicación y no tendrá efectos posteriores.
Navegación iOS
En esta plataforma, existen tres estilos de navegación principales, donde cada uno de ellos se adecuará a la estructura de la aplicación que puede ser:
- Jerárquica: digamos que es de arriba a abajo y viceversa
- Plana: de izquierda a derecha
- Contenida: combinación de las anteriores
En aplicaciones con estructura jerárquica son los usuarios los que eligen la pantalla de navegación hasta llegar a su destino. Si desean cambiar de destino, tendrán que retroceder o empezar de cero desde la pantalla de inicio de la app. Un ejemplo de aplicaciones nativas que utilicen esta estructura son “Ajustes” y “Correos”.
En cambio, en las aplicaciones que tienen estructura plana los usuarios pueden navegar de una categoría a otra directamente ya que se puede acceder a todas las categorías desde la pantalla principal. “App Store” es un claro ejemplo de aplicación con esta estructura.
Por otro lado, las aplicaciones con estructura contenida o experiencia guiada definen su navegación por la experiencia o contenido. Por ejemplo, en el caso de navegar por un libro, los usuarios pueden ir pasando de página o elegirla desde una tabla de contenidos; en un juego el papel de esta experiencia suele ser mucho más importante.
Dependiendo del tipo de aplicación del que estemos hablando, podemos combinar más de una estructura de navegación. Esto es, por ejemplo, coger elementos de la estructura jerárquica y mezclarlos con elementos de estructura plana. Sin embargo, sea cual sea la estructura es muy importante que el usuario siempre sepa en qué lugar de la aplicación se encuentra y qué ruta debe seguir para llegar a su pantalla de destino.
Ha de tener una estructura clara y sencilla que facilite la navegación y experiencia al usuario. Independientemente del estilo de navegación que utilicemos y de los elementos que hayamos combinado, lo importante es que el recorrido que tiene que seguir el usuario a través del contenido sea fácil, previsible y coherente.
Navegación Windows Phone
Explicamos antes de nada que es la “Barra de estado”: La barra de estado de Windows Phone muestra el nivel del sistema de una forma clara y fácil. Permite la interacción por parte del usuario ya que esta se actualizará constantemente para mostrar diferentes notificaciones y tenerlo informado de las novedades más importantes. Las propiedades de la barra de estado de Windows Phone son:
- La aplicación puede sustituir la visibilidad de la barra de estado.
- La aplicación permitirá cambiar la opacidad de la barra de estado.
- También permitirá cambiar el color de la barra de estado.
- El mismo indicador de progreso en la barra de estado se puede usar para indicar el progreso en la aplicación.
Por otro lado, tenemos la “Barra de aplicaciones”: En esta barra podemos encontrar reunidas las tareas más habituales. Para las menos habituales, se puede incluir un menú ejecutable accesible desde la barra de aplicaciones. Las características de la barra de aplicaciones de Windows Phone son:
- La aplicación puede sustituir la visibilidad de la barra de aplicaciones.
- La aplicación permitirá cambiar la opacidad de la barra de aplicaciones.
- También permitirá cambiar el color de la barra de aplicaciones.
Con respecto a la orientación, la plataforma de Microsoft permite cambios de orientación horizontal y vertical. Si hace falta, la aplicación deberá estar configurada para adaptarse a diferentes orientaciones, si bien es cierto que por defecto las aplicaciones vendrán configuradas solo para la orientación vertical.
Si una página de la aplicación soporta ambas orientaciones, vertical y horizontal, el usuario solo tendrá que girar su dispositivo móvil en alguna de estas direcciones para iniciar el cambio.
Por su parte, el botón “Back” o “Atrás” de Windows Phone funciona igual que en Android y se emplea para retroceder dentro de una aplicación o entre varias aplicaciones a la pantalla anterior. Pero su uso no solo se limita a esto, también permite cerrar el teclado en pantalla, cambiar la aplicación y cerrar menús o cuadros de diálogos. Sin embargo, el uso principal que se le da es para volver a la pantalla anterior de navegación.
El próximo post de diseño de apps vendrá en una semana y explicaremos las principales diferencias en cuanto a los layouts previo al desarrollo de apps multiplataforma.
Si tienes una idea de app y quieres recibir asesoramiento no dudes en ponerte en contacto con nuestro equipo de desarrolladores de apps con nosotros. Te ayudaremos encantados en todo lo que necesites.
Síguenos en Facebook, Google+, Linkedin y Twitter.
