Caso e-commerce · Shopify Hydrogen
Caso D2C
confidencial
Tienda semianonimizada para una marca D2C con configurador, bundles y recorrido de compra más limpio. El objetivo no era “hacerla más bonita”, sino quitar fricción donde estaba perdiendo conversión.
Actualizado · 08 Abril 2026 · Capturas anonimizadas · Escrito por Berritu
Ficha rápida
Sector: D2C con catálogo configurable
Stack: Next.js, Shopify Hydrogen, Storefront API
Trabajo: arquitectura, UX, PDP, carrito y lógica bundle
Objetivo: mejorar claridad de compra sin depender de apps para lo esencial
Configurador, bundle y checkout sin peso muerto.
El proyecto pidió una experiencia muy concreta: producto configurable, combinación de variantes y recorrido directo a carrito sin la sensación de “tema parcheado”.
Panel lateral
Builder de producto
Paso 01
Selección de variante principal, material y tamaño sin recarga de página.
Paso 02
Bundle complementario sugerido según decisión previa y stock disponible.
Paso 03
Sticky CTA y resumen del pedido antes de pasar a carrito.
El problema
El producto pedía más que una plantilla. Había demasiadas decisiones concentradas en la ficha, una lógica bundle que no encajaba en un theme genérico y demasiada fricción antes del carrito.
La tienda necesitaba una arquitectura que aguantara personalización, rendimiento y una experiencia más limpia desde móvil sin acumular apps para resolver cada detalle.
Fricción detectada
Demasiadas decisiones sin jerarquía
La ficha concentraba variantes, extras y objeciones en el mismo plano visual.
Fricción detectada
Bundle resuelto con parche
La lógica dependía de apps y forzaba pantallas innecesarias antes de comprar.
Fricción detectada
Móvil por debajo del estándar
La experiencia principal ocurría en móvil, pero el flujo parecía una adaptación tardía.
Decisiones clave
01. Hydrogen para la capa crítica
Se optó por Hydrogen porque el configurador y el bundle necesitaban más control del que da un theme sin cargar deuda técnica desde el día uno.
02. PDP como recorrido, no como lista
La ficha se rehízo para ordenar decisiones, revelar contexto justo a tiempo y llegar al carrito con más seguridad.
03. Menos dependencias
El configurador se resolvió como componente propio para no meter una app pesada por cada regla de producto.
Producto principal
La jerarquía separa información comercial, selección y refuerzo de confianza.
Resumen de compra
Impacto
El valor del proyecto no estaba en “añadir features”, sino en hacer que el producto se entendiera mejor y que el camino al carrito exigiera menos esfuerzo cognitivo.
En este tipo de caso, la mejora se nota en claridad, velocidad y control técnico: menos dependencia, mejor base para CRO y más margen para seguir iterando sin que el theme marque el techo.
Impacto técnico
LCP 1.4s
Objetivo de lanzamiento con menos peso y control real del frontend.
Impacto técnico
CLS 0.02
Jerarquía estable y menos saltos en la experiencia móvil.
Impacto de producto
Bundle entendido antes
La oferta complementaria deja de sentirse como upsell arbitrario.
Impacto operativo
Más margen para iterar
Menos dependencia de apps para tocar lógica crítica del catálogo.
Dónde encaja este caso
Si tu tienda depende de apps para resolver el producto principal, si el bundle todavía se siente como un parche o si no sabes si te compensa Liquid o Hydrogen, este es el tipo de problema que resolvemos.