PDF de programación - Edición digital de imágenes con Gimp: Herramientas avanzadas

Edición digital de imágenes con Gimp:

Herramientas avanzadas

Ana Saiz García
<[email protected]>

I Jornadas de Diseño Gráfico y Software Libre

Facultad de Informática de A Coruña

Octubre 2004

Guión

● Trabajo con capas
● Filtros
● Animaciones
● Personalización de brochas y patrones
● Script­Fu
● Ejemplos:

– Elementos para páginas web
– Retoque fotográfico

Trabajo con capas (I)

● Capas: láminas transparentes con porciones de la imagen

– Apilables
– Tratamiento independiente
– No estropear trabajo bien hecho con elementos nuevos

● Modo ­> tipo de mezcla de la capa con inferiores

● Mantener transparencia ­> restringe las 
modificaciones a la parte no transparente

● Opacidad ­> 0 transparente, 100 opaca

●   Conservar estructura capas ­> guardar como 

XCF

Trabajo con capas (II)
Operaciones sobre capas (I)

● Añadir nueva capa
● Mover capa

– hacia arriba
– hacia abajo
● Duplicar capa
● Anclar selección flotante a una capa
● Eliminar capa

●  Click sobre una capa ­> capa activa
●  Click sobre el ojo ­> capa visible/invisible

Trabajo con capas (III)
Operaciones sobre capas (II)

● Click con botón derecho sobre la capa en el diálogo
● Mismas operaciones que en el diálogo
● Combinar capas ­> mezcla dos o más capas

– combinar hacia abajo ­> capa activa con la inferior
– combinar visibles ­> sólo capas con ojo activado
– aplanar la imagen ­> combina todas las capas

● Alfa a selección ­> selecciona zonas no transparentes
● Alinear capas ­> Click botón derecho sobre la imagen... 

Capa... Alinear capas visibles

Trabajo con capas (IV)

Operaciones sobre capas (y III): Modos

●  Combinar píxels de una capa con los de las inferiores

● Normal
● Disolver
● Multiplicar
● Dividir
● Pantalla
● Solapar
● Blanquear

● Ennegrecer
● Claridad fuerte
● Claridad suave
● Extraer granulado
● Combinar granulado
● Diferencia
● Suma

● Sustraer
● Oscurecer sólo
● Clarear sólo
● Tono
● Saturación
● Color
● Valor

Trabajo con capas (V)

Máscaras (I)

● Cubren una capa
● Modificar la capa basándose en 

canales alfa (luminosidad)
– Partes negras ­> visibilidad total
– Partes blancas ­> invisibilidad 

total

● Click botón derecho sobre 

capa... Añadir máscara de capa

Trabajo con capas (y VI)

Máscaras (y II)

● Trabajar sobre la máscara (por ejemplo pintar)

● Botón derecho... Aplicar máscara de capa

● Botón derecho... Máscara a selección ­> 

crear selección a partir de máscara

Filtros (I)

● Plug­ins específicos para alterar imágenes
● En contínuo desarrollo
● Click botón derecho... Filtros...

– Desenfoque
– Ruido
– Realzar
– Efectos de cristal
– Efectos de luz
– Distorsión
– Artísticos...

¡Jugar!

Filtros (II)

Algunos filtros interesantes
● Desenfoques ­> nos permiten hacer sombras
● Colores

– Descomponer ­> divide en canales de color
– Invertir valor ­> intercambia colores por sus opuestos
– Color a alfa ­> pone transparentes los píxels del color elegido

● Mapa

– Hacer enlosable

● Renderizar

– Gfig ­> permite dibujar figuras geométricas

Animaciones (I)

● Animación: efecto visual creado por el movimiento de 

varias capas superpuestas de la misma imagen, a la 
velocidad suficiente para engañar al ojo humano.

● En Gimp ­> diálogo de capas

– Nombre de la capa ­> información sobre el tiempo:

Nombrecapa (100ms)

