El arte perdido de la creación de prototipos: por qué Axure sigue siendo la mejor opción para muchos diseñadores | Mateo Edrashchik | septiembre 2022

Antes de convertirme en diseñador de productos, era un vendedor interesado en la economía del comportamiento. Esto fue hace casi 10 años y tuve el placer de trabajar con los dinosaurios UX que diseñaron la mayoría de los sitios web famosos a principios de los años 2000 y 2010 en Polonia. Probablemente es por eso que pienso en UX de manera diferente a como pensamos ahora.

Imagen de héroe con el logo de Figma y Axure.  En el fondo hay una ventana con interacciones.

Antes solo había diseñadores UX o diseñadores gráficos. Los diseñadores de UX sabían cómo ejecutar talleres, diseñar wireframes y crear prototipos. Los diseñadores de UI, por otro lado, han desarrollado interfaces de usuario pulidas basadas en diseños Low-Fi. Esto es algo que creo que se ha perdido en los últimos años.

Nuestros roles se han vuelto más complejos de la misma manera que nuestras posiciones, nos referimos a nosotros mismos como Diseñadores de Producto, Especialistas en CX, Diseñadores de UI, Diseñadores de UX/UI, Expertos Cognitivos, etc. Nuestras herramientas también han mejorado durante este tiempo. En lugar de usar Axure y Photoshop, comenzamos a usar una herramienta que debería ayudarnos a administrarlos todos: Figma, pero resultó que no era así.

El problema con Figma y Sketch es que probablemente sean demasiado fáciles de aprender para los principiantes (¡lo sé! También me encantan). Hoy en día, cuando comienzas un nuevo proyecto como diseñador de UX, saltas directamente a Figma, creyendo que es la única herramienta que necesitas para todo.. La cuestión es que Figma se centra en el diseño de alta fidelidad y eso tiene un gran impacto en ti como diseñador. Cuando usas Figma, olvidas las técnicas básicas (a esto lo llamo el efecto Figma). Permítanme darles un ejemplo simple: bocetos y estructuras alámbricas de baja calidad. Normalmente los haces muy temprano porque no requieren mucho esfuerzo. Simplemente dibuja algo en papel o en una tableta, explora nuevas posibilidades y, a veces, profundiza en algunas ideas tímidas.

En Figma, puede crear hermosos tableros de humor, revisar cuestionarios e ir directamente a estructuras alámbricas o incluso diseños de alta fidelidad utilizando algunos de los elementos del sistema de diseño. Este flujo hace que sea extremadamente difícil para los diseñadores encontrar errores de usabilidad al principio del proceso. Se llama sesgo estético y bien descrito en este artículo: https://medium.com/aleph-universe/be-aware-of-aesthetic-usability-effect-in-user-research-ac4c93193089

Según mi experiencia, si no creas wireframes de baja fidelidad, te estás perdiendo algunos pasos en el proceso de UX. Por supuesto, diferentes personas lo dividen en etapas casi infinitas, pero hablando a ciegas, en lugar de pensar en problemas y posibles soluciones, obligas a tu cerebro a pensar en una o dos opciones, porque los esfuerzos para corregir errores en Hi-Fi aún son más que suficientes. una ligera mejora en Low-Fi o Sketch.

fuente: https://www.justinmind.com/prototyping/low-fidelity-vs-high-fidelity-prototypes

Axure te hace pensar en procesos e interacciones.

Por supuesto, Figma también puede mostrarle el flujo o incluso permitirle crear prototipos, pero Axure es crudo en comparación con Figma. Joder, hasta el panel de interacción es complejo (el de la parte superior del artículo), pero si lo dominas, empezarás a pensar en el flujo de usuarios y el sistema como un organismo vivo, y en Figma he visto muchos proyectos con solo algunas páginas estáticas enlazadas entre sí sin ninguna lógica.

En Axure, se ve obligado a pensar en la lógica comercial y las interacciones. Si no vincula sus mesas de trabajo, el cliente simplemente no verá la siguiente estructura alámbrica. Todo esto debería tener sentido. La razón de esto es que en Axure cada página está dedicada a cada vista única, mientras que en Figma a menudo ves páginas utilizadas para secciones enteras, o incluso diseñas una caja de arena con cientos de vistas.

La imagen muestra Figma a la izquierda con cientos de conectores de prototipos, mientras que a la derecha vemos Axure con páginas en boceto y una página.

Entiendo que Low-Fi no es sexy.

Realmente no existen, pero ¿sabes qué es peor? Un producto inútil que no estaba bien pensado. Al usar marcos Low-Fi, terminará construyendo la interfaz de usuario final más rápido y mejor con menos errores. He visto a diseñadores experimentados olvidarse de agregar navegación porque están muy enfocados en el contenido. El uso de prototipos tiene otros beneficios, por ejemplo, también pueden ayudarlo a resolver problemas al comprender todo el proceso como equipo. En momentos como estos, encontré la siguiente cita muy cierta.

“Si una imagen vale más que mil palabras, un prototipo vale más que mil encuentros” – IDEO

Ver un producto casi real e interactuar con él no tiene precio cuando sabes que esto es lo que se codificará en unos meses o incluso años. Un buen prototipo te ayuda a ti y a tu equipo a mantenerse cuerdos. Entonces, en lugar de crear grandes especificaciones con miles de palabras, ¿quizás la próxima vez podamos crear un buen prototipo?

Aquí hay una descripción general rápida del prototipo hecho en 2 horas: https://dss6vn.axshare.com

Oblíguese a pensar en el proceso y no intente omitir la arquitectura de la información, los personajes y los diseños de baja calidad solo porque cree que los conoce todos. Al forzarte a crearlos de una manera de baja calidad (las viejas maquetas grises), engañas a tu cerebro para que piense en el “qué” y el “por qué” estás haciendo algo. Design Systems y Figma facilitan la creación de un sitio web hermoso, pero, irónicamente, dificultan la entrega de una experiencia de usuario excepcional. Axure lo ayuda a pensar en el valor agregado, el contenido y la experiencia del usuario.

Puede crear prototipos de juegos simples, tiendas en línea con lógica comercial y validación de campos, también puede crear ejemplos reales de herramientas funcionales (como una calculadora de hipotecas), etc. También puede crear rápidamente diferentes estados del mismo componente (llamado “asistente” en Axure) y cree sitios web receptivos con “Responsive Views”.

Este gif muestra un diseño receptivo hecho con Axure.
Diseño receptivo simplificado con Axure

Y sí, Axure ahora también tiene una opción de transferencia como Figma.

Axure ha sido la herramienta número uno para la creación de prototipos durante mucho tiempo porque la creación de prototipos es bastante fácil, pero los resultados son realmente sorprendentemente cercanos a la experiencia final, tan cercanos, de hecho, que a veces, sin mirar el código, puede confundirlo con el producto real

Los puntos fuertes de Axure son la seguridad y una gran comunidad. Es difícil contar cuántas veces he tenido que probar cómo hacer algunas interacciones de maqueta realmente agradables pero también complejas que ahorrarían semanas de desarrollo o cientos de mesas de trabajo y reuniones de alta fidelidad (búsqueda elástica, tienda en línea funcional con cupones). etc.).

Juego hecho con Axure

Por cierto, ¿mencioné que Axure es una herramienta independiente? Figma es una herramienta en línea y puede ser molesto cuando quieres hacer algo sin acceso a Internet, pero si eres un usuario de Figma realmente dedicado…

Esta pantalla muestra la ventana emergente de error de Figma que aparece cuando se queda sin memoria del navegador.  Por lo general, el archivo se corrompe después y pierde parte de su trabajo.
Figma Pantalla de la Muerte

Simplemente puede importar archivos Figma a Axure usando el complemento oficial de Axure. Sí, no es perfecto, pero me ha ayudado en muchos proyectos.

Encontrará el complemento aquí: https://www.axure.com/blog/import-figma-designs-into-axure

Nadie dijo (al menos eso espero) que para convertirse en un buen diseñador de UX, solo necesita conocer una herramienta: Figma. Puede comenzar su viaje con Figma y ver rápidamente Axure para ver cómo lo cambia y la forma en que piensa sobre productos y procesos completos.. Axure sigue siendo el estándar de oro para muchas grandes empresas, la mayoría de nosotros hemos hecho algo con Axure en algún momento o al menos lo hemos visto en acción. Si es un principiante, le aconsejo que comience con prototipos de demostración simples, que se pueden descargar de forma gratuita desde el sitio web oficial https://www.axure.com/support/download-widget-libraries.

Hay mucho más en Figma y otras herramientas de creación de prototipos como ProtoPie, UXPin, Axure y más, así que déjame saber en los comentarios si quieres más artículos de creación de prototipos.

Previous post ¿Qué es Quora y cómo funciona?
Next post Garantizar la privacidad y la seguridad de los datos de los participantes en la investigación.

Deja una respuesta