Crear en familia: atrapa tu primera estrella con MakeCode Arcade

Dibuja un personaje, muévelo con las flechas y recoge estrellas. Un primer juego con bloques para niños de 10–14 años y sus familias, sin cuenta ni consola.

Portada ilustrada de Crear en familia: atrapa tu primera estrella con MakeCode Arcade
Portada original generada con IA. Es una ilustración; las capturas del ejercicio aparecen en el tutorial.

Un personaje. Una estrella. Y una pregunta: ¿podemos hacer que ocurra algo cuando se encuentren?

Vamos a dibujar, encajar unas piezas de colores y probarlo. No hace falta saber programar ni escribir órdenes en una terminal. Hoy utilizaremos Microsoft MakeCode Arcade, un editor de juegos que funciona en el navegador.

Empezaremos viendo moverse al personaje. Después haremos que recoger una estrella sume un punto. Si queréis dejarlo ahí, habremos terminado un juego pequeño que se puede volver a abrir mañana.

Esto es lo que vamos a construir

Captura real de Microsoft MakeCode Arcade con el robot, la estrella y el marcador después de recoger una estrella.

Este sí es el resultado del ejercicio en el simulador. A la izquierda se juega; a la derecha están las instrucciones. Podéis abrir cada imagen a tamaño completo para leer los bloques.

El robot se mueve con las flechas. Cada vez que alcanza una estrella, suma un punto y la estrella aparece en otro lugar. No hay reloj, enemigos ni pantalla de derrota. Podéis proponeros llegar a cinco puntos y parar, pero el programa os deja seguir.

¿Preferís tocar algo antes de construirlo? Descargad el proyecto Atrapaestrellas y abridlo siguiendo el paso 27. Es un PNG con el juego guardado dentro, no una captura para copiar a mano. No lo redimensionéis ni lo paséis por un editor de fotos.

Antes de empezar: el adulto prepara el sitio

Necesitamos un ordenador con teclado, ratón o panel táctil, navegador y conexión. No hacen falta una consola física, una licencia de Microsoft 365 ni una cuenta de IA. Reservad unos 30–45 minutos orientativos, o dos ratos más cortos. El dibujo puede llevar el tiempo que os apetezca.

  • El niño o la niña elige y dibuja el personaje, coloca bloques, juega y decide un cambio.
  • El adulto revisa el acceso al sitio y sus condiciones, acompaña cuando una pantalla resulta confusa y ayuda a guardar una copia fuera del navegador.

Microsoft presenta MakeCode como una plataforma gratuita y permite usar el editor sin iniciar sesión. Este recorrido no pide tarjeta ni activa servicios de pago. Es la situación comprobada el 28 de septiembre de 2026, no una promesa de gratuidad indefinida. Presentación oficial · Uso sin cuenta.

La actividad está escrita para 10–14 años. La documentación de privacidad consultada contempla el uso educativo infantil y explica el consentimiento para cuentas, pero no fija una edad mínima universal para el editor sin cuenta. El adulto debe revisar las condiciones aplicables a su familia o centro; el acompañamiento no elimina una restricción de acceso. No necesitamos crear una cuenta ni visitar el foro, que tiene reglas propias y exige al menos 13 años. Si no podéis usar el sitio, dibujad el robot en papel cuadriculado y jugad a mover una ficha siguiendo flechas; la parte online puede esperar. Privacidad de MakeCode · Condiciones · Normas del foro.

Usad un nombre inventado para el proyecto. No hacen falta fotografías, colegio, correo, nombres completos ni voz. Sin cuenta no significa sin conexión con Microsoft: el sitio documenta telemetría de uso. El juego que construiremos no añade cuentas de jugadores, chat, compras ni rastreo propio.

Las capturas proceden de Microsoft MakeCode Arcade 4.1.25, en español, con Chrome 153 en macOS. No se ha probado un equipo Windows ni un móvil físico. La web debería ofrecer un recorrido parecido en otros ordenadores compatibles; algunos nombres siguen apareciendo en inglés.

Misión 1. Un dibujo que ya se mueve

1. Abre el editor

Con el adulto, entra en Microsoft MakeCode Arcade. No pulses «Iniciar sesión». Si la página está en inglés, usa el selector de idioma —«Language» o «Lenguaje»— y elige español. Espera a que termine de cargar.

2. Dale nombre al juego

Pulsa Nuevo proyecto, escribe Atrapaestrellas y pulsa Crear. Si aparece una visita guiada de bienvenida, puedes cerrarla con su X para seguir este tutorial.

Verás una consola dibujada a la izquierda, categorías de colores en el centro y el espacio de bloques a la derecha. La consola es el simulador: permite probar sin comprar ningún aparato.

