Curso de diseño y retoque fotográfico con Gimp Apuntes, recursos y ejercicios gratis

Plugin para Liquidrescale para Gimp

2013-06-21T21:29:00.002+02:00

Este plugin te permite escalar las imágenes sin perder la proporción.
http://liquidrescale.wikidot.com/

Efectos de texto usando Gimp

2013-03-10T19:09:00.003+01:00

En esta dirección tenéis una relación de efectos que pueden ser realizados con Gimp. En cada una de las opciones se explica paso a paso como hacerlo.

http://texteffectsforgimp.wordpress.com/

Gimp · Practical exercise · Add exact guides to imagen

2012-10-17T00:48:00.001+02:00

In a Gimp imagen you can add a guide in an exact place using "Imagen/New guide (by percent)" option (see figure below):

Add exact guides to image in Gimp.

A guide can be placed in an exact place, for example, if you want one horizontal guide in the middle of the image, you can use 50 percent. If you want to separate the vertical space by three, you can use 33, 66 percent, etc.

In this way, you can add any horizontal or vertical guide in the middle of the image. This is perfect for some designs where the space is divided in blocks..

Practical exercise: Load some image. Add the necessary guides for divide the image size in two columns and three rows.

Gimp · Colocar guías exactas en una imagen

2012-10-09T18:58:00.001+02:00

Cuando en Gimp deseamos añadir guías en una posición que corresponda a un porcentaje del tamaño de la imagen, se puede utilizar la opción del menú "Imagen/Guía nueva (por porcentaje)":

Añadir guías exactas en Gimp.

De esta manera podemos colocar fácilmente un guía vertical y horizontal justo en la mitad del documento, para separar, por ejemplo, la imagen en cuatro cuadrantes. En este caso, situaríamos las dos guías (vertical y horizontal) al 50% del tamaño. Esta operación es perfecta para algunos trabajos de diseño donde se desea dividir el espacio en bloques. Otras opción como usar un 30% nos permitirá dividir el espacio en áreas más pequeñas.

Ejercicios práctico: Carga una imagen en Gimp. Coloca las guías necesarias para dividir la imagen, en dos columnas y tres filas. ¡Ánimo!

Gimp · Ejercicio práctico, diseñar un banner publicitario

2012-10-01T22:05:00.002+02:00

Os propongo diseñar un banner publicitario como el que aparece en esta página web:

http://www.fotonostra.com/grafico/trackingykerning.htm

El diseño no es una imagen jpg o png, se puede hacer clic con el botón derecho del ratón para comprobar que no es una imagen ¿qué fichero es? Se pide realizar el diseño usando Gimp.

Para medir las dimensiones del banner, como no se puede descargar, hay que utilizar otro método.

Se puede utilizar Jrules, una herramienta muy interesante para medir en pantalla.

http://www.spadixbd.com/freetools/jruler.htm

¿Se os ocurre algún otro método para obtener la medida sin este programa?

Compartir, comentar, complementar y aprender..

2012-09-12T10:46:00.003+02:00

Después de aprender el uso de los programas, hemos empezado a realizar proyectos, imaginamos trabajos que nos pueden pedir las empresas y realizamos los diseños completos. Ayer propuse un cartel turístico para la ciudad de Sagunto y un cartel publicitario para una academia de informática, usango Gimp e Inkscape. Cuando he recibido uno de los carteles, lo he reenviado al grupo por correo electrónico con un objetivo

La idea no es sólo que compartamos y veamos los diseños, que está muy bien, lo que pretendo es que entre todos, podamos compartir mejoras, ideas, sugerencias sobre el diseño que ha realizado mis compañeros en el aula. Por ejemplo puede ser interesante hacerse este tipo de preguntas, ¿cómo lo hubiera hecho yo? ¿hubiera añadido algo más? ¿el tipo de letra me gusta? o ¿quizá yo hubiera puesto otro?

El objetivo es que también aprendamos a ser críticos, pero siempre de manera constructiva. Está claro que a todos no nos gusten las mismas cosas, los mismos diseños, pero siempre podemos aportar algo positivo ¿verdad? Algunos ejemplos se comentarios positivos podrían ser:

