¿Son los guiones gráficos el eslabón perdido en su proceso de diseño de experiencia de usuario?

Guiones gráficos… eso es lo que usan los guionistas para crear películas y programas de televisión, ¿verdad? Sí, eso es cierto, pero los guiones gráficos no se limitan al mundo del entretenimiento ficticio. También pueden desempeñar un papel importante en el proceso de diseño de la experiencia del usuario.

En esta publicación, voy a entrar en todo lo relacionado con los guiones gráficos. Comenzaré con una definición simple y trabajaré en cómo puede usar guiones gráficos para diseñar los viajes de sus usuarios en su proyecto y, en consecuencia, diseñar una mejor experiencia de usuario.

¿Qué son los guiones gráficos?

Los guiones gráficos son un concepto bastante simple. Básicamente, son ilustraciones simples que se mueven secuencialmente a través de una historia. Como mencioné, son más conocidos por su uso como herramienta para desarrollar las tramas de películas y obras de teatro.

Para una visualización divertida de cómo funcionan los guiones gráficos cuando se aplican a las películas, Flavorwire reunió una lista de guiones gráficos de algunas películas famosas . ¿Recuerdas la famosa escena de la cortina de baño de Psycho? Así es como se veía en forma de guión gráfico:

Pero los guiones gráficos no solo son útiles para diseñar tramas ficticias. También se han convertido en un método popular para visualizar cómo un ser humano real experimenta un sitio web o una aplicación.

Cuando se trata de su sitio web o aplicación, un guión gráfico básicamente sigue el viaje completo de una persona de usuario específica, comenzando con ellos luchando con un problema y terminando con ellos interactuando con su creación y experimentando una resolución positiva.

Lo importante es que su guión gráfico represente a una persona real con un problema real en un entorno real . Los guiones gráficos siempre deben sentirse auténticos y basados ​​en la realidad.

Entonces, ¿cómo podría ser esto en realidad? Aquí hay un ejemplo de Chelsea Hostetter en el Austin Center for Design :

¿Observe cómo el guión gráfico de Chelsea representa una historia completa de principio a fin? No se enfoca solo en el uso que hace Susan de la aplicación Heartline. Comienza con una situación de la vida real, alcanza su punto máximo cuando Susan usa la aplicación para conectarse con Tom y termina con la resolución del problema en la vida real.

¿Cómo ayudan los guiones gráficos a mejorar el diseño de la experiencia del usuario?

Hoy en día, hay un gran enfoque en los grandes datos. Y si bien los datos duros fríos son ciertamente valiosos, eliminan por completo al ser humano del proceso de diseño. El guión gráfico puede ayudar a traer de vuelta ese elemento humano al diseño.

Con el guión gráfico, tiene humanos reales que completan acciones reales, en lugar de descripciones de características abstractas o datos analíticos.

Más allá del elemento humano, el guión gráfico también le facilita revisar e iterar rápidamente sus ideas. Debido a que todo lo que está haciendo es esbozar el proceso, necesita invertir mucho menos tiempo del que necesitaría para crear un prototipo funcional de la misma funcionalidad.

Eso significa que puede implementar cambios más rápidamente de lo que sería posible con un prototipo.

Consejos para ayudar a crear su primer guión gráfico

No necesita ser un ilustrador profesional para crear un guión gráfico, pero hay algunas estrategias que debe seguir para crear guiones gráficos que realmente son útiles para su proceso de diseño.

Recuerde, su objetivo es crear algo que sea auténtico y convincente. Si es necesario, regrese y eche un vistazo al ejemplo de Heartline nuevamente. Observe cómo la historia:

  • Está repleto de emociones humanas.
  • Se enfoca en todo el escenario, no solo en la parte en la que los personajes usan tu producto.
  • Tiene una resolución clara.

Si bien el producto final de Chelsea es un buen ejemplo, no sienta que necesita pasar directamente de la página en blanco al guión gráfico completo.

En cambio, ayuda a desarrollar lentamente ese producto final.

