HA903 - Preparando la animación del sapito.

He estado ejercitando la animación del sapito.

A propósito... sería bueno ponerle nombre. ¿Me sugerirían algunos? .Para él y para su amiga.

Como les contaba, he estado ejercitando posibles movimientos del sapito, y sin darme cuenta... se fue a un porta-retrato que tengo cerca. ¡Miren como se ve allí! ¡¡¡Se ha puesto muy charlatán!!!

Para lograr estos movimientos tomé la imagen tal cual quedó en el post anterior y la fui modificando. Guardé en distintas capas las modificaciones :

- Primero le cerré los ojos pintando arriba de los mismos con el pincel.

- Luego para que la boca tuviera una nueva posición ( cerrada) usé la herramienta borrador, con el baldecito pinté el área nueva (la que borré) y con el aerógrafo traté de que la zona se viera como su entorno. Finalmente resultó porque se ha vuelto... un charlatán total.

- En cuanto a las manos para lograr sus movimientos las seleccioné,roté y las ubiqué apropiadamente en el nuevo lugar( un poco más arriba una y un poco más abajo la otra).

El archivo tiene cuatro imágenes y no le he variado el tiempo que el programa propone.

Finalmente seguí los pasos para producir el gif : fui a filtros/ animación/optimizar para gif . Luego guardé el nuevo archivo con extensión gif .

Este es un ejercicio para ver cómo producir algunos movimientos ccon la imagen.

¿Cómo lo mejoraría?

Creo que no debe parpadear tanto, es así que lo tendré presente cuando lo ubique en el área del trabajo final. Las imágenes donde parpadee deben ser no tan continuas.

De todas formas, se ve lindo el travieso, ¿no?.

HA903 - Trabajo cierre de trimestre - Gif animado

Para realizar la actividad de cierre del primer trimestre he elegido realizar un gif animado.

Será la visualización de una breve y sencilla canción infantil que seleccioné entre varias.

Como les comentara, me desempeño en la docencia primaria, es así que el trabajo está pensado para ser ocupado futuramente en los primeros años de escolaridad.

Les voy a presentar los personales que participarán en el mismo.

Estos dos sapitos inicialmente eran así:

Luego les hice las siguientes transformaciones:

a) Al sapito lo importé en el Inkscape, vectoricé el mapa de bits y por último lo pinté ( Objeto / rellleno y borde) .

b) En el caso de la sapita decidí hacerle bajar un poco de peso. Esta dieta la hizo en el Inkscape ( con la herramienta de selección y transformación de objeto ) .

Después la importé, abrí su archivo en el Gimp y resolví ponerle una capelina para que se viera más coqueta.

Al sombrerito lo trabajé en el Gimp así: Seleccioné, con la máscara rápida, la parte de la imagen original que deseaba. Seguidamente copié la selección y la pegué en una nueva capa. Después le agregué un poco de tela ( con el pincel ),luego usé la herramienta de escalado y por último le apliqué una pequeña rotación para que le entrara en su cabecita. A continuación verán como era y cómo quedó después.
Luego pensé que quedaría más linda con alguna sombra en su pancita.Es así que como se la veía contenta en el Gimp le hice el agregado allí, con la herramienta aerófago.

Ya tengo elegido el lugar donde estarán ( el fondo), pero eso lo dejo para más adelante así queda algo de efecto sorpresa... ¿No les parece?

Hasta aquí el trabajo realizado.

Saludos y... seguimos en contacto.

HA903 - Ejercitando gif

Resulta que escalé la imagen del payaso que hice en la entrada anterior ( archivo gif) , pero han surgido algunos desperfectos en la nueva visualización ( se ven unas manchas). Continuaré consultando sobre el tema en la plataforma del curso.

Mientras ... elaboré un nuevo gif con una imagen que tenía guardada desde hace tiempo. Le hice algunas adaptaciones.

Importante: Como la quiero colocar en el costado derecho del baner seguí los consejos que me dieron y escalé la imagen : Ancho 200 píxeles.



Copié la capa inicial y la invertí (Capas/Transformar/Voltear horizontalmente).

Luego copie en forma alternada las capas ( Una mira hacia la derecha, la otra hacia la izquierda y así sucesivamente hasta completar diez) .
Luego le apliqué los pasos que detallé en la entrada anterior para guardar el archivo en extensión gif.