3. Encuentra la caja de personajes

Pulsa Objetos, la categoría azul. Busca el bloque que dice fijar mySprite a objeto … del tipo Player. Arrástralo al interior del bloque verde al iniciar. Tiene que encajar dentro, no quedarse suelto al lado.

Captura real del editor con la categoría Objetos abierta, el bloque de creación de personajes y el bloque al iniciar.

Busca el bloque que comienza por «fijar mySprite». «Player» significa jugador. Los bloques de abajo pueden requerir desplazarse por la lista.

4. Llama «robot» a tu personaje

Pulsa la flecha junto a mySprite en el bloque que acabas de colocar. Elige Renombrar la variable…, escribe robot y confirma. Si preferís otro nombre, también vale, pero tendréis que escoger ese mismo nombre en los siguientes bloques.

Una variable aquí es una etiqueta para reconocer a nuestro personaje. No hay que aprender una definición antes de jugar.

5. Dibuja en la cuadrícula

Pulsa el pequeño recuadro del dibujo dentro de objeto. Se abre el editor de imágenes. Elige el lápiz y un color de la izquierda; pinta casillas en la cuadrícula. Un cuadrado con dos ojos ya puede ser un robot.

La cuadrícula pequeña tiene 16 × 16 píxeles. Un píxel es una casilla de color. El damero gris es la parte transparente, no un fondo que debas pintar.

Captura real del editor de imágenes de Microsoft MakeCode Arcade con un robot de 16 por 16 píxeles, paleta de colores y botón Listo.

El robot de la captura viene en el descargable. No hace falta copiarlo: podéis dibujar una cara mucho más sencilla. Usad el borrador o deshacer si pintáis una casilla que no queríais.

6. Mira tu primer resultado

Pulsa Listo, abajo a la derecha del editor de dibujos. Espera un momento. El personaje debe aparecer en la pantalla de la consola. Si no aparece, comprueba que el bloque de creación está dentro de al iniciar y que has pintado alguna casilla.

7. Dale los mandos

Abre Mando, la categoría naranja. Arrastra mover … con botones debajo de la creación del robot, todavía dentro de al iniciar. Selecciona robot en su desplegable.

Si solo ves el nombre del personaje, pulsa el + del bloque para mostrar vx y vy. Son las velocidades horizontal y vertical. Pon 70 en las dos casillas.

8. Haz que se quede en pantalla

Vuelve a Objetos. Busca fijar … permanecer en pantalla ACTIVADO. Colócalo debajo del movimiento y elige robot. Deja el interruptor en ACTIVADO.

9. Prueba las cuatro flechas

Haz clic dentro de la pantalla del simulador. Pulsa derecha, izquierda, arriba y abajo. Si está detenido, pulsa el triángulo que hay debajo.

¿Se mueve y se queda dentro de los bordes? Ya has conectado una instrucción con algo que puedes ver. Este es un buen sitio para descansar; guarda con el paso 26 antes de cerrar.

Misión 2. Algo que encontrar

10. Elige el fondo

En Escena, busca fijar color de fondo a. Colócalo en al iniciar y pulsa su muestra de color. Escoge un azul oscuro para distinguir bien el personaje y la estrella. Puedes colocarlo al principio de la pila, como en nuestra captura.

11. Pon al robot en su salida

En Objetos, arrastra fijar … posición a x … y … al final de al iniciar. Selecciona robot, escribe 30 en x y 60 en y.

x indica cuánto nos movemos de izquierda a derecha; y, de arriba abajo. No son números para memorizar: nos sirven para separar al robot de la estrella al empezar.

12. Crea otro objeto

Desde Objetos, arrastra otro bloque de creación fijar … a objeto … del tipo Player al final de al iniciar. Abre su desplegable de variable, elige Nueva variable… y escribe estrella. Comprueba que el nuevo bloque tiene estrella seleccionada y que el primero sigue llamándose robot.

No renombres robot para este paso: cambiarías su etiqueta también en los otros bloques. Queremos guardar dos objetos diferentes.

13. Dibuja la estrella

Pulsa la miniatura del nuevo objeto. Elige amarillo y dibuja una estrella, una cruz gruesa o un rombo. Pulsa Listo. El dibujo es tuyo: no necesitamos copiar personajes de otros juegos ni coger imágenes de Internet.

14. Dale una etiqueta distinta

En el bloque que crea estrella, cambia Player por Food. Aunque signifique «comida», aquí lo usaremos como etiqueta de los objetos que podemos recoger.

robot → Player. estrella → Food. Esta diferencia nos permitirá explicar qué dos cosas deben tocarse.

15. Separa la estrella del robot

Añade otro bloque fijar … posición a x … y …. Elige estrella, x 120, y 60. Debes ver al robot a la izquierda y la estrella a la derecha.

