jueves, 19 de mayo de 2011

Maquetando tu aplicacion con Balsamiq mockups

Como todo desarrollador de sistemas siempre al inicio de un proyecto es necesario sentarse y plasmar la idea inicial de una aplicacion en papel o en forma electrónica, lo que para un arquitecto o ingeniero vendria a ser una maqueta, el término que se usa en ingles es "Mockup", para cuestiones informáticas que tienen que ver con diseño o desarrollo de aplicaciones encontre la sig. definición: en resumen un mockup es un primer boceto que muestra de forma gráfica los puntos básicos y esenciales que luego serán desarrollados con más detalle en pasos siguientes del proyecto.

Como es usual existen en la web infinidad de herramientas que nos pueden ayudar a elaborar un mockup, yo gracias a la referencia que mencionaron en una platica de desarrollo flex fue que conocí "balsamiq mockups", sitio internet: http://balsamiq.com/products/mockups

Primera impresion

La version desktop es una aplicacion bastante sencilla e intuitiva que me muestra organizados en "tabs" los elementos mas usados para desarrollar interfaces de usuario, cabe hacer mencion que algunos de los elementos que incluye fueron extraidos directamente de la interface de usuario del ipod, por ejemplo la vista de albumes con scroll de las portadas entre otros.

Basicamente uno agrega los elementos de la interface empezando por lo contenedores, ej, formas o ventanas, a continuacion agregamos los elementos como botones, cuadros de texto, etiquetas, etc, tambien tenemos una seccion de elementos que nos sirven para hacer anotaciones de nuestro diseño como una hoja post-it, un trazo para enumerar, etc.

El look de los componentes asemeja bastante a trazos hechos a mano lo que los hace bastante familiares y faciles de colocar pero ademas agrega la sofisticacion que nos da trabajarlo desde un software de diseño, tenemos la opcion de agrupar elementos y ademas agregar algunas de nuestras creaciones para posteriores diseños, una vez terminado el trabajo tenemos opcion de imprimirlo o exportarlo en diferentes formatos como png, pdf, etc.

Aqui les dejo una muestra de lo que se puede lograr en menos de una hora con balsamiq.