13 abr. 2012

Balsamiq: Mockups de tus aplicaciones

Un mockup es una maqueta o representación de un objeto, para esta entrada, un mockup es un dibujo (en borrador) que representa como están distribuidos los elementos de una pagina web o de sistema. Un mockup puede servir para diseñar de forma rápida un bosquejo de como debe quedar la interfaz de usuario de una aplicación o para realizar presentaciones sobre sistemas.

http://www.iphoneuxreviews.com/wp-content/uploads/2009/06/balsamiq_test.png

Balsamiq es una aplicación que permite hacer mockups de forma muy fácil, simplemente debes arrastrar los componentes a un tablero.

Para descargar la aplicación debes acceder al siguiente enlace:

http://www.balsamiq.com/


En este debes dar clic en "Install Mockups" y ejecutar el archivo que descargas. Las siguientes imágenes corresponden a la instalación de balsamiq.

Das clic en Abrir o Guardar

Das clic en Continuar y eso es todo

El inconveniente que tiene esta versión es que funciona de forma gratuita por 7 dias, luego debes comprar la licencia para que funcione (esta cuesta 79 dolares).

Cuando ejecutas la aplicación te aparece una serie de botones y elementos que puedes arrastrar para construir tu mockup.


Yo utilizo balsamiq de la siguiente forma (gratuita por siempre):

Ingreso a la versión de prueba que se puede usar desde Internet dando clic en "TRY WEB DEMO" (primera imagen), esta versión es algo molesta porque cada 10 minutos te esta recordando que estas haciendo uso de una versión de prueba mediante un popup (pero es algo a lo que te acostumbras).

La versión de uso desde la Web tiene los mismos componentes que la aplicación de escritorio. Para que no pierdas lo que haces debes dar clic en "Mockup" y luego en "Export mockup XML", esta opción guarda en el portapapeles el código en XML de lo que estas haciendo, debes copiar este XML en un archivo vació de texto (.xml o .txt son buenas extensiones para guardar este archivo). Cuando quieras recuperar lo que estabas trabajando, debes dar clic en "Mockup" y luego en "Import Mockup XML", te aparece un cuadro de texto en donde debes ingresar el código XML que habías copiado previamente.


Espero que te sea útil para representar sistemas, ya seas un diseñador, programador o usuario normal.

1 comentario:

  1. Aqui pueden encontrar algunos templates de proyectos ya hechos en Balsamiq: https://mockupstogo.mybalsamiq.com/projects

    ResponderEliminar