16. Prepara el marcador

Abre Información. Arrastra fijar puntaje a 0 al final de al iniciar. «Puntaje» es el nombre que utiliza esta traducción para la puntuación.

Captura real de las dos pilas de bloques: preparación del robot y la estrella al iniciar, y regla de contacto debajo.

La pila de arriba prepara la partida. La de abajo será la regla de la siguiente misión. Los nombres robot y estrella identifican dos objetos diferentes.

Misión 3. «Cuando se toquen, pasa esto»

17. Saca una regla nueva

En Objetos, baja hasta Overlaps. Arrastra el bloque cuando el sprite de tipo Player se superpone otherSprite del tipo Player a una zona vacía del espacio de trabajo.

Este bloque se queda separado de al iniciar. No es una orden para el comienzo: espera a que dos objetos se toquen. «Se superpone» significa que coinciden partes visibles de sus dibujos.

18. Elige las dos etiquetas

Deja el primer tipo en Player y cambia el segundo a Food. En este bloque, sprite será el jugador y otherSprite será la estrella que ha tocado. No hace falta renombrarlos.

19. Suma un punto

Abre Información. Mete cambiar puntaje por 1 dentro de la regla de contacto. Utiliza «cambiar», no «fijar»: queremos añadir uno a lo que ya teníamos.

20. Prepara el siguiente lugar

En Objetos, añade fijar … posición a x … y … debajo de sumar el punto, dentro de esa misma regla. En el desplegable, elige estrella.

En el descargable verás otherSprite en su lugar: significa «el segundo objeto de este contacto» y aquí es exactamente la estrella. Puedes dejarlo como está al importar; al construir desde cero resulta más sencillo seleccionar estrella.

21. Deja que el juego elija la x

Abre Matemática y busca escoger al azar de 0 a 10. Arrástralo encima de la casilla de x para sustituir el número. Escribe 12 y 148 en sus extremos.

El juego elegirá una posición horizontal dentro de ese intervalo. Dejamos un pequeño margen para que la estrella no aparezca cortada por el borde.

22. Haz lo mismo con la y

Añade un segundo bloque escoger al azar en la casilla de y. Esta vez escribe 24 y 108. Dejamos espacio arriba para el marcador.

No hace falta acertar dónde saldrá. La sorpresa está en buscarla después de cada punto.

23. Añade un respiro diminuto

En Bucles, busca pause … ms y colócalo al final de la regla. Escribe 300: son tres décimas de segundo antes de que termine esa ejecución de la regla.

Esto no es un botón de pausa para la partida. La estrella puede aparecer cerca, incluso coincidir otra vez con el robot: este primer juego no busca huecos libres. No pasa nada si alguna vez recoges dos muy seguidas; resolverlo puede ser una mejora futura.

24. Juega y comprueba una cosa cada vez

Pulsa la flecha circular Reiniciar el simulador que hay debajo de la consola. Haz clic en el juego y ve hacia la estrella con las flechas.

Comprueba estas tres cosas: el marcador empieza en cero, sube al recogerla y la estrella cambia de sitio. Después mantén una flecha hacia un borde: el robot debe quedarse dentro de la pantalla.

Para parar, usa el cuadrado Detener el simulador. En la versión probada, el triángulo vuelve a empezar desde cero: no conserva la partida. La flecha circular también reinicia y pone el marcador a cero. La versión mínima no tiene sonido añadido, victoria automática ni derrota.

25. Cambia una sola cosa

Pulsa la miniatura del robot, cambia el color de una casilla y pulsa Listo. Reinicia para verlo. Otra opción es bajar vx y vy de 70 a 50 en el bloque de movimiento.

No cambies dibujo y velocidad a la vez si quieres reconocer qué ha pasado. Puedes decir: «Ahora quiero probar solo esto». Las otras ideas van a una hoja de «Para después».

Misión 4. Guardarlo para mañana

26. Descarga una copia de tu proyecto

Con el adulto, localiza el nombre Atrapaestrellas en la barra inferior. A su lado hay un disquete: Guardar el proyecto. Púlsalo. El navegador descargará una imagen PNG; en la prueba se llamó arcade-Atrapaestrellas.png.

Captura real del aviso Proyecto guardado, que explica que el PNG contiene el proyecto y se puede importar de nuevo.

Este archivo guarda más que una imagen. Conservad el PNG original, sin recomprimirlo ni enviarlo por una aplicación que reduzca las fotos.

El adulto lo mueve desde Descargas a una carpeta fácil de reconocer, por ejemplo Mis juegos / Atrapaestrellas. Pulsad ¡Entendido! para cerrar el aviso. Podéis guardar otra copia con la fecha en el nombre cuando hagáis un cambio que os guste.

