Saltar al contenido

Trabajos / Sikana Tikis

CASO DE ESTUDIO · E-COMMERCE · DISEÑO + DESARROLLO

SIKANA TIKIS TIENDA ONLINE

Una tienda WooCommerce 100% personalizada: sin plantilla genérica, con cada pantalla pensada a medida de la marca. Tomé lo mejor de muchas tiendas online para que comprar sea más fácil para el cliente.

MI ROL
Diseño UX/UI, estrategia de conversión y desarrollo de plugins a medida
STACK
WordPress · WooCommerce · Blocksy
INTEGRACIONES
Correo Argentino · Andreani · Mercado Pago · Meta
SITIO EN VIVO
sikana.com.ar ↗
Home en compu y en celular

EL CONTEXTO

UNA MARCA HECHA A MANO, QUE VENDE EN TODO EL PAÍS.

Sikana es una marca argentina de vasos tiki de cerámica, hechos y pintados a mano. Vende online en todo el país a público minorista (regalos, coctelería, juntadas) y a mayoristas (bares y revendedores).

EL DESAFÍO

Sikana pasó de Tiendanube a WordPress + WooCommerce para tener más control. Pero lo estándar de WooCommerce no alcanzaba para su forma de vender:

  • Productos que se arman eligiendo tikis: boxes de regalo y packs con descuento
  • Stock compartido entre venta inmediata y producción a pedido
  • Envíos con Correo Argentino y Andreani, con retiro en sucursal
  • Descuento por transferencia y cuotas sin interés
  • Una tienda mayorista con precios por volumen

Además, comprar tenía que sentirse tan simple como en Tiendanube o mejor, sobre todo en el celular.

MI ROL

DISEÑO, ESTRATEGIA Y CÓDIGO.

  • Diseño UX/UI
  • Estrategia de conversión
  • Desarrollo de plugins a medida
  • Integraciones: envíos, medios de pago y Meta (píxel y API de conversiones)

STACK

  • WordPress
  • WooCommerce
  • Tema Blocksy
  • Checkout de bloques
  • Side Cart Premium
  • LiteSpeed Cache
  • WPCode
  • Rank Math
  • Meta for WooCommerce
  • Correo Argentino
  • Andreani
  • Mercado Pago

PROBLEMAS Y SOLUCIONES

SIETE MÓDULOS, UNA TIENDA HECHA A MEDIDA.

01PLUGIN A MEDIDA · SIKANA – CARRITO Y ENVÍOS

CARRITO LATERAL REDISEÑADO

EL PROBLEMA

El carrito lateral estándar era confuso: no dejaba calcular el envío, mezclaba textos en inglés y mostraba totales que no coincidían con lo elegido.

LO QUE HICE

  • Orden tipo Tiendanube: productos, calculadora de envío, subtotal y envío, sugeridos. Un total grande y fijo, con "Iniciar compra" como botón principal.
  • Calculadora de envío dentro del carrito: provincia y código postal, opciones agrupadas (a domicilio y retiro en sucursal) y elección de sucursal de Andreani o Correo Argentino sin salir del carrito. Arriba, una barra compacta de envío gratis.
  • Sugeridos que venden: un carrusel "También te pueden gustar" (sin packs ni boxes) y un aviso que recomienda el pack que más conviene.
  • Totales en los que se puede confiar: el precio por transferencia debajo del total, sin sumar un envío que todavía no se eligió y con el 10% de descuento que nunca se aplica dos veces.
Carrito lateral en celular, antes y después
AntesDespués
Calculadora de envío con opciones y sucursales
Aviso de pack en el carrito
02

CALCULADORA DE ENVÍOS EN LA FICHA DE PRODUCTO

EL PROBLEMA

El costo del envío es la duda que más frena la compra.

LO QUE HICE

  • La misma calculadora que en el carrito, con el mismo diseño, dentro de la ficha de cada producto.
  • Un "ver más / ver menos" mantiene corta la lista de opciones.
Ficha de producto con la calculadora
03PLUGIN A MEDIDA · SIKANA – MAYORISTA

TIENDA MAYORISTA

EL PROBLEMA

Vender por mayor sin duplicar productos ni stock, y sin mezclar los precios mayoristas con la tienda minorista.

LO QUE HICE

  • Una landing propia, /tienda-mayorista/, con grilla tipo catálogo (2 columnas en celular, 3 a 4 en compu) ordenada por más vendidos.
  • Tarjetas con bolitas de color y sin color preseleccionado: la foto cambia al elegir uno. Vista rápida con galería, descripción y atributos.
  • Precios por tramos según el total de unidades surtidas, con mínimo de 10 unidades y envío gratis desde 20.
  • Una barra fija muestra el total, el tramo alcanzado y cuántas unidades faltan para el siguiente.
  • Stock compartido, con producción a pedido si no hay, explicado desde el principio. El carrito bloquea la compra por debajo del mínimo y avisa a quien se va con productos cargados. Todo se edita desde WooCommerce → Mayorista.
