Mostrando entradas con la etiqueta gif animado. Mostrar todas las entradas
Mostrando entradas con la etiqueta gif animado. Mostrar todas las entradas

miércoles, 1 de julio de 2009

HA903- Por fin llegamos al audio!!

Bueno, llegaaamos a la etapa del audio!

La semana pasada dejamos pendiente el tema de mezclar sonido con nuestra animación...

El gif es un formato de imagen y no podemos mezclarle directamente un audio como un mp3. ...
Por eso necesitamos un formato contenedor, es decir un formato que acepte ambas cosas, imagen y sonido... como el formato avi por ejemplo.

Esto es posible hacerlo si tienes una máquina con GNU/Linux y el mencoder instalado, los pasos serían aproximadamente los siguientes...

  • Primero que nada creamos una carpeta (que no tenga ningún otro cachivache, así no te complicas) solo con el archivo gif y otro archivo de audio mp3

  • Luego vamos a la línea de comando y nos ubicamos en esa carpeta... yo la nombré con_sonido en línea de comando, y escribimos todo esto respetando los espacios y donde yo escribí el nombre de mis archivos tu vas a reemplazarlo por los nombres de tus archivos: tu gif, tu mp3, y el archivo nuevo que creará mencoder: el avi

mencoder HA903-haiku.gif -ovc lavc -fps 4 -o HA903_audiohaiku.avi -oac copy -audiofile HA903_Haiku_musicalizado.mp3

  • le das enter y ya está.... fíjate en la carpeta que creaste debería aparecer un nuevo archivo, creado por mencoder con extensión avi.

para moverte de una carpeta a otra en la linea de comando escribes cd dejas un espacio y el nombre del directorio o archivo donde están el audio y el gif. Sino mencoder no podrá hacerlo, digamos que tienes que estar bien ubicado. Recuerda que debes escribir todo el camino, por ejemplo: nina/Desktop/CURSOS/anim/con_sonido






Entonces tenemos aquí una pequeña multimedia (audio y sonido) que realicé a partir de un guión , el haiku. Pero vuelvo sobre mis pasos para hacer visible el proceso...

  • Primero hice unos bocetos en papel para determinar los frames principales o frames claves.
  • Del papel fui a la montaña, Inkscape, donde trabajé dibujando vectorialmente las imágenes de una manera rápida y limpia.
  • De la montaña fui al lobo: exporté cada imagen como raster, formato png, y las abrí con el lobito, el Gimp. Cada una es una capa de un único archivo xcf, el formato nativo del Gimp.
  • Generé un gif animado y usé el filtro fundir para dar la apariencia de transición
  • Grabé un audio con Audacity y lo exporté a mp3
  • Finalmente uní ambas cosas, imagen+sonido utilizando un programa GNU/Linux desde la línea de comandos: mencoder.

Por supuesto esta es una manera de hacer las cosas. Seguro que encontrarás tus propios caminos dependiendo de los programas con que cuentes y del sistema operativo que utilices; pero la intención de este trabajo es mostrar que con muy pocos recursos se pueden crear pequeñas multimedias con fines educativos.

Vamos a socializar cualquier inquietud en el foro Colgadas, en la plataforma baidarkas.
Espero que disfrutes de hacer esta actividad, te entusiasmes y compartas tanto el proceso como el producto.

Un saludo afectuoso!! Nina

martes, 16 de junio de 2009

HA903- Paso a paso...y ya empezamos a animar...

Y esto se va poniendo interesante.... ya empezaste a animar a tu frase, haiku, canción, etc...??

Antes de mostrar lo que he estado haciendo quiero decirte tres palabras: no te compliques
Sí, no te compliques, busca algo sencillo, de manera que no te enredes ...
si has elegido una leyenda o un cuento trata de condensarlo en tres o cuatro ideas. Por ejemplo, Maryel ha tomado la leyenda cherokee de los dos lobos, que por otra parte me encanto!!

Bien, no quiero decirte Maryel que hagas tal cual, digo solamente cómo me lo imagino, como lo hubiera condensado personalmente...