"Yo hubiera elegido un tipo de letra con más fuerza para el título principal.." o
"En las fotos centrales, yo incluiría una composición tipo póster.." o
"Los textos de los titulares tienen un tono muy parecido al fondo y casi no se ven, yo le hubiera puesto un borde de 2 píxeles en negro para mejorar su visibilidad.."

Venga ánimo y a compartir, comentar, complementar y aprender!!!!

Gimp · Conseguir alto contraste en las imágenes

2012-07-20T12:20:00.000+02:00

En este ejemplo se ha aplicado el modo de capa blanquear con pincel y aerógrafo para conseguir alto contraste. Nueva capa, duplica la capa, cambia el modo y usa la herramienta.

Duplicar capa, modo blanquear y herramienta pincel.

Duplicar capa, modo blanquear y herramienta aerógrafo.

Gimp · Combinar efectos por capas y colores

2012-07-19T13:43:00.001+02:00

Cuando trabajamos con varias capas, un buen recurso es aplicar diferentes efectos a cada capa, también puede hacerse sobre una selección por color en una capa única. Aquí puede verse un ejemplo donde se ha utilizado el filtro desenfoque de movimiento.

Imagen final · Desenfoque radial (turquesa) y acercamiento (rojo).

La imagen original tiene dos capas, un lienzo en blanco y un fondo en color rojo. Sobre la primera capa, se ha pintado con un valor de jitter alto, se ha aplicado detección de bordes, selección por color y se ha cambiado el modo de capa a extraer granulado. Fusionadas las dos capas, con la herramienta de selección por color se aplican filtros diferentes a zonas de la imagen. También se puede aplicar efectos distintos a las capas por separado. Experimenta!!

Imagen original · Pincel glow1_brushes_by_hawksmont5

El pincel aquí descrito, puede descargarse aquí

Gimp · Cuidado con el tamaño de las animaciones

2012-07-16T18:30:00.000+02:00

Hay que tener especial cuidado con el tamaño de las animaciones. Si son para la web, deben ser ligeras y no superar, siempre que sea posible, el mega de peso. La siguiente animación se diseñó a un tamaño de 1000x600px, generando un fichero muy grande.

Tamaño original 1000x600 · 4,28MB

Aunque las conexiones actuales son rápidas, se aconseja que un archivo pequeño para agilizar la carga en los navegadores, para minimizar el efecto en conexiones lentas.Se puede escalar la animación, reduciendo el tamaño del fichero final.

Tamaño 200x120 · 245KB

También se puede modificar la velocidad de fotogramas para conseguir otros efectos:

Tamaño 200x120 · 245KB (acelerado)

Gimp · Efectos artísticos en el borde de un texto

2012-07-16T12:51:00.004+02:00

El objetivo del ejercicio es aplicar un efecto al borde de un texto. Primero seleccionamos la herramienta de texto y escribimos un mensaje. Selecciona un tipo de letra como Arial Black, Bauhaus o Verdana, con un tamaño de fuente alto para que el resultado sea mejor.

Texto en Verdana Bold 79 puntos.

Adapta la capa de texto al tamaño del lienzo, así cualquier selección realizada en él (por ejemplo, con la herramienta de selección por color), incluirá todos los puntos. Seleccionamos la capa con el botón derecho y elige la opción "Capa a tamaño de imagen".

La capa de texto se adapta al tamaño del lienzo.

Ahora selecciona la herramienta "Selección difusa" y haz clic en una zona en blanco de la capa de texto. Con esta operación seleccionamos el fondo. Amplía la selección en 3 ó 4 pixeles con "Seleccionar/Agrandar".

Al ampliar la selección, queda seleccionada una parte del texto.

Una vez se tiene seleccionada una zona de la imagen, se pueden aplicar filtros como "Distorsiones/Ondular" o "Artístico/Cubismo" y observar los resultados:

Se ha aplicado al texto el Filtro Distorsiones/Ondular.

Se ha aplicado al texto el Filtro Artístico/Cubismo.

