LaRaza
Diseñando una experiencia Shopify de alta conversión para una marca de streetwear.
- Rol
- Diseñadora de producto de principio a fin
- Alcance
- Estrategia visual y branding, UX/UI, UX writing, CSS de front-end
- Plataforma
- Shopify
- Lanzamiento
- 25 de agosto
Resumen
El proyecto
Lanzamiento de la plataforma de e-commerce de la marca de streetwear La Raza, construida desde cero en Shopify.
El desafío
Traducir la poderosa identidad de la marca en una experiencia digital visualmente impactante, diseñando al mismo tiempo un flujo de compra optimizado para la conversión, sobre todo en dispositivos móviles.
Impacto clave
La tienda atrajo 979 sesiones y generó sus primeros pedidos en sus primeros 9 días. La estrategia mobile-first se validó: el 56% de todas las sesiones vino de dispositivos móviles.
El contexto y el desafío de negocio
La Raza es una marca de streetwear consolidada, con una estética urbana distintiva. Con una fuerte presencia offline, necesitaba un buque insignia digital: una tienda e-commerce que no solo fuera su principal canal de ventas, sino también un espacio poderoso para contar su historia y construir comunidad.
1. Traducir la marca
¿Cómo trasladar la energía cruda y auténtica de la marca a una interfaz digital limpia y funcional sin perder su carácter?
2. Diseño enfocado en la conversión
¿Cómo construir un recorrido de compra sin fricción que anime a los visitantes a convertirse en clientes fieles, sobre todo en los dispositivos móviles que usan a diario?
Mi proceso: de la estrategia a la realidad
Para abordar este desafío, dividí el proyecto en fases clave, asegurando que cada decisión de diseño partiera de los objetivos de negocio y las necesidades de los usuarios.
A. Definir la identidad visual digital
El primer paso fue construir un sistema visual coherente y escalable, fiel a las raíces urbanas de la marca. Esto implicó afinar el logo para el uso digital y establecer una guía de marca clara para colores y tipografía.
B. Construir una experiencia de compra sin fricción
La simplicidad fue mi norte. Mapeé el recorrido ideal del usuario, desde el descubrimiento del producto en redes sociales hasta una compra exitosa, y optimicé el flujo para reducir los clics. Simplifiqué la navegación para que sea fácil explorar colecciones o encontrar artículos específicos. Las páginas de producto muestran de entrada la información esencial para decidir la compra con rapidez y confianza.
C. Del diseño al código
Un diseño en Figma es una promesa, y me aseguré de cumplirla. Para lograr un resultado pixel-perfect, entré directamente al código del tema de Shopify e hice ajustes finos de CSS en espaciado, alineación y comportamiento responsive que el editor del tema por sí solo no permitía, de modo que el sitio publicado coincide con el diseño.
Los resultados: impacto medible desde el primer día
Lanzamiento exitoso
En los primeros 9 días tras el lanzamiento (del 25 de agosto al 3 de septiembre), la tienda atrajo 979 sesiones y procesó sus primeros 2 pedidos, demostrando desde el inicio la viabilidad del canal de ventas.
Estrategia mobile-first validada
Las analíticas de tráfico confirmaron la hipótesis central de que el público de la marca es nativo móvil: el 56% de todas las sesiones ocurrió en dispositivos móviles.
Rendimiento técnico
El sitio obtuvo una puntuación de rendimiento “Buena” (16 ms de INP), así que las interacciones se sienten instantáneas y fluidas.
Aprendizajes clave
Este proyecto reforzó la importancia de un enfoque de diseño integral. Poder salir del archivo de diseño, ajustando código de front-end y analizando datos posteriores al lanzamiento, fue clave para entregar un producto final que no solo se ve bien, sino que funciona como un activo de negocio.