Por último lo abrí ( al archivo gif) con el editor de imágenes Gimp. Luego fui hasta la ventana capas y le cambié los tiempos de cada imagen.

Seguidamente fui a archivo/ guardar y tildé guardar como animación.

Agradezco los aportes que hicieron el profe Pablo y mi compañera Maryel para orientarme en cómo ubicarlo donde lo puse finalmente: arriba a la derecha del blog.

Espero les guste el ritmo que llevan. ¿Qué les parece? ¿Los acompañamos?

HA903 - Realizando gifs con GIMP .

Cuando vi la actividad propuesta por Nina, nuestra profe, pensé que era la oportunidad de que el payasito del baner se moviera .

Para ello trabajé,de la siguiente forma, la figura original en el GIMP :

1)La pegué en varias capas y fui guardando el archivo con extensión xcf. En cada oportunidad modifiqué la ubicación ,de la imagen, con la herramienta de rotación. O sea que, en este caso, la imagen es la misma que cambia de sitio en el lienzo.

He de aclarar que para producir el efecto de ir hacia la derecha y regresar hacia la izquierda copie a la inversa las capas delas imágenes creadas de ida para que regresara el payaso al sitio de partida.

2)Agregué una capa de fondo trabajando con la herramienta de mezcla.

3)Cuando lo consideré terminado fui a filtros/animación/optimizar para gif.

4)Luego lo guardé como gif y tildé la opción animación.

5)Finalmente hice clic con botón derecho sobre el nuevo archivo ( gif) y activé la opción abrir con el “Navegador web Firefox”.

La imagen no se veía correcta porque se sumaban los movimientos apareciendo también los anteriores . Aquí pueden observar la captura de pantalla del archivo xcf que producía el error detallado.

Para mejorarla volví al archivo xcf ( Les cuento que habitualmente trabajo con copias de archivos por si me equivoco mantengo lo que he hecho bien en el archivo original) y copié tantas capas de fondo como capas con payasos tenía. Las ubiqué abajo de cada payasito. Luego combiné ( Ir a capa/ combinar hacia abajo) cada payaso con su capa de fondo nuevo.


Seguidamente le apliqué los mismos pasos que detallé arriba para obtener el archivo gif.


Y ¡¡¡Oh!!! funcionó. El payasito ahora sí realiza ejercicios físicos.

Finalmente hice clic sobre el archivo gif. Lo abrí con el Gimp , le varié los tiempos de inicio, medio y final para que descansara un poco y retomara aliento.( Je, je, je ).

Para que apareciera en el blog investigué en el Google . Seguí los consejos de:

http://www.oscargp.net/2008/04/gifs-animados-en-blogger.html

Me agradaría poner la animación a la derecha de blog. Todavía no lo logro. Pediré consejos a mis profes y compañeros de curso. Si consigo hacerlo les cuento los pasos.

HA903 - Grises y la máscara de capa - Edición no destructiva

Les muestro los trabajos en donde he usado la máscara de capa.

Los pasos que seguí fueron:

Primero Abrí la imagen.
Luego dupliqué la capa original.
Después la guardé en formato xcf
A continuación desaturé la capa de arriba ( Colores/Tono y Desaturación ... ) y le añadí “máscara de capa” (botón derecho sobre la capa/ añadir máscara de capa/ blanco opacidad total )
Finalmente pinté con transparencia la parte que deseaba que se viera de vivos colores. Para ello seleccioné el pincel y lo pasé arriba de la superficie deseada.
Atención: No debemos olvidar de controlar que los colores de frente y fondo sean blanco y negro antes de comenzar la tarea.
Con pincelado negro pintamos con transparencia ( aparece el color de la imagen con los colores originales donde pasamos la brocha) , con pincelado blanco pintamos con opacidad ( reaparecen los grises) . Esta segunda acción la hice para corregir los lugares donde me había equivocado.
Finalmente fui a " archivo/ guardar como" y guardé la imagen en formato jpg.
La tarea fue sencilla y agradable.

HA903 – Separar una figura del fondo usando la herramienta “ selección de primer plano” .

Para ejercitar la la herramienta “ selección de primer plano”elaboré la siguiente tarjeta, la que se podría usar como señalero..

