Cómo ASOS optimiza los flujos de trabajo de diseño con Figma

La tienda de moda y cosméticos ASOS se ha convertido en el destino favorito de los veinteañeros de todo el mundo. Y no es de extrañar. Los consumidores pueden elegir entre una amplia selección de 900 marcas, incluidas las propias de ASOS, que incluyen ASOS Design, Topshop, Topman y Collusion.

ASOS también es conocida por su experiencia de cliente divertida y sin complicaciones, con devoluciones fáciles y una experiencia coherente de principio a fin en todos los dispositivos, sitios web de escritorio y móviles, y apps para Android e iOS.

Además, ASOS opera en 10 idiomas y más de 200 mercados, admite métodos de pago globales y ofrece a los usuarios una experiencia localizada.

Como te puedes imaginar, el diseño juega un papel muy importante en todo lo que hace ASOS, lo que lo llevó a Figma. Al hacerlo, ASOS optimizó su sistema de diseño, redujo costos, obtuvo herramientas y procesos sofisticados y logró una mayor colaboración en toda la empresa.

Oportunidades únicas de mercado en la moda en línea

El sector del comercio electrónico de moda creció rápidamente durante la pandemia y sigue madurando gracias a los avances globales en tecnología y logística.

A los consumidores les encanta la comodidad y la rapidez del comercio electrónico, con sus precios competitivos, sus ofertas en línea y sus experiencias de compra personalizadas y multicanal. También utilizan las redes sociales para promocionar marcas e influirse mutuamente, lo que puede hacer que los productos se vuelvan virales.

Kate Brook-Hart, directora de Diseño de Productos de ASOS, afirma que, por lo tanto, es fundamental analizar el ciclo de vida del producto digital antes, durante y después de la experiencia de compra. Por eso, su equipo se asegura de que estos puntos de contacto se reflejen a lo largo de los procesos de descubrimiento y diseño. Para ello, es esencial contar con un sistema de diseño sólido.

Un equipo de diseño altamente conectado

El equipo de diseño de productos de ASOS está compuesto por más de una docena de diseñadores de todos los niveles, incluyendo asociados, intermedios, sénior y jefes.

• Los diseñadores de productos forman parte del equipo de productos digitales, que colabora estrechamente con más de 25 gerentes de productos, con el apoyo de dos gerentes de operaciones de productos.
• Cada diseñador trabaja en un área de producto específica, como Adquisición y Compromiso, Compras, Pagos, Finalización de la compra, Posventa, así como en equipos con misiones específicas, como Rostro + Cuerpo, Ropa deportiva o Estudiantes.
• Trabajan en estrecha colaboración con ingenieros, arquitectos e ingenieros de control de calidad de diversos equipos de la plataforma para idear, crear, probar, experimentar y lanzar nuevas funciones.

También forman parte del equipo Jack Marsden, diseñador jefe de productos en el área de productos de Checkout, y Sean Conlon, diseñador de productos que también trabaja en Checkout.

Desde que se unió a ASOS en abril de 2022, Sean se ha especializado en el diseño integral, desde la investigación hasta la creación de diseños de alta fidelidad. Afirma: “Lo que me motiva es el impacto que puedes tener en ASOS como diseñador. Tus diseños serán utilizados por millones de personas en todo el mundo y pueden tener un impacto significativo en el rendimiento del negocio. ¡Eso es realmente gratificante!”

El equipo de Kate también cuenta con una especialista en accesibilidad, Tzveta Dinova, que se enorgullece de promover la diversidad y la inclusión, tanto a nivel interno como externo. “Queremos asegurarnos de que todas las nuevas funciones sean inclusivas para todos los clientes, por lo que dedicamos mucho tiempo a escuchar a los usuarios y creamos una documentación de diseño exhaustiva sobre la accesibilidad en cada proyecto”, afirma Tzveta.

Una de las características únicas de ASOS es la estrecha colaboración entre los diseñadores de productos, los gerentes de productos y una amplia gama de partes interesadas de toda la empresa en tres equipos principales: Tecnología y Datos, Comercial y Clientes, o Personal y Operaciones.

Consolidación de tres herramientas en Figma

Antes de embarcarse en su aventura con Figma, ASOS utilizaba tres herramientas principales: una para el diseño, otra para la gestión de archivos y la colaboración, y otra para la creación de prototipos. Esta configuración presentaba una serie de inconvenientes tanto para los desarrolladores como para sus colaboradores.

Esto significaba que necesitaban utilizar tres herramientas para el diseño, la creación de prototipos y la entrega al desarrollador. Además, cambiar entre las diferentes variantes de los componentes resultaba complicado, ya que era necesario guardar y cerrar, lo que ralentizaba el proceso de ideación y diseño y lo hacía ineficiente. “Incorporar componentes del sistema de diseño, tener que llevar a cabo cambios sobre la marcha o simplemente abrir un archivo se sentía un poco como correr por el lodo”, explica Jack.

