Analítica y Usabilidad

Tendencias, novedades, noticias y tips del mundo de Analítica y Usabilidad

Analítica y Usabilidad

12 Ene 2018
1 comentarios

17 herramientas de prototipado y usabilidad web

1 Star2 Stars3 Stars4 Stars5 Stars (6 votes, average: 4,33 out of 5)
Cargando…
Claudia Crua

herramientas prototipado

Los prototipos son una parte integral del proceso de diseño, ya que permiten la revisión de los conceptos básicos del proyecto en la etapa inicial de su desarrollo y compartir opiniones con el resto del equipo. Gracias a ellos puedes crear fácilmente una maqueta interactiva de un sitio web o aplicación móvil, que es capaz de identificar cualquier deficiencia en el flujo y la usabilidad del diseño antes de invertir demasiado tiempo ni dinero en su desarrollo.

Es importante, cuando comenzamos un proyecto, que el primer paso sea establecer una jerarquía en la información y el contenido para poder trasladarlo visualmente. De esta manera nuestro cliente podrá entenderlo y hacerse una idea de cómo estará estructurado en un futuro. Para ello hemos recopilado 17 herramientas de prototipado para dar a conocer tu aplicación y saber cuál es la experiencia del usuario al navegar a través de las diferentes pantallas.

Artículos relacionados:

17 herramientas de prototipado y usabilidad web

Justinmind

Justinmind es una herramienta de prototipado de sitios web, aplicaciones software y aplicaciones móviles que puede trabajar tanto con Windows como con Mac o también con iOs y Android. Existe una versión gratuita con la que puedes trabajar bastante bien aunque el precio de la versión Pro no es muy elevado.

La aplicación es bastante sencilla de usar y se divide en dos partes principales, los paneles dinámicos y los eventos. Los paneles dinámicos permiten poner varios elementos en la misma área, de esta forma podremos simular botones, cambios de pestaña u otros contenidos que cambian dinámicamente. Los eventos permiten indicar acciones sobre los elementos que tenemos en nuestro diseño.

https://www.youtube.com/watch?v=kUes0bJYokU
10 herramientas de prototipado que no te puedes perder para desarrollar tus proyectos

In Vision

In Vision ha supuesto una revolución no solo en el mercado de las herramientas de prototipado sino también de gestión de un proyecto en general, desde las fases de creación de los mockups hasta el final del desarrollo. El valor que la distingue de otras herramientas es que es muy intuitiva tanto para el diseñador que la está utilizando como para el cliente.

Entre algunas de sus características encontramos la de compartir y comentar un proyecto a tiempo real con el cliente. De esta forma el feedback llega de manera más rápida y más clara y los procesos se agilizan. Además, permite gestionar las versiones de tus proyectos sincronizando tus archivos de Photoshop o Illustrator con la aplicación de modo que resulta muy fácil no perderse en el entramado de carpetas y capas de los diferentes archivos.

La versión de prueba deja probar hasta cinco proyectos. Si tu volumen de proyectos web es notable, merece la pena que te crees una cuenta de pago ya que cuando comiences a utilizarla te darás cuenta de que te aporta un valor añadido a tus proyectos.

https://www.youtube.com/watch?v=0qisGSwZym4

Origami

Origami es una herramienta de creación de prototipos cuya propiedad es de Facebook y se utilizó para crear las maquetas de varias aplicaciones como Instagram, Messenger y Paper. Aunque se usa principalmente para aplicaciones de iOS gracias a su integración con Apple Quartz Composer, Origami también es compatible al desarrollo de prototipos interactivos en Android.

Esta herramienta de prototipado ofrece un par de características muy útiles para la creación de prototipos interactivos, incluyendo plugins para Sketch y Photoshop, así como una extensa biblioteca completa con foros, tutoriales en vídeo y guías. Tiene una característica para exportar el proyecto a código que permite convertir tu diseño visual en ejemplos de código escritos para iOS, Android, o la web.

https://www.youtube.com/watch?v=Gt9Kn7mhhfI

