El diseño de tecnología moderna requiere un alto grado de interactividad: las barras de navegación cambian con la ubicación de desplazamiento del usuario, las casillas expanden el clic para mostrar y ocultar la información de respaldo, las listas se arrastran y se sueltan para reordenar, etc. Los diseñadores deben considerar todas las posibles interacciones del usuario para crear la experiencia de usuario más intuitiva y simplificada en sus productos.
Compartir y entregar diseños interactivos puede tomar una variedad de formatos dependiendo de lo que usted está tratando de lograr y de a quién va a entregar.
En este post, lo guiaré a través de varios enfoques de creación de prototipos, y describiré en qué contextos uno elegiría cada uno. En última instancia, las diferentes metodologías que se describen a continuación tienen tres facetas que debe considerar al decidir qué ruta emprender:
Usaré ilustraciones que demuestran los niveles de cada uno de estos para todos los métodos de creación de prototipos que cubrimos.
La red temprana se basaba en el estado: hacer clic en un enlace me llevó a otra página, que tenía una colección de enlaces que me llevaron a páginas subsiguientes, etc. La comprensión de Javascript era un conjunto de habilidades avanzadas, y los marcos aún no se habían desarrollado para facilitar el uso del lenguaje. Como tal, los componentes interactivos eran raros. Los entregables estáticos de los diseñadores se ajustan a las necesidades de estos productos tecnológicos: dado que había pocos componentes interactivos y móviles, los diseños podrían representarse de manera efectiva mediante composiciones estáticas creadas en Photoshop, InDesign y otras herramientas de diseño de impresión..
A medida que la tecnología ha progresado, la comprensión de los beneficios de un mayor grado de interactividad en la experiencia del usuario ha llevado a que el diseño de la experiencia del usuario dependa de la interacción. Sin embargo, la naturaleza de las herramientas de diseño estático dificulta la representación de ideas de diseño interactivo, dada la falta inherente de componentes interactivos de los entregables. En última instancia, esto ha llevado a la proliferación de herramientas de creación de prototipos para elaborar conceptos de diseño interactivo con mayor eficacia..
Los prototipos exhiben dos beneficios principales que faltan en los entregables estáticos:
Como tales, pueden ser un mecanismo muy eficaz para entregar ideas de diseño..
Sin embargo, dependiendo de la estructura del proyecto y sus objetivos, los entregables estáticos (“prototipos en papel”) aún pueden ser efectivos en el proceso de diseño. Si el producto está mejor representado a través de una arquitectura de información basada en el estado, por una parte, los entregables estáticos funcionan perfectamente. Además, si la estructura del equipo proporciona mucha comunicación entre los equipos y un proceso iterativo de diseño / desarrollo iterativo, los resultados estáticos pueden ser efectivos. Al determinar qué camino emprender, uno debe tener en cuenta la estructura de comunicación de la organización, las partes interesadas involucradas y el grado de interactividad requerido en el producto terminado al decidir si proceder con maquetas estáticas o prototipos más robustos..
Prototipado de papelLos prototipos de baja fidelidad intentan cubrir la brecha entre las restricciones de las comps estáticas y los wireframes, abarcando un entregable que puede ilustrar algunos de los conceptos de diseño interactivo, pero carece del refinamiento de un producto terminado. El sistema de diseño visual puede no estar completamente conceptualizado, por ejemplo, y el diseñador puede elegir representar la información en blanco y negro, usando marcadores de posición para el contenido con el fin de presentar una visión propuesta de la arquitectura de la información..
Dichos entregables son populares entre los diseñadores que se consideran completamente una persuasión de UX, ya que pueden sentirse menos cómodos al concebir cómo una arquitectura de información se traduce en un sistema de diseño visual. Estos tipos de prototipos suelen ir acompañados de composiciones estáticas "diseñadas visualmente" para ofrecer una representación más robusta del producto final..
Por el contrario, otros prototipos de baja fidelidad pueden presentar un alto grado de diseño visual, pero carecen de estados interactivos robustos. Muchas herramientas de creación de prototipos permiten a los diseñadores definir fácilmente "áreas de impacto", zonas activas que al hacer clic, llevan al usuario a otra página o sección del diseño. Esto es útil para los diseñadores visuales, ya que pueden centrar más esfuerzos en crear los aspectos visuales de una jerarquía de información y luego vincular sus diseños más adelante para ilustrar el flujo de usuarios. Sin embargo, la creación de interacciones más robustas y sofisticadas está limitada en este proceso de diseño..
Tanto los prototipos de baja fidelidad como los de papel, por lo tanto, requieren un alto nivel de comunicación entre el diseño, el desarrollo y las partes interesadas clave, ya que los entregables son simplemente una aproximación del producto terminado. Ya sea que el sistema de diseño visual o interactivo esté subrepresentado, y en última instancia, dichos entregables enfrentan muchos de los mismos riesgos que las comps estáticas: la falta de comprensión de las ideas de diseño que resultan en una pérdida de tiempo de desarrollo, la necesidad de presentar ideas sofisticadas verbalmente o por escrito, tiempo perdido en reuniones elaborando ideas de diseño subrepresentadas, etc..
Otro problema potencial es la fragmentación excesiva de las ideas de diseño, que puede resultar en un diseño mal concebido que carece de unidad. Tanto como las organizaciones aman segmentar la responsabilidad en roles separados (UI, UX, Visual, Interacción, etc.), el diseño es una disciplina contingente a la creación de
“Algo que está hecho de muchas partes y, sin embargo, es más o menos diferente de la combinación de sus partes” - Gestalt
Por lo tanto, en el contexto del diseño, la fragmentación excesiva de responsabilidades sin un enfoque unificado para la creación de productos a menudo resulta en un producto mal conceptualizado. El producto se puede paralizar creando interacción, interfaz, experiencia y diseño visual en vacíos separados.
Dependiendo del contexto, los prototipos de baja fidelidad pueden ser un buen mecanismo para entregar el diseño. A menudo son efectivos en la entrega de nuevos productos dentro de un sistema de diseño visual ya establecido. La forma en que se presentan visualmente las diferentes interacciones ya se ha establecido, por lo tanto, la forma en que un usuario fluye a través de una aplicación de manera interactiva es el objetivo principal del entregable.
Prototipado de baja fidelidadPresentando la totalidad de un diseño: su diseño visual, de interfaz y de experiencia, el prototipo de alta fidelidad es el santo grial de los entregables de diseño interactivo. En un prototipo de alta fidelidad, las partes interesadas, los desarrolladores y los usuarios pueden interactuar completamente con el entregable, proporcionando una serie de beneficios para la organización.
Primero, los prototipos de alta fidelidad aseguran una comunicación más efectiva y eficiente entre los departamentos. A menudo, el tiempo se ahorra ya que los desarrolladores pueden entender completamente cómo se estructura una interacción antes de emprender el camino equivocado y perder un tiempo de desarrollo valioso. Las partes interesadas también aprecian los prototipos de alta fidelidad, ya que pueden captar por completo los conceptos de diseño interactivo y visual en un producto consolidado. Los prototipos de alta fidelidad, por lo tanto, ahorran recursos al garantizar una comunicación efectiva de ideas de diseño a los desarrolladores y partes interesadas.
Otro beneficio de la creación de prototipos de alta fidelidad es su facilitación de investigaciones más sólidas sobre la experiencia del usuario. Un usuario puede interactuar completamente con el prototipo, lo que ilustra las brechas en el diseño en tiempo real. Muchos prototipos de alta fidelidad se adaptan a la introducción del software analítico en el mismo entregable, y proporcionan métodos adicionales de apoyo para llevar a cabo la investigación del usuario. Google Analytics se puede incorporar en prototipos generados por html, por ejemplo, facilitando experimentos de usuario y pruebas A / B. En última instancia, la capacidad de incorporar las pruebas de usuario antes en el ciclo de vida del desarrollo del producto crea un proceso más eficiente y da como resultado un mejor producto: el tiempo de desarrollo se guarda a medida que se modifica el diseño antes de que se comience a construir, y se producen iteraciones antes de la primera versión de producto.
Además, dependiendo de sus partes interesadas, un prototipo de alta fidelidad puede aumentar el potencial de ventas, impactando directamente en los resultados de su empresa. En CrossCap, estamos diseñando módulos para la manipulación y análisis de campañas de marketing en los minoristas más grandes del mundo. Vender a un cliente en un módulo particular, muchos de los cuales aún no se han desarrollado, es mucho más fácil cuando el cliente puede sentarse e interactuar completamente con el producto futuro. La entrega de prototipos interactivos de alta fidelidad, por lo tanto, ha contribuido a los resultados finales de la compañía al aumentar las ventas.
Hay muchos beneficios al producir prototipos interactivos de alta fidelidad. Desafortunadamente, muchas de las herramientas actuales de creación de prototipos carecen de la sofisticación para representar conceptos de diseño visual y experiencial robustos. Las herramientas de creación de prototipos actuales están limitadas en su alcance, y se especializan en uno u otro. Axure, por ejemplo, tiene una suite de diseño de interacción robusta, que permite la fácil manipulación de los elementos, pero carece de la sofisticación proporcionada por otras herramientas más orientadas a la visión, como las paletas de colores, la manipulación avanzada de formas, etc..
En el otro extremo del espectro se encuentran herramientas como Quartz Composer, que le permitirán incorporar composiciones de diseño visual sofisticadas, pero que ilustran los requisitos de interacción avanzada, la manipulación de parches y el conocimiento avanzado de la herramienta..
Kit de herramientas Origami the Quartz Composer de FacebookDada la falta de un enfoque holístico y gestáltico para diseñar la tecnología de las herramientas actuales, la creación de prototipos de alta fidelidad supone una carga mayor para el departamento de diseño, ya que las herramientas deben ser cuidadosamente masajeadas para producir el resultado deseado. Para crear prototipos de alta fidelidad, por ejemplo, hemos tenido que piratear Axure para inyectar Javascript enfocado en el diseño de interacción directamente en el html generado. El uso de Sketch con framer.js ha planteado problemas similares, que requieren un flujo de trabajo avanzado que depende de un enfoque multidisciplinario para el diseño.
Nuestro equipo de diseño elimina estas barreras para crear prototipos interactivos de alta fidelidad a través de una estructura de equipo multidisciplinario: tenemos un equipo que abarca desde diseñadores visuales altamente competentes hasta desarrolladores front-end centrados en el código, además de algunos miembros que se ubican en la línea entre . Esto permite que cada miembro utilice su conjunto de habilidades para contribuir a un único entregable que sea más sólido en su naturaleza. Como resultado, la estructura del equipo crea un mayor nivel de eficiencia, ahorra tiempo y recursos, y contribuye al potencial de ventas de nuestros productos. Mientras que algunas organizaciones segmentan el equipo de diseño y sus entregables en diferentes unidades (IU en Photoshop, UX en Axure, etc.), la fuerza de nuestro equipo reside en unificar diferentes conjuntos de habilidades bajo un solo objetivo y entregable..
La producción de prototipos de alta fidelidad genera muchos beneficios al diseñar productos tecnológicos: ahorran tiempo de desarrollo, crean una comunicación más efectiva entre los departamentos y las partes interesadas, contribuyen a un proceso más eficiente y, dependiendo del potencial de ventas de la organización, aumentan. Sin embargo, en última instancia, su decisión sobre qué ruta tomar debe depender de la organización, las partes interesadas, el calendario, la naturaleza del entregable, el nivel de comunicación entre los departamentos y la filosofía de desarrollo de productos de la organización..
La efectividad del diseño se mide en su ejecución. Si bien los prototipos de alta fidelidad facilitan la ejecución de ideas de diseño al proporcionar una comunicación más efectiva que resulta en una mejor apropiación de recursos, de ninguna manera son el único vehículo en el camino para crear un gran producto. Al considerar qué ruta tomar para crear sus entregables, tenga en cuenta los pros y los contras de las diferentes metodologías enumeradas anteriormente, los recursos de su equipo y su conjunto de habilidades, su estructura organizativa y su filosofía, ya quién le está entregando el diseño para embarcarse en lo mejor. Ruta y crea el mejor producto..
En mi próxima publicación, ilustraré estos enfoques de creación de prototipos de alto nivel con ejemplos de cada formato de entrega para guiarlo más hacia el camino correcto a seguir con entregas interactivas..