La entrega de un diseño web tiene lugar cuando los diseñadores finalizan el trabajo y necesitan entregarlo a los desarrolladores. El objetivo final de la entrega del diseño de la pagina web es minimizar las conjeturas y mejorar la eficacia del proceso de diseño. Aquí hay 7 cosas que los diseñadores pueden hacer para que la transferencia sea lo más fácil posible:
- Establecer comunicación efectiva.
- Preparar una lista de verificación de transferencia
- Preparar activos de alta calidad.
- Automatice el proceso de transferencia utilizando herramientas especiales.
- Diseño para casos de borde.
- Describe los efectos animados complejos en detalles
- Programar una reunión para la entrega
1 Establecer comunicación efectiva.
Las relaciones entre el equipo de diseño web e ingeniería juegan un papel vital en el éxito del proyecto. Muchos equipos de productos cometen el mismo error: aíslan los equipos de diseño y desarrollo. Como resultado, dos equipos trabajan de forma independiente y el traspaso de información es el único punto durante el proceso de diseño donde el equipo intercambia la información.
Esta decisión rara vez tiene un resultado positivo. Por lo general, conduce a lazos de retroalimentación extra entre desarrolladores y diseñadores web.
La preparación para el traspaso del diseño debe comenzar mucho antes del traspaso real; Debería ocurrir al principio de todo el proceso de diseño. Es muy importante involucrar a los desarrolladores en el proceso de diseño lo más temprano posible.
Un diseñador de productos digitales debería compartir diseños con anticipación y, a menudo, con los desarrolladores. Para que la colaboración sea productiva, es importante establecer puntos de control: eventos que ocurren durante el diseño del producto donde los diseñadores y los desarrolladores se reúnen para analizar el diseño.
Practica la colaboración en tiempo real
Es vital para los diseñadores comprender las posibilidades y limitaciones de la tecnología con la que están trabajando. Sin esta comprensión, existe una gran posibilidad de que la solución propuesta por los diseñadores no sea técnicamente viable.
Lo mejor es involucrar a los desarrolladores en el proceso del diseño web. Es especialmente beneficioso cuando los diseñadores trabajan en estados de aplicaciones complejas, como las transiciones animadas. Los diseñadores web pueden consultar a los desarrolladores que trabajarán en el proyecto para comprender si algo es fácil de implementar o no y así evitar futuros retrasos en la producción.
2 Preparar una lista de control de transferencia
Al igual que en cualquier otro proceso, cuanto mejor sea el traspaso, mejor será el resultado final. Es evidente que sería un error pedir a los diseñadores que memoricen todos los archivos que deben proporcionar a los desarrolladores. Los directores de proyecto deben preparar una lista de verificación, una lista de los items de diseño requeridos para la transferencia. Esta lista de verificación debe presentarse como una tarea en una herramienta de administración de tareas. Cada vez que los diseñadores hacen un cambio, deben pasar por esta lista de verificación.
3 Preparar recursos de alta calidad
Independientemente del proyecto de diseño, la nomenclatura desempeña un papel vital en la organización de la estructura de un proyecto. Las nomenclaturas adecuadas ayudan a los desarrolladores a navegar a través de archivos y evitar tener duplicados.
Para cada equipo de diseño del proyecto, debe haber una forma estándar de nombrar archivos, etiquetar elementos y capas. Las nomenclaturas correctas reducen las preguntas y hacen que el proceso de transferencia sea mucho más predecible.
Consejo:
- Cuando se trata de nombrar archivos, no incluir ninguna nomenclatura de versiones en el nombre del archivo. El nombre de la pantalla debe describir simplemente su función. No debería ser «pantalla_de_busqueda_new_ver_24.png». Debería ser simplemente «busqueda.png»
Compartir el flujo, no una colección de pantallas independientes
Muchos diseñadores creen que es suficiente compartir simulacros estáticos con los desarrolladores. En realidad, sin ver una conexión entre pantallas, puede ser difícil entender la relación entre las pantallas.
Por eso es tan importante proporcionar diseño como un flujo: las pantallas esenciales deben estar conectadas entre sí. Este enfoque también es beneficioso para los diseñadores. Cuando los diseñadores preparan un flujo para el traspaso, les ayuda a revelar los pasos que faltan o los casos de borde.
4 Automatizar el proceso de transferencia utilizando herramientas especiales.
En los viejos tiempos, los diseñadores tenían dificultades para exportar todos los activos necesarios para los desarrolladores. Tienen que preparar manualmente un archivo con todos los activos necesarios y enviarlo a los desarrolladores. No solo tomaba mucho tiempo, sino también habia algunos detalles esenciales que podían olvidarse fácilmente. La situación empeoraba cuando el diseño requería una revisión y los diseñadores tenían que repetir todo el procedimiento nuevamente.
La situación ha cambiado recientemente. Es posible exportar el diseño directamente desde Sketch, Photoshop o Adobe XD y ver la especificación preparada automáticamente. Crear prototipos interactivos y animados. Facilita la colaboración en el diseño.
5 Diseño para casos avanzados.
Los diseñadores siempre diseñan el estado ideal de un producto: cuando un producto funciona de manera excelente y los usuarios no cometen ningún error. Rara vez ocurre en el archivo real. Pero es una situación bastante común cuando los desarrolladores crean estados vacíos y casos de error simplemente porque el equipo de diseño no pensó en ellos.
Para ofrecer un buen diseño, los diseñadores siempre deben tener estados vacíos y estados de error para las pantallas en sus listas de verificación. Diseñar para casos avanzados no solo facilita la vida de los desarrolladores, sino que también conduce a una mejor experiencia de usuario para los usuarios.
6 Describe los efectos animados complejos en detalles.
La animación funcional juega un papel vital en las experiencias digitales modernas. Cuando se usa correctamente, la animación puede describir la relación entre pantallas, notificar a un usuario sobre el estado actual de la experiencia o incluso deleitar a los usuarios con efectos visuales. Pero para que esto suceda, la animación debe estar correctamente diseñada e implementada.
Incluso cuando una animación está diseñada perfectamente en un prototipo, no garantiza que el mismo nivel de calidad esté en un producto final. ¿Por qué? Debido a que los diseñadores crean animaciones en una herramienta de diseño especial (como Adobe After Effects), los desarrolladores tendrán que codificarlo utilizando un conjunto de herramientas completamente diferente (como Apple XCode). Las herramientas de diseño proporcionan solo elementos visuales, y cuando los desarrolladores no tienen suficiente información sobre el efecto animado (por ejemplo, tipo de animación, tiempos, etc.), necesitan llegar a los diseñadores para obtener esta información o implementarla en función de su propia experiencia. .
Para facilitar la vida de los desarrolladores, los diseñadores responsables del efecto de animación deben describir el efecto en una especificación en detalles tan pronto como terminen el trabajo. La información que proporcionan ayudará a los desarrolladores a codificar las animaciones.
7 Programar una reunión para el traspaso.
Si se les pide a los diseñadores que imaginen un diseño ideal de entrega, lo más probable es que describan un caso cuando simplemente entreguen el diseño de «píxel perfecto» y los desarrolladores lo pongan en el código sin hacer ninguna pregunta. Desafortunadamente, eso rara vez sucede en la vida real. En la mayoría de los casos, los desarrolladores necesitarán alguna explicación. Es por eso que el traspaso de diseño es mucho más que enviar artefactos de diseño al equipo de desarrollo.
Después de que los desarrolladores reciban todos los artefactos requeridos, los diseñadores deben comunicarse con los desarrolladores para revisar los diseños. Los diseñadores deben programar una reunión con los desarrolladores. Una reunión será una excelente oportunidad para que los diseñadores describan detalles y aclaren algunas decisiones de diseño.