Diseño

La etapa de Diseño es el momento del proceso de desarrollo para la toma de decisiones acerca de cómo diseñar o rediseñar, en base siempre al conocimiento obtenido en la etapa de planificación, así como a los problemas de usabilidad descubiertos en etapas de prototipado y evaluación.

5.1.1. Modelado del usuario

Toda la información obtenida de los estudios de usuarios realizados en la anterior fase de planificación debe servir como base para comenzar el diseño, pero para ello se debe resumir y sintetizar dicha información.

Este paso se denomina modelado del usuario y consiste en la definición de clases o perfiles de usuarios en base a atributos comunes. Los atributos sobre los que se hará la clasificación dependen de la información que se tenga de la audiencia, pero normalmente se tratarán de atributos tales como necesidades de información, condiciones de acceso, experiencia y conocimientos.

Mediante esta técnica, el diseñador tendrá en mente para quién diseña, qué espera encontrar el usuario y en qué forma. El diseño del sitio web debe estar orientado al usuario, organizando y estructurando la información según los modelos definidos de usuarios.

El problema de esta técnica de modelado de usuario es que cuando la audiencia es demasiado extensa y heterogénea, la categorización total de la audiencia puede no ser viable. En estos casos es conveniente hacer uso del enfoque 'persona', ideado por Cooper (1999).

Esta técnica de modelado del usuario se basa en la definición de arquetipos de usuarios que representan patrones de conducta, objetivos y necesidades. Estos arquetipos, llamados "personas", son descripciones en forma narrativa de usuarios, a los que se les da una identidad inventada: fotografía, nombre,... En cambio, todos los atributos, características y necesidades del arquetipo deben estar basados en información real extraída de la audiencia objetiva del sitio web, ya que si éstos fueran datos inventados la técnica perdería toda su utilidad.

Además se deben definir "scenarios" - descripciones de situaciones de uso del sitio - sobre los que poder contextualizar la interacción persona-aplicación web.

Las "personas" definidas, al contrario de lo que se pretendía con la categorización de la audiencia, no pueden representar al total de los usuarios del sitio web, pero es que ésta no es su misión.

La función de esta técnica es la de servir de soporte para la toma de decisiones en el diseño del sitio, permitiendo al desarrollador realizar un diseño centrado en el usuario, o más correctamente, en "algún" usuario. Este usuario podemos considerarlo 'real', ya que aunque no pertenece al mundo real, su descripción está basada sobre, y por tanto representa a, un nutrido grupo de usuarios reales.

Es demasiado común que el diseñador se imagine a sí mismo usando el sitio y por tanto sea incapaz de comprender por qué a alguien le puede resultar difícil, incomodo y hasta frustrante su uso. Estos arquetipos de usuarios conseguirán precisamente que el diseñador tenga en mente a un usuario 'real', con limitaciones, habilidades y necesidades reales.

5.1.2. Diseño conceptual

El objetivo de la fase de Diseño Conceptual es definir el esquema de organización, funcionamiento y navegación del sitio. No se especifica qué apariencia va a tener el sitio, sino que se centra en el concepto mismo del sitio: su arquitectura de información.

Los sitios web son sistemas hipermedia formados por conjuntos de páginas interrelacionadas por enlaces unidireccionales, pudiendo cada una de estas páginas contener sub-elementos con entidad propia, contenidos multimedia y herramientas interactivas.

La "estructura" del sitio web se refiere precisamente a las conexiones y relaciones entre páginas, a la topología de la red de páginas, así como a la granularidad de los elementos de información contenidos en las páginas; y la "navegación" a las posibilidades y forma en que cada página presenta las opciones de desplazamiento hacia otras páginas.

La definición de la estructura del sitio puede hacerse desde dos enfoques diferentes y complementarios: aproximación descendente y ascendente. En la descendente se trata de estructurar del "todo" a las "partes", dividir los contenidos en páginas y definir los enlaces entre páginas. En la Ascendente, por el contrario, se definen los bloques mínimos de información, estructuración que va más allá de la propia segmentación de información en páginas.

Una vez definida la estructuración del sitio es necesario documentarla, para así tener un modelo de referencia sobre el que sustentar el desarrollo del sitio. La forma de documentar arquitecturas se suele hacer a través de grafos y esquemas, con el objetivo de que sean de fácil y rápida comprensión por todos los miembros del equipo de desarrollo.

Si la arquitectura es ascendente normalmente se documentará a través de diagramas entidad-relación. Por otro lado, cuando la arquitectura a documentar es la descendente, para sitios web proponemos el uso del vocabulario gráfico de Garret (2002). A través de unas sencillas convenciones gráficas para la diagramación de la arquitectura, podemos definir la estructura de la información así como la navegación del sitio.

