En nuestro último trabajo tuvimos que realizar un GIF animado dibujado totalmente a mano con el Inkscape. A continuación haré un breve descripción de como ha sido:
Primero decidí que mi GIF tratara sobre el famoso juego de marcianitos Space Invaders, que seguramente algunos de vosotros conoceréis:
Después pasé a recrearlo en el Inkscape con distintas herramientas , como "Crear cuadrados y rectángulos", "Diferencia" y "Crear estrellas y polígonos" entre otras. (Pese a lo que pueda parecer esta hecho por mi, y no copiado y pegado de una imagen sacada de Internet). No describiré todo el proceso por ser demasiado largo.
Una vez hecho el fondo, había que hacer cada fotograma por separado, para ello movía lo que quería y le daba a "Archivo" - "Exportar mapa de bits" - "Exportar", y repetí este proceso las veces necesarias. Se puede hacer por capas, pero en caso de que la imagen contenga muchos elementos y sea pesado (como el mío) era mejor ir exportándolo.
Una vez hechos todos los fotogramas, el mío tiene 47, se abrían con el GIMP, y para generar el GIF había que ir a "Archivo" - "Guardar como" y guardar con la extensión .gif, una vez llegado aquí hay que seleccionar 2 opciones importantes: "Guardar como animación" y en la siguiente pantalla "Bucle infinito", además aquí podemos regular la velocidad a la que queramos que se mueva. Exportamos y voilá, ya tenemos el GIF.
Por último solo queda enseñarlo en el blog, para ello hay que subirlo a un hosting de imágenes, que es un servidor donde tras almacenar una imagen nos da una dirección URL que podemos usar para enseñarla donde queramos, en un blog, un foro... El hosting elegido fue Subirimg.com, por ser uno de los pocos que no está bloqueado por el filtro del instituto. La subida es fácil, solo seleccionamos la ubicación del archivo y le damos a "Subir", cuando acabe copiamos la dirección URL, vamos a nuestro blog y le damos a "Añadir imágenes" - "Desde una URL" pegamos la dirección aceptamos y ya está.
Aquí está mi GIF tras todo el proceso, espero que os guste:
Esteban Rozas
viernes, 29 de abril de 2011
sábado, 9 de abril de 2011
Open Office. Impress. Presentación.
Saludos a todos los lectores, comienza un nuevo y emocionante trimestre en que no sabemos con que sorpresas nos encontraremos, pero intentaré contároslas de la mejor forma posible.
En la primera práctica que tenemos que realizar usaremos el Impress, una extensión del OpenOffice.org para realizar presentaciones similar al Microsoft Powerpoint, pero al ser software libre (como todo el que utilizamos en la clase de TIC) cuenta con la gran ventaja de ser gratis.
OpenOffice.org es una suite informática, lo que significa que es una recopilación de distintas herramientas o aplicaciones, que son:
- Un procesador de textos (OpenOffice.org Writer).
- Una hoja de cálculo (OpenOffice.org Calc).
- Un editor de gráficos vectoriales (OpenOffice.org Draw), como el ya utilizado el trimestre anterior, Inkscape.
- Un programa de base de datos (OpenOffice.org Base) lo que permite básicamente es la creación de formularios,informes... en definitiva, todo aquello que premite a los usuarios un acceso fácil a los datos que deseen.
- Y en el caso que ahora nos interesa, un programa para realizar presentaciones (OpenOffice.org Impress).
El OpenOffice.org es muy parecido al MicrosoftOffice en el sentido de que ambos son suites informáticas, pero OpenOffice.org presenta más ventajas, ya que además de ser software libre y de código abierto funciona en cualquier sistema operativo aparte de Windows, y también lee los archivos de MicrosoftOffice, cosa que no ocurre a la inversa.
Como curiosidad, antes de hablar de mi presentación, diré que OpenOffice.org, que es el nombre oficial, habitualmente se abrevia llamándola OpenOffice a secas, pero esto no se debe hacer, ya que openoffice es marca registrada de otra empresa.(Orange).
-Presentación
-Presentación
Como primera prática, tenía que hacer una presentación que recopilara todos los trabajos de GIMP e Inkscape de la anterior evaluación. Consta de 15 diapositivas en las que aparece una imagen de cada práctica junto con un breve resumen de cada una. Hay efectos y animaciones personalizadas y como diapositiva final, aparece una conclusión. Aquí tenéis una captura de imagen de ella:
En caso de querer verla me podéis dejar vuestro correo electrónico como comentario.
En caso de querer verla me podéis dejar vuestro correo electrónico como comentario.
Esteban Rozas
jueves, 17 de marzo de 2011
Prácticas restantes de InkScape
Como andamos algo faltos de tiempo en el final de esta segunda evaluación, en esta entrada resumiremos todas las prácticas que hemos hecho en InkScape desde la T (explicada en la anterior entrada).
1º- Cuadrado.
Comenzamos haciendo un cuadrado con la herramienta "Crear rectángulos y cuadrados", duplicándolo 4 veces y colocándolos formando un cuadrado más grande yendo a "Objeto" - "Alinear y distribuir". Pondremos el de arriba a la izquierda y el de abajo a la derecha negros, y los otros dos blancos. Ahora para hacerle efecto de sombra a los negros, los duplicamos los desplazamos un poco abajo a la izquierda y los desenfocamos. Para hacer que los blancos sean transparentes excepto su borde, vamos a "Objeto" - "Relleno y borde" y en Relleno ponemos el canal alfa a 0 y en Color de trazo todos a 0 menos el alfa que estará al máximo. Por último escribimos nuestros nombres ( nombre y apellido en este caso) encima y los centramos. El resultado es este:
2º- Símbolo de Nike
Este es muy sencillo, solo tenemos que hacer 4 puntos ( o los que se deseen para que sea lo más parecido posible) con la herramienta "Dibujar curvas Béizer y líneas rectas"", después elegimos la herramienta "Editar nodos de trayecto o tiradores de control" y seleccionando los puntos que queremos curvar darle a Suavizar los nodos, ahora si queremos podemos modificarlo a nuestro gusto. En nuestro caso lo pintamos de naranja y incluimos nuestra propia marca.
3º-Logo de Volkswagen
Esta última práctica fue más difícil que las anteriores y tuvimos algunas dificultades, pero conseguimos completarla satisfactoriamente. Tiene dos partes, en la primera había que hacer el logo de Volkswagen en blanco y negro sin sensación de volumen, y la segunda tenía que tenerla y además ser a color.
1º - Hacemos dos triángulos mediante la herramienta "Crear estrellas y polígonos", colocamos uno encima del otro, seleccionamos ambos y le damos a "Trayecto" - "Diferencia" para crear una V. La duplicamos y colocamos una encima de otra para hacer una W y las unimos (Unión). Ahora hacemos un círculo, lo colocamos debajo de la W y le damos de nuevo a Diferencia, ya tenemos un círculo con el hueco en forma de W. Para la aureola exterior podemos crear un nuevo círculo un poco mayor que el anterior, le sacamos el relleno y aumentamos el grosor del trazo hasta que deseemos. Y por último para el rectángulo de en medio hacemos uno del tamaño deseado, lo alineamos en el centro y lo ponemos del mismo color que el resto. El resultado es este.
2º- Esta práctica es mucho más fácil si ya tenemos hecho la anterior, ya que a partir de ella sacaremos el molde con la herramienta "Cubo de pintura". Una vez lo tenemos, lo duplicamos, lo colocamos un poco debajo a la izquierda de color negro y la desenfocamos para que parezca su sombra. Ahora resta hacer un círculo de color azul y colocarlo debajo. si queremos podemos usar la herramienta "Degradado" tanto en el círculo como en el molde para hacerlo más claro por una parte y oscuro por otra. Nosotros también le añadimos un círculo de color blanco arriba a la derecha, solo lo desenfocamos a nuestro gusto. Una vez acabado todo, este es nuestro resultado.
1º- Cuadrado.
Comenzamos haciendo un cuadrado con la herramienta "Crear rectángulos y cuadrados", duplicándolo 4 veces y colocándolos formando un cuadrado más grande yendo a "Objeto" - "Alinear y distribuir". Pondremos el de arriba a la izquierda y el de abajo a la derecha negros, y los otros dos blancos. Ahora para hacerle efecto de sombra a los negros, los duplicamos los desplazamos un poco abajo a la izquierda y los desenfocamos. Para hacer que los blancos sean transparentes excepto su borde, vamos a "Objeto" - "Relleno y borde" y en Relleno ponemos el canal alfa a 0 y en Color de trazo todos a 0 menos el alfa que estará al máximo. Por último escribimos nuestros nombres ( nombre y apellido en este caso) encima y los centramos. El resultado es este:
2º- Símbolo de Nike
Este es muy sencillo, solo tenemos que hacer 4 puntos ( o los que se deseen para que sea lo más parecido posible) con la herramienta "Dibujar curvas Béizer y líneas rectas"", después elegimos la herramienta "Editar nodos de trayecto o tiradores de control" y seleccionando los puntos que queremos curvar darle a Suavizar los nodos, ahora si queremos podemos modificarlo a nuestro gusto. En nuestro caso lo pintamos de naranja y incluimos nuestra propia marca.
3º-Logo de Volkswagen
Esta última práctica fue más difícil que las anteriores y tuvimos algunas dificultades, pero conseguimos completarla satisfactoriamente. Tiene dos partes, en la primera había que hacer el logo de Volkswagen en blanco y negro sin sensación de volumen, y la segunda tenía que tenerla y además ser a color.
1º - Hacemos dos triángulos mediante la herramienta "Crear estrellas y polígonos", colocamos uno encima del otro, seleccionamos ambos y le damos a "Trayecto" - "Diferencia" para crear una V. La duplicamos y colocamos una encima de otra para hacer una W y las unimos (Unión). Ahora hacemos un círculo, lo colocamos debajo de la W y le damos de nuevo a Diferencia, ya tenemos un círculo con el hueco en forma de W. Para la aureola exterior podemos crear un nuevo círculo un poco mayor que el anterior, le sacamos el relleno y aumentamos el grosor del trazo hasta que deseemos. Y por último para el rectángulo de en medio hacemos uno del tamaño deseado, lo alineamos en el centro y lo ponemos del mismo color que el resto. El resultado es este.
2º- Esta práctica es mucho más fácil si ya tenemos hecho la anterior, ya que a partir de ella sacaremos el molde con la herramienta "Cubo de pintura". Una vez lo tenemos, lo duplicamos, lo colocamos un poco debajo a la izquierda de color negro y la desenfocamos para que parezca su sombra. Ahora resta hacer un círculo de color azul y colocarlo debajo. si queremos podemos usar la herramienta "Degradado" tanto en el círculo como en el molde para hacerlo más claro por una parte y oscuro por otra. Nosotros también le añadimos un círculo de color blanco arriba a la derecha, solo lo desenfocamos a nuestro gusto. Una vez acabado todo, este es nuestro resultado.
Esteban y Eloy
jueves, 3 de marzo de 2011
Primera práctica de Inkscape. T.
Saludos a todos, por ahora hemos acabado de usar GIMP y comenzamos con Inkscape, un programa gratuito de creación de gráficos vectoriales que surgió en 2003.
Vamos a describir la primera práctica que hemos realizado, una circunferencia con una T, fondo degradado y nuestros nombres detrás. Este trabajo es una gran sencillez. Primero hicimos una circunferencia con la herramienta elipsis (y CTRL apretado para que fuera perfecta) y la pintamos de color rojo. Después escribimos una T de tamaño proporcional, la colocamos exactamente en el centro de la circunferencia mediante la opción "Alinear y distribuir" y usando "Diferenciar" se forma un hueco con el contorno y el relleno de la T. Como toque adicional le podemos añadir otra circunferencia por debajo del mismo tamaño con un "degradado" que vaya de blanco a amarillo para conseguir el efecto de la imagen. Y por último para sumarle un toque adicional escribimos "Esteban y Eloy" loa bajamos a fondo y le quitamos opacidad al círculo de arriba para que se viera.
Vamos a describir la primera práctica que hemos realizado, una circunferencia con una T, fondo degradado y nuestros nombres detrás. Este trabajo es una gran sencillez. Primero hicimos una circunferencia con la herramienta elipsis (y CTRL apretado para que fuera perfecta) y la pintamos de color rojo. Después escribimos una T de tamaño proporcional, la colocamos exactamente en el centro de la circunferencia mediante la opción "Alinear y distribuir" y usando "Diferenciar" se forma un hueco con el contorno y el relleno de la T. Como toque adicional le podemos añadir otra circunferencia por debajo del mismo tamaño con un "degradado" que vaya de blanco a amarillo para conseguir el efecto de la imagen. Y por último para sumarle un toque adicional escribimos "Esteban y Eloy" loa bajamos a fondo y le quitamos opacidad al círculo de arriba para que se viera.
4º Práctica de GIMP. Letras en calor resplandeciente.
Esta práctica fue un poco más difícil que la anterior, tuvimos muchos problemas y hubo que repetirla 4 veces, pero finalmente se consiguió. Vamos a explicar solo como hicimos la última, que es la que salió bien.
Primero escribimos en el fondo "Esteban" a tamaño 140, (podéis escoger la fuente que queráis) y con la capa seleccionada accedimos a "Filtros"-"Alfa a logotipo"-"Calor resplandeciente", dejamos los parámetros por defecto y aceptar. Como queremos que las letras se transparenten, eliminamos todas las capas menos la llamada "Glow Layer" y "Texto" (en este caso pondrá "Esteban" ya que es el nombre que le hemos dado"), clicamos con el botón derecho encima de la paleta capas y le damos a "Combinar capas visibles". Ahora creamos una imagen nueva , en nuestro caso de tamaño 1024x512 y cambiamos el fondo blanco por un degradado que vaya de negro a amarillo, para ello seleccionamos la herramienta "Degradado". Por defecto los colores de frente y fondo (debajo de las herramientas) serán negro y blanco, cambiamos el blanco por un amarillo con los parámetros Rojo 255, Verde 148 y Azul 0; cuando tengamos los colores y la herramienta seleccionada clicamos en la parte inferior del fondo y arrastramos hacia arriba (mantener pulsado Ctrl para que vaya recto).Debería quedaros algo así:
Ahora copiamos la capa "Texto" desde la otra imagen y la pegamos encima del nuevo fondo, la duplicamos y le pusimos de nombre "Fuego1", activamos "Mantener transparencia" ( marcar el cuadro a la derecha de bloquear) y pintamos esta nueva capa con un amarillo claro (Rojo 251 Verde 247 Azul 128). El resultado fue este:
Es hora de producir el movimiento de las llamas, para ello vamos a utilizar diferentes filtros. Desmarcamos la opción "Mantener transparencia" y a continuación comenzamos. Primero vamos a "Filtros"-"Distorsión"-"Desplazamiento" escogemos "Desplazar verticalmente" y valor 50. Ahora de nuevo "Filtros"-"Distorsión"-"Ondas" y como parámetros "Amplitud" 5, "Desfase" 0 y "Longitud de onda" 50. Toca difuminar un poco: "Filtros"-"Desenfoque"-"Desenfoque Gaussiano" con el parámetro en 5 horizontal y vertical. Y por último "Filtro"-"Desenfoque"-"Desenfoque de movimiento"-"Lineal"; Longitud 5 y Ángulo 45. Así salió:
Solo queda: duplicar la capa "Fuego1", activar "Mantener transparencia", pintarla (la capa "Fuego1") con los valores Rojo 247 Verde 79 Azul 56, poner la capa "Texto" por encima de las demás y clicando encima de la capa "Texto" darle dos veces a "Combinar capas visibles". El resultado es este:
Para introducirla en la imagen que queramos solo tenemos que arrastrar encima:
Esteban & Eloy
Primero escribimos en el fondo "Esteban" a tamaño 140, (podéis escoger la fuente que queráis) y con la capa seleccionada accedimos a "Filtros"-"Alfa a logotipo"-"Calor resplandeciente", dejamos los parámetros por defecto y aceptar. Como queremos que las letras se transparenten, eliminamos todas las capas menos la llamada "Glow Layer" y "Texto" (en este caso pondrá "Esteban" ya que es el nombre que le hemos dado"), clicamos con el botón derecho encima de la paleta capas y le damos a "Combinar capas visibles". Ahora creamos una imagen nueva , en nuestro caso de tamaño 1024x512 y cambiamos el fondo blanco por un degradado que vaya de negro a amarillo, para ello seleccionamos la herramienta "Degradado". Por defecto los colores de frente y fondo (debajo de las herramientas) serán negro y blanco, cambiamos el blanco por un amarillo con los parámetros Rojo 255, Verde 148 y Azul 0; cuando tengamos los colores y la herramienta seleccionada clicamos en la parte inferior del fondo y arrastramos hacia arriba (mantener pulsado Ctrl para que vaya recto).Debería quedaros algo así:
Ahora copiamos la capa "Texto" desde la otra imagen y la pegamos encima del nuevo fondo, la duplicamos y le pusimos de nombre "Fuego1", activamos "Mantener transparencia" ( marcar el cuadro a la derecha de bloquear) y pintamos esta nueva capa con un amarillo claro (Rojo 251 Verde 247 Azul 128). El resultado fue este:
Es hora de producir el movimiento de las llamas, para ello vamos a utilizar diferentes filtros. Desmarcamos la opción "Mantener transparencia" y a continuación comenzamos. Primero vamos a "Filtros"-"Distorsión"-"Desplazamiento" escogemos "Desplazar verticalmente" y valor 50. Ahora de nuevo "Filtros"-"Distorsión"-"Ondas" y como parámetros "Amplitud" 5, "Desfase" 0 y "Longitud de onda" 50. Toca difuminar un poco: "Filtros"-"Desenfoque"-"Desenfoque Gaussiano" con el parámetro en 5 horizontal y vertical. Y por último "Filtro"-"Desenfoque"-"Desenfoque de movimiento"-"Lineal"; Longitud 5 y Ángulo 45. Así salió:
Solo queda: duplicar la capa "Fuego1", activar "Mantener transparencia", pintarla (la capa "Fuego1") con los valores Rojo 247 Verde 79 Azul 56, poner la capa "Texto" por encima de las demás y clicando encima de la capa "Texto" darle dos veces a "Combinar capas visibles". El resultado es este:
Para introducirla en la imagen que queramos solo tenemos que arrastrar encima:
Esteban & Eloy
jueves, 17 de febrero de 2011
3º Práctica de GIMP. Halo
Está práctica era más fácil que la anterior puesto que había que hacer menos cosas, a continuación describiremos cómo lo hemos hecho:
En primer lugar abrimos el montaje anterior con el GIMP y ocultamos la capa fondo y sombra para que sólo se viera el cuerpo recortado.
Ahora seleccionamos la capa cuerpo y con la herramienta varita mágica + MAYUS seleccionamos el fondo e invertimos la selección (CTRL + I). Luego escogimos la herramienta pincel y le cambiamos los parámetros: color blanco, opacidad 50 y el tipo de pincel Circle Fuzzy (11) para que diera impresión de halo sobrenatural. Sólo quedaba ir a la pestaña "Editar" - "Trazar selección" y seleccionar "Trazar con una herramienta de pintura" y aceptar. Activamos de nuevo el fondo y la sombra, y trabajo acabado. La fotografía inicial está en la anterior entrada y aquí está el resultado:
Esteban y Eloy
En primer lugar abrimos el montaje anterior con el GIMP y ocultamos la capa fondo y sombra para que sólo se viera el cuerpo recortado.
Ahora seleccionamos la capa cuerpo y con la herramienta varita mágica + MAYUS seleccionamos el fondo e invertimos la selección (CTRL + I). Luego escogimos la herramienta pincel y le cambiamos los parámetros: color blanco, opacidad 50 y el tipo de pincel Circle Fuzzy (11) para que diera impresión de halo sobrenatural. Sólo quedaba ir a la pestaña "Editar" - "Trazar selección" y seleccionar "Trazar con una herramienta de pintura" y aceptar. Activamos de nuevo el fondo y la sombra, y trabajo acabado. La fotografía inicial está en la anterior entrada y aquí está el resultado:
Esteban y Eloy
viernes, 4 de febrero de 2011
2º Práctica de GIMP. Fotomontaje.
Bueno, ahora os hablaremos de la 2º práctica, en la que tuvimos que recortar mi cuerpo (Esteban) de una imagen para insertarlo en un paisaje previamente escogido a una resolución de 1920x1080 píxeles. Empezaremos por el principio:
Primero elegimos una imagen en la que salgo de cuerpo entero y la abrimos en el GIMP, luego la seleccionamos con la herramienta llamada "lazo" y una vez acabado la copiamos y la pegamos en el paisaje.
Como el cuerpo pegado era mucho mayor que la imagen, usando la herramienta "escalar" la pusimos a un tamaño creíble, después, antes de deselecionarlo creamos una nueva capa para que no se fundiera con el fondo y puediéramos modificarlo más tarde si queríamos.
Hecho esto, seguía pareciendo irreal, ya que a diferencia del resto de elementos, el cuerpo no tenía sombra, la forma de hacerlo era seleccionando a ojo con el lazo por detras y oscureciéndolo, pero de está forma no se parecía al cuerpo, sino que no tenía forma; pero innovamos una forma de que pareciera más real. Pegamos de nuevo el cuerpo por encima y le pusimos otra capa, usando la herramienta de transformación "perspectiva" la inclinamos con relación a luz proporcionada por el sol y la oscurecimos.
Para oscurecerlo fuimos a Colores - "Matiz - Saturación" y le quitamos luminosidad y saturación. Por último, ya todo parecía aceptable, pero no daba el pego porque el cuerpo era demasiado oscuro en relación al paisaje, así que por el mismo procedimiento que la sombra le aumentamos la luminosidad. Una vez acabado solo restaba mandarle el correo a nuestro profesor. Y aquí está, 1º la fotografía incial y luego el resultado:
Esteban y Eloy
Primero elegimos una imagen en la que salgo de cuerpo entero y la abrimos en el GIMP, luego la seleccionamos con la herramienta llamada "lazo" y una vez acabado la copiamos y la pegamos en el paisaje.
Como el cuerpo pegado era mucho mayor que la imagen, usando la herramienta "escalar" la pusimos a un tamaño creíble, después, antes de deselecionarlo creamos una nueva capa para que no se fundiera con el fondo y puediéramos modificarlo más tarde si queríamos.
Hecho esto, seguía pareciendo irreal, ya que a diferencia del resto de elementos, el cuerpo no tenía sombra, la forma de hacerlo era seleccionando a ojo con el lazo por detras y oscureciéndolo, pero de está forma no se parecía al cuerpo, sino que no tenía forma; pero innovamos una forma de que pareciera más real. Pegamos de nuevo el cuerpo por encima y le pusimos otra capa, usando la herramienta de transformación "perspectiva" la inclinamos con relación a luz proporcionada por el sol y la oscurecimos.
Para oscurecerlo fuimos a Colores - "Matiz - Saturación" y le quitamos luminosidad y saturación. Por último, ya todo parecía aceptable, pero no daba el pego porque el cuerpo era demasiado oscuro en relación al paisaje, así que por el mismo procedimiento que la sombra le aumentamos la luminosidad. Una vez acabado solo restaba mandarle el correo a nuestro profesor. Y aquí está, 1º la fotografía incial y luego el resultado:
Esteban y Eloy
Suscribirse a:
Entradas (Atom)














