La guía definitiva para crear prototipos

Sin embargo, para cosechar estos beneficios, tienes que hacerlo bien. En esta guía, aprenderás qué es un prototipo, sus ventajas, los distintos tipos, cómo hacer uno y qué debes buscar en una herramienta de creación de prototipos.

Los prototipos son una réplica exacta del aspecto que tendrá el resultado final de un producto, normalmente sin código. Incorporan la mayor parte del diseño final de la UI y la interacción que tendrá el producto acabado. La creación de prototipos es una de las herramientas más potentes del inventario de un diseñador de UX.

Son una forma poderosa de diseñar cualquier producto digital, porque nos ayudan a experimentar y poner a prueba las suposiciones sin que se conviertan en costosos errores más adelante. Los prototipos son también una forma ideal de comunicar la funcionalidad, la interacción y el diseño de UI a todos los implicados. Este tipo de comunicación conduce a lo que se denomina «ciclo iterativo».

El prototipado en papel es una forma rápida y sencilla de ilustrar un concepto de tu producto utilizando nada más que un bolígrafo y un papel. También es el método menos costoso de creación de prototipos. Eso si incluyes el coste del papel, el bolígrafo y, bueno, ¡un café para tus usuarios si necesitan un incentivo! Con el prototipado en papel, puedes sketchear el diseño principal de la pantalla, junto con los elementos y formas básicos. Puedes crear varias hojas de papel que representen las distintas pantallas. Los prototipos en papel te permiten sentarte con tu usuario y darle tareas que completar, simulando que lo que ve en el papel es un sitio web o una aplicación real. Pueden utilizar un bolígrafo como ratón si se trata de un sitio web o el dedo si es una aplicación móvil. Cuando pulsen un botón, sustituye la hoja por la siguiente pantalla a la que llevaría el botón.

Un prototipo de baja fidelidad consiste generalmente en una versión básica del producto final. Suele contener lo siguiente

• Diseños de pantalla
• Esquemas de elementos simples
• Dimensionado, espaciado y colocación de los elementos
• Clickabilidad básica y navegación entre pantallas

La razón de la simplicidad en esta fase es mantener la atención únicamente en los diseños de pantalla fundamentales, la arquitectura de la información (AI) y la navegación. Esto ayuda a conceptualizar la funcionalidad básica del producto sin distracciones extrañas. También es útil para realizar las primeras pruebas con los usuarios y obtener la aceptación de las partes interesadas, antes de añadir cualquier diseño avanzado de interacción y UI. Consulta este post y descubre las diferencias entre un prototipo y un MVP.

Con un prototipo de alta fidelidad, deberías estar cerca de haber diseñado todo menos el producto final. Los prototipos de alta fidelidad contendrán todos los diseños, espaciado, colocación de elementos y navegación del prototipo lo-fi, pero con muchos detalles adicionales.

Normalmente puedes identificar los prototipos de alta fidelidad por los siguientes aspectos:

• Interacción
• Diseño avanzado de UI
• Contenido real
• Visualización de datos

Como una progresión natural, la navegación básica en el prototipo de alta fidelidad recibe nuevas iteraciones para crear interacciones más avanzadas. Algunos ejemplos podrían ser el desplazamiento por la página, las microinteracciones del ratón sobre un prototipo de sitio web, o un icono que cambie de color al tocarlo en un prototipo de móvil. Otras interacciones podrían incluir la navegación en pantalla entre pestañas dinámicas y en menús de acordeón; incluso el desplazamiento de paralaje. Además de esto, los prototipos de alta fidelidad contendrán un diseño de elementos más avanzado, colores, fuentes únicas, imágenes de alta definición y contenido real. También es más probable que demuestren la funcionalidad de la visualización de datos, de la que hablaremos con más detalle a continuación.

Los prototipos de alta fidelidad se utilizarán para mostrar a los clientes y otras partes interesadas la funcionalidad y los aspectos visuales del producto, de modo que puedan validar el diseño antes de que se lo entregues a los desarrolladores. Obtener la opinión de las partes interesadas sobre el diseño antes de entregarlo a los desarrolladores es crucial, ya que cualquier modificación o error de diseño será costoso y llevará mucho tiempo corregirlo una vez que comience la codificación.

