Una guía del diseñador para una transferencia de diseño exitosa.
Cuando comienza a trabajar para una empresa en la que tiene que trabajar con desarrolladores, debe aprender a comunicar con éxito su diseño a los desarrolladores para que puedan hacer realidad su idea.
Y para una mejor comunicación, creé esta guía, ya que trabajo con desarrolladores en un equipo que conozco, ese es el punto. Este artículo es breve y simple y comienza enseñándole los conceptos básicos de la transferencia de diseño.
Antes que nada, tienes que aprender algunos conceptos básicos para hacer la mejor transferencia de cosas, que son básicos pero nadie te enseña, esto es lo que tienes que aprender solo, trabajando en equipo. A continuación se presentan algunos de los mejores consejos que aprendí mientras trabajaba con mi equipo de desarrollo.
Desde el principio hasta el lanzamiento del producto, asegúrese de colaborar con los desarrolladores, tenerlos en sus equipos le brinda una visión y perspectiva sobre si el diseño es realmente fácil de codificar. También has visto muchos diseños hermosos en dribble que en realidad son imposibles de codificar.
Esto te ayudará a ser más simple y mejor, ya que el desarrollador ahora sabe un par de cosas sobre tu diseño y puede hacer la transferencia mejor.
El punto de vista de los desarrolladores importa, la programación es su trabajo, así que entiéndalos y sea empático. Póngase los pies en sus zapatos y descubra cómo se sienten codificando su diseño para que pueda crear algo que sea más fácil de codificar para ellos, se vea increíble y funcione mejor para el usuario.
Habla con los desarrolladores como si estuvieras hablando con una persona normal que no conoce términos de diseño como maquetas, estructuras alámbricas, personas, KPI, etc. Evita la jerga o las palabras profesionales, ya que pueden confundirlos.
Para realizar la transferencia de diseño, debe hacer algunas cosas como diseñador, por ejemplo, puede saber exactamente dónde está un archivo o un ícono dentro de su archivo, pero el desarrollador no lo sabe, tiene que buscar todo si su archivo está desordenado, por lo que ordenar facilita el proceso para el diseñador.
En el próximo artículo, voy a compartir algunas cosas que pueden ayudar a aliviar el estrés de los desarrolladores y ayudar a completar las transferencias de proyectos de manera eficiente.
Al crear un sistema de diseño que mantiene todo en orden, se vuelve mucho más fácil para un desarrollador comprender el sistema de diseño. Todos los íconos, colores y guía tipográfica están ahí, lo que hace que la comunicación del diseño sea fácil y directa.
Creación de una guía donde se enumeran todos los estilos de tipografía, peso, tamaño de fuente y familia de fuentes, lo que ayuda al desarrollador a aprender fácilmente sobre la tipografía del proyecto. Es parte del sistema de diseño, pero lo mencioné por separado porque es muy importante y la mayoría de los diseñadores lo subestiman.
Determinar todo el viaje del usuario de una pantalla a la siguiente es muy útil para que los desarrolladores ejecuten correctamente acciones, tareas y navegación. También una ventaja es la creación de un prototipo que muestra todo el flujo en acción.
Para hacer una transferencia de diseño perfecta, necesita saber que lo está haciendo para otra persona que no sabe nada acerca de cómo lo diseñó realmente, por qué usó ese estilo, etc. dividir el archivo en diferentes secciones y luego organizar el contenido en esas secciones.
Los componentes son una de las partes importantes al diseñar la interfaz de una aplicación/sitio web completo. Por lo tanto, es mejor crear un lugar para todos los componentes y mostrar este lugar/archivo al desarrollador para que pueda aprender más sobre cómo funcionan los componentes.
Esto es lo que hacen la mayoría de las grandes empresas, pero creo que puede ayudar mucho. Documentar temas como el sombreado, la paleta de colores, los componentes y las variantes ayuda al diseñador a comprender su punto de vista.
Zeplin es una gran herramienta que utilizan la mayoría de los desarrolladores, ya que les ayuda a descifrar un diseño en lo que necesitan. Por ejemplo, proporciona detalles como códigos hash de color, tamaños de margen, fuente, tamaño de fuente, etc. Analicemos algunos de ellos. los beneficios que un desarrollador puede obtener en el proceso de entrega del proyecto.
- Zeplin es fácil de usar, como desarrollador, pueden aprender a usar Zeplin y están listos para comenzar, no tienen que aprender todas las herramientas de diseño.
- Fragmento de código de Zeplin, cuando selecciona un elemento en Zeplin, proporcionará un código de acuerdo con su dispositivo, como Android. Proporciona un código XML que facilita a los desarrolladores el diseño de la interfaz de usuario.
- Con sus características, Zeplin simplifica toda la comunicación de diseño tanto para el desarrollador como para el diseñador. Puedes usar Zeplin con cualquier software, pero recomiendo usar Figma con Zeplin.
Uso Figma para todo mi trabajo de diseño y me encanta. Para usar Zepin con Figma, debe instalar el complemento Zeplin de la comunidad de Figma y luego podrá usarlo fácilmente. Así que este es un artículo breve, gracias por leer, estén atentos a otros artículos similares y estén atentos.
