2.4. Estructura y navegación
A la hora de estructurar la información de una interfaz, es importante que la arquitectura refleje los objetivos del producto y las necesidades del usuario. La estrategia nos indica cuáles son las necesidades del usuario y el ámbito (scope plane) indica qué información es más relevante para cubrir esas necesidades.
Una buena arquitectura y un diseño de interacción apropiado se caracteriza por anticipar las expectativas del usuario combinando el diseño de información con el diseño de interfaz y de navegación.
Existen varios tipos de arquitecturas o estructuras de información:
- Estructuras jerárquicas: también llamadas árboles, se componen de nodos (unidades de información) asociados a nodos padres y nodos hijos, estableciendo así relaciones de dependencia.
- Matrices: permiten una navegación estructurada de nodo a nodo en dos o más dimensiones.
- Estructuras orgánicas: no siguen un patrón concreto. Los nodos se conectan individualmente según evolucionen sus relaciones, y no contienen secciones diferenciadas.
- Estructuras secuenciales: las más comunes, a menudo las encontramos en soportes fuera de línea, como por ejemplo un libro de texto.

Fuente: https://www.oscarblancarteblog.com/2014/08/22/estructura-de-datos-arboles/.
Para representar la arquitectura de la información podemos utilizar los diagramas (ved figura 7). Este tipo de representación visual también es especialmente útil para comunicar las ramificaciones, secciones e interrelaciones entre los componentes de la interfaz. No es necesario que represente cada enlace o cada conexión entre secciones, sino que debe comunicar un patrón estructural que pueda ser aplicable a la totalidad del contenido previsto.

Fuente: https://wiseseo.guru.
Ejercicio
Leed en profundidad «Capítulo 5. The Structure Plane: Interaction Design and Information Architecture» del libro The Elements of User Experience: User-Centered Design for the Web. ¿Podríais identificar ejemplos de interfaces web que presenten estructuras de información jerárquicas, matrices, orgánicas y secuenciales? Elegid uno de estos ejemplos y esbozad un diagrama de nodos para representar su estructura general.
El diseño de navegación es una especialidad del diseño de interfaces que se centra en optimizar la distribución de información en el espacio.
A este nivel es determinante que la organización de la información esté contextualizada y utilice la metáfora de forma efectiva, facilitando una navegación intuitiva y libre de indicaciones explícitas. El diseño de navegación tiene tres objetivos:
- Permitir al usuario trasladarse de un punto a otro punto de la página o aplicación (wayfinding).
- Comunicar la relación entre elementos o unidades de información.
- Comunicar la relación entre los contenidos y el espacio de la interfaz (como la página) en la que se encuentra el usuario.
La clave de un buen diseño de interfaz de navegación es seleccionar los elementos de interacción más adecuados para cada caso. Algunos de los elementos de control convencionales son:
- Checkboxes: para la selección de opciones múltiples.
- Botones radio: para la selección de opciones exclusivas.
- Campos de texto: para la introducción de texto.
- Menús desplegables: una versión compacta de los botones radio.
- Listado de cajas: una versión compacta de los checkboxes.
- Botones de acción: suelen usarse para aplicar un cambio de opciones, pero pueden controlar cualquier tipo de acción.
Ejercicio
Identificad los elementos de la interfaz de navegación del buscador de la página Wallapop. Comparad estos elementos a los encontrados en el buscador de Idealista y reflexionad sobre las ventajas e inconvenientes de ambos diseños. ¿Cuál os parece más adecuado? ¿Por qué?
Como comentábamos anteriormente, la mayoría de páginas web combinan diferentes estructuras de información; asimismo, también hacen uso de múltiples sistemas de navegación según el rol particular del usuario y las circunstancias. Algunos de los diseños más habituales son:
- La navegación global: proporciona acceso al amplio barrido de todo el sitio.
- La navegación local: proporciona a los usuarios acceso a lo que está «cerca» en la arquitectura.
- La navegación suplementaria: proporciona accesos directos a contenido relacionado que puede no ser fácilmente accesible a través de la navegación global o local.
- La navegación contextual (in-line): está incrustado en el contenido de la página en sí.
- La navegación de cortesía: proporciona acceso a elementos que los usuarios no necesitan de manera regular, pero que comúnmente se proporcionan como una conveniencia.
Ejercicio
Leed en profundidad el «Capítulo 6. The Skeleton Plane: Interface Design, Navigation Design, and Information Design» del libro The Elements of User Experience: User-Centered Design for the Web. Analizad el diseño de la interfaz de la aplicación que aparece en las siguientes capturas de pantalla:

Fuente: http://travispinnick.com/projects/apartmentfinder.html.
Trazad su estructura con diagramas wireframe utilizando el kit de wireframes de Sketch o de Figma; luego nombrad los elementos de navegación que utiliza.