Hasta ahora el flujo de trabajo de un proyecto había sido: Wireframes > Diseño > Desarrollo > Testeo. Nos centraremos en el proceso de diseño a desarrollo. Siendo Photoshop la herramienta más potente para hacer diseños ha ocupado el podio del top 10 de los programas utilizados para diseñar. Pero ahora, las necesidades han cambiado y Adobe XD ayuda a mejorar la relación entre diseñadores y desarrolladores.

Adobe XD es una herramienta nueva para hacer diseños y transferirlos a los desarrolladores con mayor facilidad. El programa, a parte de poder hacer diseños más fácilmente, proporciona varios enlaces para los diferentes perfiles. Se puede hacer un enlace para cliente con una maqueta funcional con navegación y todo. Por otra parte s epuede hacer un enlace para los desarrolladores que en cada página ofrece opciones para facilitar la obtención de estilos, imágenes y recursos del propio diseño.

Adobe XD, enlace de desarrollador

Cómo podemos ver en la captura de encima, se proporcionan todo tipo de lementos que normalmente con Photoshop tendríamos que ir buscando entre capas y carpetas.

Elementos que nos ofrece para ayudarnos a desarrollar:

  • Medidas del canvas
  • Imágenes para descargar en 1 click (jpg, png, gif, svg…)
  • Colores utilizados en esta página
  • Estilos de fuentes (nombre de la fuente, tamaño, estilo y color)

Lo bueno de este sistema también es que cualquier cambio que haga el diseñador sólo tiene que actualizar el enlace para publicar los cambios y el desarrollador con una simple recarga de la página ya puede ver los cambios. También permite, en la versión de cliente, poner comentarios en cada una de la páginas con pequeñas bola con un numerito para saber a qué hace referencia. Muy práctico para pasar feedbacks.

Evidentemente para poder utilizar de esta form Adobe XD se tiene que tener el Creative Cloud contratado, pero sólo para publicar para ver el enlace para clientes y desarrolladores no hace falta tener cuenta en Adobe.

 

FuenteAdobe XD
Categorías: Herramientas
Si necesitas una url corta puede usar: codygo.es/2139

Deja un comentario