– El tiempo de cada capa es acumulado al de la inferior 

(no absoluto)

Animaciones (y II)

● Procedimiento:

– Crear nueva imagen y hacer el dibujo de partida
– Crear nueva capa transparente

● Modificar dibujo
● Asignarle información de tiempo (nombre)
– Hacer lo mismo con todas las capas deseadas
– Filtros... Animación... Reproducir animación
– Guardar como GIF ­> Animación

Personalización de brochas y patrones (I)

Brochas (I)

● Imagen en escala de grises 

(Imagen...Modo...escala de grises)

● Guardar con extensión .GBR

– Elegir espaciado

● Mover al directorio .gimp[­version]/brushes
● Abrir diálogo de brochas ­> refrescar
● Se puede elegir color con el que pintar

Personalización de brochas y patrones (II)

Brochas (y II)

● A partir de una imagen en color
● Una o varias capas transparentes
● Guardar con extensión .GIH
● Opciones:

– Espaciado (%)
– Número de celdas (­> número de capas)
– Dimensión, Rangos 
– Selección ­> Forma en que varía la brocha

● Mover a .gimp[­version]/brushes y refrescar diálogo

Personalización de brochas y patrones (y III)

Patrones

● Dibujar imagen
● Hacer enlosable: Filtros...Mapa...Hacer enlosable
● Guardar con extensión .PAT
● Mover a .gimp[­version]/patterns
● Refrescar patrones

Plug­ins

● Extender la funcionalidad de Gimp sin necesidad de modificar y 

compilar el código de éste (por ejemplo los filtros)

● Programas externos que se ejecutan bajo el control de Gimp e 

interactúan con él

● Suelen depender de la versión de Gimp

●

Instalación ejemplo.c 
– gimptool[­2.0] –install ejemplo.c (necesitamos libgimp2.0­dev)
– lo compila y lo copia a .gimp[­2.0]/plug­ins

● El menú en el que se instala viene determinado por el plug­in
● Explorador de procedimientos (DB Browser) ­> muestra base de 

datos sobre plug­ins y extensiones instalados

Scripts­Fu

● Scripts que hacen uso de las funciones de la base de datos de 

Gimp

● Automatizar y agrupar efectos

– No tener que repetir todos los pasos
– Compartirlo con los demás

● Generalmente escritos en SCHEME, plug­ins para trabajar con 

otros lenguajes (Perl, Tcl)

● Algunos incluidos, otros descargables

●

Instalar ejemplo.scm:
– copiarlo a .gimp­2.0/scripts
– Exts... Script­Fu... Refrescar guiones

Scripts­Fu (II)

Tipos (I)

● Standalone ­> genera nueva imagen

– Botones para páginas web...

– Logos...

Scripts­Fu (y III)

Tipos (y II)

● Dependientes de la imagen ­> operan sobre imagen existente

– Redondear esquinas

– Fulgor alienígena

Perl­Fu (I)

● Módulo para plug­ins escritos en Perl
● Qué necesitamos

– The Gimp
– Perl
– Gtk­Perl (libgtk­perl)
– Gimp­Perl (libgimp­perl)

Perl­Fu (II)
Estructura básica

#!/usr/local/bin/perl 

#Módulos de perl específicos para Gimp

use Gimp ":auto";  #Auto:incluir funciones de DB

use Gimp::Fu;

#Subrutina que ejecuta las acciones sobre Gimp

sub{...}

#Registro del script para Gimp

register ... ;

exit main();  #Devuelve el control a Gimp

Perl­Fu (III)

La función de registro (I)

● Registra el script para Gimp, definiendo la interfaz entre ambos

● Parámetros:

1. Nombre de la función (string)
2. Pequeña descripción (string)
3. Texto de ayuda (string)
4. Nombre del autor (string)
5. Copyright (string)
6. Fecha de creación (string)
7. Path donde se localiza el script en el menú (string)

