Ir al contenido
Todos los recursos
E-commerceComenta LOVABLE

Tu E-commerce con Lovable + Shopify en 2 horas

Paso a paso para construir una tienda online con Claude, Lovable y Shopify, usando el flujo real de ElectriClick.

14 de mayo de 202614 min
E-commerce14 min

Comenta LOVABLE

E-commerce en 2 horas

SHOPHazlo Tuyo IAGratis

Tipo: Lead magnet, guia paso a paso

Trigger: Comentario "LOVABLE" en el reel del Dia 4

Audiencia: Emprendedores latinos que quieren vender en linea


Tu E-commerce con Lovable + Shopify en 2 horas

*El paso a paso real que usamos para armar la tienda de nuestro primer cliente, sin developer, sin plantillas genericas, sin saber programar.*

Por: Mel & Erik, Hazlo Tuyo IA

Cliente del caso: ElectriClick

Stack: Claude + Lovable + Shopify


Antes de empezar

Hace tres semanas no sabiamos si ibamos a conseguir nuestro primer cliente de consultoria.

Hace una semana firmamos a ElectriClick.

Ayer subimos su tienda en linea, electriclick.mx, en menos de dos horas. Sin developer. Sin plantillas genericas de Shopify. Sin saber escribir codigo.

Y este es exactamente el paso a paso que usamos.

No es teoria. No es "10 herramientas de IA que tienes que probar". Es lo que funciono para un cliente real, con una marca real, vendiendo productos reales.

Vamos.


El resumen, rapido

Stack:

  • Claude: el cerebro, con un skill experto en Lovable.
  • Lovable: las manos, construye el sitio.
  • Shopify: la trastienda, pagos, envios, productos.

Datos clave:

  • Tiempo: ~2 horas, sin contar subir productos.
  • Costo: $1 USD por los primeros 3 meses.
  • Requiere: cuenta en Claude + cuenta en Lovable.
  • Dominio aparte: ~$15 USD al ano.

El flujo:

javascript
Brandbook → Skill Claude → Prompt → Lovable → Shopify → Dominio → A vender

Lo que necesitas tener listo

  • Cuenta en Claude: claude.ai, plan Pro recomendado.
  • Cuenta en Lovable: lovable.dev, el plan free alcanza para empezar.
  • Tu brandbook: si ya tienes uno, perfecto. Si no, primero arma el tuyo con Marko.
  • Tu dominio: opcional al inicio, obligatorio al final.

El skill de Claude que usamos te lo mandamos junto con esta guia. Buscalo en el archivo adjunto.

lovable-prompt-master.skill

Adjunto original de Notion. Falta subir el archivo publico al sitio.


Paso 1, habla con Claude primero, no con Lovable

Tiempo: 10-15 min

Tool: Claude con skill incluido

Output: Un prompt afinado para Lovable

Esto es lo que cambia todo. La gente abre Lovable, escribe "hazme una tienda de zapatos" y se queja de que le quedo generico.

Claro que les quedo generico. Le hablaron a Lovable como si fuera un mago, no un developer.

Lo que hacemos diferente:

  1. Abrimos el skill de Claude que te pasamos.
  2. Le pegamos el brandbook completo del cliente.
  3. Claude te hace preguntas que probablemente no habias pensado:
  • Que productos vendes y como se categorizan.
  • Cual es la sensacion que quieres transmitir al entrar.
  • Que tipo de cliente entra a la tienda.
  • Si quieres una experiencia tipo Apple, Nike o marketplace.
  1. Cuando termina, te entrega el prompt exacto para pegar en Lovable.

Por que importa: el prompt que te genera Claude es 10x mas preciso que cualquier cosa que escribas directo. Le da a Lovable contexto de marca, audiencia, estilo visual y arquitectura.

Tip de Mel: No te saltes las preguntas de Claude por flojera. Cada pregunta que respondes mal te cuesta 30 minutos extra de iteracion despues en Lovable.


Paso 2, pega el prompt en Lovable

Tiempo: 5-10 min

Tool: Lovable

Output: Primera version navegable

  1. Entra a lovable.dev y abre un proyecto nuevo.
  2. Pega el prompt que te dio Claude, sin tocarle nada.
  3. Cuando Lovable te pregunte si quieres integrar Shopify, dile que si.
  4. No necesitas cuenta de Shopify todavia. Lovable abre una tienda en modo prueba dentro de tu cuenta.

Mientras Lovable trabaja, ve por un cafe. En 5-10 minutos vas a tener la primera version navegable de tu tienda.


Paso 3, itera en el chat hasta que quede como quieres

Tiempo: 45-90 min

Tool: Lovable, chat lateral

Output: Tu tienda lista para vender

Desde el chat de Lovable, le vas pidiendo cambios uno por uno.

Lo que vas a ajustar normalmente:

  • Hero section: primer impacto al entrar.
  • Banners: promociones, anuncios, destacados.
  • Grid de productos: como se ven los productos en lista.
  • Productos destacados: best sellers, lanzamientos.
  • Categorias: navegacion clara, mas conversion.
  • Politicas y contacto: envios, devoluciones, contacto.

Para los productos: dos caminos

Camino A, si ya tienes fotos y descripciones: Lovable te ayuda a subirlos y crearlos.

Camino B, si todavia no tienes producto fisico o foto: pide productos ficticios para visualizar el layout.

Tip de los dos: No te obsesiones con la perfeccion. Lo importante es que este funcional y que la marca se sienta.


Paso 4, activa Shopify cuando ya estes listo para vender

Tiempo: 10 min

Tool: Lovable + Shopify

Output: Tu tienda en modo productivo

Cuando ya te late como quedo y estas listo para vender:

  1. Le dices a Lovable: "activala", "claim store" o "quiero salir a vender".
  2. Te abre una pestana para crear tu cuenta de Shopify.
  3. Eliges plan, Basic o Grow alcanza para arrancar.
  4. Lovable se encarga de pasar productos, diseno y configuracion.

Promo que nadie te cuenta: Si entras a Shopify por primera vez desde Lovable, los primeros 3 meses te cuestan $1 USD por mes. Aplica a planes Basic, Grow o Advanced.


Paso 5, conecta tu dominio

Tiempo: 15 min

Tool: Lovable, GoDaddy o Hostinger

Output: Tu tienda con dominio propio

Opcion A, compra el dominio dentro de Lovable

Lo mas facil. Buscas el dominio, lo compras ahi y se integra solo.

Opcion B, si ya tienes dominio o prefieres comprar por fuera

GoDaddy, Hostinger o cualquier registrador funciona. Tienes que apuntar los DNS a Lovable.

  • Comprar en Lovable: cero configuracion.
  • Comprar afuera: unos 5 minutos configurando DNS.

Checklist final antes de salir a vender

  • La tienda se ve bien en celular.
  • El proceso de compra completo funciona.
  • Las paqueterias estan conectadas, si vendes fisico.
  • Las politicas estan escritas.
  • Los emails de Shopify estan personalizados.
  • El dominio apunta correcto.
  • Tienes un canal para responder dudas.

Te trabaste en algun paso

La primera vez que armamos un e-commerce asi nos tardamos 8 horas. La segunda vez 4. La tercera, 2.

La curva existe.

Tres opciones para acelerarla:

  1. Escribenos en los comentarios o en los DM.
  2. Comparte tu proceso. Si lo armas siguiendo esta guia, mandanos el link de tu tienda.
  3. Unete a la comunidad. Estamos armando un grupo de consultores de IA latinos donde compartimos prompts, skills, casos de cliente y baches.

Hazlo Tuyo IA, Mel & Erik

*Hazlo tuyo... con IA.*