Qué vas a construir, y por qué no se hace pidiéndoselo a ChatGPT

Quizás ya probaste. Abriste ChatGPT, escribiste «quiero una página web impresionante» y esperaste. Y salió algo. Una página con un título grande, tres tarjetas y un botón azul. No era horrible, pero tampoco era tuya. A mí me pasó lo mismo cuando empecé, y le pasa a todo el mundo. Tranquilo.

El problema no es ChatGPT. El problema es que ChatGPT no sabe qué significa «impresionante» para vos. No sabe qué páginas querés, cómo se conectan entre sí, qué criterio estético tenés, ni cómo se arma un sitio que se vea bien en la computadora y en el celular. Tampoco sabe cómo pensamos un sitio los que lo hacemos todos los días.

Para eso existe esta skill. En vez de un prompt y una oración de deseos, vas a seguir una metodología: la misma que usamos en The Mariscal para hacer sitios para clientes, pero empaquetada para que ChatGPT la ejecute solo y te vaya preguntando lo justo. Vos describís, mirás, aprobás y pedís cambios. Nada más.

Lo que vas a tener al final

Una tienda online de zapatillas. Elegí ese ejemplo porque es un sitio de verdad, con varias páginas que tienen que hablar entre sí: el home, las categorías, el detalle de cada producto, el carrito, el pago. Al terminar la guía vas a tener ese sitio publicado en internet, con una dirección que le podés pasar a cualquiera, con un diseño consistente en todas las páginas, con animaciones, y con los textos editables desde un bloc de notas.

Y todo empieza con una carpeta vacía y una frase: «quiero hacer una web para vender zapatillas».

Si tu idea es otra (una web para tu estudio, un portfolio, la página de tu negocio), el camino es exactamente el mismo. Cambian las capturas que le pasás y el nombre de la marca. Los pasos no.

Qué es una skill

Una skill es una habilidad. Cuando le instalás una skill a ChatGPT le estás dando instrucciones muy específicas de cómo tiene que hacer cierta tarea. En nuestro caso, cómo se hace un sitio web profesional: en qué orden, qué preguntar, qué revisar, cuándo frenar a pedir aprobación.

Esto tiene una ventaja enorme sobre escribir prompts: cada vez que ejecutás la skill, ChatGPT hace lo mismo. Los resultados se parecen. No dependés de haber tenido un buen día escribiendo.

La skill de The Mariscal trae adentro, además, otras skills de otras personas. Skills de diseño, de animación, de auditoría de interfaces. Vos no tenés que instalarlas una por una ni acordarte de cuál usar en qué momento: la nuestra las instala al principio y las llama cuando corresponde.

Qué es Obsidian y por qué le da memoria a ChatGPT

Seguro te pasó: hablás con ChatGPT un día, volvés al otro, y no se acuerda de nada. Eso en un proyecto de varias horas es un desastre.

Obsidian es una aplicación de notas. Pero no de notas sueltas: las notas se conectan entre sí y forman un mapa. La skill usa ese mapa como la memoria del proyecto. Cada decisión, cada captura que le pasás, cada diseño que aprobás, queda escrito ahí. Cuando ChatGPT necesita acordarse de algo, lo encuentra en un segundo.

El resultado práctico: podés cerrar ChatGPT, cambiar de cuenta, dejar el proyecto una semana. Volvés, escribís «continuemos», y sigue exactamente donde lo dejó. Vas a verlo en acción varias veces en esta guía porque, mientras grababa el video, se me acabó el plan dos veces y tuve que cambiar de cuenta.

No vas a tener que tocar Obsidian casi nunca. Lo instalás, la skill lo llena, y al final lo vas a usar para una sola cosa muy linda: editar los textos de tu web sin abrir el código.

El mapa de todo el camino

La skill tiene diecinueve pasos, del 0 al 18. Suena a mucho. No lo es: la mayoría los hace ChatGPT solo y vos solamente aprobás. Pero conviene tener el mapa en la cabeza antes de arrancar, porque el orden es la mitad del truco.

Primero se le cuenta la idea y la skill arma el plan. Después se trabaja la estructura: qué páginas hay y qué tiene cada una, sin ningún diseño. Con eso se hacen los wireframes, el sitio en blanco y negro. Recién ahí se buscan referencias de diseño y de marca, se eligen, y se aplican sobre los wireframes. Se arma un prototipo de todo el sitio en HTML, y cuando está aprobado, se convierte en un proyecto profesional en Next.js. Se publica. Y como bonus, se le agrega magia: animaciones, un rediseño del home, los detalles que marcan la diferencia.

Fijate en algo: el diseño aparece recién a la mitad. Esa es la diferencia entre una web que sale bien y una que sale mal, con IA o sin ella. Primero el esqueleto, después la piel.

Cómo usar esta guía

La guía sigue el video paso a paso, pero con más calma y con esquemas. Cada capítulo cubre uno o dos pasos de la skill. Al final hay un glosario con todas las palabras raras que van a aparecer (repositorio, rama, merge, wireframe, framework) y una lista de problemas frecuentes.

Si entrás con tu cuenta de The Mariscal (gratis), podés subrayar, pegar post-its y bajarte la guía entera en PDF. Si no, se lee igual.

Manos a la obra.