Guía para crear sin saber programar

Le hablas a Lovable como a un amigo, y te arma tu página.

Le escribes lo que quieres con tus propias palabras, y la inteligencia artificial te construye la web (o la app), le pone el diseño y la deja lista en internet. Aquí te enseño todo, paso a paso y con dibujos.

00 / La idea en un dibujo

Tú escribes. Ella construye.

Así de simple. No tocas código, no instalas nada. Le cuentas qué quieres en una cajita de chat y, en segundos, aparece tu página al lado, viva y funcionando.

🔒 lovable.dev/projects/cafe-de-la-esquina
Tu chat con la IA
Hazme una página para mi cafetería "Café de la Esquina", con un botón para pedir por WhatsApp.
Listo. Creé tu página con el menú, fotos y el botón de WhatsApp. Mírala a la derecha 👉
Escribe otro cambio…
El mejor café
de tu barrio
Recién molido, todos los días. Pídelo y pásalo a recoger.
Pedir por WhatsApp
1Aquí escribes lo que quieres, como un mensaje de WhatsApp.
2Aquí aparece tu página al instante. Cada cambio que pidas se ve aquí al toque.
i

A esto se le llama vibe coding?Vibe coding = crear apps describiéndolas con palabras normales, sin escribir código. Tú dices la idea, la IA pone la parte técnica.: tú pones la idea y el "buen gusto", la máquina pone lo difícil.

01 / Las formas de empezar

Tienes 4 maneras de arrancar

Elige la que más te acomode según lo que ya tengas a la mano.

A · Escribiendo

Cuéntale tu idea

Escribes qué quieres y listo. La forma más rápida y la más usada.

B · Diseño

Desde Figma

¿Ya tienes un diseño en Figma?Figma es un programa donde los diseñadores dibujan cómo se verá una página antes de construirla.? Pegas el enlace y lo convierte en página real.

C · Foto

Desde una imagen

Subes una captura o foto de algo que te gustó y le dices "hazme algo así".

D · Plantilla

Desde un molde listo

Partes de un ejemplo ya armado (tienda, blog, portafolio) y lo cambias a tu gusto.

02 / La pantalla por dentro

Dos cosas que debes conocer

Antes de seguir, mira estos dos botones mágicos. Te van a ahorrar tiempo (y dinero, porque cada mensaje a la IA cuesta un poquito).

Truco 1 · Editar tocando, sin pedirle nada a la IA
Modo edición visual
El mejor café
de tu barrio
Toca un texto y cámbialo desde el panel →
TextoEl mejor café…
Tamaño28 px
ColorVerde
Negrita

Esto se llama Visual Edits. Cambias textos, colores y tamaños tocando directo en la pantalla. Y lo mejor: es gratis hasta 100 cambios al día. Úsalo para los detalles, así no gastas tus créditos.

Truco 2 · Los 3 modos de conversación
Modo Agente

El que construye

Es el que de verdad arma y cambia tu página. Piensa solo, revisa y corrige. Este es el que usas casi siempre.

Modo Chat

El que aconseja

Pregúntale dudas o pídele ideas sin que toque nada de tu página. Como un amigo que te orienta.

Modo Plan

El que avisa antes

Primero te dice "voy a hacer esto, esto y esto". Tú apruebas y recién construye. Cero sustos.

03 / Cómo pedir bien

El secreto: pide de a poquito

El error más común es pedir TODA la página de un golpe. La IA se confunde. ¿La forma correcta? Pídele una parte a la vez. Mira la diferencia.

✕ Así NO
Hazme una tienda online completa con login, pagos, blog, carrito y panel de administrador.

→ Demasiado de golpe. Sale algo genérico y con errores.

✓ Así SÍ
Por ahora solo la sección de precios para "Bodega del Norte". 3 planes en tarjetas: Básico (S/ 49), Pro (S/ 89, el destacado) y Empresa. Cada uno con su lista de beneficios y un botón.

→ Una parte clara y con datos reales. Sale justo lo que querías.

3 reglas de oro para tus mensajes

1

Da contexto primero

Dile para quién es, de qué trata y qué quieres que la gente haga ahí (comprar, reservar, escribirte). Mientras más le cuentas, mejor te entiende.

2

Pieza por pieza

Primero el encabezado. Luego los precios. Luego el formulario. Una cosa a la vez, como armar con bloques de Lego.

3

Cierra pidiéndole que pregunte

Termina con "si te falta algún dato, pregúntame antes de construir". Así no inventa cosas raras.

i

Lovable guarda un contexto fijo?El "Knowledge" es una notita que la IA lee siempre. Ahí pones tu marca, tus colores y de qué trata tu negocio, para no repetirlo en cada mensaje. de tu proyecto. Pon ahí tu marca y tu estilo una sola vez, y no tendrás que repetirlo nunca más.

04 / Ponerla en internet

Publicar es un solo botón

Cuando tu página esté lista, le das a Publish y queda en internet con su propia dirección. Así de fácil.

🔒 cafe-de-la-esquina.lovable.app
Publish ↑
Tu página ya está viva en
cafe-de-la-esquina.lovable.app
OJO

Cada vez que hagas un cambio nuevo, vuelve a darle Publish para que se vea en internet. Lo que ves mientras editas y lo que ve el público son dos cosas separadas: el cambio no sale solo hasta que lo publicas.

05 / Tu dominio propio

Pon tu dirección bonita