"los dos lobos peleando en tu interior
-dijo el anciano al niño-
son el bien y el mal...el amor y el odio,
ganará el que más alimentes".

aquí hay cuatro frases, que pudiera representarse en unas pocas escenas básicas

1-texto: "los dos lobos peleando en tu interior"
2-imagen: dos lobos peleando
3-texto: "-le dijo el anciano al niño-"
4-imagen: de un anciano indio y su nieto... o algo que lo sugiera, (por ejemplo: las manos delatan la edad).
5-texto: "son el bien y el mal... el amor y el odio"
6-texto: "ganará el que más alimentes"
------------------------------
Es una idea, que solamente pretende esclarecer esto .... no te compliques.
En realidad al usar Gimp para una animación GIF estamos tratando de llevar al máximo las posibilidades del gif, y lo estamos logrando con una herramienta de autor que es libre y muy estable.
Una sencilla animación de este tipo puede mostrar con qué pocos recursos haces algo verdaderamente significativo.
-------------------------------
Te muestro algo:
una vez que tienes esas escenas básicas, en Gimp, en formato xcf, en modo RGB...
vas a
  • Filtros/animaciones/Fundir. Este filtro te genera capas intermedias (tu eliges cuántas ... a más capas más suave es la transición, pero ojo!! también es más peso). Este filtro además les aplica un desenfoque (tu determinas el grado de desenfoque)

  • vas a Filtros/animaciones/optimizar para gif

  • luego vas a Modo/Indexar

  • y entonces ya puedes Guardar como gif (no olvides tildar animación)



gif optimizado




  • Una vez guardado como gif puedes reproducirlo con el navegador o dentro del mismo Gimp en Filtros/animación/reproducir.



  • ahora mira las capas en que quieres que vaya más lento, que se detenga, a las de texto les di 2000ms, todo es cuestión de probar y probar. Puedes editar la capa o doble click en el diálogo capas, corriges los milisegundos y enter.

Te dejo el xcf original si quieres descargarlo... y si tienes un poco de paciencia, la semana que viene vamos a ponerle sonido. Una cosa que vas a necesitar es tener Linux y el mencoder instalado, un programita encantador que se ejecuta desde la línea de comando.

Un saludo afectuoso!! Nina

jueves, 11 de junio de 2009

HA903 -Un proyecto final... seguimos avanzando

Hola a tod@s!! y seguimos!! a pesar del frío y los resfríos.... :P
¿cómo van las actividades sugeridas? espero continúe el entusiasmo, y estés disfrutando de cada paso y puedas darle una aplicación práctica.

Ahora sigamos con los avances del gif... estás teniendo alguna dificultad en algún punto de tu proceso?

Volvamos sobre lo que dijimos la semana pasada:
  • la frase, la descomponemos como si la cortáramos en trocitos...
  • armamos un guión, una secuencia ... algo útil puede ser que primero dibujes los cuadritos vacíos en papel, y garabatees lo que te sugiere cada uno de esos trozos...
  • puedes escanear tus garabatos o sacarles una fotografía
  • y entonces lo importas a Inkscape... y dibujas en vectores sobre tu garabato...
  • No hace falta que sean demasiados cuadros, porque queremos que la animación sea lo más liviana posible.
  • Luego exportas cada cuadrito como png.

La semana pasada publiqué tres frames... ahora muestro todos los que están en el medio que semejan transiciones....





Aquí ves doce dibujos?! No, no te asustes... no vas a pasar media vida dibujando...es una misma imagen... la fui copiando y modificando gradualmente.... Una vez que tuve todos los cuadros que me parecieron, los exporté a png...

Para empezar el armado una sugerencia es que trabajes en xcf...
para no copiar uno por uno a un archivo nuevo aquí va una idea de hacerlo más rápido:


... de esta manera tendrás un nuevo archivo xcf, con todas las imagenes para tu animación...
una sugerencia más es que no crees demasiadas capas....y que conserves esa versión original y trabajes en copias.