Primero, recuerda que tu meta es tener:

  • Personajes auténticos
  • Un problema de la vida real
  • Una forma lógica y auténtica de resolver ese problema a través de su producto.
  • Una resolución real al final del guión gráfico.

Para asegurarse de alcanzar todos esos elementos, es más fácil comenzar con descripciones de texto sin formato que esbozan los conceptos básicos de la historia. Conéctalos en un arco narrativo, pero no te preocupes por profundizar demasiado todavía.

Luego, regrese y reescriba su historia incorporando emociones más detalladas. ¿Qué sienten tus personajes en cada etapa del viaje? ¿Estan felices? ¿Triste? ¿Indiferente?

Una vez que tenga la narrativa y las emociones esbozadas en texto sin formato, estará listo para traducirlo en un guión gráfico real. Para ello, divide cada acción de la historia en un marco individual y haz un bosquejo con ilustraciones reales.

Si tiene las habilidades artísticas, intente traer emoción a sus ilustraciones cuando dibuje su guión gráfico.

Herramientas para ayudarlo a crear guiones gráficos

Antes de profundizar en algunas herramientas para ayudarlo a crear guiones gráficos de la experiencia del usuario, debo comenzar con el hecho de que probablemente ya tenga suficientes herramientas guardadas en un armario en alguna parte.

Es decir, no necesariamente necesita nada sofisticado para crear un guión gráfico. Ir de baja fidelidad con lápiz y papel está totalmente bien si va a ser el único que mira su guión gráfico. O bien, siempre puede optar por un enfoque digital usando algo como PowerPoint para unirlo en una historia cohesiva.

Pero si va a colaborar con otros miembros del equipo, es posible que desee crear guiones gráficos que se vean un poco más pulidos y profesionales de lo que permiten el lápiz y el papel o PowerPoint. En esas situaciones, las siguientes herramientas pueden ayudar…

Guión gráfico que

En lugar de dibujar a mano, Storyboard That le permite crear guiones gráficos cuadro por cuadro utilizando elementos prefabricados de arrastrar y soltar. Una vez que haya esbozado su historia con texto sin formato, puede usar estos elementos para crear un producto final más pulido.

La herramienta es bastante simple de usar. Todo lo que realmente necesitas hacer es:

  • Elige un fondo para tu escena.
  • Agregar personajes
  • Traer texto o elementos

Por ejemplo, pude crear este guión gráfico básico en solo un par de minutos:

Si bien dudo que gane una competencia de guión gráfico, es mucho más rápido que dibujar a mano (al menos para mí). El único inconveniente es que pierdes la capacidad de expresar emociones con las expresiones faciales de tus personajes.

La herramienta básica Storyboard That es gratuita, aunque también tienen planes premium que ofrecen más funciones.

tableros

Boords es una herramienta más elegante y de alta tecnología que te ayuda a crear guiones gráficos a partir de ilustraciones existentes.

Si bien no lo ayudará a crear esas ilustraciones, sí lo ayudará a organizarlas, agregar notas y compartir sus guiones gráficos a través de Internet o PDF:

Entonces, si planea colaborar con otros en su guión gráfico, Boords hace que sea mucho más fácil ajustarlo sobre la marcha.

Hay un plan gratuito básico que te permite tener hasta dos guiones gráficos gratis. Pero después de eso, deberá pagar Pro.

Terminando

Los guiones gráficos no son solo para películas y obras de teatro. Lo ayudan a iterar más rápido, comprender mejor a sus usuarios y poner una cara humana en todo su proceso de diseño.

Solo recuerda: tus guiones gráficos deben ser auténticos y convincentes. Esbozar una situación descabellada en la que tu producto salva al mundo puede sentirse bien, pero ese no es el objetivo del guión gráfico. Manténgalo realista y concéntrese en contar la historia completa de principio a fin.

Ahora te toca a ti: ¿utilizas guiones gráficos en tu proceso de diseño? Si es así, ¿crees que valen la pena el tiempo que tardan en hacerlos?

Imagen en miniatura del artículo por CharacterFamily / shutterstock.com