Arquitectura de información y flujos de usuario
Antes de diseñar una sola pantalla necesitas saber qué hay en el producto, cómo se organiza y por qué pasos pasa el usuario para conseguir su objetivo. Eso es arquitectura de información y diseño de flujos, y es el trabajo invisible que hace que un producto sea claro u opaco.
Arquitectura de información (AI)
La arquitectura de información es la disciplina que organiza, etiqueta y estructura el contenido de un sistema para que los usuarios puedan encontrar lo que buscan y entender dónde están.
No es solo la navegación. Es la lógica que hay detrás de cómo se agrupa todo.
Principios fundamentales:
- Principio de divulgación progresiva: muestra primero lo esencial; añade detalle a medida que el usuario lo necesita. No vuelques toda la información de golpe.
- Principio de proximidad: los elementos relacionados deben estar cerca. Si el usuario tiene que saltar de un sitio a otro para hacer una tarea coherente, la arquitectura falla.
- Principio de consistencia: el mismo concepto siempre con el mismo nombre y en el mismo lugar. Cambiar la etiqueta de “Mis proyectos” a “Proyectos” en distintas partes del producto genera desorientación.
- Principio de contexto: el usuario debe saber siempre dónde está, de dónde viene y a dónde puede ir.
Card Sorting: descubrir cómo agrupa el usuario
El Card Sorting es una técnica de investigación que te ayuda a entender cómo el usuario mental agrupa el contenido, antes de imponerle tu propia lógica.
Cómo funciona:
- Escribe cada categoría u opción de contenido en una tarjeta separada.
- Pide al usuario que las agrupe de la forma que le resulte más natural.
- Pídele que ponga nombre a los grupos resultantes.
Existen dos variantes:
- Abierto: el usuario crea sus propios grupos desde cero. Ideal para diseñar una arquitectura nueva.
- Cerrado: el usuario clasifica tarjetas en grupos que ya has definido. Ideal para validar una arquitectura existente.
Con 15-20 participantes ya tienes patrones estadísticamente útiles.
Tree Testing: validar la estructura
Una vez que tienes una propuesta de arquitectura, el Tree Testing te permite validarla antes de diseñar. El usuario navega por el árbol de categorías solo con texto (sin diseño visual) e intenta encontrar cosas concretas.
Si falla, el problema es estructural, no visual. Y es mucho más barato corregirlo ahora que después de maquetar todas las vistas.
Mapas del sitio y jerarquía
El mapa del sitio es la representación visual de la estructura completa del producto: qué secciones existen, cómo se anidan y cómo se relacionan.
No es solo para webs. Cualquier producto digital con varias pantallas necesita este artefacto para que diseño y desarrollo hablen el mismo idioma.
Niveles habituales:
- Nivel 0: página raíz o pantalla de entrada.
- Nivel 1: secciones principales (Dashboard, Proyectos, Configuración).
- Nivel 2: subsecciones dentro de cada sección.
- Nivel 3 en adelante: pantallas de detalle, vistas específicas, modales.
Una regla práctica: si el usuario necesita más de tres clics para llegar a una función que usa frecuentemente, la arquitectura tiene un problema.
Flujos de usuario (User Flows)
Un flujo de usuario describe la secuencia de pasos que una persona sigue para completar una tarea concreta dentro del producto.
No es el happy path solamente. Un flujo bien diseñado incluye:
- La entrada: desde dónde llega el usuario (email, notificación, búsqueda directa).
- Las decisiones: puntos donde el usuario puede ir por caminos distintos.
- Los estados de error: qué pasa si algo falla o el usuario hace algo inesperado.
- La salida: dónde termina el flujo y qué ha conseguido el usuario.
Notación básica:
[Rectángulo] = pantalla o vista
[Rombo] = decisión con dos o más caminos
[Óvalo] = inicio o fin del flujo
[Flecha] = dirección del flujo
Ejemplo de flujo: crear una cuenta
Inicio
→ Pantalla de bienvenida
→ Clic en "Crear cuenta"
→ Formulario de registro
→ ¿Email válido?
→ No → Mensaje de error en campo → vuelve al formulario
→ Sí → ¿Contraseña cumple requisitos?
→ No → Indicador de requisitos pendientes → vuelve al campo
→ Sí → Envío del formulario
→ Email de confirmación enviado
→ Pantalla "Revisa tu correo"
Fin
User Journey Map
El Journey Map es distinto al flujo: no describe los pasos técnicos del sistema, sino la experiencia emocional del usuario a lo largo de un proceso más amplio, que puede incluir pasos fuera del producto.
Un Journey Map típico incluye:
- Fases: los momentos principales del proceso (descubrir, registrarse, usar por primera vez, renovar).
- Acciones: qué hace el usuario en cada fase.
- Pensamientos: qué está pensando o preguntándose.
- Emociones: cómo se siente (curva de emoción: frustración, alivio, confianza…).
- Oportunidades: dónde el equipo puede mejorar la experiencia en cada punto.
Es una herramienta de comunicación tanto como de diseño. Sirve para que stakeholders de distintas áreas entiendan la experiencia completa del usuario, no solo su parte del sistema.
¿Qué hemos aprendido?
- La arquitectura de información organiza el contenido según la lógica del usuario, no la del equipo.
- Card Sorting y Tree Testing son técnicas para descubrir y validar esa estructura con datos.
- Los flujos de usuario modelan la secuencia de pasos incluyendo decisiones y estados de error.
- El Journey Map captura la dimensión emocional de la experiencia, no solo los pasos técnicos.
Siguiente paso
En la próxima lección veremos Wireframing, donde aprenderás a pasar de los flujos a estructuras visuales de baja fidelidad que puedes compartir y validar antes de invertir tiempo en diseño visual.