Las ventajas de usar Wireframes son por un lado que el equipo y el cliente se centra en el diseño de contenidos y no en el diseño visual, y por otro lado, definiendo la organización y estructura en etapas previas al diseño y programación se evitan cambios posteriores más costosos, reduciendo así costos y tiempos. La información que deben contener los wireframes es: Inventario de contenido. Elementos cómo: cabeceras, enlaces, listas, imágenes, formularios, etc. Vínculos, títulos, etc. Layout. Notas que nos indiquen el comportamiento de algunos elementos. En general esta herramienta es parte del proceso de arquitectura de infomación y permite definir el detalle del contenido de las páginas más relevantes, por ello es aconsejable realizar el wireframe antes de empezar con el diseño y la programación del proyecto web. Es evidente que el uso de wireframes es una muy buena idea para el desarrollo de proyectos web, más aún si los enriquecemos con otras dimensiones, como por ejemplo con indicios para la construcción del HTML y CSS. Es también una valiosa herramienta para determinar claramente los contenidos a nivel de página, junto con marcar hitos con el cliente respecto al desarrollo del proyecto. Para más información sobre los wireframes y su utilización os recomiendo leer el siguiente post de Olga Carreras. Herramientas relacionadas: Hoy he probado la aplicación MockFlow de prototipado para aplicaciones web, me ha resultado muy fácil de utilizar y con un gran número de posibilidades para configurar tu wireframe. Su principal ventaja es que es una aplicación online, permitiendo realizar modificaciones en el wireframe que se mostrará en todos los equipos que estén visualizando la aplicación a tiempo real.