Cómo utilizar un GIF en Scratch: creando objetos animados

Inicio / Nivel / Medio / Cómo utilizar un GIF en Scratch: creando objetos animados

Introducción

Los GIF han vuelto a estar de moda en los últimos tiempos al permitir mostrar pequeñas animaciones en bucleo, que se repiten una y otra vez. En Scratch, los GIF tienen una característica muy peculiar y de la que podemos sacar un gran partido: permiten crear en muy pocos pasos un objeto animado, que se mueva y que tenga una cierta ‘vida’.

Sin entrar en detalles técnicos, cuando descargamos y cargamos como objeto un GIF animado (por ejemplo este perro que dispara que hemos encontrado en Pinterest) resulta que Scratch lo guarda como un único objeto con muchos disfraces diferentes. Tantos como frames tenga el .gif.

Así es un .gif:

dog shooting gif
Este es el gif original que hemos encontrado en Pinterest

Prueba ahora a descargar este .gif en tu ordenador (clic derecho en la imagen > guardar imagen) y cárgalo como un objeto.

Cargar objeto

¿Has probado a ver qué disfraces tiene este objeto? ¿Qué crees que ha ocurrido?

Deberías saber

No es necesario saber nada para cargar este tutorial, aunque sí es recomendable tener una cierta destreza en Scratch. Cargar un GIF en Scratch para crear tu propio objeto animado te ayudará a mejorar tus proyectos, pasados y futuros, dándoles nuevas funcionalidades y posibilidades.

Aunque no es obligatorio, sí es recomendable:

  • Saber unos fundamentos básicos de Scratch.
  • Saber cómo encontrar buenos GIFs (échale un vistazo a este artículo o a este otro). Si escribes filetype:gif en Google Images o si seleccionas Animaciones en el submenú Tipo, te saldrán directamente los resultados que buscamos.

Animated image search

Objetivos

  • Aprender a aprovechar los GIF en Scratch
  • Desarrollar objetos animados en Scratch

Si has cargado el GIF que te hemos enlazado antes y lo has cargado en Scratch verás que te ha cargado un objeto con ocho imágenes, que corresponden a las imágenes que contiene el propio GIF. Estos archivos funcionan como las películas, que en realidad son un conjunto de imágenes que se reproducen rápidamente, una tras otra.

Scratch GIF

En este caso el GIF que hemos utilizado tiene un fondo gris, y ya hemos visto en algún ejemplo previo que lo ideal es utilizar imágenes con fondo transparente. En Scratch esto es tan sencillo como seleccionar la herramienta de Rellenar con color y el color transparente (el blanco con una raya roja en diagonal), y hacer clic en el color gris.

Scratch transparent background tool

El fondo se volverá transparente. Ahora, lo ideal es hacer esto mismo con todos los disfraces del objeto para dejar solo a nuestro protagonista sin el fondo gris.

GIF Scratch

Creando una animación con el GIF

Es hora de programar. En este mismo objeto, lo que vamos a decir que cambie rápidamente entre un disfraz y otro. Este es el código:

GIF y disfraces

Esta es una de las muchas posibilidades que existen para programar esta acción. Ten en cuenta lo siguiente:

  • Aquí “activamos” el GIF cuando pulsamos la tecla espacio.
  • Como nuestro GIF tiene ocho frames (ocho disfraces), repetimos 8 veces. Esto puede variar según un gif y otro.

Este es el resultado de nuestro código:

Y así luce nuestro nuevo personaje en marcha.

Scratch GIF

¿Quieres más? Sigue leyendo en la siguiente pestaña y te propondremos algunos retos.

Los GIF son (casi) infinitos. En portales como Giphy o DevianArt puedes encontrar millones de ellos con los que puedes hacer casi cualquier cosa.

A continuación te proponemos algunos retos que puedes desarrollar con el GIF que hemos usado de ejemplo aquí. ¿Te animas?

¡No olvides compartir con nosotros tus creaciones!. También puedes encontrar más bananas siguiéndonos en BananaCoders en la comunidad de Scratch o en nuestro Twitter @BananaCoders.

Deja un comentario