Proto.io

Tanto para iOs como para Android, Proto.io es una muy buena herramienta para la creación de grandes aplicaciones. Su principal característica es que cuenta con un motor que permite crear animaciones para apps móviles a través de un timeline para poder definir cuánto durará la animación.

https://www.youtube.com/watch?v=89TWEpIitFM

 

Herramientas de prototipado imprescindibles para el desarrollo de proyectos

Fluid

Fluid es otra herramienta de prototipado compatible con Android e iOs muy eficaz para pequeñas aplicaciones. Con ella puedes diseñar el maquetado de las principales vistas de tu app, pero también puedes enlazar cada una de esas vistas a controles de otras, pudiendo así realizar una demostración interactiva muy cercana a lo que sería el resultado final. Además, en su editor cuenta con diferentes wireframes para las diversas plataformas. De forma gratuita puedes crear proyectos de hasta 10 pantallas. Luego deberás contratar alguno de los diferentes planes mensuales que ofrece.

https://www.youtube.com/watch?v=uodln1GmrFM

Codiqa

Codiqa es una de las herramientas de prototipado de pago, extremadamente intuitiva ya que funciona con drag and drop. La tendencia de este tipo de aplicaciones es que ofrecen al diseñador cada vez más facilidades y simplicidad en su uso. Además permite escoger recursos de entre la amplia biblioteca que posee o bien puedes importar tu propio código. Su ventaja es que una vez construyas el prototipo, lo podrás ejecutar en cualquier navegador o tamaño de pantalla, lo que te ahorrará mucho tiempo de gestión de peculiaridades de cada navegador. Finalmente otra de las características de Codiqa es que permite compartir y ver las propuestas en tiempo real así como generar el proyecto visualmente y con código.

https://www.youtube.com/watch?v=19KGPbWMBKM

Pixate

Desarrollada por Google, Pixate es otra plataforma de prototipado que permite a los diseñadores probar diseños móviles interactivos, animaciones y wireframes para dispositivos Android o iOS.

En Pixate puedes crear diseños de interfaz en forma de capas y animaciones individuales de forma similar a la mayoría de los programas de diseño gráfico, a través de una simple función de arrastrar y soltar. Una vez que estés satisfecho con tu prototipo, puedes implementarlo y probarlo en un dispositivo Android o iOS.

Una vez que pongas Pixate en marcha, echa un vistazo a la documentación y tutoriales ofrecidos online para aprender los fundamentos básicos de la creación de tu primer prototipo.

https://www.youtube.com/watch?v=-TkRyyHoCYI

Marvel

Marvel es una herramienta fácil de usar válida para iOS y Android, que permite crear propotipos funcionales de manera rápida y sencilla a través de wireframes o bocetos. La aplicación permite a través de borradores, objetos insertados e incluso imágenes para presentar un diseño personalizado lo más parecido posible a la app que queremos crear.

https://youtu.be/Zdjg9yhBqTU

Ninja Mock

Ninja Mock es una herramienta de nivel intermedio que permite mediante bocetos la creación de aplicaciones móviles y diseño de páginas web de manera totalmente gratuita. Una vez tengas clara la idea puedes comenzar a utilizarla en los sistemas operativos Android, iOS o Windows.

https://youtu.be/9eImPwflGKI

Axure RP

Axure RP cuenta con años de experiencia, y es conocida por sus complejas interacciones entre diseñadores y desarrolladores. Dentro de la lista es una de las opciones más complejas pero también más completa. Mientras se tiende cada vez más a simplificar la interfaz esta herramienta ofrece el máximo control a los diseñadores, es por este motivo por que se desaconseja su uso a novatos en el sector.

https://youtu.be/03BnwgWNzeo

Pop app


Pop app es una herramienta funcional y fácil de usar que permite utilizar la cámara del móvil para fotografiar bocetos en papel y dotarlos de interacción para navegar. Puedes utilizar la herramienta en el sistemas operativos que prefieras de iOS, Android y Windows phone.

