paso a paso · 2020-05-14 · acción de movimiento y la dejamos quieta con veloci-dad 0 -cero-...
TRANSCRIPT
en Fundación Andreani
VideojuegosPaso a paso
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
2
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
PASO A PASOLUGAR DE INVENTOS EN FUNDACIÓN ANDREANI#InventoresEnCasa
VIDEOJUEGOS
hOY
En este Tutorial vamos a ver como crear un Videojuego básico sin la necesidad de usar código de programación. Para este Proyecto vamos a necesitar tener el programa
Game Maker 8. Para eso pueden entrar enHTTPS://TINLY.CO/GAMEMAKER8 para descargarlo directamente y comenzar con la actividad.
¡QUE TAL FUTUROS PROGRAMADORESDE VIDEOJUEGOS!
¡Empecemos!
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
3
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Una vez ya descargado dentro del programa veremos la siguiente pantalla:
Nos vamos a encontrar con muchas herramientas que no conocemos pero que vamos a ir aprendiendo a usar a lo largo del tutorial.
Para comenzar carguemos las fotos que sacamos. Vamos a darle click al icono de Pacman Rojo en la barra superior.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
4
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Esto nos crea un Sprite automáticamente con el nom-bre “sprite0” que no tiene ninguna imagen asignada. Para asignarle una imagen seleccionamos el botón de cargar un sprite.
Seleccionamos una de las fotos que esté en la carpeta donde las guardamos y de esa manera lo asociará al sprite.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
5
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Para retirarle el fondo lo que vamos a hacer es darle al botón de “Edit Sprite” y seleccionar el marcador para poder editar la imagen.
Esto nos va a abrir un editor de imagen en el que vamos a pintar todo el fondo de negro.Una vez pintado el fondo seleccionamos la herramienta de la varita mágica, lo seleccionamos y apretamos [ Ctrl + X ]
Este sería el resultado final.
Le damos Aceptar a todo y repetimos este mismo paso con las 3 imágenes faltantes.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
6
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Una vez que terminemos de editar las imagenes no tendrian que quedar todas las posiciones en la carpeta de sprites.
Para eso clickeamos en la pelotita azul de la barra superior.
Nos va a abrir una ventana en la que podemos configurar nuestro objeto según nuestras necesidades.
Vamos a crear nuestroobjeto perosnaje
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
7
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
¡¡¡A MOVERSE!!!
Comencemos dándole un nombre en el campo “Name”. Luego le vamos a asociar el sprite de frente que carga-mos anteriormente dando click en el campo de <sprite> y seleccionando la imagen que cargamos.
Ahora si, vamos a otorgarle comportamiento a nuestro objeto para poder moverlo a nuestro antojo.Dentro de la ventana de configuración del objeto tene-mos un campo de eventos y otro de acciones.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
8
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Los Eventos son literalmente eventos que suceden en la computadora y el Game Maker tiene que reconocer de alguna manera. Si yo quisiera que mi personaje se mueva hacia la izquierda cuando aprieto la tecla ‘flecha izquierda’ entonces apretar la tecla es el evento y moverse es la acción.
Con esto en la cabeza vamos a añadir el evento KeyPress y seleccionamos el botón <Left>
Ahora dentro del campo de las acciones vamos a arras-trar el movimiento (Move Fixed)instantáneamente se nos abrirá una ventana para configurar la velocidad y la dirección a la que se va a mover nuestro personaje.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
9
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
De la manera que se configuró en la imagen de arriba nuestro personaje se debería mover hacia la izquierda cuando presionemos la tecla “Flecha izquierda”.Pero no tan rápido!!! Todavía nos faltan unos ajustes para probar nuestro juego.De esta manera el personaje se va a mover para la izquierda pero no va a dejar de hacerlo nunca.
Vamos a añadir otro evento que se llama Key release y seleccionar la tecla“Flecha izquierda” nuevamente. Luego arrastramos la acción de movimiento y la dejamos quieta con veloci-dad 0 -cero- como en la imagen de abajo.
También queremos que mire para donde nos estamos moviendo! Así que le vamos a agregar la acción “change sprite” dentro de la solapa “Main 1” y seleccionamos el lado para el que queremos que mire, en este caso es la izquierda.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
10
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Podemos repetir estos pasos 3 veces más, ya tenemos el movimiento hacia la Izquierda. Nos faltan Derecha, Arriba y Abajo. Por cada dirección crearemos 2 eventos con las teclas que correspondan a cada una.
El siguiente paso sería hacer las colisiones con las pare-des para que nuestro personaje no pueda seguir cami-nando hacia el infinito y más allá.Vamos a crear entonces el Sprite de la pared y asignarlo a un objeto que llamaremos “Pared”.el Sprite se puede encontrar en el directorioC:\Program Files (x86)\Game_Maker8\Sprites\Maze - Platform
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
11
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Es importante que al igual que en la imagen marquemos el casillero “Solid”. Esto hará que el juego detecte este objeto como algo que no se puede traspasar.De todas maneras nuestro personaje le pasara por encima como si nada, así que tendremos que ir a la ventana de nuestro Objeto Personaje y darle algunos comportamientos.
Seleccionamos el Evento “Colisión” y elegimos la Pared. Esto quiere decir que al tocar la pared con el personaje va a hacer lo que le pidamos. Y que queremos que haga cuando toca una pared ??? Sencillamente quedarse quieto. De esta forma entonces le asignamos la acción de movimiento la dejamos en el centro.
Del lado izquierdo de la ventana en la solapa “objects” se encuentra el campo para seleccionar el objeto que se quiere colocar en el nivel. A nosotros nos aparecen Sebas y la pared que tenemos creada. Si damos click en el nivel nos colocará a nuestro objeto seleccionado
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
12
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
AHORA SÍ
En la barra superior encontraremos el botón de crear un nivel.
Una vez que le damos click nos crea un nuevo nivel que se encuentra vacío y aparece en la carpeta “rooms”.vamos a ir a la solapa de settings y cambiar el tamaño del nivel a 1000 x 600
A crear nuestro primer nivel
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
13
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Vamos a añadir algunas paredes y luego a probar como va nuestro juego!!!
Para darle play vamos a la barra superior y presionamos el botón verde.
Si todo salió bien nuestro personaje se tendría que mover para todas las direcciones y chocar contra las paredes sin ningún problema.
Para esto al igual que con nuestro Personaje y la pared vamos a tener que crear un sprite y asignarlo a un objeto “Enemigo”. El sprite recuerden que lo pueden conseguir de la carpeta:C:\Program Files (x86)\Game_Maker8\Sprites\Maze - Platform
Así es como lo dejé yo
Vamos a crear enemigos
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
14
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
El comportamiento del enemigo no va a ser una inteli-gencia muy sofisticada, le vamos a decir que se comience moviendo hacia cualquier dirección y que cuando choque contra una pared se mueva hacia cualquier otra dirección.
Para lograr esto vamos a usar un nuevo evento llamado “Create”. El evento Create es el comportamiento que va a tener el objeto cuando se crea en la pantalla, es decir al principio del juego.
Dentro el Evento Create le vamos a dar la acción de Movimiento y vamos a seleccionar todas las direccio-nes al mismo tiempo. Esto hace que el personaje tenga que “decidir” para donde moverse eligiendo una sola dirección.
Nos tendría que quedar como en la siguiente imagen:
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
15
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Por último le vamos a dar la colisión con las paredes. Para eso creamos el evento Colisión y le damos exacta-mente el mismo comportamiento.
Si agregamos al escenario algunos objetos de fantas-mas deberíamos verlos en acción.
¡¿QUÉ ES LO QUE SUCEDIÓ?! Los fantasmas se mueven a la perfección, pero no pasa nada cuando tocan a nuestro personaje! entonces démosle ese comportamiento.
Dentro de nuestro personaje principal creamos un nuevo evento de colisión pero esta vez con el Enemigo.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
16
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Y vamos a darle la acción “Jump to start” que quiere decir “Saltar al inicio”.
Lo dejamos como está y le damos a “OK”
Esto va a hacer que cada vez que un enemigo nos toque volvamos a aparecer en donde nos creamos en un principio.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
17
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Vamos a crear los puntos. Para esto al igual que con nuestro Personaje, la pared y enemigos vamos a tener que crear un sprite y asignarlo a un objeto “Puntos”. El sprite recuerden que lo pueden conseguir de la carpeta:
A diferencia de los demás objetos la manzana no va a tener ningún comportamiento. El comportamiento se lo vamos a dar al personaje.Así que vamos a nuestro personaje y le agregamos otro evento de colisión pero esta vez con la Manzana.
Dentro de este evento le vamos a dar la acción “Destroy”
C:\Program Files (x86)\Game_Maker8\Sprites\Maze - Platform
Yo elegí una manzana ya que me encantan las manzanas
Delicioso puntaje
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
18
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Y también le vamos a dar click a la opción que dice “Other” (Otro) para que lo que se destruya sea la manza-na y no el personaje.
Por último vamos a darle un evento más a nuestro personaje, el evento “Step”.
Este evento lo que hace es ejecutarse 60 veces por segundo. Es decir que lo que pongamos dentro se va a hacer siempre.Dentro del evento vamos a poner la acción “Test Instance Count” que está dentro de la solapa “Control”
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
19
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Y le vamos a asignar el objeto de la Manzana igual que en la imagen de abajo.
En el caso de que eso sea cierto queremos que nos envíe al siguiente nivel. Para eso debajo de esa acción le ponemos “Next room” (Siguiente nivel) que está en la solapa “Main1”
Dejamos la opción que dice <no effect> y le damos a OK
Esto va a fijarse si la cantidad de manzanas en el nivel es igual a cero.
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
20
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Por último nos queda poner las manzanas en el juego.
Ahora solo resta hacer más niveles apretando en el botón “Create a room” igual que hicimos con el primero.
El único problema que vamos a tener va a ser que cuando terminemos de jugar nuestros niveles nos muestre este error.
Esto pasa porque le decimos que vaya al siguiente nivel y no hay ninguno. Entonces para solucionarlo podemos crear un nivel que no tenga ni personaje ni manzanas y diga algo como “Victoria” o “Game over”Esto lo podemos hacer creando un Background (Fondo) en la barra superior.
SOLUCIONANDO ERRORES
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
21
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
y dándole a “Edit Background”
Y le damos el tamaño de nuestro nivel que es1000 x 600.
¡¡¡Yo hice esto!!!
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
22
ww
w.fu
ndac
iona
ndre
ani.o
rg.a
r
Por último se lo agregamos al último room dentro de las configuraciones en la solapa Background
Nos tenemos que asegurar de que este nivel sea el último.
¡MISIÓN CUMPLIDA!Ahora solo queda poner de tu ingenio e
imaginación para crear niveles cada vez mejores.¡Y a disfrutar de tu juego al máximo!