A continuación, realizaremos unos pasos para confeccionar el primer trabajo práctico.

La idea es buscar dos imágenes que se relacionen entre ellas, una se mantendrá estática y vas a animar a la otra.

Las imágenes que verás son solo para demostración, es decir, podrás animar el objeto que quieras como imagen, siempre que sigas los pasos que a continuación se detallan:

  • Elegir una imagen desde internet, guardarla en tu disco Z y luego importarla al proyecto desde el menú ARCHIVO -> IMPORTAR RECURSOS...
  • En la línea de tiempo seleccionaremos la opción MODO AVANZADO. 
  • Seleccionar la herramienta GIRAR OBJETOS 3D   y dar un leve giro a la imágen.
  • Añadir otro fotograma clave, dar otro leve giro y repetir esto tanto como sea necesario para dar el efecto que requieras.
  • Guardar el trabajo realizado en tu disco Z, deberás colocarle como nombre TP1.

Podemos ver el efecto pulsando el botón de play "REPRODUCIR" que se encuentra sobre la línea de tiempo.

Se puede apreciar que cada rombo será un cuadro clave de una escena que ejecutada seguidamente genera una animación que da la sensación de movimiento. A más cuadros mayor fluidez (pero mayor peso del archivo final).

Si pulsas el botón PLAY "REPRODUCIR" podrás ver en todo momento el resultado de la animación.

En Archivo -> Guardar Todo podrás almacenar cada archivo con extensión HTML.

OJO, este archivo .html NO es válido hasta que pulsemos "PUBLICAR". En ese momento, Google Web Designer te generará el conjunto de archivos válidos que te permiten ver la animación y utilizarla, por ejemplo, en una página web.

A continuación un ejemplo:

 

Fecha: 23/7/2019 | Creado por: Alejandro
Categoria: Trabajo práctico 1