Un prototipo o mockup en inglés es una maqueta o modelo de un diseño o dispositivo para que nos hagamos una idea de cómo será el producto final. El prototipo puede ser muy útil para probar una funcionalidad concreta, para ver el aspecto de distintos diseños e incluso para realizar tests de usabilidad (UX) sin invertir tanto tiempo, esfuerzo o dinero como supondría de tratarse del producto final.

Aunque su origen está en el mundo físico, la creación de páginas web o de aplicaciones móviles también implica el uso de prototipos, ya que nos permite jugar con la colocación de los menús o elementos y con el diseño en general sin malgastar tiempo picando código.

De la misma manera que la creación de aplicaciones ha evolucionado mucho con el tiempo, el mismo camino ha seguido el diseño y elaboración de prototipos o mockups, con soluciones de escritorio u online para usar directamente desde el navegador web.

Hace años ya vimos propuestas muy interesantes de herramientas online de mockup como Moqups o Balsamiq.

Hoy veremos más propuestas web de este tipo con las que diseñar un prototipo profesional y funcional con poco tiempo y esfuerzo.

InVision

Centrada especialmente en el diseño, InVision sirve para crear mockups o prototipos tanto para páginas web como para aplicaciones iOS o Android.

Funciona desde cero o con nuestros diseños previos, que podemos subir a la herramienta. Con InVision podremos crear un prototipo con gestos, transiciones y animaciones, prácticamente funcional para probar cómo quedará finalmente.

Otra de sus ventajas es la posibilidad de trabajar en solitario o en equipo en el mismo diseño. Además, se lleva bien con otros servicios como Slack, Drive, Dropbox o Evernote para así importar y exportar información o parte del proyecto.

Marvel

Con un nombre sugerente, Marvel se ofrece para que crees prototipos web o de apps móviles. Como ocurre con InVision, podrás complementar el uso de Marvel con otras herramientas como Slack, Google Drive o Asana.

Además de trabajar en modo online, Marvel cuenta con sus propias apps iOS y Android para seguir diseñando desde tus dispositivos móviles.

Marvel te ayuda a crear el prototipo desde cero o a importar tus proyectos de Photoshop o Sketch. Luego podrás darle vida al mockup con gestos y transiciones de la librería de Marvel.

Mockup Builder

Con más de 800 plantillas disponibles, Mockup Builder es un gran aliado si necesitas crear con poco tiempo un prototipo para páginas web, herramientas de escritorio o apps móviles.

En cualquier caso, en el editor encontrarás todo lo necesario para crear menús, añadir botones y elementos interactivos y diseñar todas las pantallas o páginas del proyecto.

Proto.io

Prototipos que parecen de verdad. Así se presenta Proto.io, una herramienta online de creación de mockups y prototipos especialmente pensado para aplicaciones móviles.

Con la herramienta de creación de Proto.io podemos crear prototipos con animaciones y gestos que dan cuenta de cómo será la app definitiva. Además, cuenta con elementos prediseñados para ayudarnos y que el resultado sea atractivo con poco esfuerzo.

NinjaMock

Para terminar, NinjaMock, que sirve tanto para diseño de páginas web como para aplicaciones Android, iOS o Windows Phone.

NinjaMock trabaja básicamente con vectores, de tu propiedad o importados de otras fuentes. Luego podrás exportar el resultado en PDF o compartirlo a partir de su enlace.

Por otro lado, admite comentarios, muy práctico si trabajas en equipo en el mismo prototipo.