6 puntos por GN⁺ 2023-12-13 | 2 comentarios | Compartir por WhatsApp

Patrones de navegación para la estructura de apps en iOS

  • Las apps de iOS tienen una estructura jerárquica fija, y gracias a eso los usuarios pueden predecir las opciones de navegación.
  • Los patrones de navegación ayudan a que el usuario reconozca su ubicación actual y la anterior, y entienda cómo regresar.

Navegación drill-down

  • El drill-down es un patrón para explorar una estructura de árbol de información paso a paso, y utiliza animaciones de transición horizontal.
  • No conserva el estado, y la barra de navegación muestra el título de la pantalla actual.
  • El indicador de revelación en una fila de lista señala que se puede profundizar más dentro de la jerarquía.

Navegación plana

  • La navegación plana divide la jerarquía en el nivel raíz y la muestra con una barra de pestañas.
  • Los elementos de la barra de pestañas se organizan en torno a las funciones principales de la app, y forman las expectativas del usuario y su modelo mental sobre la app.
  • La barra de pestañas siempre se muestra en toda la pantalla de la app, salvo cuando una hoja modal la oculta temporalmente.

Patrón piramidal

  • El patrón piramidal permite moverse rápidamente entre vistas hermanas del mismo nivel jerárquico sin tener que volver a la pantalla padre.
  • Es posible desplazarse entre vistas hermanas dentro de una app de medios usando gestos de deslizamiento horizontal o botones.

Patrón hub-and-spoke

  • El patrón hub-and-spoke es adecuado para grandes colecciones de elementos no relacionados entre sí que se encuentran en la parte superior de la jerarquía.
  • La pantalla de inicio de iOS, como hub, ofrece un "estado neutral" confiable del sistema operativo.

Navegación por superposición

  • Las superposiciones exigen la atención del usuario, y las superposiciones modales requieren una acción del usuario.
  • Los modales de alta fricción requieren una decisión del usuario y se enfocan en completar una tarea específica.
  • Los modales de baja fricción pueden descartarse fácilmente, y en lo posible deben evitarse los cuadros de diálogo de notificación de una sola acción.

Navegación incrustada

  • Los patrones de navegación incrustada requieren especial atención a la estructura estricta y al modelo espacial de iOS.
  • Un cambio de estado no modifica la posición jerárquica, y debe confirmarse que el cambio de estado no sea jerárquico ni modal.

Navegación paso a paso

  • El patrón paso a paso conecta una serie de pantallas en un flujo lineal, como tours guiados, flujos de configuración y tutoriales de onboarding.
  • Las secuencias paso a paso deben incluirse dentro de una superposición modal, y cerrarse con un botón de finalizar o cerrar.

Navegación centrada en el contenido

  • La navegación centrada en el contenido transporta al usuario de forma instantánea a otra página o vista mediante hipervínculos o botones.
  • En las apps de iOS, este patrón debe evitarse salvo en hipertexto, juegos inmersivos o contenido no lineal.

Opinión de GN⁺

  • Este artículo puede ser muy útil para desarrolladores de apps en iOS, ya que presenta patrones de navegación importantes para mejorar la experiencia de usuario.
  • Distintos patrones de navegación como drill-down, plana y piramidal contribuyen a mejorar la usabilidad y la accesibilidad de una app.
  • En particular, el uso de modales y navegación por superposición puede afectar de forma significativa el flujo de trabajo del usuario, por lo que los desarrolladores deben considerarlo cuidadosamente.

2 comentarios

 
genkino 2023-12-13

¡Hola! Yo también me enteré de esto mientras compartía este artículo con un colega. Resulta que, en coreano, la forma estándar según la ortografía correcta no es 네비게이션, sino 내비게이션. Jaja. Como es una pronunciación tomada del inglés, en realidad puede ser ambiguo decir cuál es la “correcta”, pero como es un lugar que ve mucha gente, pensé en dejar discretamente este comentario porque estaría bien que, ya que estamos, se usara la forma estándar.

 
xguru 2023-12-14

Este texto es un resumen hecho por GPT-4. Parece que GPT usa bien "navegación", pero a veces también mezcla la forma "nebigeisyeon". Ya lo corregí jaja.