Si nos atenemos a una definición formal de qué son los prototipos, “la representación mediante diagramas de la estructura, el funcionamiento y el comportamiento de objetos o procesos” (NoSoloUsabilidad), nos encontramos con que la mayoría de las veces no se cumple más que la representación de la estructura, olvidándonos del funcionamiento y del comportamiento.

Este “olvido”, normalmente, se debe principalmente a dos motivos, el primero suele ser causado por el propio diseñador (entenderemos diseñador por la persona encargada de la generación de wireframes) habituado a representar únicamente la estructura. El segundo motivo sería más propio del medio, el papel, en el que se presentan los entregables, ya que resulta complejo representar interacción en algo plano y estático.

¿Qué podemos hacer para representar el funcionamiento y el comportamiento?

Vamos a tratar de dar un poco de luz y unas pequeñas pautas que pueden servirnos en nuestro día a día, aunque la mejor solución siempre es la imaginación de cada uno.

Solución 1: Usar patrones

Un patrón es un modelo que sirve de muestra para sacar otra cosa igual (RAE). Un patrón siempre, o casi siempre, mantiene el mismo funcionamiento y comportamiento, y puede servirnos para entender de manera general qué interacción va a haber con el usuario.

Aunque no representará de manera específica y formal el funcionamiento exacto en un caso concreto, puede ser una guía útil, un punto de partida.

Podemos encontrar patrones en:

• UI Patterns: con definición del problema que resuelve y cuándo usarlos.
• Welie patterns: igual pero con muchos más patrones, más completo.
• MockupsToGo (patrones para la herramienta Balsamiq Mockups)
• Wiki Designing Social Interfaces: Wiki con patrones de interfaces Sociales

Solución 2: Representar la interacción

A través de:

• Iconos gestuales o que representen acción (flecha ratón, doble click, mouseover,…)
• Símbolos: números, anotaciones,comentarios
• Transiciones: Cambios de estado, flujo de interacción

¿Cómo? Con stencils

• Touchscreen Stencils: representan gestos táctiles
• Konigi Stencils: contienen muchos iconos de anotaciones

Solución 3: Crear prototipos interactivos

Los prototipos interactivos están entre un prototipo plano en papel y una maqueta dinámica en HTML y, a veces, pueden generarse desde prototipos planos sin mucho esfuerzo por parte del diseñador y cuentan con la ventaja de que pueden usarse como entregables.

Por ejemplo, para Microsoft Visio tenemos VisDynamica, un addon que nos genera páginas web interactivas desde nuestro prototipo. Y también contamos con la posibilidad de generar PDF’s dinamicos desde la propia herramienta.

También podemos crear un prototipo interactivo con PowerPoint 2007 y un toolkit, o incluso desde Excel. Aunque ambos estén quizás más enfocados a realizar test de usuarios sobre prototipos de manera ágil que a terminar como entregables para el cliente.

Otras soluciones

Existen otras soluciones para representar e incluso crear la interacción en nuestros prototipos, como puede ser el prototipado en papel, pero se trataba con este artículo de intentar representar la interacción en nuestros entregables, y a según que clientes parece dificil entregarles un boceto hecho con boli y post-its.

A parte de todo lo ya dicho, siempre nos queda nuestra propia imaginación : )