Como diseñador de UX, uno de los problemas más frecuentes al que me enfrento es quedarme atrapado entre la estructura alámbrica y el cliente.
Escucho estos comentarios con frecuencia de los clientes: “Este diseño es tan sencillo”, “¿Qué pasó con los colores de nuestra marca?”, “Me diste un diseño en blanco y negro”, “¿Así se verá la aplicación?”, “¿Es este el diseño final?”, “¿Es el diseño visual diferente de la estructura alámbrica? ”,“El contenido tenía un estilo particular en el wireframe, pero ¿por qué se presenta de manera diferente en los diseños finales?”
imagen buscada en Google.
Muchos clientes se sienten tentados a ignorar los wireframes estándar de baja fidelidad. Sin presentaciones y explicaciones sólidas por parte de los diseñadores, los clientes pueden pasar por alto los wireframes por completo.
Los clientes pueden percibir los wireframes como los borradores finales de un diseño y, por lo tanto, esos bocetos, que pretenden ser clarificadores, pueden sofocar la creatividad y cerrar iteraciones de diseño en el futuro. O la mayoría de las veces, están confundidos acerca de esta baja fidelidad, alta fidelidad y sienten que es solo otra palabra elegante de UX.
Según mi experiencia, el proceso de práctica habitual para crear estructuras alámbricas en un proyecto es:
Por qué deberías optar por wireframes de baja fidelidad:
Aporta claridad: Como se mencionó anteriormente, la estructura alámbrica ayuda a ejecutar conceptos e ideas en un diseño sólido. Esto ayudará a generar ideas y explorar posibilidades alternativas que les gustaría incorporar en el diseño. Wireframes aporta claridad tanto al cliente como al diseñador de UX/UI al colocarlos en una misma página y crea una base de estructura sólida antes de implementarla en la parte de diseño. Se centra en los ajustes y promueve la información esencial y los elementos de navegación en la página que tienen más importancia. sin distraerse con el atractivo visual y la estética.Bajo costo :– Si, escuchaste bien. Los wireframes de baja fidelidad pueden ser incluso bocetos rápidos con lápiz y papel. Allí obtendrá mejores ideas sobre su aplicación y podrá identificar errores, contenidos faltantes, etc. en la etapa inicial.Ahorrar tiempo: Si comienzas con estructuras alámbricas de alta fidelidad o pantallas visualmente hermosas o perfectas, terminarás dedicando mucho tiempo a formatear y menos tiempo a los hallazgos de UX. El cliente tuvo que esperar un mínimo de 2 a 3 días para ver qué entendió el diseñador de la discusión anterior y qué hay de nuevo.Iteraciones fáciles de hacer: Solo le llevará unos minutos hacer la corrección porque más que en la apariencia se concentrará en su funcionalidad. Ayudar a crear un diagrama de flujo de tareas y un diagrama de flujo de usuario.
imagen buscada en google
Entonces, ¿para qué sirven los wireframes de alta fidelidad?
Los detalles se realizan en esta etapa. En lugar de lorem ipsum, pondremos el contenido real aquí. Se creará un prototipo básico en el que se pueda hacer clic.Aclare las características de la interfaz: En muchos casos, es posible que los clientes no comprendan jergas como “presentación de diapositivas dinámica”, “fuentes de noticias”, “integración de mapas de Google”, “filtrado de productos”, “ruta de navegación” y cientos de otros tipos de funciones. Una estructura alámbrica proporciona una comunicación clara al cliente sobre cómo funcionarán estas funciones, dónde aparecerán en la página específica y qué tan útiles podrían ser realmente.Se centra en la experiencia de usuario adecuada: Ofrecer una experiencia de usuario adecuada es uno de los beneficios más importantes de los wireframes. La usabilidad es el requisito básico de un diseño. Wireframe elimina las imágenes y los colores y se centra en los huesos para obligar a todos a mirar objetivamente una interfaz, cómo funcionarán estas funciones, dónde aparecerán en la página específica y qué tan útiles podrían ser en realidad.Inicio temprano del desarrollo: Wireframe es una guía para los equipos de desarrollo, ya que ofrece instrucciones específicas y precisas para los desarrolladores, reduciendo el espacio para suposiciones y dudas. Esto ayuda al equipo de desarrollo a comenzar a construir el marco, integrar Api y actualizar la base de datos en paralelo al diseño visual de la interfaz. Esto no solo ayudará a iniciar el desarrollo, sino que también ahorrará tiempo para aclarar el flujo y las funciones, ya que reduce el retrabajo.Aporta una mejor creatividad: El equipo de UX garantiza el proyecto de estructura alámbrica antes de enviarlo al tiempo de diseño. Esto hace que el proceso sea mucho más fácil y sencillo, ya que el diseñador de la interfaz de usuario no tiene que dedicar tiempo a garantizar que el flujo sea perfecto y que los elementos clave del diseño estén intactos. Simplemente pueden concentrarse y explorar para resaltar el valor, el estilo y el color de la marca, lo que hace que un trabajo de estructura alámbrica de baja fidelidad parezca un concepto de diseño de obra maestra.
imagen buscada en google
Llevar:
Los wireframes son algo imprescindible en su proceso de diseño y desarrollo, ya que son la base de un producto; cuando la base (wireframe) está bien construida, el producto/sitio web final debe quedar impecable. Reduce el dolor de cabeza de RETRABAJAR en cosas innecesarias tanto para el equipo de diseño/desarrollo como para los clientes. Saltarse una estructura alámbrica no es una decisión inteligente y sí, definitivamente deberíamos comenzar con estructuras alámbricas de baja fidelidad.