3

Una solución para la navegación con niveles en sitios móviles

UX

navegacion en dispositivos móviles 

Al ver un artículo de Francisco Tosete  haciendo referencia soluciones para la navegación en sitios móviles  que plantea Luke Wroblewski y recodando la navegación del app de Facebook para IOS que lo uso diariamente  me animé a completar una solución.

El problema es como navegar intuitivamente por un sitio móvil que tiene más de un nivel de profundidad y que sea de fácil acceso a nuestro dedo pulgar.

Este patrón de navegación debe cumplir dos funciones. De agrupación, es decir, que al hacer clic en el elemento de primer nivel (padre) despliegue los elementos de segundo nivel (hijos) y la segunda función es que cargue la página que esté asociada al padre.

En los dispositivos móviles, hacer que cumplan ambas funciones en simultáneo genera un problema de ubicación para el usuario ya que al desplegar el menú con los hijos tapa la pantalla que ha cargado y si hacemos lo contrario debemos hacer clic nuevamente al padre para que muestre sus elementos hijos.

Una solución es dividir la pantalla en dos partes, una para el botón que inicia el despliegue principal + el pedazo de pantalla asociada al padre y la otra parte para la navegación entre las opciones de n niveles que se expande y contrae.

Veamos ilustración para un mejor entendimiento.

 

menú multinivel en móviles

 

Fuentes: Lukew ideation+design de Luke Wroblewski  y Tentándote.com de Francisco Tosete

 

——————————

Por Percy Negrete

Percy es ingeniero especializado en marketing online, profesor universitario en temas de diseño de interacción en facultad y posgrado, jefe de experiencia usuaria en una empresa privada y es autor del blog Diseño de experiencia usuaria. Puede ser seguido con la cuenta en twitter @percynegrete

 

Fatal error: Uncaught Exception: 12: REST API is deprecated for versions v2.1 and higher (12) thrown in /web/htdocs/www.uxinperu.com/home/wp-content/plugins/seo-facebook-comments/facebook/base_facebook.php on line 1273