Otras tareas a llevar a cabo por el Arquitecto de Información o diseñador en la fase de Diseño Conceptual son: Definir sistemas de clasificación para los contenidos; Elaborar índices y mapas del sitio; Aplicar metadatos a cada una de las páginas y sub-elementos de información; y Definir el Sistema de Rotulado (Rosenfeld, Morville; 2002).

Entre las técnicas de Diseño Centrado en el Usuario a aplicar en la etapa de Diseño Conceptual destacamos, por su utilidad y facilidad de ser llevada a cabo, la técnica de "card sorting" u ordenación de tarjetas. Ésta se basa en la observación de cómo los usuarios agrupan y asocian entre sí un número predeterminado de tarjetas etiquetadas con las diferentes categorías o secciones temáticas del sitio web. De esta forma, partiendo del comportamiento de los propios usuarios, es posible organizar y clasificar la información de un sitio web conforme a su modelo mental. (Hassan Montero et al.; 2004)

5.1.3. Diseño visual y definición del estilo

En esta fase se especifica el aspecto visual del sitio web: composición de cada tipo de página, aspecto y comportamiento de los elementos de interacción y presentación de elementos multimedia.

Con el objetivo de evitar la sobrecara informativa, en el diseño de cada interfaz se debe tener en cuenta el comportamiento del usuario en el barrido visual de la página, distribuyendo los elementos de información y navegación según su importancia en zonas de mayor o menor jerarquía visual - por ejemplo, las zonas superiores del interfaz poseen más jerarquía visual que las inferiores-.

Además de la posición de cada elemento en la interfaz, existen otras técnicas para jerarquizar información como son: uso del tamaño y espacio ocupado por cada elemento para otorgarle importancia en la jerarquía visual, utilización del contraste de color para discriminar y distribuir información, uso de efectos tipográficos para enfatizar contenidos, rotura de la simetría y uso de efectos de relieve / profundidad para resaltar elementos, etc.

Además de evitar la sobrecarga informativa jerarquizando los contenidos mediante las técnicas descritas, para evitar la sobrecarga memorística se recomienda definir menús de navegación con un número de opciones reducido, normalmente no más de nueve diferentes.

Otro aspecto importante en el diseño visual del sitio es la accesibilidad. En el uso de colores, por ejemplo, se debe ofrecer suficiente contraste entre texto y fondo para no dificultar la lectura, e igualmente seleccionar combinaciones de colores teniendo siempre en cuenta las discapacidades visuales en la percepción del color que pudieran presentar nuestros usuarios.

Al utilizar imágenes en el diseño, por motivos de accesibilidad y comprensibilidad, se debe cuidar su resolución y tamaño, así como en fotografías la no pérdida de significación o contexto por recorte o minimización excesiva de la imagen.

Desde una perspectiva más amplia del diseño visual del sitio es importante mantener una coherencia y estilo común entre todas las páginas, proporcionando una consistencia visual a todo el sitio. Para asegurar que esta coherencia se cumple, es útil elaborar un libro o guía de estilo que sirva de documento referencia para todo el equipo de desarrollo.

5.1.4. Diseño de contenidos

En el diseño de contenidos hipermedia se debe mantener un equilibrio entre lo que serían contenidos que no aprovechasen las nuevas posibilidades hipertexto y multimedia, y lo que serían contenidos caóticos o desorientativos debido a un uso excesivo y no sosegado de las posibilidades hipermedia.

Sin prescindir de las capacidades que ofrece el nuevo medio, de lo que se trata es de diseñar contenidos interrelacionados y vinculados, manteniendo cierta coherencia informativa, comunicacional y organizativa.

La escritura hipertextual se debe realizar de forma diferente a la tradicional. El nuevo medio y sus características obligan a ser concisos, precisos, creativos y estructurados a la hora de redactar. Debemos conocer a quién nos dirigimos y adaptar el lenguaje, tono y vocabulario utilizado al usuario objetivo.

Algunos consejos a seguir en el diseño y redacción de contenidos son:

• Seguir una estructura piramidal : La parte más importante del mensaje, el núcleo, debe ir al principio.
• Permitir una fácil exploración del contenido : El lector en entornos Web, antes de empezar a leer, suele explorar visualmente el contenido para comprobar si le interesa.
• Un párrafo = una idea : Cada párrafo es un objeto informativo. Se deben trasmitir ideas, mensajes... evitando párrafos vacíos o varios mensajes en un mismo párrafo.
• Ser conciso y preciso : Al lector no le gusta leer en pantalla.
• Vocabulario y lenguaje : Se debe utilizar el mismo lenguaje del usuario, no el de la empresa o institución. El vocabulario debe ser sencillo y fácilmente comprensible.
• Tono : Cuanto más familiar y cercano (sin llegar a ser irrespetuoso) sea el tono empleado, más fácil será que el lector preste atención.
• Confianza : La mejor forma de ganarse la confianza del lector es permitiéndole el diálogo, así como conocer cuanta más información posible acerca del autor.