DIAGRAMACIN EN LA AI

Introduccin
El primer paso en el diseo de objetos o procesos es la representacin mediante diagramas de su estructura, funcionamiento y comportamiento, concretando as las primeras ideas abstractas. En el caso de productos interactivos con interfaz, como por ejemplo los sitios web, esta interfaz tambin es objeto de diagramacin, especificando cul ser la organizacin y estructuracin visual de los diferentes elementos. Los diagramas se deben realizar a partir de la informacin recogida durante las etapas de investigacin de la audiencia, en las que se estudia a los usuarios con el objetivo de crear un producto que satisfaga sus necesidades.

En qu consiste la diagramacin
La diagramacin, a la cual nos referimos, consiste en la representacin de los contenidos que tendr un producto digital, y las relaciones entre dichos contenidos. Desde sus orgenes los seres humanos representaron escenas de caza, danzas rituales y otros aspectos de su vida. La representacin forma parte de la naturaleza cognitiva humana, y es lgico que el hombre, en su devenir histrico, haya usado esta capacidad para plasmar en algn soporte, ideas concebidas mentalmente. La representacin se ha usado desde los comienzos del diseo de software, en forma de organigramas, diagramas de flujo de datos, rboles de decisin, etc. Al evolucionar las interfaces grficas de usuario, las labores de representacin se ampliaron con los llamados guiones de navegacin y guiones de interaccin, los cuales consistan en diagramas que representaban el funcionamiento de los productos electrnicos que se generaban en ese momento. La evolucin de los productos digitales, unida al crecimiento geomtrico de la informacin que soportan, ha originado la necesidad de ampliar estas formas de representacin con otras nuevas, o de enriquecer las existentes. Es por esto que se ha generalizado el uso de los esquemas de representacin entre arquitectos de informacin, enfocados a los aspectos organizativos y representativos de la informacin. Hay que sealar que durante el proceso de Arquitectura de Informacin se usan otras formas de representacin, con diferentes objetivos. Por ejemplo, en la aplicacin de la tcnica de Card Sorting se pueden generar dendogramas y grficos de escalamiento multidimensional; otro ejemplo seran las representaciones de las estructuras mentales de los usuarios tras una tormenta de ideas (brainstorming); o los organigramas de la empresa por la cual se crea el producto digital. Los diagramas a los que se refiere este artculo son los que se usan en arquitectura de informacin para proponer cmo ser el producto final. Esencialmente se refieren a la organizacin de los contenidos del producto, al funcionamiento bsico del mismo, y la ubicacin que tendrn estos contenidos en la interfaz. Los autores angloparlantes, pioneros en los temas del diseo y representacin del software, dividen estos diagramas en 2 tipos: Blueprints Wireframes

Como sustituto del trmino Blueprint a veces se usa el de Architecture Map, que significa Mapa de Arquitectura. Tambin como trmino similar a wireframe se usan otros trminos como mockup y prototype (maqueta y prototipo). (Rosenfeld & Morville, Wodtke, Snyder) El primer grupo de diagramas (blueprints), tiene como objetivo representar "las principales reas de organizacin y rotulado" (Rosenfeld & Morville), y estn enfocados a los aspectos estructurales y de funcionamiento del producto. Generalmente se representan con textos, cajas y flechas. Estos planos o blueprints parten de lo general a lo particular, de lo abstracto a lo concreto. Su funcin es explicitar iterativamente las decisiones de diseo, con el objetivo de comunicar dichas decisiones al resto de miembros del equipo de desarrollo, o al cliente final. Christina Wodtke conceptualiza los Blueprint como: "Un plano de diseo es justamente una buena idea llevada a la realidad a travs de la escritura".

El segundo grupo de diagramas (wireframe, mockup o prototype) tienen el objetivo de "mostrar el contenido de las pginas" (Rosenfeld & Morville), concretando los elementos que se plantearon en los primeros planos (blueprints) y ubicndolos en las pginas o pantallas del producto final. Este segundo grupo de diagramas estn comprendidos como prototipos de baja fidelidad, ya que se realizan en "blanco y negro" y no muestran el diseo grfico del producto ni la funcionalidad de sus cdigos de programacin. Los niveles de prototipos son: Prototipos de baja fidelidad o estticos (wireframes, mockup) Prototipos de fidelidad intermedia (diseo grfico) Prototipos de alta fidelidad o dinmicos (Web, HTML)