https://youtu.be/EGp20lVwUa8

Principle

Aunque en principio la aplicación Principle está especializada en animación, es capaz de realizar prototipos incluir un nuevo editor de líneas de tiempo. Es similar a Adobe After Effects o al Flash, entre sus ventajas es que posee dos líneas del tiempo y puede animar los objetos de las página. Si tus ventajas son la animación y el vídeo esta es tu herramienta.

https://youtu.be/vFrivX021-A

UXPin

UXPin es un conjunto de herramientas que pretende mejorar la experiencia Usuario al máximo. Creada por diseñadores UX, permite la creación rápida y fácil de prototipos de forma ágil.

Las mayores ventajas de utilizar UXPin son: poder colaborar y comunicarse con el equipo en todo el proceso de diseño en tiempo real, integrar versiones de documentos de nuestros archivos, demostrar las el proceso de diseño a clientes y recopilar sugerencias y comentarios.

https://youtu.be/zEjyfiIouH8

Webflow

Webflow es una herramienta de prototipado creada para diseñadores independientes y freelance que además de diseño incluye otras muchas tareas. Una de sus grandes ventajas es que no requiere el conocimiento previo de código para utilizarlo, también incluye un CMS maestro y características de hosting con múltiples opciones de diseño.

En una sola plataforma es capaz de ofrecer gestión y diseño, además con la herramienta es capaz de editar en tiempo real mediante una interfaz similar a Photoshop.

https://youtu.be/Ymn1sPuNMt8

Adobe XD

Entre las últimas incorporaciones de Creative Cloud de Adobe encontramos Adobe XD, una herramienta destinada a la creación de prototipos para hacerse con el mercado Sketch. Aunque es joven pronto será un fuerte competidor en este tipo de herramientas.

https://youtu.be/p66jDvPKnAA

Framer

Está herramienta de prototipado está más destinada a los usuarios que trabajan con Apple y requiere unos conocimientos más avanzados para aprovechar al máximo su potencial. Pero una vez controlada podrás manejar el lienzo a tu gusto. Otra ventaja que tiene es también se integra con Sketch.

https://youtu.be/y6FUs-CKcZg

Flinto

El elemento diferencial de Flinto son las transiciones. El formato de su editor permite  manipular o ajustar cada elemento de transición más rápido y con menos esfuerzo. Por este motivo, es ideal para proyectos en los que necesita ajustar el paso de usuarios entre varias páginas, para controlar la velocidad de transición y previsualizaciones.

https://youtu.be/ntEEnPtPCtM

Y si te interesa abarcar la Analítica Web, técnicas de conversión, SEO y otros aspectos del Marketing Digital, además de la Usabilidad y Experiencia de Usuario, el Master en Analítica Web, Usabilidad y Experiencia de Usuario (UX) es lo que estás buscando.

Y por último te dejamos el siguiente webinar para que en una hora aprendas algunos conceptos sobre prototipado y usabilidad web:

https://www.youtube.com/watch?v=SZjILxfPjQU

¡Si te ha sido útil este artículo compártelo con tus amigos! Y si conoces otra herramientas de prototipado deja un comentario en el post para conocerla.

Master en Analítica Web, Usabilidad y Experiencia de Usuario (UX)

Aprende a optimizar tu app o página web para conseguir más visitas, ventas y fidelización de la audiencia

¡Me interesa!

Comparte y comenta este artículo!

Ideas, noticias y mucha formación en tu bandeja de correo
Suscríbete ahora y recibe los mejores contenidos sobre Emprendedores, Marketing, Negocios e Internet

Un comentario en “17 herramientas de prototipado y usabilidad web”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

SUSCRÍBETE AL BLOG

Ideas, noticias y mucha formación en tu bandeja de correo
Sucríbete ahora y recibe todo el contenido de nuestro blog

SUBCATEGORÍAS

LO MÁS LEÍDO HOY

BUSCA EN EL BLOG

IEBS EN LAS REDES

Si lo prefieres puedes seguir nuestro RSS: