1. Libros y videos
  2. Scratch 3
  3. Técnicas para la animación
Extrait - Scratch 3 Introducción a la programación, la robótica y la IA a través del juego
Extractos del libro
Scratch 3 Introducción a la programación, la robótica y la IA a través del juego Volver a la página de compra del libro

Técnicas para la animación

Introducción

Un proyecto de animación es un proyecto que consiste en una secuencia de imágenes en movimiento para crear un vídeo, un dibujo animado o una narración. Muchos usuarios de Scratch realizan cortometrajes, vídeos musicales y tutoriales utilizando diversas técnicas. En la web oficial hay estudios dedicados a estos temas.

Hacer animación requiere conocer técnicas para hacer que los personajes hablen, se muevan, interactúen o simplemente para hacer avanzar una secuencia de imágenes muy rápidamente con el fin de realizar stop motion.

En todos estos proyectos, los bloques de la categoría Apariencia se utilizan para dar vida y dinamismo a los personajes y los escenarios. Los bloques Eventos, con el envío y la recepción de mensajes, son útiles para sincronizar las acciones.

En este capítulo descubrirá algunas técnicas de animación que también pueden utilizarse en videojuegos. Veremos cómo animar disfraces, sobre todo cuando los personajes se mueven, y cómo animar sus bocas en función del volumen del sonido. Se abordarán varias técnicas para simular el desplazamiento; además, aprenderá a implementar desplazamientos horizontales y verticales (scrolling).

Animación de disfraces

Algunos de los objetos disponibles en la biblioteca tienen varios disfraces para animarlos. Para saber si un objeto puede animarse, basta con pasar el ratón por encima de su miniatura en la biblioteca. Una de las animaciones más comunes es el ciclo de caminar (o volar, para los pájaros). Esto se aplica tanto a los animales (gatos, por ejemplo) como a otros personajes.

Un ciclo de caminar es una serie de disfraces que se despliegan uno tras otro para simular la acción de caminar (o volar). Se utilizan para:

  • personajes en movimiento;

  • crear películas de animación;

  • juegos.

1. Un gato andante

El gato de Scratch tiene dos disfraces que, combinados, crean un ciclo de marcha. He aquí un primer ejemplo de programa que utiliza un bucle de repetición y el bloque siguiente disfraz:

images/05img01.png

La primera pila de bloques se utiliza para fijar el sentido de giro del gato:

 al hacer clic en la bandera verde

 fijar estilo de rotación a izquierda-derecha // para definir la forma en que el gato girará en el escenario y evitar que tenga la cabeza apuntando hacia abajo.

Las dos pilas de bloques siguientes corresponden a algoritmos para mover el objeto a izquierda y derecha mientras se anima.

 al presionar tecla flecha izquierda

 apuntar en dirección -90 // el gato mira hacia la izquierda.

 repetir 5 // abre un bucle de repetición. El programa insertado en este bucle se repetirá cinco veces. Por lo tanto, el gato avanzará y cambiará de disfraz cinco veces.

 siguiente disfraz // el disfraz es sustituido...

Creación de hologramas

La novedad de Scratch 3 es que puede utilizarse en tabletas y teléfonos móviles. La superficie plana de estos dispositivos facilita la creación de hologramas con Scratch. Luego se proyectan en una pantalla hecha con papel grueso transparente colocado sobre la pantalla del dispositivo. Yo utilizo fundas transparentes como las que se usan para encuadernar documentos.

1. Fabricar una pantalla de proyección

Una pantalla holográfica está formada por cuatro triángulos isósceles (transformados en trapecios). Como recordatorio, un triángulo isósceles es aquel cuyos lados opuestos no paralelos tienen la misma longitud.

images/05img06.png

Estas son las principales pantallas que se pueden producir en función de su equipo de proyección (smartphone o tableta, pantalla de 4’’ - 5’’ - 7’’ - 10’’).

images/05img07.png
images/05img08.png

2. Posicionamiento de hologramas

Dependiendo del tamaño de la pantalla de su dispositivo, de la pantalla fabricada y del tamaño de los objetos utilizados, tendrá que hacer ajustes en su posición.

Para facilitar la colocación, puede dibujar un objeto cuadrado que actuará como referencia para la posición central de la pantalla. Los cuatro objetos utilizados se posicionarán a cada lado. Una vez ubicados correctamente los elementos, puede borrar el objeto o simplemente ocultarlo mientras se ejecuta el programa.

images/05img09.png

El tamaño de los elementos cambia cuando está en modo pantalla completa o en modo espacio de trabajo (pantalla reducida).

Los objetos, según su posición en la pantalla, tienen orientaciones diferentes.

  • Objeto 1 = Dirección 90

  • Objeto 2 = Dirección 180

  • Objeto 3 = Dirección -90

  • Objeto 4 = Dirección 0

images/05img10.png

Hay distintas formas de cambiar o especificar la orientación de los objetos, dispone de varias posibilidades: 

 En la ventana del objeto, seleccione Dirección. Cambie la dirección utilizando la flecha o escribiendo el valor deseado.

images/05img11.png

 O especifique la dirección de cada objeto directamente...

Desplazar un fondo

Un ciclo de marcha se combina a menudo con un fondo que se desplaza para acentuar la impresión de que el personaje se mueve. La técnica consiste en poner el fondo en bucle a medida que el personaje se mueve.

Este proyecto puede descargarse del sitio web de Ediciones ENI con el nombre Avery caminando y de fondo.sb3.

1. El personaje y los fondos