Probar tus prototipos es de suma importancia antes de que llegue el momento de entregarlos a los desarrolladores. Al fin y al cabo, el prototipo no es sólo para mostrárselo a las partes interesadas y a los desarrolladores, sino también a tus usuarios. Si los usuarios son capaces de navegar bien por el producto y realizar las tareas que les has encomendado, y si les gusta el diseño, estás listo para pasárselo a los desarrolladores.

Si estás diseñando un sitio web, echa un vistazo a este impresionante tutorial sobre cómo crear un prototipo de sitio web responsivo en menos de 10 minutos. También puedes elegir una de estas maravillosas plantillas de diseño de sitios web para empezar con buen pie.

Crear prototipos de tus diseños y poner a prueba tus suposiciones e ideas desde el principio es una forma estupenda de evitar contratiempos en el futuro. Si pasas directamente al código sin probar tus ideas y cometes un error, la revisión será mucho más costosa, por no hablar del tiempo que llevará arreglarlo.

Al implantar la creación rápida de prototipos y utilizar el método «a prueba de fallos», estarás contribuyendo a acelerar el lanzamiento de tu producto. Esto se debe a que las partes interesadas podrán validar las decisiones de diseño mucho más rápido y habrá menos ambigüedad en la fase de desarrollo.

A estas alturas, no es ningún secreto que el diseño de prototipos de alta fidelidad y con píxeles perfectos para probarlos con tus usuarios conduce a un producto más fácil de usar. También significa que es mucho menos probable que cometas errores de diseño que sólo se detectan cuando ya ha comenzado el costoso trabajo de desarrollo.

Tampoco es ningún secreto que un producto más fácil de usar conduce a tasas de adopción y activación mucho más elevadas, al tiempo que aumenta el compromiso de los usuarios.

Además, la creación de prototipos es también una forma estupenda de demostrar la funcionalidad de tu aplicación o sitio web a clientes y partes interesadas. Al presentarles un prototipo, te ahorras horas de largas reuniones, extensos documentos técnicos y malentendidos. A veces, para que te entiendan y te acepten, tienes que demostrarlo visualmente; de lo contrario, las cosas pueden perderse en la traducción. Como esos momentos de «tendrías que verlo para entenderlo». ¿Qué mejor manera de explicar el concepto de un producto que mostrar el propio producto?

La creación de prototipos te ayuda a compartir eficazmente tus ideas de diseño con un equipo. Supongamos que tienes una sugerencia para el cliente sobre cómo debería comportarse una característica concreta en el producto. ¿Qué mejor manera de demostrar esa idea que prototiparla? Entonces puedes seguir adelante y probar esa función con tus usuarios y ver si es para quedarse.

La creación de prototipos nunca se hace de forma aislada, siempre es para alguien más: el usuario. Llevar a cabo la investigación de usuarios adecuada para averiguar quiénes son y cuáles son sus puntos de dolor es primordial no sólo para el éxito de un prototipo, sino también para el éxito de un producto. Llevar a cabo una investigación de usuarios no sólo te ayudará a informar sobre el diseño y la funcionalidad de tu producto, sino que también te ayudará a identificar si existe una necesidad real de tu producto en el mercado.

La fase de recopilación de requisitos consiste en definir la dirección que tomará el producto, junto con sus características principales. Normalmente, esto significa pasar tiempo con el cliente y escuchar atentamente sus ideas, tras haberle presentado los datos de tu investigación de usuarios. Esto te permite considerar unánimemente la mejor forma de diseñar el producto.

Fijar la navegación básica mediante clics en un prototipo lo-fi y establecer una IA firme nos permite pasar a un prototipo más refinado. En la fase de alta fidelidad, te basarás en esa navegación y crearás interacciones más complejas, como:

• Desplazamiento
• Menús con pestañas
• Acordeones
• Desplegables
• Menús de hamburguesas (en el móvil)
• Carruseles
• Efectos de desplazamiento de paralaje

Añadir este grado de fidelidad al producto final te permite conceptualizar y demostrar la funcionalidad que tendría el producto final a las partes interesadas y a los desarrolladores, y probarlas con los usuarios. Esta es también la fase en la que intentarás mejorar la experiencia del usuario, para que tu producto final sea algo más que utilizable, sino que consiga enganchar a los usuarios.

