Siempre que empiezo un nuevo proyecto o desarrollo me gusta diseñar en papel el aspecto de las pantallas, para poder presentarlas al cliente y decidir si se ajusta a sus requerimiento o simplemente para exponerle mis ideas.
Estos diseños de interfaces gráficas se podrían hacer con Visio (pero evidentemente usando Linux es complejo utilizar esta aplicación a menos que utilices una maquina virtual), asi que preferi buscar otras alternativas y al final me resultan incluso mejores. Hasta ahora usaba Pencil, una extensión libre para Firefox. Pero recientemente descubri Balsamiq Mockups y me parece una excelente solución para crear muy rapidamente los prototipos. Es una aplicación de Adobe Air, por lo que requerira que lo tengas instalado en el equipo. (La instalacion de Adobe Air no es compleja, basta con descargar el fichero .bin correspondiente, darle permisos de ejecución y ejecutarlo).
Cuando arrancas la aplicación de Mockups, aparece una barra con todos los elementos gráficos que puedes usar: botones, cajas de texto, paneles, contenedores y un largo etcetera. El aspecto de estos controles es de un dibujo a mano alzada lo que da al aspecto final del prototipo un look muy caracteristico como si fuera una copia directa de tu diseño en papel.
Su uso es muy simple, seleccionas el control a usar, lo arrastras a la ventana principal y con un doble click, te permite editar sus propiedades.
Otra cosa que me gusto, es que el último boton del menu te permite entrar en “modo presentación”. En este modo, a pantalla completa se muestra el diseño que actualmente estas creando y un enorme cursor azul te permite moverte por las diferentes secciones del diseño, lo cual es útil para presentar la idea en una reunión o ir comentandosela al resto del equipo.
La aplicación no es gratuita, tiene un coste de 79$ (lo cual para alguien que se dedique a esto, no es que sea excesivamente cara). Podeis sin embargo descargar una demo para que comprobeis su funcionalidad (esta demo tiene capadas algunas funcionalidades como son la de guardar o exportar a imagen los diseños realizados) o probarla de manera online.
Alternativamente Starman nos habla de GomockingBird, otro servicio online para crear nuestros propios mockups.
Enlace | Ejemplos de Mockups | Demo Online
¡¡Gracias por la entrada!!
Justo lo que necesitaba 🙂 Aunque creo que voy a usar GomockingBird!
Gracias!!
Yo uso directamente el Qt Designer… y si me gusta incluso ya puedo empezar a implementar sobre él. Si lo que tengo que programar no es Qt pues me sirve sólo de mockup.
Lo bueno del Qt Designer es que tiene una opción de “Preview” que te permite ver la ventana e incluso interactuar un poco con ella como si ya la hubieses compilado (incluso cambiarle el estilo a cleanlooks, plastik, oxygen, human, windows, mac os, para ver como quedaría en las distintas plataformas).
muy buen aporte!! la pregunta del millón es.. dónde lo puedo bajar al QT Designer?? gracias!!!
Necesitaba algo así, no sabía que existia :O.
Hacia mis dibujos con OpenOffice Dibujos
^^
Muy bueno.
Gracias.
Patrick
ese es el que usan para los mockups de ubuntu? se parece a los que he visto del software center y el area de notificacion nueva^^
Yo uso inkscape cuando me piden el diseño de una pagina web. inkscape me permite brindar un prototipo casi identico al resultado final. hago uso de las capas para separar el proyecto, por ejemplo fuentes, fondo, colores, logos, etc. en verdad es una gran herramiente, ah! se me olvidaba otra herramienta indispensable para darle presicion al trabajo es kruler, es una regla que esta en los repositorios y en verdad es de mucha ayuda 🙂
y es necesario el uso de COMIC SANS?? :S
jajaja, hombre yo creo que este es de los pocos casos en que si que pega, a pesar del odio que le tengamos XDD
Esto es extraordinario. 🙂 Vamos a probarlo para preparar prototipos de productos. Gracias.-