La información que diseñes debe presentarse con claridad, organizada y ordenada para que el usuario pueda tener la mejor experiencia posible al interactuar con tu app o sitio web. Este proceso es llamado Arquitectura de información, qué es algo así como hacer un mapa de la información de tu producto o servicio.
Hay 3 partes claves:
- Organizar: se refiere a como las diferentes piezas de la información están conectadas en el producto.
- Jerarquía: muchas veces a través de una estructura tipo árbol, donde las categorías más grandes agrupan información en subcategorías y así hasta llegar a la unidad mínima de información. Información del mimo nivel es localizada lado a lado.
- Secuencia: que habilita al usuario a moverse a través de la aplicación en cierto orden o pasos.
Entender estas 3 partes te ayudará a guiar el proceso para construir el mapa del sitio (sitemap).
Los 8 principios básicos
Estos principios fueron creados por el fundador de EightShapes, Dan Brown. Fueron creados para ayudar a los diseñadores de UX a entender y tomar decisiones sobre los productos.
- Principio de objeto: tu contenido es un objeto como si fuera un ser vivo. Viene de la filosofía de programación orientada a objetos.
- Principio de escoger: Dar menos opciones para escoger que estén bien organizadas ayudará al usuario.
- Principio de divulgación: Transmitir lo esencial, evitar lo innecesario o inesperado.
- Principio de ejemplaridad: Los humanos categorizamos y agrupamos todo.
- Principio de la puerta de al frente: Los usuarios llegarán a la página de inicio desde otro sitio.
- Principio de múltiples clasificaciones: Los humanos tenemos diferentes formas de buscar la información.
- Principio de navegación enfocada: Debe haber una estrategia y una lógica detrás de la manera de navegar por menús.
- Principio de crecer: La cantidad de contenido en un diseño crecerá con el tiempo.
Mayor información en este artículo en inglés sobre los 8 principios de la IA.
¿Cómo aplicarías estos principios?
Principios para crear un buen mapa de sitio
Un mapa del sitio, como hablamos arriba, es una estructura jerárquica de la información, la conexión en jerarquía es conocida en el mundo del software y el IA como padre/hijo.
Mapa de sitio para aplicaciones web
- Homepage, homescreen o punto de inicio: La homepage es usualmente el primer punto de entrada del usuario. Por ejemplo, para una aplicación el primer punto de entrada será la página de bienvenida. El padre de esta página sería la página de bienvenida, el hijo podría ser: iniciar sesión, crear usuario, usuario retornando (para casos como Google o Facebook) todos en el mismo nivel.
- Otras pantallas relevantes: Es importante incluir tantas relaciones padre e hijo sean relevantes. Por ejemplo, cuando el usuario va de la pantalla padre a la configuración y de esta a perfil, seguridad, ayuda y políticas. Otro ejemplo es cuando el usuario ingresa a Ayuda desde la ventana padre, de ayuda los hijos serán Buscar, Temas de ayuda y Contáctenos.
Mapa de sitio para aplicaciones móviles
Esta es una estructura similar, incluyendo el más alto nivel de entrada de los usuarios, no se usa tantas categorias como en la parte web.
- Página de inicio, características del producto, configuración de usuario, precios, contáctenos y ayuda son ejemplos de categorías.
- Y por ejemplo, Hijos de la categoría Perfil de usuario puede estar ya la información de Nombre, Email, y detalles de pago.
Siempre tener en cuenta el propósito de la aplicación y al usuario que beneficia, esto logrará que sea una mejor estructura de información.
Las pantallas móviles son normalmente más pequeñas y el desafío de crear arquitectura de información para estas es:
- Buscar maneras de enfocarse en el contenido esencial, eliminar lo menos importante.
- Considerar el tamaño y espacio de los objetos tocables (interactivos con las manos).
- Considerar que el texto sea lo suficientemente largo para un móvil.
La arquitectura de información es uno de los primeros pasos parar así definir la disposición (layout) de diseño que facilite la navegación por el contenido, así que debes prestarle mucha atención.
Otros recursos (en inglés)
Los 6 patrones de pensamiento para arquitectura de información de apps para móvil.
Accesibilidad: Guía para IA, Diseño de UX y Diseño visual.
Excelente guía de IA para novatos
Fuente
Traducción y ajuste de artículo de diseño de arquitectura de información para aplicaciones en curso de diseño de UX de Google en Coursera.