Un wireframe es una representación directa del diseño de un elemento. Son inimaginablemente útiles al principio de cualquier proceso de diseño, ya que ayudan a conceptualizar rápidamente las ideas. Los wireframes suelen centrarse en cuestiones centrales como el espaciado de los elementos, la posición, la disposición general de la pantalla y los flujos de usuario. Ayudan a los diseñadores a centrarse en la parte más práctica del diseño antes de proceder al diseño avanzado y la interacción.

Antes de entrar en los pasos generales para crear un prototipo, echa un vistazo a algunos tutoriales concretos que nuestro equipo ha creado a lo largo de los años. Son mucho más específicos y funcionan bien como práctica antes de que empieces a plasmar tus ideas en un prototipo. Échales un vistazo:

• Cómo prototipar un chatbot
• Cómo crear prototipos y validar formularios
• Cómo crear el prototipo de una app de comestibles
• Cómo crear prototipos de formularios de inicio de sesión

Una vez que has hablado con el cliente, has realizado una investigación de usuarios y has ideado los requisitos del producto, estás listo para empezar a crear un prototipo de baja calidad. Ahora puedes empezar a crear los diseños de pantalla, junto con el tamaño y la posición de los elementos de UI. Además, aquí es donde implementarás un flujo de navegación básico y cimentarás un diseño de UI básico. No es necesario entrar en demasiados detalles en esta fase. Básicamente, sólo estás construyendo un esquema básico de las pantallas de tu producto que permita a los clientes, partes interesadas y usuarios hacer clic y probar el agua.

A medida que pases a un diseño de alta fidelidad, tu prototipo debería empezar a demostrar una funcionalidad más profunda. Un ejemplo de ello sería crear una barra de búsqueda que recupere los datos almacenados en el prototipo basándose en las entradas del usuario, menús acordeón, listas desplegables y otros elementos similares. Otro aspecto que distingue a los prototipos de alta fidelidad del extremo inferior del espectro es que a menudo almacenan datos numéricos y de texto, así como determinados ajustes que introduce el usuario. Estos ajustes pueden almacenarse y afectar a otros elementos del prototipo, ya sea en la misma pantalla o en pantallas diferentes. Por ejemplo, imagina que estás prototipando un formulario de registro y quieres que la dirección de correo electrónico del usuario se guarde y aparezca en otra pantalla, como la página de la cuenta. La variable permitiría que esto ocurriera, haciendo que la experiencia fuera más significativa y realista durante las pruebas.

Las microinteracciones son un aspecto crucial a la hora de refinar el diseño en la fase de creación de prototipos de alta fidelidad. Una microinteracción suele consistir en un desencadenante iniciado por el usuario o el sistema, seguido de algún tipo de respuesta. Un ejemplo de esto podría ser añadir efectos al pasar el ratón por encima para cambiar los estados de varios elementos como botones, enlaces e imágenes para mostrar que se puede hacer clic en ellos. Un menú que se desliza al pulsar la hamburguesa también es una microinteracción. Estas interacciones pequeñas pero significativas ayudan a mejorar la experiencia del usuario y hacen que tu producto sea más intuitivo y utilizable.

Piensa en añadir transiciones cuando se trate de cargar nuevas pantallas o de aparecer/desaparecer elementos. Estamos hablando de transiciones de fundido de entrada y salida y de elementos que explotan. Este tipo de interacciones no sólo añaden dinamismo a la UI, sino que el retardo fraccionario que provocan ayuda a los ojos del usuario a reajustarse.

Cuando llegues a la fase de alta fidelidad, la mayoría de los prototipos tendrán un nivel avanzado de diseño de UI. En esta fase debes implementar la paleta de colores que hayas elegido basándote en las directrices de la marca, así como estilos avanzados para los elementos, como tonos, degradados y sombras. Asegúrate de que las combinaciones de colores que utilizas proporcionan una buena accesibilidad y usabilidad, al tiempo que acentúan tu marca. Es decir, un contraste adecuado para los usuarios con deficiencias visuales, al tiempo que reservas sistemáticamente colores como el rojo y el verde para los mensajes de error y éxito.

Elegir el tipo de letra y la fuente adecuados para utilizar en tu prototipo es importante, ya que será el reflejo más fiel del resultado final, por lo que es un elemento importante a tener en cuenta durante las pruebas. ¿Por qué? Porque es crucial para la UX y la usabilidad básica. Si los usuarios no pueden escanear y leer fácilmente tu fuente, tendrás menos probabilidades de activarlos y retenerlos.