10+15%unidades
15+18%unidades
20+20%unidades
30+22%unidades
50+25%unidades
Landing mayorista en celular y compu
Vista rápida de producto
Barra fija con tramos
04PLUGIN A MEDIDA · SIKANA – PÁGINA DE GRACIAS

PÁGINA DE GRACIAS

EL PROBLEMA

La página de "pedido recibido" de WooCommerce es una tabla fría. No le dice a la persona qué hacer después, algo clave cuando paga por transferencia.

LO QUE HICE

  • Un saludo con el nombre de quien compra y un estado claro: "Tu pedido está reservado" para transferencias, "Tu pago fue confirmado" para pagos aprobados con tarjeta o Mercado Pago, y un mensaje propio para los pendientes o rechazados.
  • Para transferencias: una tarjeta con monto, alias y CVU, cada uno con botón "Copiar", y "Enviar comprobante por WhatsApp" con el número de pedido ya escrito.
  • Datos de entrega (retiro en taller, sucursal con nombre y dirección, o domicilio), los pasos de "Cómo sigue tu pedido", datos del comprador, productos relacionados y botones de contacto.
  • Compatible con los procesos de Andreani, Correo Argentino y Meta que se disparan en esa página.
Página de gracias con transferencia, en celular
Página de gracias con pago confirmado
05PLUGIN A MEDIDA · SIKANA – TIENDA

FICHA DE PRODUCTO Y CATÁLOGO

EL PROBLEMA

Muchas mejoras sueltas vivían en snippets que se pisaban entre sí. Las unifiqué en un solo plugin ordenado por módulos.

LO QUE HICE

  • Ficha de producto: badge de capacidad (ej. 500 ml) leído de la descripción, precio por transferencia y cuotas, beneficios y un desplegable "Sobre este tiki".
  • Mensajes de stock unificados: "En stock · despacho 24/48 hs" o "A pedido · aprox. 10 días hábiles", que cambian según el color elegido.
  • Badges automáticos: "Más elegido" (top 6 en ventas), "Nuevo ingreso" (últimos 60 días) y "Últimas unidades" (1 a 2 en stock).
  • Galería mobile con swipe, flechas propias, contador 1/X y miniaturas. Tarjetas de catálogo con swatches de color (máximo 4 + "+N") y galería deslizable.
  • Venta cruzada en la ficha: "¿Llevás más de uno?" (packs) y "¿Es para regalar?" (boxes), para quien entra directo a un tiki y nunca vería los packs.
Ficha de producto completa en celular
Catálogo con swatches y badges
06

BOXES Y PACKS ARMABLES

EL PROBLEMA

Los boxes de regalo y los packs con descuento son productos que se arman eligiendo tikis, algo que el WooCommerce estándar no hace.

LO QUE HICE

  • La persona elige exactamente 1, 2 o 3 tikis para un box de regalo, o de 2 a 10 para un pack con descuento, incluido el color.
  • El precio se calcula en vivo según lo elegido.
  • El stock de cada tiki se descuenta por separado en el pedido.
Selector de box / pack
07

MEDICIÓN Y DATOS (META)

EL PROBLEMA

Los packs y los boxes no mandaban "Agregar al carrito" a Meta, y los eventos por servidor salían con valor $0.

LO QUE HICE

  • El evento ahora se dispara en el navegador y por servidor con el valor real de la combinación.
  • Los dos llevan el mismo ID de evento, así Meta los cuenta una sola vez.
  • También encontré por qué no aparecía el evento "Compra": el plugin de Meta ignora las compras hechas por administradores.

POR DENTRO

LOS DETALLES QUE LO MANTIENEN CONFIABLE.

SEGURIDAD DEL CARRITO QUE SE RENUEVA SOLA

Las claves de seguridad se renuevan automáticamente aunque la página esté en caché, y hay protección contra bucles de actualización.

ENVÍO COTIZADO COMO UN SOLO BULTO

Al generar la etiqueta, el envío de cada Box se calcula como un solo bulto, igual que en el checkout. Antes el correo cotizaba de más.

MIGRACIÓN SIN DUPLICADOS

Cada módulo se pausa solo mientras siga activo el snippet viejo que reemplaza, así nunca se duplica nada.

DE SNIPPETS SUELTOS A PLUGINS

19 snippets sueltos pasaron a plugins ordenados por área, con versiones y un historial de cambios.

DECISIONES DE DISEÑO

CINCO REGLAS DETRÁS DE CADA PANTALLA.

01

MOBILE FIRST

Cada módulo se diseñó primero para el celular, porque ahí es donde comprar tiene que sentirse más simple.

02

JERARQUÍA CLARA

Un solo botón principal por pantalla y acciones secundarias con contorno.

03

PRECIOS TRANSPARENTES

El envío, el precio por transferencia y las cuotas siempre son visibles y coherentes entre ficha, carrito, checkout y página de gracias.

04

MENSAJES HONESTOS

Los tiempos de fabricación a pedido se aclaran desde el principio, y los packs dicen que incluyen una bolsita por pack, no por tiki.

05

ORDEN TÉCNICO

De 19 snippets sueltos a plugins por área, con versiones y un historial de cambios.

¿QUERÉS UNA TIENDA HECHA 100% A TU MANERA?