Espero para la próxima poder mostrar cómo se va animando... y me encantará ver tus propios avances... y nos queda también el tema de agregarle sonido, pero eso queda para el final.

En la plataforma de baidarkas, puedes ver en PROYECTO FINAL- primer trimestre por lo menos tres pasos, tres escaloncitos hacia nuestro gif animado.

Un afectuoso saludo!!! Nina

miércoles, 3 de junio de 2009

HA903- Un proyecto final.... ajustando el proceso

Hol@s!!! y cómo van los procesos?
¿Por qué insistir taaaanto con lo mismo?...
Hay personas que nos marcan en la vida, que dicen unas pocas frases, pero de una suficiencia tal, que pueden determinar nuestro modo de aprendizaje por mucho tiempo.
Una querida tutora una vez me dijo "si te parás acá al lado, acá nomás, cuál es el trayecto que recorriste?"
Es decir aprovechar cada oportunidad para crecer, para aprender cosas nuevas... y no quedarme a dos pasos de donde partí....
Si una cosa te cuesta.... pues en esa dirección debes poner tu proa...
No importa tanto el producto, importa más el proceso, importa la ocasión para afrontar un desafío, para aprender, desplazarte hacia un punto en el horizonte...
Nuestro punto en el horizonte es el proyecto final... de estos tres meses
----------------------------------------------
Una disgresión:
Yo sé que muchos tienen vergüenza... Sí, sí, a tí ti hablo....¿te da vergüenza publicar en un blog tus 'garabatos'... porque no dibujas 'taaaan bien' como algunos compañeros?

Aprendamos esta otra cosa de los niños: cuando empiezan a caminar se caen, se tambalean.... pero no renuncian... intuitivamente saben que no deben hacerlo... hasta que se afirman, sus piernas se fortalecen, su confianza se fortalece.
Vamos!!! no renuncies!!! da tus primeros pasos, muéstralos y después verás cuántas cosas harás con gran soltura... siéntete orgullos@ de los pasos que ya has dado...
Oye, que yo tampoco considero que sepa dibujar... y el Inkscape ha venido a darme en esto una mano bárbara!!!

Repito una anécdota y que ilustra esto de arriesgarse, arriesgarse a estar expuesto...siempre me hace reir como loca... esta es la traducción al pedagogo y genial Sir Ken Robinson (por Diego Leal):

"...una niña que estaba en una clase de dibujo, tenía 6 años y estaba al fondo del salón, dibujando, y cuenta la maestra que esta niña difícilmente prestaba atención, y en esta lección de dibujo lo hacía.
La maestra estaba fascinada, se dirigió a ella y le preguntó: "¿Qué estás dibujando?"
y la niña le dijo, "Estoy haciendo un dibujo de Dios."
Y la maestra le dijo, "Pero nadie sabe cómo se ve Dios"
Y la niña dijo: "Lo sabrán en un minuto.""

Los chicos son creativos porque no tienen vergüenza, y se arriesgan ...
-------------------------------------------------

La semana pasada puse (en el foro Daily, de la plataforma baidarkas)tres bocetos en lápiz...(te lo dije, puse mis garabatos) vuelvo a exponerlos y exponerme :-)





y a tí cómo te está yendo? el trabajo final NO es un solo post.... son varios...un post por cada paso de tu trayecto...
Todavía no sé cómo va a quedar ... por ahora estoy compartiendo mis pasos...

1- Busqué un Haiku... pero puedes contar un cuento, desde Caperucita .... o "El nombre de la Rosa" el desafío es contarlo en una secuencia de imágenes en las que pasan cosas, cada imagen cuenta algo, puede tener texto... sería conveniente... aunque muy poco
El Haiku que elegí podría ser útil para ilustrar la cuestión de los sustantivos, pero da para más ... bueno, es una idea...
2-hice los bocetos en lápiz
3-me puse a jugar con Inkscape que me encanta.... y te muestro algunos cuadros o frames de mi secuencia... los frames clave, en los que pasan cosas que van a marcar un cambio, y que también son portadores de sentido porque allí está el texto y la palabra sirve de ancla a tu imagen.
4- usé la tipografía MgOpen Cosmetica que es bastante parecida a la que suele usarse en los cuentos infantiles: Óptima... y le dí protagonismo a los sustantivos ponéndolos en bold, (negrita).