Por último, en la fase de alta fidelidad querremos trabajar para conseguir una representación de píxel perfecto de nuestro producto final. Eso significa refinar el espaciado y la posición de todos los elementos de UI al píxel exacto. Definir este tipo de información en la fase de prototipado facilitará las cosas cuando llegue el momento de desarrollar el producto.

En la fase de prototipo de baja fidelidad, lo más probable es que utilices marcadores de posición para las imágenes, ya que la atención se centrará simplemente en el diseño, la navegación y el tipo de contenido que se muestra en la pantalla.

Sin embargo, todos los prototipos de alta fidelidad utilizarán imágenes de calidad con una gran definición. Utilizar este tipo de contenido en esta fase es importante por varias razones:

• Ayuda a obtener la validación del cliente
• Acerca tu prototipo al producto real
• Aumenta la intuitividad durante las pruebas de usuario
• Puedes entregar activos de imagen a los desarrolladores con tu prototipo

Añadir imágenes de alta calidad, además de interacción, es una forma de ascender en la cadena de fidelidad y acercarse al producto final.

El texto de marcador de posición como Lorem Ipsum, como hemos mencionado antes, está bien para los wireframes, siempre que no afecte a la navegación y la orientación dentro de la simulación. Sin embargo, en tu prototipo de alta fidelidad, debes intentar incluir todo el texto real en tu diseño siempre que sea posible, incluidos los párrafos de texto que no estén relacionados con la orientación en el prototipo. He aquí por qué:

• Ayuda a añadir más significado al prototipo
• Te ayuda a descubrir si determinados contenidos funcionan en determinadas páginas
• Cuando tu prototipo esté desarrollado, tu producto necesitará un nivel mínimo de contenido real

Por estas razones, siempre debemos intentar incluir contenido real en nuestros prototipos.

El diseño de formularios es una parte crucial de la UX de un producto. Los formularios tienen un coste de interacción por parte del usuario. Los formularios innecesariamente largos, o excesivamente complicados, difíciles de entender o con fallos, pueden hacer que los usuarios abandonen tu producto y no vuelvan nunca más. Por esta razón, los prototipos son muy útiles para validar y probar los formularios. En la fase de alta fidelidad, los formularios de tu prototipo deben incluir interacciones condicionales y mensajes de error y validación en línea. Un ejemplo de esto podría ser mostrar un mensaje de error si se escribe en un campo cualquier cosa que no sea un correo electrónico.

Por último, es más que probable que un prototipo de alta fidelidad contenga una visualización de datos reales para simular la funcionalidad del producto final. Imagina que estás creando un prototipo de una aplicación web que gestiona los turnos de los empleados. Quizá quieras crear una lista de nombres de empleados, funciones y datos de contacto.

En la fase de alta fidelidad, debería ser posible visualizar este tipo de datos en los siguientes formatos:

• Listas
• Tarjetas
• Rejillas

Lo ideal sería que el usuario pudiera hacer cambios, como añadir o eliminar empleados, cambiar horarios, etc., y que estos cambios se repitieran a lo largo del prototipo. Al crear prototipos de visualizaciones de datos como éstos, siempre debes incluir las siguientes interacciones posibles:

• Aplicar filtros
• Ordenar datos

Visualizar e interactuar con los datos ayuda a demostrar la funcionalidad del producto a las partes interesadas y a los desarrolladores, a la vez que ofrece la oportunidad de probar si las interacciones tienen sentido para el usuario.

Al prototipar un sitio web, hay algunos factores importantes que lo distinguen del prototipado de una aplicación móvil. He aquí algunos de los factores importantes a tener en cuenta:

La diferencia en la resolución de pantalla de distintos dispositivos, como portátiles, ordenadores de sobremesa, tabletas y teléfonos inteligentes, significa que tu sitio web debe ser responsivo. Siempre es mejor empezar el diseño adaptativo por el dispositivo más pequeño. Esto se llama «diseño móvil primero» y se considera una buena práctica en todo el mundo del diseño. ¿Por qué? Porque ampliar un diseño siempre es menos complejo que hacerlo al revés. Por tanto, debes asegurarte de que tu prototipo es responsivo y puede verse y probarse en distintos dispositivos. Hay distintas formas de hacerlo. Una de esas formas son los diseños líquidos.

