Cómo conectar Zeplin con Jira

Si está trabajando con Jira y Zeplin, ¡debería leer esto!

En primer lugar: todavía no hay una solución que funcione completamente perfecta para nosotros. Pero encontramos una solución para tener una visión general bastante buena de los diseños en zeplin mientras los conectamos con JIRA. (En este punto, quiero gritar que realmente, realmente necesitamos una función de carpeta, donde podamos anidar carpetas en carpetas. Saludos al equipo de Zeplin aquí).

En ABOUT YOU trabajamos con Jira en casi todos los departamentos. Pero como equipo de trabajo gráfico necesitamos otras herramientas para tener una mejor conexión entre nuestro equipo de UX, UI y los equipos de desarrollo. Elegimos Zeplin para trabajar en estrecha colaboración con las partes interesadas, diseñadores, diseñadores de experiencia de usuario y desarrolladores frontend. Zeplin combina algunas características que optimizan nuestro proceso de trabajo, presentaciones, rondas de comentarios y exporta fragmentos de código y activos. Usar la función de comentarios en el diseño, por ejemplo, es mucho mejor, y luego explicar en Jira qué botón tiene que cambiar cómo o qué espacio en blanco necesitamos disminuir.

Pero: la clasificación de los diseños en zeplin es un desastre. Sí, nos dieron la función de "secciones" hace un par de meses para combinar pantallas en un área, lo que hace que todo sea un poco mejor. Pero si tiene un producto de comercio electrónico muy complejo, esto no lo ayudará en absoluto. Tenemos una producción de más de 80 diseños cambiantes y nuevos al día. Y necesitamos la posibilidad de distinguir entre páginas y sus características. Y también tenemos que preocuparnos por los diferentes puntos de interrupción.

También hay una complejidad en la elección del canal de comunicación correcto. Como mencioné antes: los comentarios en zeplin deberían ser el canal deseado para comentarios en diseños. ¿Pero qué hay del estado? Información como plazos, bloqueadores, prioridad: estas informaciones aún deben pertenecer a la junta de Jira para garantizar la transparencia en una empresa que trabaja en jira.

¿Y cómo debe vincular las entradas de Jira a los archivos de Zeplin y viceversa? No podemos vincular a secciones solo a archivos que a menudo son confusos. Poner 25 enlaces en un ticket no tiene ningún sentido.

Intenté tan duro ...

En el primer paso, tratamos de limpiar toda la descripción general con el uso de secciones para páginas y mantener los diseños con etiquetas. Utilizamos etiquetas para los números de boleto de Zeplin y para diferenciar los puntos de interrupción. Para los primeros 20 boletos, en realidad fue una buena idea. Pero entonces ... ehm ... compruébalo tú mismo:

También ha habido muchos malentendidos cuando un diseño está listo. Entonces usamos una etiqueta final para cada pantalla que era final. ... Hasta que corregimos la primera pantalla final y todos estaban confundidos. (Sí, está bien ... deberíamos haberlo sabido ...)

Segundo enfoque: recoger las necesidades

Después de dejar un gran desastre en nuestra herramienta, volvimos a juntar nuestras cabezas y comenzamos desde cero. Todos los diseñadores, gerentes de proyectos y diseñadores de UX estaban haciendo sus propias notas que agrupamos y discutimos en equipo.

Descubrimos que:

  • Tenemos que dejar de usar etiquetas
  • Deberíamos dejar de subir todo en Jira y Zeplin y deberíamos tener un solo punto de verdad.
  • Necesitamos algún tipo de enlace a los archivos de Jira a Zeplin y viceversa.
  • Deberíamos separar de alguna manera las secciones en secciones más pequeñas para poder diferenciar páginas y características
  • Solo deberíamos usar Zeplin para discusiones relacionadas con el diseño y Jira para comentarios relacionados con el estado
  • Queremos presentar todo en Zeplin (porque dar comentarios y ver versiones anteriores es más fácil)

Encontrar soluciones

Creamos un "mosaico de clúster" que separa nuestros diseños en una sección. Por ejemplo: una sección sería una colección de diseños de una página completa (como una página de categoría) y un mosaico de clúster sería solo una característica de esta página (como el árbol de categorías).

Este mosaico tiene el mismo nombre que el número de ticket es negro, por lo que podemos encontrar fácilmente una nueva subsección y muestra el resumen del ticket como un gran título blanco. Este mosaico también se menciona como un hipervínculo en el ticket, por lo que es fácil encontrar el ticket de la sección. Esto nos permite mantener a Jira y Zeplin conectados al tener una buena visión general en Zeplin.

  1. El boleto entra al tablero
  2. Creamos el "mosaico de clúster" llamado como el ticket y lo vinculamos en el ticket
  3. Nos aseguramos de que el mosaico esté en el lugar correcto y en la sección correcta
  4. Empezamos a diseñar
  5. Exportamos todo lo que diseñamos en Zeplin y colocamos estos diseños justo después del mosaico del clúster
  6. Presentamos todo en Zeplin revisando los tickets ordenados por estado y prioridad y abriendo los archivos vinculados de Zeplin.
  7. Recopilamos todos los comentarios como comentarios de Zeplin
  8. Si el trabajo está hecho, verificamos todos los enlaces nuevamente, adaptamos los puntos de interrupción (usamos etiquetas en zeplin solo para diferenciar los puntos de interrupción) y cargamos la versión final en el ticket (para que esto también esté completo)

Hasta ahora, nuestro mejor enfoque es trabajar con estas herramientas hasta que los chicos de Zeplin nos brinden la función de carpeta y estamos seguros de que esto nos ayudará en este momento. Espero que eso también ayude a alguien.

Dustin Lundt, director de dirección de arte de ABOUT YOU