Los mejores resultados los obtendrás por experimentación personal, cuanto más uses las opciones, más aprenderás. Anímate a utilizar diferentes efectos, a cambiar el ancho de la selección, a cambiar los pinceles y conseguirás resultados muy interesantes.

Gimp · Animación de texto sencilla

2012-07-12T19:38:00.001+02:00

El trabajo está realizado usando dos capas, una de fondo negro y otra con el texto. Al texto se le ha matizado con un pincel (puede usarse cualquiera). Se pueden utilizar otros efectos una vez se convierte a imagen.

Primera prueba. Animación demasiado rápida.

Hay que tener cuidado con el tamaño de las capas, deben estar recortadas al mismo tamaño para que no aparezcan saltos y zonas sin pintar. En la segunda se ha añadido más fotogramas para suavizar el movimiento. Se ha usado el desenfoque de movimiento.

Mayor número de fotogramas y desenfoque.

El movimiento ahora es mucho más suave, sin saltos y va apareciendo el texto gradualmente. La última versión:

Gimp · Ejemplo de trabajo con capas en un mueble de cocina

2012-07-12T15:26:00.002+02:00

El trabajo con capas es la piedra angular de los trabajos de diseño, permite separar el trabajo y modificar diferentes partes de la imagen independientemente. Por ejemplo, en este ejercicio, se quería tintar el cristal frontal de un mueble de cocina. El cliente deseaba saber el aspecto que tendría con un tono similar al de la bancada.

Imagen original. El cristal al ácido no aparece tintado.

En este ejercicio de Gimp, se utilizan tres capas: Una para la imagen original y dos más, ambas transparentes, para los dos cristales nuevos (el nuevo tintado). Hemos renombrado las capas como "original", "cristal_izquierdo" y "cristal_derecho". Recuerda que es conveniente tener bien organizadas las capas, cada una con su nombre.

Primera aproximación. Tinte suave.

Las capas correspondientes a los cristales, deben situarse por encima de la original, para apreciar el efecto. Recuerda que las capas de arriba "tapan" las que están por debajo. Se ha utilizado la herramienta lazo, para seleccionar el área de cristal de cada puerta del mueble. Se ha rellenado con el bote de pintura, capturando a priori, el color de la bancada, con la herramienta cuentagotas.

Segunda aproximación. Tinte más intenso.

En la última figura, se ha probado con los modos de capa, para aplicar una mayor intensificar al tono del cristal. Se puede utilizar cualquier otro color para probar otras combinaciones. Se puede ver dos ejemplos más en las imágenes siguientes:

Gimp · Ejemplo del uso de máscaras de capa

2012-07-11T17:48:00.001+02:00

Cuando se utiliza la máscara de capa en una imagen, se puede hacer visible o no cierta parte de la misma. Podríamos decir que es como aplicar opacidad selectiva a partes de la capa, haciendo transparentes zonas de la imagen. Los efectos que se pueden conseguir con dos imágenes son muy interesantes. Sobre todo, es útil, cuando deseamos realizar una composición con varias imágenes.

Ejemplo del uso de la máscara de capa con Gimp.

En el ejemplo de arriba hemos utilizado dos imágenes y aplicado máscaras de capa para hacer visibles sólo unas franjas de la misma.

Gimp · Introducción al programa e imagen digital

2012-07-07T02:59:00.002+02:00

Gimp

View more PowerPoint from geopaloma

Gimp · Ejemplo de animación intermitente coche

2012-07-06T12:50:00.000+02:00

Modificado el coche con Gimp, hemos creado una sencilla animación (gracias Mario):

Gimp · La ficha técnica en los trabajos

2012-07-05T15:59:00.001+02:00

Recordad que debemos usar la ficha técnica, quizá no en los trabajos más sencillos, pero sí en aquellos que por su complejidad, requieran recordar los pasos o técnicas utilizadas (he visto hoy que muchos apuntáis en clase en un cuaderno).

Algunas de las pruebas (numerosas) que iremos haciendo a lo largo del curso, consistirán en redactar las fichas técnicas de los trabajos realizados.

