GameSalad – Juego de Plataformas

GameSalad – Juego de Plataformas Las aplicaciones móviles (Apps) como negocio: los juegos Andrés Carrillo Casanova cincubator.com Índice
Índice 1.  GameSalad – Juego de Plataformas 1.1 Descripción del juego. 1.2 Creación de los actores. 1.3 Posicionar los actores en la escena. 1.4 Controlando a nuestro personaje. 1.5 Condiciones de victoria y de pérdida. 1.6 Mejorando nuestro juego. 1.7 Inclusión de coleccionables. 1.8 Creación del menú principal y de más niveles. Taller Ideas de Negocio 2
GameSalad – Juego de Plataformas Descripción del juego. El juego consis:rá en controlar a nuestro protagonista y hacerlo llegar a la puerta de salida, deslizándolo por dis:ntas plataformas. −  Vamos a crear un juego de plataformas realmente simple uVlizando GameSalad. −  Con GameSalad crear juegos para disposiVvos móviles es muy sencillo. Comprobémoslo. !
3
GameSalad – Juego de Plataformas Creación de los actores Crear un nuevo proyecto, especificando que será un juego para iPhone Landscape que llamaremos PLATAFORMAS Sobre la pestaña Scenes hacemos doble clic sobre la escena Ini(al Scene para entrar dentro del editor de escena. Una vez dentro, seguimos los siguientes pasos: 1.  En el Inspector, hacemos clic sobre el botón + para crear un nuevo actor. 2.  Hacemos clic sobre el nombre del actor y lo renombramos a ‘Jugador’. 3.  Hacemos doble clic sobre el actor para entrar en el modo de edición de actor, y en sus atributos buscamos el atributo Size (tamaño) para desplegarlo y establecer los valores X e Y a 32. 4.  Pinchamos sobre el botón Back para volver al editor de escena, y en la sección Library seleccionamos la pestaña Images para luego hacer clic en el botón + situado en la esquina inferior izquierda, y seleccionamos el fichero Green-­‐Block.png que se encuentra entre en el material proporcionado. 5.  Pinchamos sobre la imagen recién creada y la arrastramos hasta el recuadro del actor que acabamos de crear. Veremos cómo la imagen queda asociada a dicho actor. 4
GameSalad – Juego de Plataformas Creación de los actores TIP: Arrastrar imágenes directamente desde la carpeta con gráficos a la zona Inspector/Actors o a la Library/Images Importamos dos imágenes (actores) más: Brick-­‐
Wall.png y Door.png. 1.  Atributo Size (tamaño) de Brick-­‐Wall.png 320 de ancho y 32 de alto R e n o m b r a r l o a ‘Plataforma’. 2.  Atributo Size (tamaño) de Door.png 35 de ancho por 48 de alto. Renombrar a ‘Puerta’. 5
GameSalad – Juego de Plataformas Posicionar los actores en la escena Una vez creado los primeros actores empezamos a posicionarlos en la escena 1.  Hacemos clic en el actor ‘Jugador’ y lo arrastramos dentro de la pantalla. Hacemos lo mismo con los actores ‘Plataforma’ y ‘Puerta’, posicionando todos los elementos dentro de la escena como se muestra en la siguiente imagen: 2.  Ahora mismo si pulsamos el botón Play veremos que no ocurre nada, De momento, todos los elementos están estáVcos porque no hemos incluido gravedad en la escena. 3.  Para ello, en Inspector pinchamos s o b r e l a p e s t a ñ a S c e n e , y desplegamos el atributo Gravity (gravedad) para establecer el atributo Y a 300 !
6
GameSalad – Juego de Plataformas Posicionar los actores en la escena 4.  Si pulsamos sobre el botón Play ahora, veremos que todos los elementos caen hacia abajo hasta desaparecer de la escena. Esto ocurre porque por defecto todos los actores están marcados como actores “móviles”. 5.  Para ello hacemos doble clic en el actor ‘Plataforma’ y en sus atributos desplegamos Physics (lsicas) y desmarcamos el atributo Movable (móvil). Pinchamos en Back y repeVmos el proceso con el actor ‘Puerta’. 6.  Pulsando ahora sobre Play, veremos como nuestro actor ‘Jugador’ es el único que cae hacia abajo hasta desaparecer, atravesando a la plataforma. Esto sucede porque no le hemos dicho que debe colisionar con la plataforma. Para conseguir esto hacemos doble clic sobre el actor ‘Jugador’ dentro del inspector (no el situado en la escena) para entrar en el modo de edición de Actor ProtoVpo. 7.  En la sección Library habiendo pulsado la pestaña Behaviors, buscamos Collide y lo arrastramos a la parte derecha del editor donde pone Drag your behaviours here para asociar dicho comportamiento a nuestro actor. En dicho comportamiento, cambiamos ‘Jugador’ por ‘Plataforma’ en el úlVmo desplegable: !
7
GameSalad – Juego de Plataformas Posicionar los actores en la escena 8.  Pulsamos Play para ver el resultado y efecVvamente vemos cómo el actor ‘Jugador’ ya no traspasa al actor ‘Plataforma’ y efecVvamente colisiona contra él. 9.  Pero para nuestra sorpresa, nuestro actor ‘Jugador’ no solo colisiona sino que además rebota constantemente. Esto es debido a que ambos actores Venen un factor de rebote establecido a 1, es decir, al colisionar rebota con la misma fuerza en senVdo contrario, lo que provoca el efecto rebote. Para solucionarlo, hacemos doble clic en el actor ‘Jugador’ del inspector, y cambiamos le valor del atributo Physics-­‐-­‐-­‐>Bounciness a 0. Hacemos clic sobre Back y repeVmos el mismo proceso sobre el actor ‘Plataforma’. Pulsamos Play para comprobar que ahora sí que el actor ‘Jugador’ se deVene al colisionar contra la plataforma. Alterna:va: como hemos visto, nuestra estrategia ha sido aplicar gravedad a toda la escena, e indicar qué elementos no queremos que se muevan (‘Plataforma’ y ‘Puerta’). Otra solución alternaVva podría haber sido no aplicar ningún Vpo de gravedad, y asignarle al actor ‘Jugador’ un comportamiento de Vpo Change Velocity, con Direc(on 270, y Speed 300. 8
GameSalad – Juego de Plataformas Controlando a nuestro personaje Ahora que tenemos a nuestro personaje descansando sobre la plataforma, vamos a establecer algunas reglas más para que el jugador pueda moverse a izquierda o a derecha, así como saltar: 1.  Hacemos doble clic sobre el actor ‘Jugador’ en el inspector y hacemos clic sobre el botón Create Group (crear grupo) situado en la parte superior derecha. Hacemos doble clic sobre el ptulo ‘Group’ y lo nombramos como ‘Controles’. 2.  Deseleccionamos el grupo recién creado y pulsamos el botón Create Rule (crear regla) para crear una regla justo debajo del grupo anterior. La seleccionamos y la arrastramos dentro del grupo que habíamos creado. 3.  Doble clic en el ptulo Rule y lo cambiamos a Mover Izquierda. También cambiamos mouse posiVon por key en el desplegable central de la regla. Aparecerá un botón llamado Keyboard que pulsaremos para que se nos muestre un teclado virtual. En él seleccionaremos la flecha izquierda. De esta forma, la regla se quedaría de esta forma: 9
!
GameSalad – Juego de Plataformas Controlando a nuestro personaje En este punto tenemos una regla que se acVvará cada vez que el usuario presione la tecla “flecha izquierda”. Ahora únicamente nos falta definir qué debe hacer el actor cuando esto suceda. 1.  Como lo que queremos hacer es que éste se desplace hacia la izquierda, incorporaremos a la regla un behavior (comportamiento) del Vpo Change APribute (cambiar atributo). Localizamos dicho comportamiento en la librería de Behaviors y lo arrastramos a la zona inferior de la regla, donde se muestra la eVqueta Drag your behaviours here. Asegúrate de que lo arrastras dentro de la regla, ya que de otra forma haríamos que el actor se estuviera moviendo constantemente, ya que la regla es la que controla cuando debe ejecutarse el comportamiento. 2.  En el campo Change APribute, pinchamos en el botón “…” asociado al campo y seleccionamos Jugador.MoVon.Linear.X, y en el campo To lo establecemos a -­‐100 !
10
GameSalad – Juego de Plataformas Controlando a nuestro personaje 3.  Esto hará que nuestro personaje adquiera una velocidad de -­‐100, es decir, el personaje se moverá hacia la izquierda del eje X. También queremos que cuando deje de pulsarse la tecla, su velocidad vuelva a ser 0. Para conseguir esto debemos desplegar la sección Otherwise (en otro caso) de la regla, y arrastramos el comportamiento Change APribute a dicha sección manteniendo pulsada la tecla Alt, con lo que haremos que se realice una copia del mismo. Establecemos el valor To a 0. !
4.  Ya tenemos la regla que nos permiVrá mover a nuestro personaje a la izquierda, así que debemos repeVr los mismos pasos para crear una regla que asocie la tecla “flecha derecha”. Para ello seleccionamos la regla Mover Izquierda, seleccionamos Edición-­‐-­‐-­‐>copiar en el menú superior, y posteriormente en Edición-­‐-­‐-­‐>pegar. De esta forma habremos creado un duplicado de la regla seleccionada. Ahora simplemente debemos cambiar el ptulo a Mover Derecha, al pulsar el botón Keyboard seleccionar la tecla “flecha derecha” y por úlVmo cambiar el valor del campo To a 100. 11
GameSalad – Juego de Plataformas Controlando a nuestro personaje 8.  Ahora podremos hacer clic sobre el botón Play y ver el resultado. Si todo ha salido bien, deberemos ser capaces de mover a nuestro actor ‘Jugador’ de izquierda a derecha. Pero si nos fijamos, nos encontramos con otro problema, al desplazar a nuestro personaje vemos cómo este va perdiendo velocidad progresivamente hasta quedar parado. Esto es debido a la fricción entre los actores, que es otra de las propiedades lsicas de los actores. Para evitar esto debemos editar tanto el actor ‘Plataforma’ como ‘Jugador’ y establecer el atributo Physics -­‐-­‐-­‐> Fric(on a 0. 9.  Por úlVmo, vamos a hacer que nuestro personaje sea capaz de saltar. Para ello creamos una nueva regla dentro del grupo Controles que renombraremos a Saltar. Esta regla será del Vpo Actor receives | key | space | is down, y dentro de ella arrastraremos un comportamiento de Vpo Change APribute de la variable self.Mo(on.Linear Velocity.Y a 200. 12
GameSalad – Juego de Plataformas Condiciones de victoria y de pérdida Cuando se creó el actor ‘Puerta’, el objeVvo que Vene que realizar el usuario será alcanzarla para completar el nivel. Además, deberá evitar caer al vacío pues en ese caso se reiniciará la parVda. Vamos a hacer que cuando el jugador alcance la puerta, se muestre un texto indicando que ha vencido, y posteriormente se reiniciará la escena: 1.  En el inspector de actores, hacemos doble clic en el actor ‘Jugador’ para incluir ciertas reglas lógicas. 2.  Creamos una nueva regla que la llamaremos “Victoria”, a la cual cambiaremos el valor mouse posi(on a overlaps or collides, cambiando además el valor del úlVmo desplegable y seleccionaremos ‘Puerta’. Así indicamos que la regla se acVvará cada vez que un actor de Vpo ‘Jugador’ colisione con un actor de Vpo ‘Puerta’. 3.  Localizamos el comportamiento Display Text de la librería de Behaviors, y lo arrastramos a la zona de comportamientos de la regla. Cambiamos el texto que se muestra por ‘¡Victoria!’. 13
GameSalad – Juego de Plataformas Condiciones de victoria y de pérdida 4.  Ahora vamos a hacer que la escena se reinicie, para lo cual debemos hacer uso del comportamiento Reset Scene, pero para que no lo haga instantáneamente al tocar la puerta, vamos a incluir un comportamiento Timer (temporizador) donde indicaremos los segundos que se debe esperar antes de reiniciar la escena. Localizamos el comportamiento Timer y lo arrastramos justo debajo del comportamiento Display Text que acabamos de incluir, pero asegúrate de que se incluye dentro de la regla ‘Victoria’. Cambiamos el valor del temporizador de 5 a 1 segundo, Every por A_er y marcamos la opción Run to Comple(on. Por úlVmo, arrastramos un comportamiento de Vpo Reset Scene a la zona de comportamientos del Timer. !
Asegúrate de que la regla queda como en la imagen de arriba 5.  Ejecuta la escena pulsando Play y comprueba que todo funciona correctamente 14
GameSalad – Juego de Plataformas Condiciones de victoria y de pérdida Ahora crearemos la segunda parte, la que nos hará que el jugador pierda si cae al vacío. En ese caso también haremos que la escena se reinicie. Sigue estos pasos: 1.  Crea un nuevo actor pinchando en el botón + del inspector (pestaña Actors). Hacemos clic sobre su nombre y la renombramos como ‘Abismo’. 2.  Hacemos doble clic sobre el cuadrado del actor para editarlo, y establecemos el atributo Width (dentro de Size) a 480. También desacVvamos el atributo movable para que no le afecte la gravedad. 3.  Volvemos haciendo clic en Back y arrastramos el actor a una zona por debajo de la instancia del actor ‘Plataforma’, centrado en el ancho de la escena. 4.  Ahora hacemos doble clic sobre el actor Jugador dentro del inspector, y lo editamos incluyendo una nueva regla. Esta la renombraremos a ‘Game Over’, y cambiaremos mouse posi(on por overlaps or collides seleccionando posteriormente el Vpo de actor ‘Abismo’. !
15
GameSalad – Juego de Plataformas Condiciones de victoria y de pérdida 5.  Ya solo nos queda reiniciar la escena, para lo cual deberemos arrastrar un comportamiento de Vpo Reset Scene desde la librería de Behaviors a la zona de comportamientos de la regla. Esta vez no uVlizaremos ningún Vpo de (mer ya que queremos que el reinicio se haga de forma instantánea: 6.  Si pulsamos Play podremos ver si todo funciona correctamente. Por úlVmo, ‘Abismo’ no debería mostrarse ya que es una mera zona de control para ver cuando el Jugador se ha precipitado al vacío, deberíamos ocultarlo. Para hacer eso simplemente debemos hacer doble clic sobre el actor ‘Abismo’ dentro del inspector para acceder a la edición de sus atributos, y desmarcar Visible dentro de Graphics. 16
GameSalad – Juego de Plataformas Mejorando nuestro juego Completamos un poco más nuestro juego incluyendo varios elementos adicionales. Por una parte, vamos a hacer el nivel algo más grande, y lograr que la cámara se mueva siguiendo a nuestro personaje. Además, incluiremos unas antorchas como decoración que nos permiVrán descubrir los sistemas de parpculas. Por úlVmo, incluiremos algo de sonido y música para amenizar las parVdas de nuestro juego. Empecemos haciendo el nivel más grande y que la cámara siga al personaje: 1.  En el editor de escena, hacemos clic en la pestaña Scene del inspector, y cambiamos el atributo Width (dentro de Size) a 1500. 2.  Colocamos varias plataformas como mejor nos parezcan, colocando una puerta al final. Un ejemplo de distribución podría ser el siguiente: !
17
GameSalad – Juego de Plataformas Mejorando nuestro juego 3.  También haremos clic en la instancia de actor ‘Abismo’ y la esVraremos para que ocupe toda la zona inferior de nuestra escena (si no aciertas a seleccionarla, edita el actor y vuelve a acVvar la casilla Graphics-­‐-­‐-­‐>Visible). 4.  Si pulsamos Play, veremos que la cámara permanece estáVca y no sigue a nuestro personaje. Para ello lo primero que debemos hacer es añadir a nuestro actor ‘Jugador’ el comportamiento Control Camera, así que hacemos doble clic en el actor situado en el inspector, y arrastramos este comportamiento desde la librería de Behaviors situándolo al final de las reglas del personaje. 5.  Si ejecutamos ahora, veremos efecVvamente la cámara sigue a nuestro personaje, aunque vemos que no lo hace hasta que llega prácVcamente al final de la zona visible, cuando lo mejor sería hacer que la cámara empiece a seguirlo tan pronto alcancemos la zona central. Para conseguir esto hacemos clic en el botón Camera mode, y veremos cómo se nos muestra un marco amarillo con unos pivotes en cada lateral. Esta zona amarilla es la que determina cuando se acVva el control de cámara. Vamos a arrastrar los pivotes hasta el centro para conseguir lo que buscamos. Botón Camera mode 18
!
GameSalad – Juego de Plataformas Mejorando nuestro juego Ya que nuestro juego puede pecar de simplista, vamos a crear un elemento decoraVvo: antorchas encendidas. Este elemento nos servirá para descubrir el funcionamiento de los sistemas de parpculas: 1.  Importa a la librería de imágenes los ficheros torch.png y par(cle.png y arrastramos la imagen torch al inspector de actores, para crear un actor que renombraremos a ‘Antorcha’. 2.  Hacemos doble clic sobre él y desmarcamos el atributo Physics-­‐-­‐-­‐>Moveable. Le incluimos un comportamiento del Vpo Par(cles, que renombraremos a ‘Llama’. Los sistemas de parpculas son elementos que nos permiVrán simular efectos como fuego o humo, simplemente ajustando los numerosos parámetros con los que cuenta. Para conseguir nuestro efecto de fuego estableceremos los siguientes parámetros: •  Sección Spawn Rate •  Number of par(cles: 100 •  Par(cle Startup Time: 2 •  Par(cle Life(me: 4 •  Sección Velocity/Posi(on •  Emiter Offset: 0 y 8 •  Direc(on: 90 •  Speed: 20 •  Sección Size: •  Size: 15 •  Seleccionamos Size changes to •  Target Size: 5 •  Dura(on: 2 •  Sección Color: •  Seleccionamos un color naranja •  Seleccionamos Color changes to •  Blending: Screen •  Target Color: negro •  Dura(on: 2 •  Sección Image: •  Set Image To: parVcle !
3.  Ahora solo debemos colocar varios actores ‘Antorcha’ en nuestra escena y podremos ver cómo al 19
pulsar Play se ‘encenderán’. GameSalad – Juego de Plataformas Mejorando nuestro juego Para terminar de completar nuestro nivel, vamos a incorporar música de fondo, así como un efecto sonoro que se oirá cuando caigamos al abismo: 1.  Lo primero que haremos será cargar los ficheros de sonido. Seleccionamos Sounds en la librería y hacemos clic sobre el botón +. Seleccionamos los ficheros music.mp3 y gameover.wav. GameSalad nos preguntará el Vpo de fichero que se trata, si es música o si es un sonido (efecto sonoro). Indicaremos que music.mp3 es música (Import as Music) y que gameover.wav es un sonido (Import as Sound). 2.  Para que suene la música de fondo, haremos uso del comportamiento Play Music. Este comportamiento debemos asociárselo a algún actor que sepamos que siempre va a estar presente en el nivel y que no va a ser destruido a la mitad del mismo. El candidato ideal es el actor ‘Jugador’, así que hacemos doble clic sobre él y le añadimos al final el comportamiento Play Music, arrastrándolo desde la librería. Dentro del comportamiento seleccionaremos el fichero a reproducir (music) y dejaremos la casilla Loop marcada para la música no pare. 3.  De forma similar, vamos a uVlizar el comportamiento de Vpo Play Sound para reproducir el efecto de sonido cada vez que caigamos al abismo. En esta ocasión, debemos asociar dicho comportamiento a la regla “Game Over” que ya habíamos creamos previamente. Arrastramos desde la librería y lo situamos bajo el comportamiento “Reset Scene” que ya poseía dicha regla. El comportamiento recién incorporado nos permiVrá seleccionar el fichero a reproducir (gameover), así como ajustar algunos parámetros como el volumen o el tono. 20
GameSalad – Juego de Plataformas Inclusión de coleccionables Para completar las funcionalidades de nuestro juego, vamos a incluir monedas que el usuario tenga que recoger. Además, incluiremos un marcador con el número de monedas que llevamos recogidas hasta el momento: 1.  Lo primero que tendremos que hacer será crear un nuevo atributo de juego en el que guardaremos el valor del número de monedas recolectadas hasta el momento. Para ello, dentro del inspector y teniendo la pestaña Game seleccionada, hacemos clic sobre el botón APributes, y luego en el botón + para crear un nuevo atributo de Vpo integer (entero) que renombraremos a “Monedas” y dejaremos inicializado a 0. 2.  Importamos a la librería de imágenes la imagen graphics/Coin.png, y la arrastramos al inspector para crear un actor que renombraremos a “Moneda”. 3.  Editamos el actor “Moneda” y desmarcamos Physics-­‐-­‐-­‐>Moveable. Además, incluiremos una regla del Vpo Actor receives event | overlaps or collides | with actor of type | Jugador . 21
GameSalad – Juego de Plataformas Inclusión de coleccionables 4.  Arrastramos dentro de la regla un comportamiento del Vpo Change APribute, seleccionando el atributo game.Monedas y estableciendo el campo To a game.Monedas+1. Además, justo debajo de este comportamiento incorporaremos otro de Vpo Destroy justo debajo. 5.  Creamos varias instancias del actor ‘Moneda’ y las colocamos dispersas por la escena. Habrá que ir colocándolas una a una. Si quieres ser preciso a la hora de colocarlas, puedes haciendo doble clic sobre cada una de ellas y editando las propiedades Posi(on-­‐-­‐-­‐>X y Posi(on-­‐-­‐-­‐>Y. !
22
GameSalad – Juego de Plataformas Inclusión de coleccionables 6.  Ahora vamos a crear el marcador que nos muestre el contador de monedas. En el inspector creamos un nuevo actor que renombraremos a ‘Marcador’. Lo editamos y desmarcamos Physics-­‐-­‐-­‐
>Moveable. Además, cambiaremos Color-­‐-­‐-­‐>Alpha a 0, para que no se muestre el recuadro blanco. 7.  Arrastramos un comportamiento de Vpo Display Text al actor y establecemos el valor a game.Monedas. Tras esto, arrastramos el actor a la esquina superior derecha dentro del recuadro que delimita la cámara. 8.  Si ejecutamos ahora nuestra escena podremos comprobar cómo nuestro personaje puede ir recogiendo las monedas y se irá actualizando el contador. El problema es que según se mueve la cámara, el marcador también se mueve. Para solucionar creamos otra capa (layer) dentro de la escena, de forma que podamos incluir en ella aquellos elementos que conformen la interfaz de usuario, como en este caso sería el marcador: En el inspector, seleccionamos Scene y luego hacemos clic sobre Layers (capas). Únicamente exisVrá una capa llamada Background, así que crearemos otra haciendo clic sobre el botón + y renombrándola a Interfaz. Una vez creada desmarcamos la casilla Scrollable para indicar que dicha capa será estáVca. Por úlVmo, desplegamos la capa Background, buscamos el actor Marcador y lo arrastramos a la capa Interfaz. 9.  Si ejecutamos ahora, veremos que hemos conseguido que nuestro marcador no se mueva y nos 23
muestre en todo momento el número de monedas recolectadas GameSalad – Juego de Plataformas Creación del menú principal y de más niveles Para terminar con esta prácVca, vamos a crear un menú principal y un segundo nivel al que accederemos tras superar el primero: 1.  Hacemos clic sobre Home, y en la pestaña Scenes pulsamos sobre el botón + para incluir una escena adicional. Arrastramos esta escena al principio para que se sitúe por delante de nuestro escena Ini(al Scene. Renombramos la escena recién creada a ‘Menu’. 2.  Doble clic sobre la escena ‘Menu’ y creamos un nuevo actor que llamaremos ‘Boton’, el cual pondremos su atributo Color-­‐-­‐-­‐>alpha a 0, y le añadiremos un comportamiento Display Text con el texto ‘Empezar Juego’. 3.  Creamos una nueva regla, estableciendo mouse buPon en el desplegable central. Incluimos a esta regla un comportamiento de Vpo Change Scene, dejándola establecida a Next Scene. 4.  Arrastramos el actor ‘Boton’ al centro de la escena, y probamos que efecVvamente al pulsar sobre el actor, el juego comienza. !
24
GameSalad – Juego de Plataformas Creación del menú principal y de más niveles Ahora vamos a crear el segundo nivel de nuestro juego: 1.  Dentro de Home, creamos una nueva escena que llamaremos ‘Level 2’, y hacemos doble clic sobre él para editarlo y hacer algunos preparaVvos previos. 2.  Volvemos a incluir gravedad en la escena, estableciendo Gravity-­‐-­‐-­‐>Y a 300 dentro de la sección Scene del inspector. También pinchamos sobre Layers para incorporar la capa Interfaz que necesitaremos para incluir el marcador de monedas, desmarcando Scrollable. También volveremos a crear una instancia del marcador posicionada en la esquina superior derecha (edita sus atributos Posi(on para establecer los valores X e Y a los mismos valores que la escena anterior, para que no parezca que el marcador se “mueve” entre escenas. También moveremos este actor de la capa Background a la capa Interfaz. Por úlVmo, acVva el modo cámara y ajusta los pivotes al centro de la escena como ya hiciéramos en la escena anterior. 3.  Una vez que hemos hecho algunos ajustes que tendremos que repeVr en todas las escenas según avance nuestro juego, sería una buena idea copiar esta escena a una que renombraríamos como ‘PlanVlla’, y que podamos uVlizar como base para cada uno de los futuros niveles que necesitáramos crear. 25
GameSalad – Juego de Plataformas Creación del menú principal y de más niveles 4.  Ahora solo tendremos que dimensionar nuestra escena al tamaño que queramos (recuerda que se realiza en el editor de escena: hacemos clic en la pestaña Scene del inspector, y cambiamos dentro de Size el atributo Width y Height (por ejemplo 750 de Width y 1500 de Height) 5.  Colocamos los elementos (jugador, plataforma, puerta…) sobre ella en las posiciones que creamos convenientes. Por ejemplo, puedes disponer los elementos como la pantalla que de la izquierda. 6.  Creamos un nuevo actor desde el inspector que renombraremos a ‘TextoVictoria’, el cual editaremos para cambiar su atributo Color-­‐-­‐-­‐
>Alpha a 0, e incorporarle un comportamiento de Vpo Display Text donde pondremos el texto “’¡Has vencido!’. Arrastramos dicho actor al centro de la escena. 26
!
GameSalad – Juego de Plataformas Creación del menú principal y de más niveles 7.  Por úlVmo, solo nos queda indicar que, cada vez que alcancemos una puerta, pasaremos de nivel. Para ello editamos el actor ‘Jugador’ y localizamos la regla “Victoria” que habíamos creado previamente. Eliminamos el comportamiento Reset Scene y le incluimos uno nuevo del Vpo Change Scene, dejándolo establecido a Next Scene. Y hasta aquí nuestro primer juego de plataformas con el que podremos pasar unos raVtos muy diverVdos cogiendo las monedas… lo único que haría falta sería publicarlo. Para elle en el icono ‘Publish’ accedemos y con la cuenta de GameSalad podremos publicarlo para Android, iOS, HTML5… pero, claro no nos lo permite si no somos usuarios registrados de pago, comprender que este magnífico creador de juegos en 2D es gratuito pero para publicarlo es cuando solicitan el pago. Espero que haya sido producVvo y os animo a que realicéis vuestros propios juegos y aprender otros nuevos con los tutoriales existentes. 27
Andrés Carrillo Universidad Politécnica de Cartagena Campus Muralla del Mar, s/n 30202 Cartagena Tel. Fax. E-­‐mail Twi}er Lista de correo
Www +34 968 33 89 40 +34 968 32 53 45 andres.carrillo@upct.es @CincubatorHUB @andr3sico cloud-­‐incubator@upct.es www.cincubator.com