Has pensado ya tu frase?
Hay un relato, un guionado, debajo de ese gif que estás imaginando?..el movimiento del gif debe servir para decir algo... mostrar una transición... no el movimiento por el movimiento, por lo menos no en este caso.... es decir es una verdadera historia? Puede tener un fin pedagógico? puedes usarlo en el aula?
¿te servira para esa Web en la que estás trabajando? ¿o simplente te gratificará, porque es algo que te gusta y nunca tuviste el tiempo/oportunidad de hacerlo? ¡Excelente! Lo importante aquí es el mensaje, lo que quieres transmitir (al final trataremos de mezclarlo con un audio)

Muy bien, miremos hacia atrás, la primera actividad de atravesamiento con relación al gif animado nos sirvió para entender la operatoria del gif.... ahora miremos hacia adelante al proyecto final del trimestre, porque trataremos de ponernos un poco más lejos .... para aprender

Un abrazo! Nina

martes, 12 de mayo de 2009

HA903- Jugar con grises y color... animar capas

Hol@s.... :-) hoy vamos a curiosear el tema de los grises... la máscara de capa... y también los gif animados

Bien, ¿Cuándo usamos una imagen en escala de grises?
Bueno, puede ser por ejemplo, cuando tenemos que imprimir a un solo color, o cuándo queremos dar la idea de otra época, enmarcar temporalmente a nuestra imagen...
Y para eso vamos a Imagen/modo/escala de grises, sin embargo esto no permitirá que usemos muchos filtros que funcionan solo en RGB...y no nos permite darle un toque de color...

Por eso, esta semana vamos a jugar con grises y color al mismo tiempo, usando colores/desaturación como se ve en la actividad de atravesamiento de esta semana... y en las dos margaritas amarillas, aquí NO usé una herramienta de selección, ni recorté la flor sino que usé una máscara... veamos



En vez de convertir a grises vamos a desaturar.... sí sacarle el color a una capa...
  • Empezamos por duplicar la capa original ...

  • luego desaturamos la copia, colores/tono y saturación...mueve el manejador de saturación hasta que te quede gris

  • añadimos una máscara de capa (botón derecho sobre la capa/ añadir máscara de capa/ blanco opacidad total

  • seleccionamos una brocha de bordes suaves, (usamos pincel) y nos aseguramos que los colores de frente y fondo sean blanco y negro

  • comenzamos a pintar una zona, la que queremos que quede en color, ahora estamos pintando con opacidad o con transparencia.
Claro lo que modificamos es esa máscara y esto evita cualquier modificación destructiva de nuestra imagen. Cuando usas negro estás pintando con transparencia.... te has equivocado? pues pinta con blanco, con opacidad y volverás a 'apagar' aquellos pixeles que no quieres que se vean.



La otra actividad opcional, Un monigote ... pero animado!!! consiste en crear primero una imagen de varias capas en xcf
luego la guardas como gif y tildas la opción animación
la abres con tu navegador (usas Firefox?)
fijate que ocurre... y... tocas todo, como siempre ....fíjate en las capas que puedes modificar los milisegundos de retardo
y durante la semana ... en los foros, en las listas o dónde quieras pregunta para afinar el uso de la herramienta... aquí te dejo mi monigote :-)


Mi monigote




Como siempre en la plataforma baidarkas

materia 2-raster
Manos a la Obra (actividad de atravesamiento)
4-Jugar con grises y la máscara de capa
5-Un monigote... pero animado!!!

materia 3-Color


Audio


Escuchar: 2-Profundidad de Color RGB (mp3 780 kb/ 3:20min)


Un saludo afectuoso!! y feliz Gimpeo!!! Nina