Wireframing es una técnica que llevan utilizando los diseñadores de sitios web desde hace tiempo y con mucho éxito, ya que combina las ventajas de la rapidez y el bajo coste tecnológico con una eficacia y claridad que la convierten en una herramienta extremadamente útil y flexible en las primeras fases de diseño y desarrollo de un sitio web.
La función básica de un wireframe es presentar un modelo viable y comprensible de la estructura, la interfaz de usuario y el contenido de un sitio web y dan una buena idea de la funcionalidad, el flujo de usuarios y otras características que pueden ser útiles tanto para los diseñadores como para otras partes interesadas en la fase inicial de desarrollo.
Los wireframes suelen desarrollarse y entregarse a través de paquetes de software concretos, pero pueden ser simples dibujos en papel o pizarra (o al menos empezar así antes de pasar a un medio más sofisticado). Los bloques de construcción de un wireframe suelen ser simples cajas, líneas, texto y áreas sombreadas para representar el contenido, los gráficos, la funcionalidad y la relación y progresión entre ellos. La jerarquía tipográfica y el diseño también pueden representarse dentro de la estructura.
Dos tipos de wireframing:
- El simple vector wireframe Una serie de pantallas dibujadas que representan a grandes rasgos los principales elementos del sitio, con marcadores de posición para gráficos, texto, funciones, etc., y con una arquitectura aproximada construida a su alrededor para describir la navegación y las relaciones funcionales. Una versión más sofisticada puede incluir texto, comentarios sobre funciones y contenidos e imágenes y gráficos reales.
- El Esquema de la interfaz de usuario Una versión estática del sitio: las páginas son versiones finales de las páginas reales, pero no están enlazadas ni son interactivas, por lo que sólo muestran el contenido y las relaciones con otras partes del sitio. También es posible producir wireframes en los que los probadores y las partes implicadas en el desarrollo puedan hacer clic entre las páginas en bruto y los títulos para comprobar la navegabilidad, la lógica de los enlaces y la comprensibilidad de la progresión.
Las ventajas de utilizar el wireframing:
- Es rápido, sencillo, barato y fácil de cambiar, por lo que es una buena herramienta conceptual y de debate;
- Al concentrarse en la funcionalidad más que en la apariencia, hay menos distracciones de las relaciones estructurales y los desarrolladores y colaboradores no se atascan tanto comentando el aspecto, los descriptores, el diseño, etc.
- Proporciona una base visible, flexible y utilizable para la experimentación y el debate en torno a la arquitectura y la navegación, así como un medio para trabajar las ideas y cuestiones que surjan del debate.
Las posibles desventajas:
- Como es muy áspera y carece de explicitud, requiere algo de imaginación y esfuerzo por parte del espectador;
- Por lo general, es poco tecnológico, por lo que es bastante restrictivo y sólo puede proporcionar ilustraciones y conceptos generales en un entorno primitivo.
El wireframing es una herramienta muy eficaz en la planificación y el desarrollo de sitios web. Si quiere saber más sobre esta técnica por qué no nos llama al +44(0)800 024624 o envíenos un correo electrónico a hello@ux247.com