Para los diseños líquidos, puedes establecer eventos para que el contenido de tu prototipo en la pantalla se desplace y reposicione cuando se cambien las dimensiones en píxeles del navegador. En herramientas como Justinmind, puedes establecer eventos para que esto ocurra automáticamente, de modo que el contenido en pantalla de tu prototipo se reorganice en consecuencia utilizando puntos de ruptura.

La siguiente parte que tienes que tener en cuenta al crear un prototipo de sitio web es cómo interactúan los usuarios con los sitios web. La diferencia más importante aquí es que en el escritorio utilizarán un ratón para hacer clic en los elementos y los gestos estarán limitados. Puedes hacer que un sitio web sea más interactivo añadiendo microinteracciones y desplazamiento de paralaje.

Añadir microinteracciones puede ser tan sencillo como un botón que cambie de color al pasar el ratón por encima, un cursor que cambie de estilo, un elemento que salte o explote al hacer clic o un fundido de página constante al pasar a otro.

Por último, nunca insistiremos lo suficiente en la importancia de hacer que los elementos parezcan clicables en un sitio web. Asegúrate de que los enlaces tengan un contraste adecuado con la fuente o el fondo que los rodea. Asegúrate de que los botones tengan un contraste adecuado y parezcan botones. Haz que los CTA sean más grandes que otros botones para llamar la atención.

Cuando se trata de crear el prototipo de una aplicación móvil para una plataforma móvil nativa, tendrás que asegurarte de que la diseñas de acuerdo con las especificaciones de diseño de iOS. Por ejemplo, asegúrate de que cumples las Directrices de Interfaz Humana de Apple y el Material Design de Android.

Para Android, asegúrate de que la navegación de tu aplicación responde a la barra de navegación nativa acoplada en la parte inferior. Asegúrate de que, cuando crees el prototipo de una aplicación para Android, incluyes este menú nativo para demostrar cómo el usuario puede navegar por la aplicación. Para iOS, no existe tal menú, así que tendrás que construir la navegación en la aplicación que corresponda a las mejores prácticas de Apple.

Para conseguir una gran experiencia de usuario, también debes aprovechar las demás características nativas de la plataforma, como las listas desplegables y los menús nativos. Los kits de UI descargables de Justinmind también incluyen elementos y componentes con estas características, así como los típicos iconos que concuerdan con los sistemas de diseño de las respectivas plataformas. También puedes y debes aprovechar funciones como el toque háptico de Apple. Al hacer esto, te estás asegurando de que tu aplicación proporciona una experiencia reconocible a los usuarios de Apple y Android, algo que siempre suma puntos en usabilidad y UX.

Cuando se trata de un espacio de pantalla menor, tienes que tener aún más cuidado con el contenido que presentas al usuario y la forma en que lo presentas. Esto implica tener una jerarquía de contenidos bien definida. Los usuarios de móviles suelen estar en movimiento y abandonarán tu aplicación si no pueden encontrar la información que necesitan o realizar la acción necesaria. Hacer frente a estas limitaciones a veces significa ocultar ciertos elementos, opciones de menú y navegación menos importantes detrás de un menú hamburguesa deslizante. Significa garantizar que el texto sea legible y que los párrafos se ajusten a la pantalla dejando suficiente espacio en blanco lateral. Además, en lo que respecta a los botones, ten en cuenta que el dedo humano no tiene la misma precisión que el cursor de un ratón y, por tanto, tendrás que asegurarte de que tus botones sean lo suficientemente grandes como para que los pueda pulsar el dedo índice medio, que tiene un diámetro de 15 mm.

El prototipado rápido es una de las técnicas más potentes que existen en la metodología ágil. No tienes que preocuparte por ser cuidadoso: el hecho de que estés creando un prototipo para probarlo con tus usuarios significa que ya estás siendo cuidadoso. Así que adelante, fracasa rápido, pon a prueba todas tus suposiciones, quédate con las buenas ideas y elimina rápidamente las malas. Las malas ideas no se castigan en el entorno ágil, sólo se descartan. Y cada mala ayuda a empujar a todo el equipo en la dirección correcta.

