Tres herramientas TOP para diseño en reclamador

En un equipo de diseño digital es importante encontrar cierta metodología, ciertas herramientas que permitan mantener un lenguaje fluido tanto con los compañeros del departamento, como con los desarrolladores.

El día a día puede convertirse en un caos de tareas y frentes abiertos si no terminas de encajar un procedimiento basado en cierta organización. En nuestro caso, vamos poco a poco encontrando ese equilibrio y hay algunas herramientas que nos están ayudando a hacerlo.

Brand.ai
Brand.ai permite gestionar sistemas de diseño fácilmente, mantenerlos actualizados y compartirlos con el resto del equipo mediante un plugin de Sketch o Adobe Illustrator.

Su funcionamiento es sencillo, puedes crear estilos de texto, botones, componentes, paletas de colores, etc en Sketch y subirlos a la librería, así cuando un compañero comienza un proyecto nuevo puede sincronizar con la librería y tener todo al día y listo para empezar. También es bueno para tirar de ciertos componentes que sueles utilizar a menudo y mantenerlos actualizados.

Los componentes se arrastran a Sketch y son editables como cualquier otro Símbolo.

Desde que empezamos a crear nuestro sistema de diseño en reclamador, nos está permitiendo centrarnos en mejorar ciertos componentes poco a poco. Además de establecer unas pautas generales tanto para los que ya estamos por aquí, como para los que están por venir.

Una de las cosas interesantes que aún no hemos probado es que permite conexión a través de hoja de estilos, manteniendo actualizados estilos en la web según los cambios que se realicen desde diseño. También permite integración con herramientas como Slack.

Muy grande.

Trackduck
Hace unas semanas bromeábamos en IT acerca de diseñar una herramienta que nos permitiese crear tickets sobre la propia web. Hasta ahora, nuestro método era hacer un pantallazo de los problemas, subirlos a Marvel App y comentar sobre ellos. A mí, personalmente este método me parecía bastante tedioso, por un lado las capturas quedaban obsoletas con los cambios, además de ser bastante rollo el tener que subirlas y actualizarlas cada vez que había revisiones.

Pensaba que estaría genial una herramienta que permitiese abrir tickets sobre el producto “vivo”, es decir sobre la propia web, si hay algo que no funciona, haces un click sobre ello y lo asignas al desarrollador.

Como no podía imaginar que existiese planteamos desarrollarlo en nuestros Labs. Pero haciendo unas cuantas búsquedas en el Webstore de Chrome, encontramos esta increíble herramienta que hace exactamente lo que necesitábamos.

Es sencillo asignar tareas a miembros del equipo directamente sobre el problema.

En Trackduck puedes crear un equipo y varios proyectos, asignar personas a ese equipo y mantener un sistema de asignaciones mediante la propia URL “real” tanto en producción, como en integración.

Una auténtica maravilla. Que ahora mismo, está fusionándose con Invision, lógico. La recomiendo al 100%.

Hotjar
De Hotjar ya he hablado otras veces en otros sitios 😃 y sé que hay muchas otras herramientas que permiten hacer lo mismo. Pero no empiezas a descubrirla hasta que empiezas a mantener una relación directa y diaria con la aplicación. Si profundizas y entras en la posibilidad de crear URL’s virtuales, y “triggers” que disparen videos en ciertas acciones es ideal para obtener métricas sobre comportamiento real.

Todo esto nos está ayudando a observar acciones en determinados desarrollos que podrían no estar funcionando tal y como creíamos.

Hotjar también permite heatmaps, aunque su punto fuerte recae en otros sitios.

La posibilidad de crear “funnels” en la misma aplicación permite fijar ciertas rutas para observar los caminos que toma el visitante, dónde se cae, y muchas veces por qué. También incluye la posibilidad de analizar formularios, incluso ahora incorpora un sistema para feedback por parte del usuario.

De obligada revisión diaria, y sobre todo, pegada a cualquier nuevo desarrollo que planteamos y llevamos a cabo.