Con este post iniciamos una serie de artículos centrados en explicar cómo trabajamos en Biko la AI. Trataremos de explicar en nuevos artículos algunos de los pasos de nuestra metodología. ¡Atentos al siguiente sobre Modelado de personajes y escenarios!

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 : )