Limita tus prototipos y céntrate en una característica cada vez. Enfrascarse en varias características diferentes a la vez puede ser caótico y reducir la calidad de las características principales importantes, además de enturbiar los resultados de las pruebas. No caigas en la trampa de lanzarte de cabeza a un diseño de producto complejo. En lugar de eso, elabora una lista de los requisitos del producto a partir de tu investigación de usuarios y decide qué características básicas compondrán tu producto. Si estuvieras atrapado con tus usuarios en un ascensor durante 60 segundos, ¿qué características enumerarías de tu producto?

Primero diséñalas, pruébalas y luego pasa a las características secundarias. Asegúrate de que se cumple el criterio de aceptación de cada característica.

Las pruebas periódicas deben estar en tu hoja de ruta del producto y ser uno de tus objetivos más importantes a la hora de crear prototipos. Prueba todas y cada una de las características. Verás más adelante que es una parte importante del proceso iterativo de la metodología ágil. Las pruebas te ayudan a explorar ideas y a revelar fallos para que puedas descartar lo que no funciona y seguir con lo que sí.

Todos los miembros del equipo deben trabajar a partir de una única fuente de verdad: un sistema de diseño. Un sistema de diseño compartido puede adoptar la forma de una guía con estilos y especificaciones de UI, además de bibliotecas de widgets que contengan los elementos que se utilizarán en todo el producto.

El lorem ipsum es estupendo para prototipos de baja fidelidad a la hora de establecer y probar características fundamentales como el diseño de la página y la navegación. Sin embargo, cuando se trata de botones, menús, formularios y otros elementos que tus usuarios necesitan para navegar con éxito por tu prototipo, tendrás que utilizar contenido real. Además, con los prototipos de alta fidelidad, debes intentar incluir todo el texto real que puedas para que el prototipo tenga más sentido para los usuarios y las partes interesadas.

Lo bueno de los prototipos es que puedes compartirlos tanto con los clientes como con los propietarios del proyecto para obtener comentarios cruciales a lo largo del proceso de diseño. Cuando tienes un prototipo, es más fácil transmitir tus ideas de diseño y conseguir que el cliente y las partes interesadas acepten la dirección que quieres que tome tu diseño. Los prototipos, ya sean de baja o alta fidelidad, son estupendos para llevarlos a las reuniones y presentarlos al cliente, pero también puedes enviárselos para que se mantengan dentro del bucle de retroalimentación.

Haz que tus desarrolladores participen desde el principio. Esto se debe a que ciertos diseños pueden requerir complejas soluciones de codificación que podrían llevar más tiempo, haciendo que el proyecto supere su plazo o presupuesto. Contar con los desarrolladores desde el principio y obtener su aprobación es crucial para evitar fricciones cuando llegue el momento del traspaso.

Por último, en lo que se refiere al traspaso perfecto entre diseñador y desarrollador, lo mejor que se puede dar a los desarrolladores es un prototipo interactivo de alta fidelidad y perfecto en píxeles. Te ayuda a comunicar lo siguiente:

• Funcionalidad prevista
• Interacciones para definir código como Javascript
• Activos necesarios, código HTML y estilos CSS

Actúa como una guía sólida de lo que se necesita en cuanto a codificación. Proporcionarles un entregable de este tipo, junto con los activos, el código HTML y los estilos CSS, no puede ser más útil. Evita que tengan que tomarse libertades con el diseño y evita malas interpretaciones. Además, reduces el riesgo de costosos retoques.

Aunque es posible que un solo perfil trabaje en un prototipo, como un diseñador de UX, la realidad es que a menudo se trata de un proceso colaborativo. Los diseñadores de UX suelen encargarse del flujo de usuario, el diseño de interacción y la IA del prototipo, mientras que los diseñadores de UI se ocupan de la parte visual. Por otra parte, los jefes de producto también pueden participar en el proceso de diseño del prototipo, ya que son los responsables últimos de garantizar que se implementen todas las interacciones y requisitos funcionales recopilados en las primeras fases.

Como su nombre indica, las pruebas de usuario moderadas implican contar con la ayuda de un facilitador o moderador formado:

• Guía a los participantes
• Gestionar tareas
• Respuesta dudas
• Registrar comportamientos

Las pruebas de usuario no moderadas suelen ser más rápidas y baratas que las moderadas. Se hace en el entorno del usuario y a menudo se graba la sesión. Sin embargo, tiene algunos inconvenientes, como el hecho de que no hay soporte en tiempo real para los participantes y también descarta el uso de prototipos de baja fidelidad debido a la falta de contexto.

