Primeros Pasos en MakeCode Arcade
45-60 min
Ages 11+
¿Que aprenderás?
Aprenderemos a crear nuestro propio videojuego con MakeCode Arcade, conoceremos variables, condiciones, funciones, arrays y animaciones para usar tu creatividad y crear algo divertido.
Inicie su Código
Paso 1
Entra al siguiente link: https://makecode.com/_Ks0dmMTvMLA7 en este se encuentra todo lo que necesitas para tu videojuego.
En la parte superior está el nombre del proyecto y a la derecha hay dos botones, presiona el “Edit Code”. En esta nueva pestaña vas a trabajar, la plataforma se divide en tres, la parte de la derecha es la zona de trabajo, la de en medio es donde encuentras los bloques, y la última es el simulador hay veras el resultado del código.
Paso 2
Para mover la mesa de trabajo en la parte inferior derecha hay dos botones uno para acercar y otro para alejar.
Muévete a la primera fila del código a tu izquierda, empezarás con el bloque verde “on Start”
Paso 3
Seleciona el bloque “set Bacground Image to” y lo llevas sobre el bloque “On Start” de color verde, al acercarlo ves como se pone un área gris y lo sueltas, ahora esta dentro y puedes ver el resultado en el simulaodor, es la imagen del Maker Camp.
Paso 4
Ahora usarás las funciones, que son secciones de código que puedes usar cuando las llamas. Ya tienes una creada “setupFrames”, ésta tendrá la mayor parte visual y animaciones del juego. Vas a arrastras el bloque “set birdFrames” adentro de la funcion de color azul. Ahora repites esto con el bloque “set makeyFrames” lo colocas debajo del bloque verde y seleccionas el bloque “set obstacles” lo arrastra debajo del último bloque verde, como en la imagen.
Acabas de terminar un tercio de tu código, ¡increíble trabajo!
Declaraciones "Forever" y "If
Paso 5
Muevete en la mesa de trabajo y dirigete a la segunda linea, al bloque “forever” de color verde. Seleciona el bloque “if escena = 1” llevalo dentro del bloque “forever” de color verde. Selecciona el bloque “ if escena > 2 ” arrastralo debajo del bloque azul.
Esto, hará que cuando cambie la variable “escena” cambiemos de asset, al fondo del jeugo.
Paso 6
Después baja en tu mesa de trabajo, y selecciona el bloque “set makey to sprite ”, y lo llevas dentro del bloque azul “if escena = 2” que está dentro del bloque morado “on game update”.
Esto activa las animaciones de nuestro personaje y la ave, que creamos en el paso 2.
Paso 7
Bajamos en nuestra mesa de trabajo, selecciona el bloque “stop all animation on makey” y lo llevas dentro del bloque azul, “if escena > 2”. Ahora slecionas el bloque “change escena by 1” y lo pones dentro del “else” que es de color azul.
Esto hará que al presionar la tecla “A”, cambie nuestra imagen, por las instrucciones, luego de presionar por segunda vez nuestra tecla “A”, entramos al juego, en el cual podremos saltar con esta tecla.
Agregar Objetos en Segundo Plano
Paso 8
Felicidades, llevas la mitad de tu videojuego, es hora de probar lo que has programado en el simulador.
Dirigete a los ultimos bloques de color azul de la linea en la que estamos trabajando.
Seleciona el bloque ”set tree to proyectitle” llevalo dentro de la funcion “createTree” de color azul, ahora seleciona el bloque “set cloud to proyectile” llevalo dentro de la funcion “createCloud”.
Paso 9
Muévete en tu mesa de trabajo al último bloque verde “forever”
Selecciona el bloque “if escena > 2” dentro del bloque “Forever”.
Luego selecciona el bloque “if escena > 2” y lo colocas dentro del bloque morado de “On game update every 1000 ms”, selecciona el bloque “if 40% chance then” colocas dentro del bloque if que acabas de colocar. Esto creará nuestros árboles.
Paso 10
Selecciona el bloque “if escena > 2” colocalo dentro del bloque morado de “On game update every 2000 ms”.
Cambiar la Puntuación
Paso 11
¡Increíble! Ya casi terminas tu videojuego
Baja en tu mesa de trabajo, el bloque morado “on Sprite” genera el game over, baja un poco más y selecciona el bloque “change score by 1” llevalo dentro del bloque azul “on destroyed sprite of kind obstacle”.
Paso 12
Ahora selecciona el primer bloque “if escena > 2”, llevalo al bloque morado “on game update”. Por último arrastras tu bloque “if escena >2”, llevalo a el bloque morado ““on game update every 200ms”.
Descarga tu Videojuego
Paso 13
¡Felicidades! Ya terminaste de programar tu videojuego.
Junto al botón descargar, hay tres puntos, presionalos, se desplegara un menu, selecciona “Choose your hardware” presiona el GameGo, vuelve a presionar en los tres puntos, y presiona la nueva opción “Pair device” sigue los pasos que aparecen.
Paso 14
Por último presiona descargar.
Listo! Juega, diviértete y lleva tu videojuego a todos partes.
¿Qué sigue?
Cambiando los colores de los obstáculos o el fondo: sobre la mesa de trabajo hay un menú con tres botones, te encuentras en “Blocks”, selecciona “Assets”, en esta zona están todos los elementos visuales del juego, selecciona el objeto que cambiaras, veras la seccion Asset preview y presiona editar. En este nuevo espacio podrás cambiar el color, el estilo o seleccionar nuevos elementos de la galería.
Cuando termines presiona el botón verde, y regresa a la zona de Blocks
Cambia el efecto de Game Over: Ve a la derecha de tu mesa de trabajo y encuentra nuestro bloque de game over “on sprite of kind player overlaps othersprite of kind Obstacle”. Presiona el rectángulo “melt” se desplegará distintas opciones, así que es momento de experimentar y probarlas, selecciona la que desees y prueba tu juego.
Recursos
Aprender más
Acerca de MoonMakers
MoonMakers — lideradas por Camila and Diego Luna — somos una comunidad de creadores apasionados por el conocimiento. Un Makerspace, un espacio abierto con diferentes máquinas de fabricación digital. Y un canal de YouTube donde promovemos la ciencia, la tecnología y el movimiento maker.
MoonMakers ha colaborado con empresas como: Sesame Street, Make Community y en México con Televisión Educativa y Fundación Televisa, creando contenido educativo.
Hemos imparto talleres por la República Mexicana con: Talent Land, Secretaría de educación en Jalisco, Conacyt, Centro Cultural España.
Materiales:
- GameGo (o consola compatible con MakeCode Arcade)
- Un cable micro usb
- Una computadora con acceso a internet
- Link al proyecto: https://makecode.com/_Ks0dmMTvMLA7
Vocabulario:
variables: En programación, una variable está formada por un espacio en el sistema de almacenaje y un nombre simbólico que está asociado a dicho espacio. Ese espacio contiene una cantidad de información conocida o desconocida.
Funciones: Las funciones son un elemento muy utilizado en la programación. Empaquetan y ‘aíslan’ del resto del programa una parte de código que realiza alguna tarea específica.
if: Un if en programación se utiliza para evaluar una expresión condicional: si se cumple la condición (es verdadera), ejecutará un bloque de código. Si es falsa, es posible ejecutar otras sentencias.
array: Es un tipo de dato estructurado que permite almacenar un conjunto de datos homogéneo, es decir, todos ellos del mismo tipo y relacionados.
videojuegos tipo runner: El concepto de estos juegos es el siguiente: un personaje se mueve sin parar en una pista 'interminable', mientras esquiva distintos obstáculos.
