Software de maquetas

MOCKUPS APPS
SEPTEMBER 26, 2015
UDG
Oscar Adrian Mariscal Arredondo
INVISION APP
InVisionapp da a los equipos de la libertad de diseñar, revisar y probar productos, todo ello sin una
sola línea de código. Con las herramientas intuitivas para la creación de prototipos, gestión de
tareas y control de versiones, es todo el proceso de diseño, todo en un solo lugar.
La presentación es todo
Hay una diferencia noche y día entre enviar 30 archivos JPG diferentes a un cliente de un diseño
de página web y pedir sus opiniones, y el envío de un enlace a un prototipo interactivo que se
puede juguetear con como si se tratara de un sitio web real.
Subiendo su presentación realmente puede hacer una diferencia, tanto en la forma en que sus
clientes perciben la calidad que usted está entregando, y la calidad de la retroalimentación que
pueden proporcionar.
Control de Diseño
Al cargar pantallas, los presenta de una manera que imita una experiencia real de la navegación
web. Esto significa que usted tiene control sobre la forma en que otros ven sus diseños, lo cual es
una gran cosa.
Móvil
Prototipo móvil. Completo con gestos.
Al que se puede hacer con las versiones de escritorio, puede crear enlaces punto de acceso para
todas las pantallas. Al hacer esto, usted puede controlar los gestos móviles y transiciones que se
producen.
Cosas como: Deslizar hacia la izquierda, doble toque, disolviendo una pantalla al hacer clic, o
deslizamiento hacia la derecha.
¡Qué mejor manera de visualizar una aplicación móvil, o sitio web de interactuar efectivamente
con él en su dispositivo móvil. Esto elimina toda adivinanzas de la ecuación cuando se trata de
diseñar elementos que son del tamaño adecuado para un dispositivo móvil.
Tutoriales
https://www.youtube.com/watch?v=vz2lys4Dgd8
Oscar Adrian Mariscal Arredondo
MockFlow
Características básicas
MockFlow proporciona a los usuarios un método para desarrollar para una amplia variedad de
proyectos. Ya sea que usted está desarrollando una aplicación para Facebook, Android o necesita
un tema de Wordpress para construir, este sistema tiene varios para elegir. También es capaz de
iniciar una nueva estructura metálica desde cero o utilizar una de las muchas plantillas
incorporadas si necesita una resolución rápida del proyecto.
Las características clave
En el desarrollo de la estructura de su proyecto, MockFlow ofrece una increíble cantidad de
componentes que se pueden añadir a sus páginas o aplicaciones .Incluye texto, imágenes,
maquetas de vídeo, mucho más. Casi todos los aspectos de desarrollo de la interfaz de su proyecto
puede ser añadidos con el fin de proporcionar una representación realista de lo que la página o
aplicación se verá como una vez terminado.
Para desarrollo de sitios web, cada página puede ser creada de forma independiente con el fin de
mostrar a sus clientes un flujo de cómo el sitio se comportará, así como ofrecer un mapa del sitio
para seguir. Esto puede ayudarle a demostrar la diferencia entre las páginas de destino, blogs y
capacidades de comercio electrónico del sitio de acuerdo a cómo el visitante interactúa con la
información.
Capacidades
MockFlow permite a los usuarios exportar sus creaciones utilizando varios métodos diferentes.
Esto incluye: PDF, imágenes, archivos de MS Word, mapa del sitio dentro de Excel, HTML 5,
presentaciones de PowerPoint y exponer vista previa de varias páginas en una sola vista. Mientras
que la mayoría de las capacidades de exportación son para suscriptores premium, el PDF se puede
hacer de forma gratuita y le dará un método de distribución para compartir con sus clientes.
MockFlow proporciona las capacidades de estar en un ambiente de equipo. Ventanas de chat se
pueden abrir con el fin de compartir información durante el proceso de aplicaciones o sitios web.
Esto puede ayudarle a mantenerse conectados con sus clientes y miembros del equipo al crear el
look perfecto y sentir para la interfaz.
Tutoriales
https://www.youtube.com/watch?v=lD5lT3LX0Ck
Oscar Adrian Mariscal Arredondo
Marvel app
Qué es
Marvel es una herramienta gratuita que convierte bocetos, wireframes, PSD y diseños
almacenados en Dropbox en prototipos móviles y web interactivas. Al conectar sus cuentas de
Marvel a Dropbox, los usuarios pueden mantener sus prototipos actualizados y sin tener en cuenta
en la sincronización de si se hacen cambios en el futuro.
Para crear su primer prototipo, iniciar sesión con Dropbox a través de SSL y extraer las imágenes
que le gustaría utilizar. Vincular cada una de sus pantallas estáticas juntos utilizando puntos de
acceso. También puede agregar animaciones, y alternar entre pantallas. Suponiendo que usted
está diseñando un prototipo para el iPhone, Marvel se abrirá un cuadro de vista previa que
muestra exactamente lo que su diseño se verá como una vez que se aplique plenamente. Usted
puede incluso crear iconos de aplicación para instalar en la pantalla principal de su dispositivo.
Marvel le proporciona una URL única para cada prototipo se crea, que luego se puede compartir
con los clientes o compañeros de trabajo. Esta URL se mantiene igual independientemente del
número de cambios que realice en su prototipo.
La verdadera innovación detrás de Marvel tiene que ver con su conexión a Dropbox. Marvel nunca
se edita o modifica los archivos en Dropbox. En cambio, la aplicación basada en la web,
simplemente extrae imágenes. Los archivos son entonces mantienen actualizados
automáticamente, lo que significa que los usuarios no tienen que volver a subir sus prototipos,
una vez que han empezado un nuevo proyecto.
Usos prácticos:
Activar imágenes estáticas en prototipos interactivos
Enviar rápidamente prototipos a clientes o colegas
Añadir animaciones a sus prototipos de aplicaciones móviles
Crear un icono de aplicación para su prototipo de iPhone
Tutoriales
https://www.youtube.com/watch?v=jQeSkclJOmg
Oscar Adrian Mariscal Arredondo
Referencias
https://www.mockflow.com/
https://marvelapp.com/
http://www.invisionapp.com/
Bibliography
Ingle, P. (2014). From Mockups to Responsive Web Design using Foundation and Bootstrap: A
straightforward approach to Web Design. Amazon Digital Services.