También tuvieron que crear colecciones separadas de enlaces y archivos para obtener feedback de las partes interesadas y para que los ingenieros pudieran acceder a los diseños. Y, por último, el proceso que utilizaban para acceder y actualizar los archivos era lento, ya que los diseñadores tenían que crear ramas y realizar confirmaciones. Los diseños no se actualizaban en tiempo real y el acceso remoto no era una opción.

Incorporación y funcionamiento con Figma

El cambio a Figma fue un paso esencial que los diseñadores de productos de todos los niveles solicitaron e impulsaron.

Kate recuerda: «La primera vez que utilicé Figma fue durante la pandemia. No habíamos probado la herramienta antes, pero era un momento de “ahora o nunca”, ya que todos trabajábamos desde casa y no podíamos beneficiarnos de la interacción cara a cara. Pensé: “Permite la colaboración en tiempo real. Probémoslo”. En dos días, ya me había familiarizado completamente con Figma».

Figma resolvió un problema único para los diseñadores de ASOS. Había tantos equipos colaborando e involucrados en el desarrollo de productos digitales, incluyendo comerciales, estudios y merchandising, que compartir archivos era un gran problema. Figma les permitió compartir enlaces que permanecieron igual, incluso si el archivo se movía. Esto supuso un gran cambio.

Actualmente, los diseñadores de productos son los editores principales en Figma, pero es fácil para otras personas de la empresa ver los archivos y colaborar, gracias al acceso seguro con inicio de sesión único a Figma.

Entre estos usuarios se incluyen los equipos de ingeniería, producto, marketing, marca, comercio y ventas, pero también personas de los equipos de recursos humanos, finanzas, auditoría, logística y entregas. En Figma, pueden colaborar simultáneamente con el equipo de producto, lo que ahorra tiempo, dinero y esfuerzo.

Ahora, Figma desempeña un papel fundamental en todo tipo de proyectos digitales relacionados con la experiencia del cliente, así como en experiencias internas, como el software interno que utiliza el equipo de Studios para crear recursos in situ.

Cinco formas en las que Figma mejoró la vida de ASOS

1. Velocidad del diseño

• Antes de Figma, el uso de múltiples herramientas hacía que los procesos de diseño no fueran fluidos. Todo se almacenaba localmente y luego se transfería a una plataforma para compartir archivos.
• Figma agiliza el diseño, ya que está basado en la nube, es rápido y ofrece la posibilidad de añadir y eliminar elementos del diseño con funciones como la disposición automática.

2. Prototipado

• Antes de Figma, la creación de prototipos requería una herramienta independiente para crear prototipos realistas y compartir enlaces para las pruebas de los usuarios.
• Figma puede crear prototipos con fidelidad y permite actualizaciones sobre la marcha, lo que ahorra tiempo y dinero en la fase de pruebas de los usuarios.

3. Colaboración

• Anteriormente, los archivos de diseño se compartían por correo electrónico y el feedback requería varios pasos.
• Figma permitió compartir un único enlace para facilitar la colaboración y el feedback directo, transformando las críticas y la coherencia del diseño y permitiendo a las partes interesadas de la empresa dejar feedback directo fácilmente.

4. Sistema de diseño

• Antes de Figma, el sistema de diseño de ASOS estaba fragmentado.
• Con Figma, los diseñadores que trabajan en el sistema de diseño lo encuentran fácil de usar y mantener, y pueden implementar componentes de la biblioteca en sus diseños.

5. Presentaciones

• Antes de Figma, presentar prototipos no siempre era sencillo.
• Las capacidades de creación de prototipados de Figma permiten a los diseñadores presentar prototipos en contexto, dando vida a sus presentaciones.

Figma ofrece resultados tangibles para ASOS

Figma ha permitido a ASOS consolidar tres herramientas en una sola. Esto ha optimizado el flujo de trabajo de diseño, ha ahorrado muchas horas de trabajo al equipo y ha supuesto un ahorro de costos para la empresa.

Figma también ha aumentado la colaboración entre diseñadores, gerentes de producto e ingenieros, ha otorgado a ASOS la oportunidad de actualizar y mejorar su sistema de diseño, y lo ha mantenido al día con las últimas herramientas de diseño, lo que atrae nuevos talentos.

En general, afirma Kate, Figma ha facilitado enormemente la colaboración, la productividad y las presentaciones entre los diseñadores y entre las partes interesadas de toda la empresa. “Esto ha dado lugar a diseños finales de mayor calidad, lo que también facilita mucho el traspaso a los desarrolladores y acerca a los desarrolladores y diseñadores de toda la empresa”.