Un ratón bien feo.

Nuestro primer videojuego con Scratch (3): el gato encuentra al ratón

El mes pasado comenzaba una serie en PItando en la que trataba de crear con vosotros un videojuego muy básico en Sratch. Constaba de, a priori, cuatro partes:

  1. Mover al gato en las cuatro direcciones y hacer que rebote en los bordes del escenario. Conseguido en la primera entrega.
  2. Programar la lógica de rebote para cuando el gato se encuentre con una pared roja. Conseguido en la entrega anterior.
  3. Programar la lógica de “gato encuentra a ratón”.
  4. Proponer un esquema de puntuación para poder competir con nuestros amigos.

En esta entrada de hoy, la tercera de la serie, vamos a ir un paso más allá y vamos a programar sobre un escenario básico la detección del ratón, además de resolver los ejercicios que os planteaba en la última entrada.

Si te animas, que espero que sí, sigue leyendo 🙂

Recuperar el proyecto del ordenador

Como venimos haciendo y para dar cabida a todos los lectores, tengáis o no una Raspberry Pi, haremos este ejercicio sobre el navegador web. Abre la página del editor on-line de Scratch y sube el fichero que guardábamos la semana pasada. Si no lo tienes, ¿qué mejor momento el de ahora para hacer las dos primeras partes del ejercicio? 😉

Para ello, ve al menú Archivo y pulsa la opción Subir de tu computadora.

Opción para subir un proyecto al editor Web de Scratch
Opción para subir un proyecto al editor Web de Scratch

Localiza el fichero y confirma la selección, tras lo cual el editor te pedirá confirmación en inglés (Replace contents of the current project?). Confirma la carga con el botón OK y, si todo ha ido bien, verás el editor cargado con el estado en el que lo dejamos en la ocasión pasada.

Diseñar el ratón

Para detectar un ratón, primero hay que disponer de un ratón en el proyecto. Como lamentablemente, la librería de objetos de Scratch no tiene ratones, vamos a aprovechar la ocasión para diseñar uno.

En Scratch el ratón va a ser un objeto o sprite y, como tal, necesita un disfraz. Todo esto lo aprendíamos en la primera de las apariciones de Scratch en este blog que, si no recuerdas, te invito a repasar.

Para empezar un objeto, hay que usar la opción Dibujar un objeto del panel de control de objetos:

Opción para comenzar a dibujar un nuevo objeto
Opción para comenzar a dibujar un nuevo objeto

Al hacer click en ese pincel, se nos abrirá un editor donde intentaremos dibujar un ratón a mano alzada con el pincel:

Un ratón bien feo.
Un ratón bien feo.

Si os fijáis en el escenario, veréis que el ratón ha aparecido en él y, en comparación con el gato naranja protagonista de nuestro experimento, es enorme.

Así visto, el ratón surgido de nuestras pesadillas podría comerse al gato de un bocado.
Así visto, el ratón surgido de nuestras pesadillas podría comerse al gato de un bocado.

Para encoger al ratón:

  • Lo que haremos será usar el botón Convertir a vector que hay en la esquina inferior derecha de la pantalla.
  • Una vez hecho esto, seleccionamos el ratón haciendo click y arrastrando el ratón de forma que describa la diagonal de un rectángulo que abarque al ratón entero. Si lo hacemos bien, veremos que el rectángulo desaparece y es sustituido por otro rectángulo de trazos más gruesos y con varios puntos de interacción:
Ratón seleccionado
Ratón seleccionado
  • Una vez seleccionado, hacemos click en una de las esquinas, y arrastramos de tal forma que el ratón merme a unas proporciones que sean coherentes con el tamaño del gato:
Proporciones mejoradas
Proporciones mejoradas

No hay que salvar explícitamente el ratón como un objeto, sino que podemos pasar directamente a la pestaña de Programas para programar el resto del ejercicio.

Antes, colocamos el ratón en la esquina inferior derecha del escenario, simplemente arrastrándolo.

Programar la detección del ratón por parte del gato

No hay más que comprobarlo de una forma muy parecida a la detección de paredes:

Detección del ratón
Detección del ratón