Pensemos en uno de los ejercicios costosos que hemos realizado (por ejemplo el retoque de la jirafa). Vamos a preparar la ficha técnica del trabajo, basándonos en el modelo que os envié en un correo anterior.

Tarea de evaluación: Preparar una ficha técnica completa, donde se refleje el trabajo realizado para completar el retoque de la jirafa (detallando todas las operaciones, efectos y consideraciones que hayáis utilizado en dicho trabajo). Este documento será un manual de referencia, que otra persona y nosotros mismos, podamos leer y comprender perfectamente. Por lo tanto, mucho ojo con la manera de enunciar, expresar acciones, describir tareas, etc, usaremos frases cortas y concisas del tipo: "..usar la herramienta lazo sobre la selección..", "..aplicar la máscara rápida y eliminar..", "..guardar en formato png para enviar por correo..", etc...

Gimp · Practicando con ejemplos de la web

2012-06-29T20:12:00.003+02:00

La mejor manera de aprender es practicando.
Hoy me pasan este enlace para buscar empleo. Quizá os pueda servir.
Observad en el banner, el texto difuminado con efecto tiza.

Si tenéis un rato y queréis seguir practicando, es buena idea dar un paseo virtual por Internet.
Hay cientos de banners y otros ejemplos que os pueden servir de inspiración para diseñar, crear y practicar..

Wikibook de Gimp (inglés)

2012-06-28T13:39:00.000+02:00

Magnífico wikibook de Gimp (en inglés):
http://en.wikibooks.org/wiki/GIMP/Print_version

Gimp · Ejercicio de sombreado a un coche

2012-06-28T01:16:00.001+02:00

Ayer con el ejercicio del Porsche estuvimos viendo como eliminar o seleccionar zonas del fondo. En este ejemplo, se puede usar la selección por color, pero no es fácil porque tiene un sombreado en la parte superior, que no hace posible una selección directa. Puede usarse la máscara rápida y entonces, con un pincel, ir añadiendo zonas a la selección. La máscara rápida es una buena herramienta para modificar "en vivo" una selección previamente creada. Mañana lo veremos en clase.

Una vez seleccionado el coche, se puede aplicar el sombreado, con diferentes parámetros, obteniendo resultados muy aparentes. Aquí se pueden ver algunas muestras junto a los parámetros usados.

El radio de desenfoque, corresponde al grado de dispersión de la sombra, podemos asociarlo al grosor de la sombra. Un valor pequeño presenta una sombra muy definida y ajustada a la selección.

Radio de desenfoque 10, opacidad 100: difuminado bajo (sombra definida) y alta intensidad de color

Con valores grandes en el radio de desenfoque, la sombra se difumina, se dispersa, como una nube, cubriendo la mayor parte de la selección (la parte interior). Se puede observar en el ejemplo.

Radio de desenfoque 300, opacidad 80: difuminado medio, intensidad alta de color

La opacidad mide el grado de intensidad de la sombra, a valores pequeños, la sombra se muestra como una fina capa de color (como la primera imagen), muy suave, que puede utilizarse con valores grandes de radio de desenfoque, para tintar zonas, como lunas o diferentes materiales.

Radio de desenfoque 1024, opacidad 10: gran difuminado y poca intensidad de color

