Kukikorn animat amb Snap! i GIMP

2022-01-23

He creat un ninotet amb Inkscape i l'he animat amb dos programes diferents, Snap! i GIMP. El resultat és una animació d'un unicorn que sembla que corri.

Il·lusió de moviment

Aquest Kukikorn s'inspira de l'experiment: «El cavall en moviment» de Eadweard Muybridge, realitzat a finals del segle XIX per saber si, quan un cavall corre, hi ha algun moment que cap pota toca a terra.

L'experiment: «El cavall en moviment» de Muybridge

Caratula Kukikorn

Segons la Viquipèdia:

En Cinema, un fotograma (frame), o quadre de pel·lícula, és una de les moltes imatges individuals en una pel·lícula, l'element més petit de la pel·lícula. Si es projecta una cadena de fotogrames a una determinada freqüència, com a mínim 12 fotogrames/segon, podem obtenir sensació de moviment.

Fotograma (cinema) a la Viquipèdia

Hi ha diverses tècniques per animar objectes inanimats. Antigament, aparells com el fenaquistoscopi i el zoòtrop ja anticipaven les imatges en moviment cícliques com avui són els GIF (acrònim de Graphics Interchange Format, Format d'intercanvi de gràfics).

GIF a la Viquipèdia

Ara, a més, tenim altres programes informàtics que ens permeten crear animacions de diverses maneres. Igualment, però, trobo que no cal abusar molt de les imatges en moviment. Algunes són massa agressives i poden provocar atacs epilèptics.

GIMP

Aquest programa ens permet fer moltes coses, com editar imatges i crear petites animacions a partir d'imatges o fotogrames. Clica l'enllaç per veure el gif fet amb GIMP.

GIF Kukikorn animat amb GIMP

Imatges

Crea o troba les imatges que vulguis animar. Si no en tens o no saps crear-les, pots reusar aquest Kukikorn que he creat amb Inkscape.

Per a la creació del GIF amb GIMP farem servir mapes de bits (.png). Aquí les quatre imatges del Kukikorn en .png amb fons gris:

Kukikorn amb fons 1
Kukikorn amb fons 2
Kukikorn amb fons 3
Kukikorn amb fons 4

Crear un GIF amb GIMP

Imatge Kukikorn animat amb GIMP

  1. Obre GIMP

Si no el tens instal·lat, descarrega'l des de la pàgina web
www.gimp.org

  1. Fes visibles les capes

Eina de capes. Dues maneres d'arribar-hi:

  • Combinació de tecles control+L
  • Finestres > Diàlegs acoblables > Capes
  1. Obre les imatges com a capes

"Fitxer > Obre com a capes..."

  1. Selecciona les imatges que vulguis usar

Per seleccionar totes quatre imatges, mantingues premuda la tecla control mentre les cliques. Importa-les en ordre, de la 1 a la 4.

  1. Desa el projecte

"Fitxer > Anomena i desa". L'extensió serà .xcf i és el fitxer editable per si volem modificar el gif de nou.

  1. Converteix el projecte a GIF

"Fitxer > Anomena i exporta". Li hem d'indicar extensió .gif i ens obrirà un diàleg per a:

  • posar metadades (com "Creat amb GIMP") a les opcions del GIF
  • determinar el temps entre imatge i imatge (com 0.3 segons ó 300 mil·lisegons).

Per poder modificar el temps, clica a la casella "com una animació" de les opcions del GIF. Exporta i ja ho tens! :)

Fitxer

Descarrega el meu arxiu del Kukikorn en .xfc i obre'l amb GIMP.

Descarrega el Kukikorn en .xcf

Snap!

Aquest llenguatge de programació també és un programa, i té una comunitat de creadores de continguts digitals.

Imatges

Per a la creació del GIF amb Snap! farem servir vectors (.svg). Aquí les quatre imatges del Kukikorn en .svg sense fons:

Kukikorn sense fons 1
Kukikorn sense fons 2
Kukikorn sense fons 3
Kukikorn sense fons 4

Crear un GIF amb Snap!

Kukikorn animat amb Snap!

  1. Obre Snap!

Si no tens compte a la web de Snap!, pots descarregar el programa al teu ordinador tal com es fa amb GIMP. D'aquesta manera, no et caldrà connexió a Internet per programar. Descarrega el programa, descomprimeix-lo i obre el fitxer que es diu snap.html al teu navegador.
Descarrega Snap!

  1. Importa els ninotets que vulguis animar

Pots importar imatges de dues maneres:

  • Arrossegant directament les imatges al programa
  • Clicant la icona del document (al menú del programa) i triar "Importa"
  1. Programa el moviment

A "Programes" de l'objecte Kukikorn, arrossega-hi els següents blocs:

Blocs Kukikorn

  • Blocs de control

    • Quan la bandera verda es premi
    • Espera segons (agafa'n dos)
    • Per sempre
  • Blocs d'aparença

    • Canvia el vestit a
    • Fixa la mida a
    • Següent vestit
  • Bloc de moviment: Vés a x y

I ja ho tindríem!

Codi

A la web de Snap!
A Gamifica’t!