En este caso, la novedad estriba en el bloque decir, que se encuentra en el grupo de controles de apariencia.

Si pruebas el resultado, verás que el gato dice “He ganado” al encontrar al ratón, y en 5 segundos vuelve a la posición de partida.

Resultado final
Resultado final

En el siguiente capítulo complicaré un poco esta solución para que el programa se detenga y pregunte al usuario si quiere repetir el desafío. Además, nos queda por realizar el esquema de puntuaciones y convendrá tener un escenario algo más elaborado, con más paredes.

Recuerda guardar el proyecto en tu ordenador como ya vimos en otras ocasiones.

Soluciones a los ejercicios de la entrega anterior

Los ejercicios decían así:

Si experimentas lo suficiente verás que puedes hacer que una pared se sitúe en zonas “angostas” del Sprite. Por ejemplo, que un extremo de una pared se cuele entre las orejas o los bigotes de nuestro protagonista. También ocurre que, si dejas demasiado tiempo pulsada una misma tecla, el programa acaba por fallar 😉 . Se comporta mejor que cuando pusimos la solución de la variable, sí… pero no del todo bien, y te toca explicar por qué y encontrar una solución.

Ejercicio 1: reproduce esos comportamientos y ofrece una explicación a los mismos.

Ejercicio 2: propón y construye al menos dos soluciones a estos comportamientos.

Ejercicio 3: Si, al detectar una pared, paramos el gato en vez de hacer que rebote, el programa funciona mal. ¿Por qué?

En primer lugar, podemos situar esquinas de las paredes en “zonas angostas” del objeto porque éste se diseña sobre un fondo transparente, y la detección se basa en colores opacos. Así, el gato no tiene fondo realmente, aunque en la paleta de objetos lo parezca.

Para entender correctamente los siguientes razonamientos es esencial haber realizado el ejercicio por tu cuenta; no es una lectura fácil si no viene respaldada por la práctica.

Abusar de las teclas tiene un efecto perjudicial en el resultado final por dos razones:

  • Todos los bloques del programa se ejecutan al mismo tiempo: concurrentemente. Deliberadamente he programado un rebote de la misma igual al desplazamiento que provocamos con las teclas.  El rebote se compensa por una pulsación de una tecla si la variable parar se pone a valor 0, es decir: el gato avanza lo mismo rebotando que pulsando una (1) vez una flecha. Por lo tanto, si mantenemos pulsada la tecla, cualquier desequilibrio en el sistema de reparto de proceso por los distintos hilos que maneja Scratch nos acerca a una situación inestable.
  • Además, deliberadamente también, el programa está hecho de tal forma que tan pronto comienza el desplazamiento del rebote, el gato deja de tocar la pared y automáticamente el valor de parar pasa de ser 1 (tocando pared) a 0, lo cual permite al resto de los bloques interpretar las pulsaciones del teclado.

Podemos modificar el bloque de rebote de, al menos, dos formas:

  • Evitar que el resto de los programas interpreten las teclas durante un tiempo suficiente para que el rebote se ejecute (introduciríamos una espera de 1 segundo o más antes de poner parar a 0)
  • Movernos más distancia en el rebote (por ejemplo, 15 puntos) en el mismo tiempo (1 segundo), lo cual haría que el gato rebotase el triple de distancia que la que avanza con el teclado, y a mayor velocidad. Eso nos sacaría del “umbral de inestabilidad” que hemos estado experimentando.

Por último, si en vez de rebotar hacemos que el gato deje de moverse al tocar una pared, el programa funcionará mal porque, salvo contadísimas excepciones, la variable parar nunca podrá tomar el valor 0. Estaremos siempre en una situación de contacto con la pared en la que, tal y como hemos programado el juego, impedimos que el programa procese las teclas para que el gato pueda alejarse de la misma.


Espero que haya sido interesante. Podéis dejarme cualquier comentario en esta misma entrada, o enviándome cualquier comentario a tavés del formulario de contacto y la dirección de correo que allí os indico. Recordad también que PItando está tanto en twitter, como en Facebook, y en Google+ también podéis seguir mis publicaciones, incluyendo las del podcast (iTunesiVooxRSS).

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *