En buena compañía: cómo los minoristas utilizan Figma para elevar el comercio electrónico

Ya sea promoviendo economías circulares o coordinando distintos puntos de contacto digitales, el mundo del comercio electrónico se ha vuelto más sofisticado. Para generar confianza, facilitar una experiencia fluida al cliente y contar una historia de marca coherente, es imprescindible ofrecer una experiencia digital consistente y convincente.

Hablamos con equipos de marcas líderes para saber cómo están alcanzando estos objetivos y evolucionando sus procesos con Figma. Aquí compartimos cómo Nuuly gestiona la logística del alquiler de ropa, cómo Ruggable conecta sus puntos de contacto de comercio electrónico y marketing, y cómo Design Business Company trabajó en estrecha colaboración con GitHub para crear una tienda enfocada en desarrolladores.

Cómo Nuuly optimiza la experiencia de usuario de alquiler de ropa

Aunque algunas empresas han normalizado el alquiler de ropa para ocasiones especiales, otras más recientes como Nuuly, lanzada en 2019, tratan de convertirlo en algo habitual para el uso diario. "Nuuly celebra la idea del cambio", afirma Laura Petrini, directora de experiencia de usuario de Nuuly. "Ofrecemos a los clientes la posibilidad de cambiar su estilo para que puedan expresarse y ser creativos con su guardarropa".

Para cumplir esta promesa, Nuuly ha creado una experiencia de alquiler perfecta que los suscriptores han llegado a conocer y amar. Dado que los servicios de suscripción de ropa aún están en sus inicios, Nuuly también ha desarrollado gran parte de su propia tecnología para impulsar la otra cara del alquiler: la gestión circular del inventario, la limpieza y las reparaciones. Esto implicó crear dos sistemas de diseño desde cero: uno para los clientes y otro para la logística del alquiler, ambos con objetivos únicos y pensando en un negocio en crecimiento. "Configuramos nuestro sistema de diseño con tokens de color y tipografía que se pueden intercambiar fácilmente, dando a la marca espacio para crecer a medida que cambian las estaciones, al igual que damos a nuestros clientes espacio para flexibilizar su estilo”, afirma Laura.

Aunque la tecnología que sustenta la logística de los alquileres es compleja, el objetivo de Nuuly es hacer que resulte lo más simple posible para que los clientes se adapten a una nueva forma de comprar. "Simplificamos las experiencias al máximo, para que sean lo más intuitivas posible", afirma Laura. Por ejemplo, la función Mi Nuuly del sitio web representa la bolsa Nuuly del cliente y lo guía a través de más de 26 posibles estados de alquiler posibles, desde lo que ocurre en ese momento hasta lo que puede esperar a continuación.

La gestión y el escalado de los sistemas de diseño que hay detrás de toda esta complejidad llevaron al equipo a adoptar Figma en 2023. "Nuestros sistemas de diseño originales estaban fragmentados debido a las limitaciones del tamaño de los archivos y, como tenían que sincronizarse con nuestro servidor, el rendimiento era lento», explica Erica Benamy, diseñadora principal UX de Nuuly. "Terminamos administrando un total de 16 archivos. "Aprovechamos la migración a Figma como una oportunidad para consolidar y rediseñar en dos sencillas bibliotecas de Figma".

El uso de Figma ha acelerado considerablemente los flujos de trabajo. "Estamos diseñando a un ritmo mucho más rápido", afirma Erica. El uso de las herramientas de prototipado nativas de Figma también ha ayudado a los diseñadores a comunicar mejor los patrones de interacción esperados a los desarrolladores durante la entrega del diseño, afirma: "Nos ha hecho mucho más ágiles y nos ha permitido sentirnos realmente en sintonía unos con otros como organización".

La migración de la UX de Nuuly a Figma ha impulsado a otros departamentos a hacer lo mismo. Los equipos de diseño de contenido y fotografía de estudio ahora diseñan en Figma junto con el equipo de UX. Y con herramientas de colaboración como FigJam y Figma Slides, el resto de la empresa Nuuly también se ha sumado a la colaboración, la lluvia de ideas y la revisión de mejoras en la experiencia del cliente, como The Thrift Shop, que ofrece a los suscriptores acceso a estilos de venta final que no tienen que alquilar para comprar.