Con valores grandes en la opacidad, la intensidad del color es muy alta (con valores de desenfoque pequeños da forma a una sombra intensa y muy definida y para valores grandes el modelo se rodea de un halo con color intenso como puede verse en la figura siguiente.

Radio de desenfoque 500, opacidad 100: gran difuminado y mucha intensidad de color

Para valores muy altos de radio de desenfoque y de opacidad, el modelo (la selección realizada) se queda rodeada de un brillo que puede simular el rojo vivo de una llama, una tobera de un avión, o puede resaltar algunas zonas de la imagen o de un texto.

Radio de desenfoque 5000 opacidad 100: altísimo difuminado y mucha intensidad de color

Gimp · Códigos de colores HTML

2012-06-25T22:55:00.002+02:00

http://html-color-codes.info/codigos-de-colores-hexadecimales/

Gimp · Compartir archivos grandes

2012-06-22T11:57:00.000+02:00

Sitios que he probado para compartir archivos:

- Google Docs.

Transferbigfiles

No hace falta registrarse, seleccionas el archivo a compartir y escribes la dirección de correo del destinatario. En usuario recibirá un enlace en su correo. El fichero estará disponible sólo 5 días.

Gimp · Formatos para encargos de imprenta

2012-06-21T14:46:00.003+02:00

Antes de enviar un trabajo a una imprenta, es muy importante hablar con ellos, para determinar el formato en el que se entregará el diseño. Cada imprenta puede trabajar con software diferente, por lo tanto, no debemos asumir que tienen los mismos programas con los que nosotros trabajamos.

Por ejemplo, si nosotros usamos Gimp y ellos Photoshop, no podrán abrir un fichero si lo enviamos en el formato nativo (.xcf). En estos casos hay que fijar un formato para el envío del trabajo.

Formatos hay muchos: jpg, png, tiff, gif, pdf..pero no debemos suponer que ellos admitirán cualquiera, una regla de oro es no asumir nada hasta confirmarlo.

Paso 1: Contactar y preguntarles los formatos que admiten.
Paso 2: Enviarles un archivo de muestra por email y una copia impresa escaneada.
Paso 3: Contactar para confirmar que lo han recibido y que no tienen problemas para abrirlo.

Una vez establecido el protocolo, si es posible, es buena idea solicitar una prueba de impresión. Cuando no se ha trabajado con la imprenta, pueden aparecer errores y es bueno si se detectan en los primeros pasos. Cuando la impresión es muy exigente, debe obligatoriamente solicitarse una prueba de impresión.

Imaginemos un caso donde una empresa nos pide un encargo de miles de euros y no hacemos la prueba de impresión. Si en el trabajo final el cliente no aprueba la impresión porque no ha salido como quería, la responsabilidad será nuestra por no haber hecho una prueba de impresión. En cualquier caso se debe informar al cliente que es necesario hacerla para garantizar el producto final. En caso de no querer hacerla, la responsabilidad será de ellos (y deberán pagar por el trabajo aunque no corresponda a sus expectativas iniciales).

Veamos un caso real, hemos diseñado una tarjeta de visita con Gimp y nos ponemos en contacto con una imprenta por correo electrónico:

"Nuestro diseño está realizado con Gimp. Por favor, podrían indicarnos los formatos que ustedes admiten para enviarles nuestro trabajo".

Estamos a la espera de su contestación...

Gimp y Movie Maker, los títulos de crédito

2012-06-21T14:02:00.001+02:00

Cuando tenemos que añadir títulos de crédito a nuestra animación, puede hacerse con Gimp, pero también puede hacerse usando Movie Maker. Ya que es mucho más sencillo hacerlo con el software de Microsoft, quizá para mejorar nuestra productividad y siempre que tengamos acceso a un sistema Windows, podemos centrarnos en la animación y luego convirtiéndola a formato .wmv (vídeo de Movie Maker) podemos añadir los títulos de crédito, efectos y audio en postproducción.

Gimp · Centrar un texto en el lienzo con guías

2012-06-21T13:59:00.001+02:00

Para poder centrar un mensaje de texto en el lienzo sólo hay que añadir una guía vertical justo en la mitad de la imagen. Cuando se hace, en la parte inferior de la ventana, puede verse la posición, por tanto sólo hay que ir moviéndola hasta que estemos en la mitad del tamaño (ancho).

El tamaño de la imagen puede verse en la parte superior de la ventana. Si la imagen es de 450x240px entonces pondremos la guía en la posición 225px.

Dafont, fuentes para Gimp

2012-06-21T12:12:00.000+02:00

En este enlace podréis encontrar muchos tipos de fuentes, se puede buscar por categorías. Importante mirarse bien para cada una, el tipo de permiso. También algunas tienen apartado de donación para apoyar el trabajo de los autores.
http://www.dafont.com/es/

Para usarlas, si están comprimidas, primero se descarga a una carpeta, se descomprime y se instalan haciendo doble clic en el archivo de fuente. Una vez instalada, se debe reiniciar Gimp para que pueda actualizar su lista.