• “<Toolbox>/Xtns/Perl­Fu/Script Name” ­> standalone
• "<Image>/Perl­Fu/Script Name" ­> dependientes de la imagen

Perl­Fu (IV)

La función de registro (y II)

● Parámetros (y II):

8. Tipos de imagen aceptados (string) ­> para los scripts dependientes de 

imagen: * (cualquier tipo), RGB, RGBA, GREY

9. Referencia a un array de parámetros de entrada del script ­> cada uno a su 

vez es otra referencia a un array que contiene:

• Tipo de parámetro (PF_INT. PF_IMAGE, PF_COLOR...)
• Nombre del parámetro (string)
• Breve descripción del parámetro
• Valor por defecto
• Array con rango permitido para el parámetro (en PF_SLIDER, 

PF_SPINNER)

10. Llamada a la subrutina que realizará las operaciones sobre la imagen

Perl­Fu (V)

La subrutina de operaciones

● Es llamada al ejecutar el script

● Se le pasan como argumentos la lista de parámetros definidos en la 

función de registro

– En scripts dependientes de la imagen, se pasan como primer y segundo 

parámetros la imagen y la capa activas

● Formas de declarar la subrutina:

– A continuación de la función de registro
– Antes de la función de registro ­> darle un nombre (sub ejemplo) y 

referenciarla al final de la función de registro (\&ejemplo;)

● Las funciones que se llaman son las de la DB, sustituyendo “­” por “_”

Perl­Fu (VI)
Manos a la obra... 

● Antes de empezar ­> Qué queremos hacer

1. Standalone o dependiente de imagen
2. Parámetros de entrada
3. Sobre qué tipo de imágenes trabajaremos
4. Secuencia de operaciones 

Perl­Fu (VII)
Ejemplo I (I) 

● Dibujar plantilla para pegatina de CD con color elegido por el usuario

– Standalone

– Parámetros de entrada: color de relleno

– Cualquier tipo de imagen

– Secuencia de operaciones:

1. Crear nueva imagen y
2. Crear nueva capa y añadir ésta a la imagen
3. Fijar color de entrada como color de frente
4. Rellenar la capa con el color de frente
5. Hacer selección circular de altura y anchura 11.5cm empezando en (0,0)
6. Invertir selección
7. Cortar
8. Invertir selección
9. Reducir selección 3.75cm (107px)
10. Cortar 

Perl­Fu (VIII)
Ejemplo I (II) 

#!/usr/bin/perl

use Gimp ":auto";

use Gimp::Fu;

sub pegatina_cd{

  my($color) = @_;   #almacena los argumentos de entrada

  #variables que vamos a utilizar en las funciones

  my $width=327;           #altura de la imagen y la selección circular

  my $height=327;          #anchura de la imagen y la selección circular

  my $opacity=100;         #opacidad de la nueva capa

  my $mode=0;              #modo de capa normal

  my $coordx=0,$coordy=0;  #inicio de la selección circular

  my $operation=0;         #opción de selección: añadir

  my $antialias=1;         #selección con antialias activado

  my $shrink_rad=107;      #radio de reducción de selección

Perl­Fu (IX)
Ejemplo I (III) 

  #Paso 1: crear nueva imagen RGB

  my $img=gimp_image_new($width, $height, 0);

  #Paso 2: crea una nueva capa

  my $layer = gimp_layer_new($img, $width, $height, 0, "Capa 1", $opacity, 

$mode);

  #Paso 3: añadir la capa a la imagen

  gimp_image_add_layer($img, $layer, 0);

  #Paso 4: fijar color de frente

  gimp_palette_set_foreground($color);

  #Paso 5: rellenar la capa con el color de frente

  gimp_edit_fill($layer, 0);

  #Paso 6: hacer selección circular

  gimp_ellipse_select($img, $coordx, $coordy, $width, $height, $operation, 

$antialias, 0, 0);

 

Perl­Fu (X)
Ejemplo I (IV) 

  #Paso 7: invertir