Este es un debate sorprendentemente polémico, y uno importante que determina dónde se gasta el presupuesto de desarrollo. Sin embargo, tomémonos unos momentos para asegurarnos de que todos estamos en la misma página antes de entrar en la "carne" de la misma.

Que es wireframing?

Una estructura metálica es un boceto o representación visual de cómo se verá una página web o una aplicación móvil. A veces también se les llama "planos de pantalla" o "esquemas de página". Se utilizan para establecer los elementos centrales del diseño visual y la funcionalidad de una página web, para establecer cómo se verá y qué hará. Luego se puede transmitir a los diseñadores, desarrolladores, redactores, clientes y cualquier otra persona involucrada en el proyecto.

El wireframing, entonces, es el proceso de construcción de su wireframe. Significa establecer las funciones principales de su sitio web, la forma en que se mostrarán estas funciones y los conceptos básicos de cómo el usuario interactuará con el sitio en general. Es (o más bien puede ser) el primer paso en prácticamente todos los procesos centrales del diseño de sitios web: diseño visual, SEO e incluso organización del texto real.

¿Qué logra el wireframing?

En esencia, el proceso de wireframing se trata de ahorrar tiempo, esfuerzo y gastos.

Como dicen, una imagen vale más que 1000 palabras. Lo que los wireframes realmente logran es poner a todas las partes interesadas creativas y comerciales "en la misma página" al comienzo de un proyecto.

Ya sea que esto se logre reuniéndolos a todos para producir el wireframe inicial (preferible) o simplemente teniendo una reunión en la que se les presente un wireframe completo antes de que comiencen a pensar en el proyecto en detalle (aún bastante útil), el proceso puede eliminar virtualmente el esfuerzo desperdiciado que resulta cuando su "chico de la UE" comienza a trabajar en algo inherentemente incompatible con la plantilla que está produciendo su diseñador web, y ninguno de sus conceptos respalda el texto que escribió su equipo de marketing.

Siempre vale la pena una pequeña inversión de tiempo y esfuerzo para reunir a todos en la misma sala y hacer una lluvia de ideas, incluso si solo puede dedicar unas pocas horas. Entonces todos están trabajando en el mismo proyecto, en lugar de 4 visiones diferentes e incompatibles.

¿Cuándo es el momento adecuado para el wireframe?

En pocas palabras, cuanto antes, mejor. Cada proyecto debe comenzar con una maqueta de baja resolución, incluso si se dibuja en la proverbial "parte posterior de una servilleta". Tan pronto como tenga la idea de una aplicación, una página web o cualquier otra cosa que sea visual e interactiva, debe comenzar a crear estructuras alámbricas. No solo ayudará a "fundamentar" sus ideas en términos prácticos y visuales, sino que establecerá una idea central con la que se puede hacer todo el trabajo de acuerdo con ella, o que se puede cambiar para adaptarse a la necesidad de una manera que todas las demás partes interesadas puedan ser conscientes rápidamente.

¿Cuándo es el momento adecuado para detener el wireframing?

Aquí hay 2 escuelas de pensamiento. Algunos procesos detienen el wireframing tan pronto como los codificadores o los especialistas de UE comienzan a producir prototipos y maquetas. Otros siguen haciendo wireframes actualizados para distribuir al resto del equipo hasta que el sitio o la aplicación se codifican y se ponen a dormir. En cualquier caso, siga utilizando wireframes hasta que se decidan y finalicen los problemas que representan.

¿Quién necesita tener acceso (y entrada) a estos wireframes?

¡Casi todos en tu proyecto!

El acceso a la estructura metálica más reciente es vital para cualquier persona que trabaje en el proyecto, por lo que pueden evitar perder el tiempo en funciones que no funcionarán o que no funcionarán de la manera que habían previsto.

En cuanto a la capacidad de modificar wireframes, si tiene equipos muy grandes, es mejor que solo brinde a los líderes de equipo específicos la capacidad de alterar wireframes o generar nuevas versiones. Incluso entonces, considere hacer que todas las modificaciones se realicen en una reunión con todas las partes interesadas disponibles, para no arruinar el trabajo de todo un equipo al hacer cambios de los que no estaban al tanto.

Cuanto más colaboren activamente las personas o equipos involucrados en diferentes aspectos de su proyecto, más eficiente será su proyecto. Cuanto más pruebes, revises los comentarios y realices iteraciones en grupo, mejor será el producto final.

¿Cómo afectan los wireframes a su proceso?

Los wireframes sirven para centrar todos sus esfuerzos en los mismos entregables. Le permiten probar diferentes enfoques rápidamente y generar comentarios casi inmediatos. Al final, el tiempo y el esfuerzo que inviertas en el wireframing se pagarán varias veces, especialmente en proyectos más grandes o más involucrados.

¿Qué podría costarle saltarse por completo los wireframes?

La respuesta corta es, como siempre, "eso depende de en qué estés trabajando". Sin embargo, de manera realista, hemos estado en el negocio el tiempo suficiente para darle una respuesta real, basada en el promedio de los diversos proyectos en los que hemos estado involucrados a lo largo de los años.

El wireframing es típicamente el 5-6% de su presupuesto total de desarrollo. Sin embargo, mejora la efectividad de casi todos los demás aspectos de su trabajo. Por ejemplo: En promedio, los costos finales de codificación son un 60% menores para los proyectos de well wireframe. Los costos de RFC (Solicitud de cambio) generalmente se reducen en un 80%.

Lo que eso significa para usted es que incluso si costara 3-4 VECES lo que realmente cuesta hacer wireframe, ahorraría tiempo y dinero al hacerlo.

Aprovechar al máximo un presupuesto de wireframe limitado

Hay algunos consejos y trucos que podemos presentar para hacer un buen wireframing, incluso si los contadores de frijoles no aprecian su importancia real:

• Elija una herramienta de estructura metálica que sea fácil de usar o una que ya sepa cómo usar bien. Esto le ahorrará tiempo para ponerse al día.
• Crea múltiples variaciones, especialmente al principio. Esto le permitirá eliminar rápidamente los arreglos inviables.
• Involucre a las partes interesadas clave con anticipación e incorpore sus comentarios en las nuevas versiones.
• Realice pruebas de usuario para determinar si su estructura alámbrica será utilizable por su público o mercado objetivo.
• Genere nuevas iteraciones para el wireframe hasta que todas las partes interesadas clave estén satisfechas (o resignadas a comprometerse).
• Asegúrate de no tener que volver a la mesa de dibujo después de que el diseño o la codificación hayan comenzado.