Primero seleccioné entre varias imágenes las siguientes:

Fui a Archivo/Abrir y guardé en extensión xcf el archivo de la canasta.

Abrí el archivo del gato. Hice clic sobre la herramienta "Selección de primer plano". Rodeé con ella el cuerpo del gato. Quedó el fondo, no deseado para esta tarea, azul. Pincelé con la brocha el área del animal ( esto para que el programa tome una muestra de los colores que seleccionará). Le di enter y aparecieron las hormiguitas en el contorno del cuerpo, o sea que quedó delimitada el área seleccionada.

Luego copié, pegué ( arriba del la canasta ) y achique al felino. Reconozco que fue un error no haber creado otra capa y copiado la figura en ella. Esto me trajo posteriores dificultades que ya verán cómo las arreglé.
La imagen se veía así:

Mejoré el aspecto de la misma aplicando la herramienta de clonación sobre el borde inferior del gato(cloné pedacitos de flores). No podía borrar el borde que sobraba del cuerpo del animal ya que estaba pegado sobre la canasta y si hacía esta acción también se borraría ella.

Ahora sí se pueden ver los tejidos rosado, rojo y celeste de las flores que rodean al gato dando la impresión de estar ellas sobre el cuerpo. Esto da la sensación de que el cuerpo está metido entre las lanas tejidas.
Bueno..., por lo menos así me parece a mí.

En otra capa seleccioné un área rectangular y la pinté de marrón caramelo. Este rectángulo es el contorno que se ve en el dibujo de la canasta.

Después trabajé los textos en dos capas más.

El fondo está hecho en una quinta capa pintada con la herramienta de mezcla ( degradado/ forma espiral).

Les acerco una captura de pantalla para que observen el orden dado a las diferentes capas creadas.

Espero les agrade la labor realizada y hasta la próxima tarea de aprendizaje virtual.

HA903 – Seleccionar una figura y cambiarla de contexto (usando la máscara rápida)

Primero busqué las figuras con las que trabajaría : de fondo un salar, para superponer una mesa, una manzana, una mujer.

Abrí las figuras y las guardé en extensión xcf .

Comencé guardando el salar y creando otra capa para poner en ella la mesa y las manzanas.

Para lograr la selección particular de la mesa trabajé con la máscara rápida. Está en la ventana de la imagen sobre la que se trabaja, en el ángulo inferior izquierdo. Luego con la herramienta pincel pinté la figura. Después desactivé la máscara y aparecieron las hormiguitas alrededor de la imagen.

Copié la figura y la pegué en la segunda capa creada, arriba del salar.

En la misma capa del salar pegué la mujer a la que previamente le hice el mismo tratamiento que detallé para la mesa.

A las mesas les varié el tamaño haciendo uso de la herramienta de escalado y les agregué arriba una manzana.

Luego le apliqué a la capa de las mesas diferentes efectos de color.

a)Sobre cada mesa en particular : Color/ brillo y contraste. Si observan con atención cada mesa tiene diferente brillo y contraste.

b)Sobre cada mesa en particular: Color/ colorear. Pinté de diferente color cada mesa.

c)A toda la capa: Color/ inversión del valor.

d)A toda la capa Color/ Invertir

e)A toda la capa Color/ Posterizar

f) En este caso le apliqué Color/ Colorear (a toda la capa). Busqué un efecto parecido al sepia.

g)Finalmente apliqué Color/ Ecualizar.

Se puede observar que según el mensaje que se quiera transmitir será el efecto que se puede aplicar.

Hasta la próxima. Seguimos asombrándonos con el programa.

HA903 - Adaptando el banner a la nueva plantilla.

He hecho algunos cambios en el diseño del blog.
He cambiado de plantilla y a la nueva la he personalizado ( le agrandé algunos valores), por ello he tenido que adaptar el banner. Le cambiado las dimensiones sobre las que trabajé y aprovechando también le varié el color del fondo ( lleva degradé de forma : contorno esférica ).
Creo que quedó mejor. Espero sea así.

HA903 – Elaborando el banner para este blog

Abrí el Gimp e hice clic en Archivo/ Nuevo ). Seleccioné las medidas aconsejadas: 700 por 177 px. Se creo el lienzo que futuramente sería el banner.

