Escucha la versión de audio de este artículo
Como parte estándar del proceso de UX, los diseñadores crean la arquitectura de la información cuando construyen productos. La arquitectura de la información es mucho más que un simple mapa del sitio para mostrar qué página lleva a dónde.
De forma similar a los arquitectos de edificios que utilizan un plano para construir cada parte de una casa, desde las estructuras físicas hasta los mecanismos internos más complejos como la electricidad y la fontanería, la arquitectura de la información describe la jerarquía, la navegación, las características y las interacciones de un sitio web o una aplicación. Y al igual que los planos son el documento más valioso para un arquitecto en la construcción de un edificio, la arquitectura de la información puede ser la herramienta más poderosa en el arsenal de un diseñador.
Sin embargo, el desarrollo de una no es tan simple como poner una lista de características juntos y el mapa de cómo funcionan – vamos a investigar el proceso.
¿Qué es la arquitectura de la información y por qué es importante?
La arquitectura de la información (AI) es, como un plano, una representación visual de la infraestructura, las características y la jerarquía del producto. El nivel de detalle depende del diseñador, por lo que la AI también puede incluir la navegación, las funciones y los comportamientos de la aplicación, el contenido y los flujos. No hay un límite establecido para el tamaño o la forma de la AI; sin embargo, debe abarcar la estructura general del producto para que cualquier persona (teóricamente) sea capaz de leerla y entender cómo funciona el producto.
Utilizaremos la referencia del plano a menudo porque el propósito de ambos documentos es casi idéntico. Al igual que un plano, la AI proporciona a los diseñadores (así como a los equipos de desarrollo e ingeniería de productos) una vista de pájaro de todo el producto. Disponer de un único documento que ofrezca una representación sencilla y comprensible de cómo funciona la aplicación o el sitio web es vital para desarrollar nuevas características, actualizar las existentes y ver qué es posible teniendo en cuenta el producto existente.
Con la IA disponible, se hace significativamente más fácil tomar decisiones clave para nuevas características e implementaciones, entender los plazos para los cambios del producto, y seguir el comportamiento del usuario a través de múltiples procesos.
Vamos a sumergirnos en un vídeo básico para ver cómo se construye una IA.
Cómo diseñar la arquitectura de la información
Como parte del proceso de UX, el diseño de la IA sigue patrones muy similares a los diagramas de flujo: Añadir formas y conectarlas con líneas de forma organizada a un único documento. El reto cuando se construye la AI es entender cómo funciona realmente su aplicación o sitio web desde la perspectiva del usuario, y cómo organizar esa información en un formato legible.
Hay dos requisitos principales para construir realmente la AI: organizarla a través de una jerarquía visual (es decir, una jerarquía de características, funciones y comportamiento) y crear una leyenda para mostrar diferentes tipos de características, interacciones y flujos. Con un diagrama de flujo estándar, las formas siguen requisitos específicos (los rectángulos son procesos, los diamantes son puntos de decisión, etc.); sin embargo, seguir esa nomenclatura no es un requisito.
En otras palabras, los factores más importantes para construir su AI son dónde se colocan los componentes individuales de la arquitectura (jerárquicamente), y cómo se etiquetan y muestran.
Entendiendo y mostrando la jerarquía visual
El aspecto más desafiante de la creación de una nueva arquitectura de la información está casi siempre en construirla jerárquicamente. Es un error común pensar que la AI debe construirse «de arriba hacia abajo». Eso es casi siempre más difícil de hacer a menos que sea un producto existente, como en el video anterior.
Cuando se construye la AI desde cero, a menos que su sitio web o aplicación esté siguiendo un formato estándar, dibujar cualquier cosa después del nivel superior es muy difícil. Es como pedirle a un mecánico que construya un coche de arriba a abajo en lugar de por partes. Cada pieza tiene que ser construida de antemano con su propia investigación, tiempo de diseño y desarrollo. Lo mismo ocurre con la AI.
La presentación de la jerarquía visual es un activo valioso para la AI, no sólo porque proporciona un mejor contexto para el lector, sino que también generaliza las regiones clave del producto. Si la función más importante de tu aplicación es pedir un viaje (a la manera de Uber o Lyft) que se puede hacer desde la página de inicio, entonces esa página tendrá la mayor cantidad de puntos de contacto y el mayor valor del producto. Lo mismo ocurrirá con la jerarquía visual.
Los mapas de sitio son útiles para entender la jerarquía, ya que organizan las páginas numéricamente (como 1.0 Inicio, 2.0 Pago, 2.1 Añadir método de pago, etc.). O considere el ejemplo de la imagen siguiente para el sitio web de la biblioteca de la Universidad de Duke, donde la navegación superior no sólo está en la parte superior, sino que también está resaltada para ser visible en toda la aplicación.
Jerarquía de formas, colores y otros elementos visuales
Además de la jerarquía, la arquitectura anterior hace otra cosa bien: Muestra cada punto de compromiso de forma única según sea necesario a través de una simple leyenda y unas pocas frases clave. La leyenda denota el tipo de página y de contenido, y señala las variaciones entre los colores de las formas. Esto es importante porque, aunque el sitio de Duke parece bastante sencillo, la AI sólo tiene tres niveles de profundidad. Cada rectángulo amarillo denota una aplicación, por lo que los procesos dentro de cada una de esas cajas no se incluyen en este documento.
Incluso sin esas partes disponibles, la estructura es tal que podemos entender cómo navegar por el sitio web a través de la IA solamente. Esto se detiene cuando llegamos a una aplicación dentro del sitio web – no tiene por qué hacerlo.
La AI de abajo es para un juego. Usando cuatro formas, sin color, y fragmentos de texto inteligentemente colocados, cada interacción importante es comprensible sin prototipos, y lo que es más importante, puede ser entendida por cualquier persona que trabaje en ella.
Este modelo no es perfecto, pero organiza la jerarquía de la app con claridad y delimita lo que el usuario ve o hace en cada momento.
Las mejores herramientas de arquitectura de la información
Hay muchas aplicaciones de software que permiten construir una AI, pero pocas son lo suficientemente sencillas y rápidas como para que la experiencia sea agradable. O al menos, fáciles de manejar.
Draw.io, utilizado en el vídeo de arriba, es completamente gratuito para uso personal y profesional y se conecta automáticamente a Google Drive. También tiene integraciones con Confluence y JIRA, que son de pago. Draw.io es excelente para hacer diagramas de flujo, crear flujos de usuarios y arquitectura de la información, y con la funcionalidad de Drive, varias personas pueden trabajar en el mismo documento y ver los cambios en directo. También hay una versión gratuita sin conexión.
Lucidchart es otra gran herramienta que proporciona una experiencia ligeramente mejor que Draw.io y tiene beneficios adicionales como plantillas preconstruidas, muchas más integraciones, una aplicación móvil (calificada con 2,5 estrellas en la App Store) y soporte para empresas.
Omnigraffle y Visio son pilares de la industria desde hace mucho tiempo y funcionan de manera excelente para la construcción y el mantenimiento de un diseño de AI, aunque Visio es sólo en línea (la antigua versión fuera de línea es sólo para Windows), mientras que Omnigraffle es sólo para Mac y requiere compras separadas para las versiones de MacOS y iOS. OmniGraffle tiene un beneficio sobre los principales competidores en que proporciona la automatización de JavaScript y AppleScript, que para la mayoría de los diseñadores puede ser innecesario, pero por lo general, los arquitectos de información a tiempo completo lo aprecian.
Todas las herramientas mencionadas anteriormente se hacen para la velocidad y la facilidad de uso, específicamente en torno a los diagramas de flujo, que sigue principios casi idénticos a la arquitectura de la información. Otras aplicaciones como Balsamiq, MindMeister, MindManager o XMind ofrecen un comportamiento de estilo similar, pero están construidas para otros propósitos principales, como la creación de prototipos o la elaboración de mapas mentales.
Mejores prácticas de arquitectura de la información
Aunque hay pocas reglas definidas para lo que constituye la arquitectura de la información, al pasar por el proceso, considere lo siguiente:
No se centre en la jerarquía, concéntrese en la estructura
La jerarquía es ajustable. La página de inicio siempre será la página de inicio, pero a dónde lleva, cómo llegan los usuarios a esos lugares y todo lo que hay en medio y más allá se determina después.
Todos los procesos deben ser lógicos
Aunque la IA en el proceso de UX es para las interacciones del usuario, cada paso del camino tiene que tener sentido. Las pantallas de registro no deberían llevar a los ajustes, una función de cámara no debería saltar a una vista de mapa… la lista continúa.
Recuerda el proceso de UX
Un error común es hacer simplemente IA, sin recursos, investigación u otros activos o trabajo. Eso es como decirle a un autor que escriba un libro sin un esquema, o a un programador que codifique una aplicación sin prototipos.
Tú eres el cartógrafo
Los cartógrafos tienen en cuenta todo lo relacionado con un mapa, desde las cordilleras hasta las fronteras estatales. Al igual que los cartógrafos, los diseñadores determinan lo que entra en el diseño de la AI. Las páginas individuales, los comportamientos específicos de los usuarios, el contexto para los puntos de decisión… y así sucesivamente.
En última instancia, el cartógrafo decide lo que va en el mapa basándose en las necesidades del usuario. Lo mismo ocurre con los diseñadores, así que construye la AI para el usuario final, es decir, para los equipos de desarrollo y diseño de productos.
La arquitectura de la información está en constante cambio y evolución
Para recalcar el punto una vez más, todas las AI se construyen para el cambio. Los productos evolucionan, los diseños cambian, los usuarios se adaptan, y el ciclo continúa, una y otra vez. No te lo tomes demasiado en serio y ten en cuenta que siempre habrá margen de mejora. No busque la perfección; construya una AI sencilla y adaptable.
Mi arquitectura de la información está hecha… ¿Y ahora qué?
Es una concepción común que cualquier trabajo de diseño nunca está realmente hecho, y ese es ciertamente el caso de la arquitectura de la información. Crecen y se reducen y cambian como lo hacen nuestros productos. A diferencia de un plano de un edificio, la AI siempre evolucionará en función de cualquier cosa, desde las necesidades del usuario hasta las nuevas características o la revisión del producto. Gran parte de la estructura puede permanecer igual y proporcionar consistencia entre versiones para que los usuarios no se confundan.
Y eso es algo bueno. Saber que la AI es un documento fluido -que probablemente cambie semanalmente, y a veces incluso a diario- es una forma poderosa de mantener la estructura general de tu aplicación o sitio web sin tener que tocar el código o crear nuevos prototipos. Cuanto mejor conozca la AI todo el equipo de desarrollo del producto, más rápido sabrá todo el mundo lo que es y lo que no es posible, y la seriedad de cualquier supuesto «trabajo fácil».
Lo que nos lleva a la verdadera belleza de la arquitectura de la información: No hay un punto de partida predefinido. Mientras que el proceso tradicional de diseño UX dicta que la AI se construye después de completar suficientes flujos de usuarios; armado con mucha investigación de usuarios y de la competencia, también puede ser lo primero que se haga… o lo último. El proceso de creación de prototipos a menudo aporta información sobre cómo deberían producirse ciertos comportamientos o acciones que serían difíciles de imaginar a partir de una AI lógica o poco imaginativa.
Como práctica en constante evolución, el diseño de la AI es un arte tanto como una habilidad, que es en parte la razón por la que las grandes corporaciones tienen puestos de arquitecto de información. Estos diseñadores son los guardianes de los sistemas masivos y, gracias a su conocimiento del crecimiento del producto a lo largo del tiempo, ayudan a los equipos de producto, diseño e ingeniería a tomar las decisiones correctas a lo largo de los años. Esa escala de organización no es para todos los diseñadores, pero todo diseñador puede construir una arquitectura de la información sencilla y comprensible.
– – –
Lectura recomendada sobre arquitectura de la información
IA para la web y más allá
Cómo dar sentido a cualquier desorden: Arquitectura de la información para todos
Básicos de la arquitectura de la información
La diferencia entre la arquitectura de la información y el diseño UX