¿Compraste tu dominio?Un dominio es la dirección de tu web, como tunegocio.com. Se compra una vez al año en sitios como GoDaddy o Namecheap. en otro lado (GoDaddy, Namecheap, etc.)? Puedes conectarlo a tu página de Lovable. Necesitas un plan pago.

Ajustes → Dominios → Conectar
Escribe tu dominio:
cafedelaesquina.com
Conectar
Opción fácil · Automático

Un clic y listo

Lovable reconoce dónde compraste tu dominio, inicias sesión ahí y se conecta solo. No tocas nada raro. Es lo recomendado.

Opción manual

Copiar y pegar 3 datos

Si tu proveedor no sale en la lista, Lovable te da 3 códigos y los pegas en la web donde compraste el dominio. Mira abajo qué son.

Los 3 datos que vas a pegar (si vas en manual)
A
Es el que dice "esta dirección apunta a la página de Lovable".
TXT
Es la prueba de que el dominio es tuyo. Solo confirma que eres el dueño.
CNAME
El que conecta la versión con "www" delante de tu dominio.
i

Esos códigos van en el DNS?El DNS es como la guía telefónica de internet: dice qué dirección (tunegocio.com) lleva a qué página. Lo configuras donde compraste el dominio. de tu dominio. Tras pegarlos, puede tardar unas horas (hasta 72) en activarse, y el candado de seguridad se pone solo. Paciencia, es normal.

06 / Login, datos y conexiones

Que tu página haga cosas de verdad

Aquí está lo potente: le pides "ponle login" o "guarda los pedidos" y Lovable arma toda la parte de atrás por ti. Tú solo lo describes.

Agrégale un login para que mis clientes entren con su correo.
Hecho. Tu página ahora tiene registro e inicio de sesión seguro. Lo conecté a tu base de datos?La base de datos es donde se guarda la info de tu app: usuarios, pedidos, mensajes. Como un cuaderno digital ordenado..
Tu página · pantalla de acceso
Iniciar sesión
tu@correo.com
••••••••
Entrar
Guardar info

Base de datos

Pedidos, usuarios, reservas. Todo se guarda y queda ordenado, sin que tú toques nada técnico.

Cobrar

Pagos con tarjeta

Conecta Stripe?Stripe es el servicio más usado para cobrar con tarjeta por internet de forma segura. y empieza a recibir pagos en tu propia página.

Más conexiones

Correos, mapas, IA

Enviar correos, poner un mapa, agregar un chatbot. Se conectan pidiéndolo nomás.

i

Toda esta parte de atrás (la base de datos?El lugar donde vive la información de tu app. Lovable la maneja por ti, no tienes que aprender nada de servidores. y el login) se llama el backend?Backend = la "cocina" de tu app, lo que el cliente no ve pero hace que todo funcione: guardar datos, logins, pagos.. Lovable lo arma solo con Lovable Cloud, sin que aprendas nada de servidores.

07 / Lo más nuevo

Lovable mejora cada mes

Estas son las novedades que más te van a servir, de lo más reciente a lo de antes.

2026 · Lo último

Más seguridad automática

Revisa tu página y arregla fallas de seguridad solo, antes de que publiques.

2026

Páginas que Google encuentra mejor

Ahora tus páginas cargan más rápido y aparecen mejor en las búsquedas.

2026

Cobra desde tu app

Sistema de pagos integrado y app para tu computadora (Mac).

2026

Modo Plan

La IA te dice qué va a hacer y tú apruebas antes. Cero sorpresas.

Fines de 2025

Modo Chat para planear

Conversar con la IA para aclarar ideas antes de construir.

2025

Conexión con tus apps

Notion, Linear y más. Y diseño con temas e imágenes generadas por IA.

2025

Backend incluido

Base de datos, login y IA dentro de Lovable, sin salir a otro lado.

Mediados 2025

La IA que trabaja sola

El modo agente que redujo los errores casi a cero.

08 / Cuánto cuesta

Funciona con créditos

Cada mensaje que le mandas a la IA gasta un poquito de crédito?Los créditos son como fichas: cada vez que le pides algo a la IA, gastas una fracción. Editar a mano (Visual Edits) no gasta.. Un cambio chico gasta poco; armar algo grande, más. Editar tocando (Visual Edits) no gasta.

PlanDesdePara qué te sirve
Gratis$0Para probar. 5 créditos al día. Perfecto para empezar a jugar.
Pro$25/mesPara proyectos en serio. Te deja poner tu dominio propio y quitar el sello de Lovable.
Business$50/mesPara equipos. Más control y opciones de privacidad.
EmpresaA consultarA medida, para compañías grandes.

Consejo: empieza con el plan Gratis para agarrarle la mano. Cuando quieras tu dominio propio o publicar en serio, ahí pasas a Pro.

+ / Todo el camino

De la idea a tu web con dominio

1

Cuéntale tu idea

Escribe, sube una foto o parte de una plantilla. Lo que te sea más cómodo.

2

Pide de a poquito

Pieza por pieza. Usa Modo Plan para aprobar y Visual Edits para los detalles (gratis).

3

Dale vida

Pídele login, base de datos o pagos. La IA arma toda la parte de atrás.

4

Publica

Un botón y tu página queda en internet con su dirección .lovable.app.

5

Pon tu dominio

Con plan Pro, conecta tu dominio bonito. Automático o pegando 3 datos.

→ / Tu siguiente paso

¿Listo para construir lo tuyo?

Esta guía es una probadita de lo que compartimos en Haiku Builders. Únete a la lista de espera y aprende a crear con IA, sin vueltas.