Para los clientes de Nuuly, esto significa mejoras e innovación más rápidas en su experiencia. Para el equipo de Nuuly, significa más tiempo dedicado a la colaboración, la exploración creativa y el tipo de pensamiento de diseño centrado en el cliente que ayuda a fomentar la relación que Nuuly tiene con sus suscriptores.

Cómo Ruggable asegura superficies digitales consistentes

Cuando la directora de Diseño de Producto UX Alicia Clapper se incorporó a Ruggable hace seis años, se encontró con varios flujos de trabajo paralelos y aislados. Esto provocó experiencias discordantes en sus plataformas digitales, desde anuncios en redes sociales, hasta la página de inicio y páginas de detalles de productos, y, por ende, un experiencia del cliente inconexa. Dado que los compradores de Ruggable suelen tardar 10 días o más en adquirir una alfombra después de navegar por la web, era fundamental crear consistencia entre todos estos puntos de contacto, especialmente en un entorno cada vez más competitivo.

"Históricamente, el equipo de UX y comercio electrónico había estado bastante separado del de marca y creatividad", afirma Alicia. Una campaña en redes sociales presentaba un conjunto de imágenes, mientras que el sitio web utilizaba otro. "Nunca teníamos mucha información sobre lo que hacían, y viceversa, hasta que las cosas se ponían en marcha".

Esto se debía, en parte, a que su trabajo se dispersaba en varias herramientas y luego se compartía manualmente en Google Drive. Sin una biblioteca de componentes centralizada, era difícil gestionar elementos como los colores, los estilos de fuente, los botones y los pies de página. "Simplemente copiábamos y pegábamos de una página a otra y los editábamos en función del proyecto y el contenido", explica Alicia. "Era un proceso muy manual y daba lugar a muchos errores de un proyecto a otro. No existía ningún control de versiones, por lo que teníamos que asegurarnos de copiar los archivos más recientes. No sé si yo calificaría esto como "gestionar" un sistema de diseño".

Hace cinco años, el equipo de UX se embarcó en una migración a Figma para armonizar todo. Ahora pueden diseñar, crear prototipos y probar nuevos diseños, todo en un solo lugar. Además, pasar del diseño al desarrollo es diez veces más rápido que antes gracias Dev Mode. En lugar de crear anotaciones manualmente, los diseñadores pueden marcar una casilla para preparar los archivos. “La sensación era: ‘Esto es perfecto. No necesitamos nada más'", afirma Alicia. Ahora, hay menos intercambios innecesarios entre diseñadores y desarrolladores, y queda claro qué versión de un diseño es la más actualizada.

Después de ser invitados a Figma como colaboradores, los equipos creativos, de marca, de retención y de adquisición de Ruggable también se unieron a la plataforma. "Pudimos involucrar al equipo creativo compartiendo fácilmente enlaces y permitiéndoles comentar cualquier detalle que consideraran más acorde con la marca", afirma Alicia. "La facilidad para actualizar e implementar nuestro sistema de diseño en Figma tras nuestro cambio de imagen de 2024 inspiró a otros equipos a querer utilizarlo. Esto fue un gran catalizador para una adopción más amplia". Ahora, Alicia también reúne a varios equipos en FigJam para llevar a cabo reuniones multifuncionales y sesiones de lluvias de ideas. "Uno de nuestros gerentes de producto incluso ha comentado lo divertidas, interesantes y productivas que son las reuniones", señala.

Este nuevo estándar de compromiso y colaboración ha sido esencial para crear una experiencia de cliente consistente, lo cual es clave para la construcción de la marca. "Hay una familiaridad que resuena con las personas", afirma Alicia. "Y realmente fortalece la confianza en la marca y les permite encontrar lo que buscan y realizar la compra".

Cómo GitHub y Design Business Company traen alegría a los desarrolladores

Como plataforma muy querida por los desarrolladores, GitHub vio la oportunidad de utilizar su tienda en línea para amplificar la marca y crear una comunidad. Para lograrlo, GitHub se asoció con el estudio creativo Design Business Company para crear una experiencia de compra destacada en Shopify que ofrece artículos coleccionables, ropa y productos de estilo de vida relacionados con la programación. El proyecto requería un nuevo sistema de diseño, productos de marca, fotografía de productos y embalaje, todo lo cual se completó en Figma. El rediseño no solo evitó que el equipo de GitHub tuviera que realizar actualizaciones manuales tediosas en la tienda, sino que también dejó espacio para la diversión en forma de "detalles ocultos" pensados para desarrolladores, que dicen mucho sobre la identidad de marca de GitHub.