Abrí ( Archivo /Abrir ) la imagen que elaboré con el Inkscape para este fin. Se abrió en otra ventana y la reduje de tamaño, teniendo presente el alto y largo del lienzo del blog. (Imagen/ escalar la imagen). La copié , hice clic en el lienzo del banner y la pegué. Seleccioné la herramienta mover y la ubiqué a la izquierda del banner.

Después cree una segunda capa que sería el color de fondo del banner. Hice clic en “herramienta de mezcla”. Elegí un color de frente y uno de fondo para trabajar con el degradé ( clic en los dos rectángulos que están en el centro de la ventana.) Luego elegí la forma en que aparecería el degradé: clic en forma/ espiral sentido horario. Finalmente clic y arrastre en el lienzo. Observé que los dibujos que aparecen dependen del sentido y la dirección que se le dé al arrastre del mouse. Elegí el que creí más conveniente.

Para escribir el nombre del blog cree otra capa (tercera) . Hice clic en “Herramienta de texto” escribí previa elección de formato y tamaño de letra. Luego seleccioné y copié en una cuarta capa lo escrito.Agrandé ( seleccionar el texto y clic en la herramienta de escalado) y pinté de otro color ( amarillo) a esta segunda escritura. Para el efecto sombra volví a copiar, pegar y agrandar en otra capa ( quinta capa) el texto. Le apliqué desenfoque y lo ubiqué ( con la herramienta mover ) abajo del texto marrón y amarillo y de esta forma da la sensación de sombra. Después uní las tres capas de los textos:Fui a la ventana “ capas” y puse una debajo de la otra . Seleccioné la primera. Fui arriba a “Capas”/ ”Combinar hacia abajo” ( se une la capa seleccionada con la de abajo) Repetí la acción y quedaron los tres textos unidos en una sola capa. ¿Para qué lo hice? Porque deseaba darle perspectiva al texto (“Herramienta de perspectiva” ) Lo realicé pero no me gustó como quedaba. Varió el brillo y color del texto. Es así que lo dejé como se ve más arriba.

Sólo resta comentarles que para agregar los logotipos de los programas los importé en otra capa, los escalé, pegué y ubiqué en el sitio donde lo ven.

Una vez terminado el trabajo, para guardarlo en formato png fui a Archivo/ Guardar una copia y le cambié la extensión del programa. Borré la que tenía y le escribí jpg. Comento esto que parece tan sencillo porque realmente no lo sabía hacer y recurrí a mi hijo, quien me orientó. Agradecida.

Espero les agrade como ha quedado.

HA903 - Trabajando para el banner de este blog.

Elegir el dibujo que usaría en el banner me llevó bastante tiempo, hasta que finalmente me resolví por uno. Lo fui transformando y quedó así:

Primero importé una imagen sin color de relleno. (La busqué en un sitio que ofrece dibujos para pintar ) .

Luego vectoricé el mapa de bits. Le apliqué reducción de colores.

Seguidamente engrosé los trazos del dibujo (ir a estilo de trazo ) y los pinté de verde . Quedó como lo observan en la figura de más abajo.

El interior del dibujo seguía blanco. No es posible pintar por separado cada parte en la primera capa ( rostro, pantalón, zapatos ... ) . Seguramente el origen de la imagen explica el por qué de esto. Es así que probé pintar creando capas. Tracé en ellas figuras irregulares que abarcaron los trozos que deseaba pintar .Ubiqué las nuevas capas abajo de la primer- la que contenía el dibujo vectorizado . Salió bien. Como el interior de la figura ( lo que sería el relleno ) es transparente se puede observar el color de cada prenda y cuerpo del payaso. Ellos están en las capas inferiores.

Por último tuve que crear una última capa. Tracé en ella una línea cerrada que iba sobre el contorno del dibujo y pinté de blanco la superficie interior. Todo esto para que al abrir la imagen en el Gimp los efectos de transparencia de los gradientes no se mezclen con el color de fondo del banner.

Finalmente la exporté.

A continuación pueden observar la transformación que fue teniendo el dibujo inicial.

Lo más relevante realizado en esta tarea fue haber pintado una imagen producto de la vectorización de un mapa de bits.