• Seguimiento ocular: utiliza un software que sigue el ojo del usuario por la pantalla y ayuda a identificar los momentos de interés y fricción.
• Mapas de calor del sitio web: te indican a qué parte de la página web dedican más tiempo y atención tus usuarios.
• Clasificación de tarjetas: te ayuda a establecer la AI más fácil de usar para los productos nuevos y existentes.
• Prueba AB: consiste en probar dos versiones de la misma página o pantalla, midiendo una variable cada vez

La idea es comunicar y obtener opiniones periódicas del cliente, además de realizar pruebas de usuario y obtener opiniones periódicas de tus usuarios. Todo ello alimenta el siguiente ciclo:

• Diseño
• Prueba
• Iterar
• Perfecto

Los prototipos pueden impulsar la colaboración, especialmente con una herramienta como Justinmind. Esto se debe a que puedes compartir tus prototipos con todo el equipo, dejar comentarios y obtener opiniones. También son útiles para las presentaciones con el cliente, además de ser una forma estupenda de demostrar por qué tu equipo optó por determinadas vías de diseño.

Un diseñador de UX cualificado te ayudará a organizar tu investigación de usuarios y tus entrevistas para definir las user personas y los requisitos del producto. Estarán especializados en construir e idear un sistema de diseño, y luego implementar ese sistema en prototipos. A continuación, podrán proporcionar pruebas de usuario expertas en prototipos para obtener comentarios de los usuarios para iteraciones posteriores mediante el uso de sesiones moderadas y/o no moderadas.

Los diseñadores de UI son los que añaden las verdaderas campanas y silbatos a las pantallas de tu producto. Suelen trabajar codo con codo con los diseñadores de UX para garantizar que el producto tenga un diseño de UI que no sólo sea atractivo, sino también acorde con la marca y accesible para los usuarios. A menudo, es posible encontrar híbridos de diseñador UX/UI en el mundo del diseño, pero sigue siendo importante distinguir entre ambos conceptos.

El papel de un gestor de producto es el pegamento que mantiene unidas todas las demás funciones importantes. Son los que diseñan y desarrollan una hoja de ruta para todo el producto, desde la ideación, pasando por el MVP, hasta el producto final. Programarán cada lanzamiento del producto y se asegurarán de que se desarrolle lo mejor posible. Lo ideal es que tengan formación técnica, como informática, desarrollo, diseño UX o incluso formación empresarial.

En última instancia, la responsabilidad del producto recae en el jefe de producto, por lo que serán ellos los que tiren del carro si hay un problema que no se resuelve.

Esta es una obviedad. Siempre que haya un prototipo, debe haber usuarios implicados. En diseño UX, crear prototipos sin implicar a los usuarios es como tener un yin sin un yang. Implicar a tus usuarios desde el principio del diseño es crucial para el éxito de tu producto. Eso significa incluirlos en cada paso y en todas las fidelidades del diseño del prototipo. Recuerda: ¡prueba, itera y vuelve a probar!

Cualquier equipo de desarrollo web o de aplicaciones necesitará a alguien que sepa escribir textos intuitivos y cautivadores para un sitio web. Los redactores de UX, y de hecho los estrategas de contenidos, pueden planificar el contenido que tendrá una aplicación o un sitio web y ayudarte a decidir una jerarquía de contenidos. Estas son las personas a las que recurrirás cuando tu prototipo necesite algo más que Lorem Ipsum.

Hay distintas formas de diseñar prototipos y, a la hora de elegir una, no hay una talla única. Tienes que encontrar el método que mejor se adapte a tu situación o a tu empresa. Los prototipos pueden variar en fidelidad y, en realidad, puedes empezar en cualquier fase. Sin embargo, recomendamos empezar primero con un wireframe y asentar los fundamentos antes de pasar a diseños más perfectos. Por último, el enfoque ágil es imbatible cuando se trata de sacar rápidamente al mercado un producto de éxito. Para obtener los mejores resultados, adopta un enfoque iterativo en tu creación de prototipos, fallando rápido y probando a menudo hasta que llegues al camino correcto. Recuerda: los errores no se castigan en la metodología ágil, siempre que se cometan pronto. Te ayudarán a guiarte hacia donde necesitas estar.