No necesitamos el botón grande Descargar, que también ofrece opciones para hardware. Tampoco Compartir: ese botón sirve para publicar. Hoy basta con tener el archivo.

27. Comprueba que puedes recuperarlo

Pulsa el icono de la casa para volver a Inicio. Después, Importar → Importar archivo. Elige el PNG que acabas de guardar y confirma con ¡Adelante!. Debe abrirse el proyecto con sus bloques.

Captura real del proyecto recuperado desde el PNG en una sesión nueva de Microsoft MakeCode Arcade.

El proyecto recuperado vuelve a mostrar los bloques y el marcador a cero. No hay que pegar una dirección pública ni iniciar sesión.

Repite una recogida para comprobarlo. El archivo guarda el juego, no la puntuación de la partida que estabas jugando.

MakeCode también mantiene proyectos en el almacenamiento del navegador, pero pueden desaparecer si se borran los datos del sitio. La copia descargada evita depender solo de esa memoria. Cómo se guardan los proyectos.

Si no te sale

Lo que vesQué probar
El robot no se mueveHaz clic en la pantalla del juego. Comprueba que el simulador está en marcha y que «mover» tiene seleccionado robot.
El robot se saleRevisa «permanecer en pantalla ACTIVADO» y que el objeto elegido sea robot.
La estrella no sumaSu creación debe usar Food; el robot, Player. La regla debe unir Player con Food y contener «cambiar puntaje por 1».
Siempre aparece un 1Puede que hayas usado «fijar puntaje a 1». Sustitúyelo por «cambiar puntaje por 1».
El marcador corre y la estrella no cambiaRevisa que el bloque de posición esté dentro del contacto y mueva estrella u otherSprite, no robot.
No cabe una pila de bloquesUsa el botón − de la esquina inferior derecha o arrastra el fondo para desplazarte. No borres bloques para que quepan.
El PNG solo se abre como una fotoEs normal en el visor de imágenes. Ábrelo desde Importar en MakeCode.
El archivo ya no se importaRecupera la copia PNG original. Redimensionarla o recomprimirla puede destruir los datos del proyecto.
Aparece inicio de sesión, pago o elección de consolaVuelve al editor sin cuenta y usa Guardar el proyecto. No hace falta pagar ni elegir hardware.

Las comprobaciones de movimiento, bordes, recogida, reinicio e importación se hicieron con el ejemplo. Las demás filas ayudan a revisar la colocación de bloques; no significan que se hayan provocado todos esos fallos en una prueba.

¿Y la IA? Hoy es opcional

Aquí podemos construir con bloques y botones. Si el adulto ya dispone de un asistente cuyo uso tenga autorizado y cuyas condiciones, edad y coste haya comprobado, puede pegar estos mensajes en una conversación nueva sin datos personales. No hay que abrir una cuenta para hacer el taller ni prestar una cuenta adulta al niño.

Para entender una pieza:

Estoy acompañando un taller familiar con Microsoft MakeCode Arcade.
El juego tiene un robot de tipo Player y una estrella de tipo Food.
Explícame en tres frases qué significa «se superpone».
Pon un ejemplo con dos fichas de papel. No añadas código,
cuentas, instalaciones ni servicios de pago.

Para pedir ayuda con lo que vemos:

Estamos construyendo un juego con bloques de MakeCode Arcade.
El robot se mueve, pero al tocar la estrella el marcador no sube.
Guíame para revisar primero los tipos Player y Food.
Dime una sola comprobación y espera a que te cuente el resultado.
No pidas datos del menor ni acceso al ordenador.

Son plantillas preparadas, no conversaciones enviadas ni respuestas de IA verificadas. La ruta de bloques y el descargable funcionan sin ellas.

Tres ideas para otro rato

  • Muy pequeña: ponle otro color a la antena del robot.
  • Una decisión de diseño: convierte la estrella en una fruta dibujada por ti. Puede seguir siendo Food.
  • Una prueba compartida: probad velocidad 50 y después 70. Elegid cuál os gusta más y explicad por qué, sin medir quién juega mejor.

Hoy hemos dibujado un objeto, le hemos dado movimiento y hemos hecho que el juego responda a un encuentro. Podéis señalar cada bloque y contar qué hace. Esa ya es una buena forma de enseñar lo que habéis creado.

Descargar Atrapaestrellas · Instrucciones del ejemplo

Fuentes y comprobaciones

Consultadas el 28 de septiembre de 2026. Microsoft MakeCode Arcade 4.1.25, motor PXT 13.1.23. El ejemplo se ejecutó en el simulador real, se guardó y se volvió a importar en una sesión vacía. No se ha publicado ni se ha probado en una consola física.