Sistemas de diagramacin en la AI
Una notacin muy usada por arquitectos de informacin y diseadores de interaccin para hacer la diagramacin de sitios web es la propuesta por Jesse James Garret (http://www.jjg.net), y que consiste, segn el propio autor, en un "vocabulario visual para describir arquitectura de informacin y diseo de interaccin" (Garret, trad. Velasco. 2002). El sistema de diagramacin est compuesto de smbolos geomtricos, flechas y lneas. El vocabulario visual de Garret es muy til para representar tanto el diseo de interaccin, como la estructura conceptual y organizativa del contenido. (Garret, trad. Velasco. 2002). Esta notacin grfica est concebida para realizar un diseo de lo general a lo concreto, ya que sigue el principio de la simplificacin de representacin a partir de cajas (boxes) y flechas (arrows). Este principio es el que le facilita a cualquier diseador comunicar arquitecturas de informacin de forma fcilmente comprensible.

Un propuesta propia
A partir de la experiencia del autor, se propone un sistema de diagramacin con una notacin que va de lo general a lo concreto, conformada por figuras ampliamente utilizadas por los creadores de productos digitales desde tiempos pasados. Se proponen tres tipos de diagramas de acuerdo a las funciones principales que cumple un arquitecto de informacin en el diseo de un producto digital: 1. Diagramas de organizacin. (planos - blueprints) 2. Diagramas de funcionamiento. (planos avanzados - blueprints) 3. Diagramas de presentacin. (maquetas - wireframes) Esta clasificacin no significa que estos diagramas sean excluyentes. Debe existir una interrelacin entre los mismos, de manera que cada diagrama creado complemente al anterior, y se convierta en apoyo de los siguientes. Igualmente la divisin por grupos de estos diagramas no significa que haya que hacer rgidamente tres.

Adems, esta propuesta no excluye a ningn otro modelo de diagramacin. Perfectamente podra complementarse con el vocabulario visual de Garret, con la propuesta de Dan Brown, o cualquier otro modelo de los anteriormente mostrados.

Propuesta de iconos
Para hacer los diagramas de organizacin se proponen una serie de iconos simples, iguales que los que propone Garret. Se basan en cajas y flechas o conectores.

Para hacer los diagramas de funcionamiento y los diagramas de presentacin se proponen otros iconos ms trabajados visualmente, con el objetivo de representar el comportamiento interactivo del producto.

Propuesta de diagramas
Los diagramas de organizacin consisten en la representacin de los grupos organizados, y de los elementos bsicos que contienen, siendo el diagrama bsico para entender la estructura general del producto.

Figura 5: Diagrama de organizacin 3

El diagrama de funcionamiento es la representacin de las estructuras con los flujos de navegacin. Este diagrama tiene un nivel de acabado superior al anterior y complementa al mismo. Debe ser el que muestre los niveles de navegacin as como los tipos de navegacin en el producto.

Figura 6: Diagrama de funcionamiento El diagrama de presentacin es el que debe mostrar las formas de organizacin visual de los contenidos en las pginas principales, por ejemplo: la pgina inicial, las pginas interiores, pginas de productos, etc. Este diagrama no pretende representar el diseo grfico o diseo visual en detalle, sino especificar el esqueleto organizativo de la interfaz.

Figura 7: Diagrama de presentacin

Conclusiones
Los diagramas son mecanismos esenciales en la arquitectura de informacin de sitios web, libros electrnicos, sistema de informacin, etc. Esta tcnica alivia el coste de produccin, al ser ms fcil y econmico rectificar un diseo sobre el "papel" que sobre el producto implementado. Aunque existen formas de diagramacin desarrolladas por diversos autores, la propuesta de nuevas formas complementa las anteriores y contribuye a la creacin de formas futuras. 4