Para este ejemplo de desplazamiento, vamos a utilizar el objeto Avery Walking.

 Abra la biblioteca de objetos haciendo clic en el icono Elige un objeto.

 Seleccione el objeto Avery Walking, que tiene cuatro disfraces.

Se utiliza un único fondo. Se duplica dos veces y se realizan modificaciones gráficas para dar la impresión de que el personaje se ha movido.

 En la ventana de fondos, seleccione el icono Elige un fondo para abrir la biblioteca.

 En la biblioteca, elija la miniatura Wall 1. Este primer fondo no se modificará gráficamente.

images/05img15.png

Este fondo se duplica dos veces, es decir, este proyecto utilizará tres fondos diferentes.

 Seleccione la pestaña Fondos (1). Se abren la paleta gráfica y la ventana que muestra los distintos fondos (como para la lista de disfraces que hemos visto anteriormente).

Hay dos miniaturas en la lista de fondos:

  • fondo 1, que corresponde a un lienzo vacío (2).

  • Wall 1, el fondo importado de la biblioteca (3).

images/05img16.png

 Borre el fondo 1 seleccionando la pequeña cruz en la parte superior derecha...

Crear un diálogo

Este proyecto puede descargarse del sitio web de Ediciones ENI; se llama Avery y Abby.sb3.

images/05img20.png

Para crear un diálogo entre al menos dos personajes, es importante prestar atención al tiempo de espera entre frases para que el diálogo fluya sin problemas. En este proyecto va a utilizar dos tipos de procedimiento para crear un diálogo. Se basan en:

  • el tiempo de espera entre preguntas y respuestas;

  • el envío y recepción de mensajes específicos para desencadenar acciones.

Para este proyecto, vamos a reutilizar el proyecto Avery caminando y de fondo.sb3. Se ampliará con otros dos objetos y se renombrará Avery y Abby.sb3.

 Abra el archivo Avery caminando y de fondo.sb3.

 Si está trabajando en la versión en línea, cambie el nombre directamente en la casilla correspondiente.

images/05img21.png

 Si utiliza la versión local, seleccione Guardar en tu ordenador (2) en el menú Archivo (1).

images/05img22.png

Ahora tiene dos archivos separados.

1. Los objetos

El objeto Avery Camina

El objeto existente pasará a llamarse Avery Camina. En la pestaña Disfraces, tiene que borrar los cuatro disfraces Camina Izquierda 1 - 2 - 3 - 4, ya que este personaje solo se moverá hacia la derecha.

images/05img23.png

El programa se mantiene sin cambios, pero se completará con:

  • un programa inicial para detener la marcha cuando Avery se encuentra con Abby;

  • un segundo para que pueda reanudar su marcha cuando termine la discusión con Abby.

El objeto Abby

Extraído de la biblioteca de objetos, este personaje llamado Abby viene con cuatro disfraces.

images/05FI26.png

 Haga clic con el botón derecho en la miniatura del primer disfraz abby-d y seleccione duplicar (1). Se ha creado un disfraz con el nombre abby-d2 (2).

 Utilice la herramienta Voltear horizontalmente (3) para que este nuevo disfraz se vea hacia la izquierda.

images/05img24.png

 Dé la vuelta también a los otros disfraces: abby-a, abby-b, abby-c.

Avery dialogo

Este objeto se utilizará durante la fase de diálogo entre los dos personajes.

 Seleccione el personaje Avery de la biblioteca de objetos y nómbrelo Avery dialogo en la ventana de objetos.

Este objeto tiene dos disfraces que usará en su animación cuando Avery hable con Abby.

images/05img25.png

2. Los programas

Programa Avery Camina

El programa...

Sincronización labial

La sincronización labial consiste en modificar la boca (su forma y tamaño) en función del sonido emitido. Este proyecto puede descargarse de las páginas web de Ediciones ENI con el nombre Fantasma.sb3.

1. Objeto y nivel de volumen

En este proyecto, vamos a ver cómo modificar el disfraz de acuerdo con el volumen del sonido. El programa utilizará el bloque volumen del sonido situado en la categoría Sonido.

Con Scratch, puede medir la entrada de volumen del micrófono. Los valores de volumen medidos por este bloque están comprendidos entre 0 y 100.

El personaje

Vamos a utilizar un fantasma disponible en la biblioteca de objetos que tiene la ventaja de disponer de disfraces muy expresivos.

 En la biblioteca de objetos, seleccione Ghost.

Este personaje tiene cuatro disfraces:

 En la pestaña Disfraces, haga clic con el botón derecho en la miniatura del disfraz ghost-b.

 Seleccione borrar.

images/05img33.png

 Haga lo mismo con el disfraz ghost-d.

Solo quedan dos disfraces, que serán rebautizados: ghost-a pasa a ser ghost-3 y ghost-c pasa a ser ghost-6.

images/05img34.png

 Utilizando el disfraz ghost-3 como punto de partida, creará otros cuatro disfraces que cambian el tamaño de los ojos y la boca. Para ello:

 Haga clic con el botón derecho del ratón en el disfraz ghost-3 y seleccione duplicar.

 Nombre a este nuevo disfraz ghost-1 (1) y colóquelo...

Conclusión

Con Scratch, puede crear fácilmente animaciones sencillas. Y con un poco de rigor, proyectos más complejos. En el capítulo Juego del laberinto, se utiliza una animación para introducir el juego. Hoy en día, los videojuegos se presentan en forma de películas de animación y hay interludios en el propio juego.

Con alumnos de primaria (3.º a 6.º ), hemos realizado cortometrajes sobre el tema de la arqueología. También hemos reinterpretado obras de Molière. ¡No faltan proyectos!