Fundada por Stewart Scott-Curran, Judson Collier y Jordan Egstad, DBCo se integra en los equipos de sus clientes en cada proyecto, alejándose del enfoque en el que “la agencia siempre tiene la razón”, que durante mucho tiempo dominó la industria del diseño. En lugar de presentar ideas cada pocas semanas o meses, DBCo ofrece visibilidad sobre qué y cómo está diseñando para crear una conversación continua con sus clientes, que suelen ser startups en fase inicial e intermedia que esperan flujos de trabajo ágiles y muy adaptables. "Los clientes nos ayudan a corregir la dirección mucho más rápidamente", afirma Jordan. "Eso supone un enorme ahorro de tiempo". "Eso supone un enorme ahorro de tiempo".

Tan pronto como se inicia un proyecto, DBCo invita a los clientes a un mood board compartido de Figma donde todos pueden aportar ideas y dejar comentarios. "Esa es nuestra primera línea de defensa a la hora de recopilar feedback, debido al contexto y la granularidad que nos proporciona", afirma Judson. En el rediseño de la tienda participaron más de dos docenas de personas, entre las que se encontraban partes interesadas de los equipos de tienda, marca, diseño y web de GitHub, así como consultores de accesibilidad. Al plasmar todo en el archivo, estos colaboradores pudieron incorporarse fácilmente en cualquier momento y orientarse en el proyecto.

Tras la fase de lluvia de ideas, era hora de desarrollar el sistema de diseño. Para agilizar el proceso, DBCo parte de una base universal que creó, denominada sistema de diseño Construct, que se configura con variables de Figma. Como marco inicial, Construct logra “el equilibrio perfecto entre disponer de un sistema lo suficientemente completo como para resultar útil y tener demasiadas restricciones", afirma Jordan, quien explica que esto condensa un día y medio de trabajo en solo 30 minutos.

El prototipado también fue una parte fundamental del proceso, especialmente a la hora de dar vida a las páginas de productos. Estos diseños solían incluir ocho variantes (desde el tamaño hasta el color, pasando por la personalización) que requerían una UI condicional y "momentos frikis y peculiares de los desarrolladores", como describe Jordan. Por ejemplo, cuando alguien ingresa el código Konami, las imágenes del sitio se convierten en arte ASCII. "Los desarrolladores utilizan palabras y letras como herramientas, así que pensamos: 'Tenemos que encontrar una forma de animar y dar vida a estas palabras'", afirma. "Desarrollamos diferentes estudios de movimiento y los incorporamos a los prototipos para poder hacernos una idea real de cómo respondería la interfaz con diferentes transiciones, estados de desplazamiento de los botones, y cosas así. Ayudar a GitHub a visualizar los diseños y hacerlos tangibles fue realmente útil para tomar una decisión.

Al final, la posibilidad de colaborar tan estrechamente con varios equipos en el mismo archivo dio lugar a una experiencia minorista cohesionada, desde la navegación hasta la finalización de la compra y la entrega, para el público altamente exigente de GitHub. "Los desarrolladores son buenos detectores de tonterías", afirma Judson. "Teníamos el desafío de asegurarnos de ser fieles a la forma y al trabajo de los desarrolladores, porque, independientemente de lo que hiciéramos, queríamos hacerlo a un nivel muy alto".

Hoy en día, el comercio electrónico es mucho más que conseguir que un cliente haga clic en "agregar al carrito". A medida que el mercado crece, las experiencias digitales excepcionales en todas las etapas de la experiencia del cliente, desde el conocimiento de la marca hasta la compra real, cobrarán cada vez más importancia. Es fundamental crear un espacio para que los equipos puedan intercambiar ideas ambiciosas, crear rápidamente prototipos y mostrárselos a los clientes. Obtén más información sobre cómo los equipos utilizan Figma y ponte en contacto con nosotros para solicitar una demostración.