5 Herramientas Gratis para Diseñar Wireframes y Mockups

Posted in: diseño web

22427-1340675540-flickr.jpg

 

Los wireframes, también conocidos como esquemas, blueprints, mockups o page architecture, son un conjunto de dibujos que tienen como fin representar la organización de los elementos en una página web. Representa solo la estructura, no incluye elementos gráficos. Sirve para ofrecer un vistazo rápido para conocer como será organizado el contenido web en la página sin entrar en muchos detalles. Es utilizada para poder observar el diseño de un sitio web antes de que se comience a programar y llevar a cabo el diseño visual del mismo. Los wireframes son una vía de comunicación entre los llamados arquitectos de la información, los programadores, los diseñadores y los clientes que encargaron el diseño visual del sitio. Los wireframes o esquemas también pueden ser utilizados para pruebas de usuarios, para evaluar la reacción de las visitas.

 

¿Por qué usar un wireframes?. Existen diferentes ventajas: por un lado, con un wireframes el desarrollo se centra en el diseño de contenidos y no en un diseño estrictamente visual. Por el otro lado, los wireframes o mockups significan una reducción de riesgo de perder dinero. ¿Por qué?, porque el diseño de contenidos se evalúa antes de comenzar a ejecutarse y desarrollarse.

 

Un wireframe debe contener lo siguiente: inventario de contenido; vínculos, títulos; layout; cabeceras, listas, formularios; junto a notas que indiquen la función a ser desempeñada por cada parte del sitio web.

 

Herramientas gratuitas para diseñar wireframes

 

1- Mockflow: cuenta con una librería de plantillas donde podrás elegir la más adecuada para organizar tu contenido web. Si bien es gratuito, existe una versión de pago para usuarios que necesiten funciones más avanzadas.

 

2- Mockingbird: permite crear y compartir wireframes online. Interfaz drag and drop muy simple de utilizar, interfaz limpia y fácil de usar.

 

3- Lovely Charts: herramienta online gratuita para crear el esquema de tu sitio web. Ideal para quienes buscan una alternativa simple para diseñar su wireframe.

 

4- Cacoo: es una herramienta fácil de utilizar para crear wireframes completamente online. Su característica más destacable es la posibilidad de colaborar entre usuarios en tiempo real.

 

5- Gliffy: otra herramienta gratuita y online para crear mockups de tu sitio web. Cuenta con una librería de esquemas y con una API para que los desarrolladores puedan integrar la herramienta con sus aplicaciones.

 

¿Te sirvió este post?. Compártelo en Facebook y Twitter. También, puedes suscribirte al blog de Equipos Creativos para más novedades sobre marketing digital y redacción en español.

 

Fuente imagen: morville, disponible bajo licencia Atribución 2.0 Genérica (CC BY 2.0), en http://www.flickr.com/photos/morville/3220111175/

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

*

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CONTACTENOS
info@equiposcreativos.comUSA: +1 305 4249966Argentina: +54 351 4235823