⌘ Claude Code Crear un juego
0 / 78

Walkthrough: Click The Target en una sentada

El juego “real” más chico que podés hacer, de punta a punta, en unos 25 minutos. Si seguís estos pasos con cualquier juego, te sale.

Mockup de Tiro al blanco: puntaje, timer y un blanco neón sobre fondo oscuro


Paso 1 — Escribí el spec

Antes de pegar nada, escribí en español qué querés. Esto te lo explicás a vos mismo:

“Aparece un círculo rojo en un lugar al azar. Lo clickeo, desaparece y aparece otro, +1 al puntaje. Timer de 30 segundos. Al terminar, muestra el puntaje final y un botón de Reiniciar.”

Tres prompts de punta a punta: el build, el pulido y publicar

PROMPT 1 — El build

Abrí Claude Code en una carpeta vacía y pegá:

Construí un juego de navegador de una sola página llamado "Tiro al blanco", en un
solo archivo index.html autocontenido (HTML, CSS y JavaScript adentro, sin
herramientas de build). Un círculo rojo aparece en una posición al azar; al
clickearlo/tocarlo suma +1 y reaparece en otro lugar. El blanco se achica 5% cada 5
puntos. Timer de 30 segundos que arranca con el primer clic. Pantalla de Game Over
con puntaje final y botón Reiniciar. Puntaje grande arriba a la izquierda, timer
arriba a la derecha, título arriba al centro, fondo oscuro, blanco tipo neón.
Celular y compu. Levantá la preview en vivo.

Paso 2 — Iterá (jugá → describí → arreglá)

Jugalo ya. Decí qué está mal en español, no en “código”:

  • “El blanco aparece muy pegado al borde, dejalo a 40px de las paredes.”
  • “En el celular el título tapa el puntaje, bajá el área de juego 60px.”
  • “Tocar se siente lento, que el toque sea instantáneo.”

3 a 5 vueltas y queda.

PROMPT 2 — El pulido

Pulido. Tres cosas: (1) un sonido sutil de "pop" al acertar (con Web Audio, sin
archivos externos). (2) Guardá el mejor puntaje en el navegador y mostrá "Mejor: X"
en el título y en el game over. (3) Cuando queden los últimos 5 segundos, que el
timer pulse en rojo. Todo en un solo index.html. Preview en vivo.

Paso 3 — Revisá los archivos

Abrí la carpeta. Tiene que haber un solo archivo: index.html. Si hay más, pedí:

Consolidá todo en un solo index.html autocontenido, con el CSS y el JS adentro.
Borrá los demás archivos.

Hacé doble clic en el index.html: tiene que abrir en el navegador y jugarse. Si se juega desde el doble clic, se juega en cualquier lado.

PROMPT 3 — Publicar

Publicá este juego en Vercel y pasame la URL pública. Guiame en cualquier login o
instalación de a un clic, en lenguaje simple. Cuando esté en vivo, cargá la URL para
confirmar y decime cuál es el link para compartir.

Abrilo en tu celular. No sigas hasta jugar tu propio juego desde el link en vivo. Después, mandáselo a una persona. El envío es la repetición que cuenta.