Manual para la correcta maquetación de ePubs, escrito por y para los miembros de la comunidad del Proyecto Scriptorium.

En este cuarto tomo dejaremos un poco de lado la maquetación en si misma y abordaremos la creación y modificación de imágenes. Extendiendo la explicación básica respecto a las portadas que existe en el primer tomo (Manual básico), veremos cómo dibujar, retocar, ajustar parámetros y en definitiva cómo conseguir que las imágenes que incluyamos en nuestros libros tengan la mejor calidad posible.

Por otro lado, también aprenderemos a crear y utilizar imágenes escalables, algo en ocasiones muy necesario para crear un efecto adecuado en esos libros donde son parte fluida del texto y deben escalarse a la vez que el lector aumenta o reduce el tamaño de la fuente.

Si consideras que el Manual no abarca algún tema necesario, que en su redacción cierto punto no ha sido abordado con la suficiente claridad, que no es correcto o que tienes un método mejor de trabajo, por favor, ponte en contacto con la editora responsable: Fénix.

Proyecto Scriptorium

Aprende a maquetar IV: Imágenes y gráficos svg

Manual para maquetar libros electrónicos - 4

ePub r3.0

Fénix 22.10.2018

Título original: Aprende a maquetar: Imágenes y gráficos svg

Proyecto Scriptorium, 2013

Edición revisada y actualizada, 2018

Diseño de cubierta: Diseñador

Editora responsable: Fénix

ePub base r2.0

A todos los editores,

del pasado, presente y futuro.

FÉNIX

¿Cómo usar este manual?

Este cuarto tomo únicamente pretende mejorar la calidad de las imágenes incorporadas en nuestros ePubs, por lo que en una primera parte ofrece una explicación básica sobre algunas de las características más útiles del programa de tratamiento de imágenes GIMP, mientras que en la segunda se centra en la creación y uso de los gráficos SVG.

Si quieres localizar algún punto concreto dispones, al igual que en los tomos anteriores, de dos métodos de organización complementarios:

Una TOC realmente amplia que permite localizar casi cada detalle del contenido.

Un Índice temático que recoge buena parte de los contenidos más interesantes.

Es imprescindible haber leído y dominado el primer tomo, Manual básico, antes de profundizar en la parte avanzada.

TRATAMIENTO DE IMÁGENES CON GIMP

Introducción a GIMP

GIMP es un programa para manipulación de imágenes. Aunque en una primera aproximación puede parecer un programa complejo, es muy versátil y fácil de usar. Quien ha trabajado previamente con Photoshop, verá que la dinámica de trabajo es similar, aunque el entorno es algo diferente y requiere un tiempo de adaptación.

Su principal ventaja es que al ser de código abierto, el desarrollo es continuo, implementándose múltiples complementos que potencian sus posibilidades. El programa y muchos de los complementos se pueden descargar desde su página oficial (http://www.gimp.org/), donde también encontrarás un enlace a la documentación oficial.

Como utilizar este manual

El manual de GIMP abarca muchas herramientas y conceptos que te serán completamente nuevos, así que hay que tomarlo con calma e ir experimentando. Se abordan primero una serie de capítulos generales, pasando luego a describirse las herramientas de que dispone GIMP.

Para este manual se ha utilizado la versión 2.8. Si utilizas una versión diferente, puede haber variaciones en el funcionamiento aquí descrito.

Capítulos generales

Se explican conceptos que se van a utilizar posteriormente en la descripción de las herramientas.

Moverse por GIMP: de obligada lectura (se definen conceptos que se van a utilizar posteriormente en la descripción de las herramientas).

Primeros pasos: de obligada lectura (cómo crear tu proyecto de GIMP y exportar la imagen).

Imagen

Estructura de la imagen: de obligada lectura.

Propiedades de las imágenes digitales: lectura recomendada.

Herramientas y recursos

Están agrupadas según su función. En cada grupo se explican primero las más sencillas y / o las más útiles. No hace falta leer la sección completa, solo lo necesario para que te hagas una idea de cómo funciona y las opciones disponibles. Algunos conceptos y aplicaciones los irás descubriendo con la práctica.

Generalidades: Lectura recomendada.

Herramientas pasivas: Son las que no tienen un efecto directo sobre la imagen.

Herramientas activas: Son las que modifican directamente la imagen.

Casos prácticos

Aplicando algunas de las herramientas explicadas previamente, se realiza un arreglo de portada, una portada nueva y un retoque de portada. También se enseña como recortar fácilmente una foto de autor para la web.

Procesamiento de imágenes por lotes

Con un complemento externo, se pueden modificar muchas imágenes a la vez. Aquí te explicamos cómo.

Moverse por GIMP

La interfaz de GIMP

Ventanas

Al abrir GIMP por primera vez verás que te aparecen tres ventanas individuales. En algunos momentos se abrirán otras ventanas emergentes.

La ventana central es la del lienzo (ventana principal).

Las ventanas laterales se denominan cajas. En ellas aparecen iconos de acceso rápido (herramientas) o pestañas que muestran diferentes opciones (diálogos). Por defecto, la configuración inicial es en dos cajas:

Caja de herramientas. En la configuración por defecto está dividida en dos: en la parte superior se encuentran las herramientas de uso más frecuente, representadas por sus iconos; en la parte inferior aparece una única pestaña que muestra el diálogo de la herramienta activa.

Caja de estructura de la imagen y recursos. En la parte superior hay varias pestañas que se corresponden con capas, canales, rutas y deshacer (diálogos de la estructura de la imagen); en la parte inferior se encuentran por defecto los diálogos correspondientes a pinceles, patrones y degradados (diálogos de recursos).

Una herramienta activa está resaltada.

Una pestaña activa está en primer plano.

Ventanas emergentes: a menudo al utilizar diferentes herramientas surgen otras ventanas que muestran diálogos contextuales.

Iconos

Iconos de las herramientas y áreas de información contextual: localizados en la parte superior de la caja de herramientas, permiten acceso rápido a las herramientas de uso más frecuente, a información sobre el color y recursos activos (áreas de información contextual), además de disponer de una miniatura de la imagen. Algunos de estos iconos no vienen activados por defecto (ver en el epígrafe siguiente: «Personalizando GIMP»).

Iconos de acciones: en la parte inferior de cada diálogo, aparecen una serie de iconos que permiten acceso rápido a acciones frecuentes de esa herramienta o recurso.

Iconos de la ventana del lienzo: se sitúan en las cuatro esquinas de la ventana, que se corresponden con el menú principal, un zoom para adaptar la imagen al tamaño de la ventana, acceso a la máscara rápida (señalado en rojo) y un navegador para moverse por la imagen.

Menús

Menú principal

Está situado en la parte superior de la ventana del lienzo. Cuando tenemos un proyecto de GIMP abierto, nos aparece además un acceso al menú en la esquina superior izquierda. Este menú también nos aparece si pulsamos sobre el área del lienzo con el botón derecho del ratón.

Menú de caja

Cada caja de diálogos tiene su propio menú, en el que se muestra el acceso al menú contextual de la herramienta / recurso activo, varias opciones que permiten modificar la caja (añadir o eliminar diálogos) y otras opciones que permiten personalizar la apariencia del diálogo activo.

Menú contextual del diálogo de la herramienta / recurso

Como hemos visto ya, en la parte superior del desplegable del menú de caja hay un acceso al menú de la herramienta / recurso activo. A este último también se puede acceder pulsando con el botón derecho del ratón sobre la pestaña.

Como caso excepcional, solo se puede acceder al menú contextual de la máscara rápida con el botón derecho del ratón sobre el icono correspondiente de la ventana del lienzo (esquina inferior izquierda).

Barra de estado

En la parte inferior de la ventana del lienzo, se muestra información de gran utilidad: la posición del puntero en el lienzo (se puede escoger la unidad de medida) y ayudas sobre la herramienta activa (cómo utilizarla y teclas especiales que permiten acciones añadidas).

Teclas con funciones especiales

Las herramientas de GIMP, además de las opciones de los diálogos, tienen funciones adicionales cuando se usan en combinación con teclas especiales («Mayúsc», «Ctrl» y «Alt»).

Personalizando GIMP

Ventanas

Redimensionar las ventanas

Situándonos en cualquier margen o esquina de la ventana, nos aparece una flecha, que «arrastramos» para ajustar las dimensiones de las ventanas a nuestro gusto.

Modo ventana única

Menú principal / Ventana / Modo de ventana única.

Nos fusiona las 3 ventanas de la configuración por defecto de GIMP en una única ventana.

Recuperar las cajas laterales

Menú principal / Ventana / Empotrables cerrados recientemente: elegir el que proceda.

Generar una caja nueva (Menú principal / Ventana / Diálogos empotrables): se seleccionan los empotrables deseados (hay que hacerlo uno por uno, se abrirá una ventana emergente para cada uno). Luego se arrastran unas pestañas para añadirlas a otra de las ventanas, hasta configurar la caja.

Dividir las cajas laterales

Arrastrando la pestaña deseada al borde inferior de la caja (o en los bordes laterales) se «ilumina» el borde en azul, momento en el que soltamos la pestaña, que se añadirá en el punto deseado, creando una nueva partición en la caja.

Iconos de herramientas

Abrir Menú principal / Editar / Preferencias / Caja de herramientas: seleccionar las que queramos incluir / eliminar.

Información contextual («color de frente y de fondo», «pinceles, patrones y degradados», y una miniatura de la «imagen»): se marca lo que se desee que aparezca en la caja de herramientas.

Herramientas: se marca en el icono del «ojo» para que se muestren las herramientas en la caja (para ocultarlas se desmarca). Para cambiar el orden en que se muestran, se utilizan los iconos de las flechas de subir o bajar situadas en la parte inferior del menú.

Pestañas de diálogo

Crear nuevas pestañas (Menú de caja / Añadir pestaña): Se elige la pestaña que se desea añadir.

Eliminar pestañas: Con la pestaña que vamos a eliminar activa (en primer plano), abrimos el Menú de caja / Cerrar pestaña.

Mover una pestaña: Seleccionando la pestaña correspondiente con el ratón (manteniendo pulsado el botón derecho) podemos arrastrar la pestaña fuera de la caja (lo que la colocará en una ventana individual) o hasta la otra caja.

Guardar la configuración personalizada

Para que la configuración se mantenga en el futuro (dimensiones y ubicación de las ventanas), ir al menú Editar / Preferencias / Gestión de la ventana - apartado de Posiciones de las ventanas:

Si se desea que conserve la disposición actual: Desmarcar la opción de «Guardar al salir» y pulsar sobre «Guardar las posiciones de las ventanas ahora».

Si se desea que conserve la última disposición utilizada: Marcar la opción de «Guardar al salir».

Complementos, guiones y recursos

Complementos (plugins): Son programas externos que corren bajo el control de la aplicación GIMP, e interactúan con ella, mejorando y extendiendo su funcionalidad.

Antes de instalar un complemento (plugin), asegúrate que sea compatible con tu versión de GIMP

Guiones: son un conjunto de instrucciones que permiten automatizar tareas. Deberán estar escritos en el lenguaje Script-Fu (un dialecto de «Scheme») para que se instalen de forma predeterminada.

Recursos: son elementos comunes que van a utilizar varias herramientas para ejercer su acción (pinceles, brochas, degradados, tipografías…).

Filtros: son complementos (plugins) o guiones (scripts) que modifica la apariencia de una imagen.

En el menú de filtros (Menú principal / Filtros) hay una opción que permite restablecer todos los filtros a sus valores predeterminados.

Instalación de complementos, guiones y recursos

Cada tipo de recurso o utilidad necesita incluirse en una carpeta específica para que GIMP lo «encuentre».

La ruta de acceso a estas carpetas la podemos averiguar a través de: Menú principal / Editar / Preferencias / Carpetas. Ahí seleccionamos el tipo de archivo que queremos añadir, y a la derecha se nos muestran dos rutas. Observamos que la luz está en verde (si está en rojo, es que no existe la carpeta especificada y tendremos crearla o seleccionar otra).

La diferencia entre ambas rutas se aplica únicamente en ordenadores compartidos que tienen definidos varios perfiles de usuario, permitiendo seleccionar si el recurso o utilidad estará disponible únicamente para el usuario que lo instala o para todos los usuarios del ordenador.

Algunos complementos tienen instrucciones específicas de instalación: asegúrate de seguirlas para que funcionen correctamente.

Para añadir nuestros archivos, copiamos la ruta y la pegamos en el explorador de archivos (en la barra de ruta de cualquier carpeta de nuestro ordenador). Una vez en la carpeta del recurso / complemento, se añaden los archivos. A veces con GIMP ejecutándose da aviso de error, por lo que es preferible cerrarlo antes.

La siguiente vez que abramos GIMP puede tardar un poco en estar operativo. Una vez reiniciado, los recursos se añaden a sus diálogos correspondientes, mientras que los complementos se añadirán en el Menú principal / Filtros.

Dónde conseguir nuevos complementos, guiones y recursos

Página oficial de GIMP

En la página de GIMP hay acceso a un registro de complementos y guiones (Plugin registry).

Internet

En internet hay múltiples webs desde donde se pueden descargar nuevos recursos y utilidades.

Personalizados

Muchos de los recursos de GIMP se pueden crear de cero (pinceles, degradados, etc).

Recurso provisional (desde el portapapeles): Cuando se usa sobre la imagen el comando copiar o cortar (Menú principal / Editar / Cortar - Copiar), se queda una copia del fragmento en el portapapeles. Este a su vez aparece en los diálogos de recursos / herramientas (pincel o patrón) y se mantiene hasta que genere otro recorte en el portapapeles o se cierre GIMP.

Recurso externo nuevo: Creamos nuestro propio recurso como una imagen de GIMP y lo guardamos con la extensión correspondiente. Se incorpora luego como un recurso externo.

Herramienta «Editores del (recurso)»: Se accede a ellos desde el «Diálogo del recurso», mediante los iconos de acciones de la parte inferior («Nuevo» o «Editar»). Está disponible para pincel, degradado, paletas y dinámica de pintura. En muchos casos, una vez generados se guardan automáticamente en la carpeta correspondiente de GIMP; si no fuera así, basta con importarlos como cualquier otro recurso externo.

Los recursos básicos de GIMP (preinstalados) están protegidos para evitar modificaciones accidentales, pero es posible duplicarlos y modificar en su lugar la copia.

Imagen digital

Estructura de la imagen

Lienzo

El lienzo es nuestro área de trabajo, la imagen (una o varias capas) es su contenido. El tamaño de las capas puede ser mayor o menor que el lienzo, quedando visible únicamente la parte que se encuentra dentro de los límites del lienzo. Salvo en las opciones de mover y escalar, cualquier modificación que hagamos se aplicará a la parte visible de la imagen (color, transparencias, selección, etc).

Capas

Una imagen está formada por una o varias capas. Es como si se tratara de un fajo de papeles apilados uno sobre otro. Se puede dibujar en cada capa, puede ser transparente u opaca, y también se puede mover una capa en relación a las otras (arrastrando la capa o mediante los iconos de acción).

Las capas están ordenadas de abajo hacia arriba (correspondiéndose con la capa inferior a la superior).

La capa activa tiene el marco en blanco y está resaltada.

Diálogo de Capas

Visibilidad de la capa (el ojo): Para cambiar el estado, desmarcar el icono del ojo.

Anclado (la cadena): Todas las capas que llevan este símbolo están unidas, funcionando como un bloque a efectos de movimiento y transformación.

Miniatura: Muestra el contenido de la capa.

Nombre de la capa: Se puede modificar desde el Menú contextual del diálogo / Capas / Editar atributos de capas.

Bloquear: Esta opción permite «proteger» la capa de otras manipulaciones, bien de todos píxeles (bloquear píxeles) o solo las áreas transparentes (bloquear canal alfa). Se aplica a la capa activa en el momento de marcar el bloqueo.

Menú de capas

Menú contextual del diálogo / Capas.

A través de este menú, además de crear, duplicar o eliminar una capa, hay varias opciones interesantes.

Grupo de capas nuevo: Crea una nueva capa que funciona como una carpeta, donde podemos meter varias capas para organizarlas o para aplicar algunas funcionalidades en bloque (para mover, escalar, rotar…).

Nuevo a partir de lo visible: Crea una capa que es equivalente a la imagen que estamos viendo en ese momento.

Combinar hacia abajo: Combina la capa actual con la inmediatamente inferior.

Añadir / Eliminar canal alfa: El canal alfa es necesario para que la capa pueda tener transparencias.

Menú de Imagen

Menú principal / Imagen / …

Hay una serie de opciones que afectan a las capas.

Combinar capas visibles: Fusiona todas las capas que están visibles ne ese momento.

Aplanar imagen: Fusiona todas las capas para formar una única capa (= imagen). Elimina el canal alfa.

Capas especiales

Selección flotante: Es un área que hemos «despegado» de una capa para poder aplicarle diferentes efectos. Es una capa temporal que debe fusionarse con su capa original o con una nueva capa.

Texto: Se crea al pulsar con el ratón sobre la imagen tras seleccionar la herramienta «Texto», cuando empezamos a escribir.

Cuando aplicamos cualquier otra herramienta se transforma en una capa normal. Si aplicamos de nuevo la herramienta de texto sobre ella, nos da la opción de convertirla de nuevo en capa de texto, con lo que se perderán el resto de efectos aplicados sobre ella.

Máscaras de capa

Es una «lámina» que aplicamos sobre una capa, para crear áreas de transparencia o semitransparencia. Su utilidad es que se diseña a medida, y evita modificar la capa, con lo que no se pierde información de la imagen. Se localizan al lado de la capa a la que acompañan.

Menú contextual del diálogo de la máscara

Con el botón derecho sobre la miniatura de la máscara tenemos acceso a varias opciones:

Editar máscara de capa: La máscara aparece con el borde blanco, lo que indica que los cambios que hagamos sobre el lienzo se realizan sobre la máscara: las áreas transparentes y opacas se determinan pintando en blanco y negro sobre ella, las semitransparentes con colores grises o degradados.

Mostrar la máscara de capa: La máscara aparece con el borde en verde y el área del lienzo lo ocupará ahora la máscara, lo que nos permite trabajar con ella de una forma más precisa (para volver a la visualización normal de las capas se despliega de nuevo el menú contextual y se desmarca la opción).

Desactivar máscara de capa: La máscara aparece con un borde rojo, y su efecto no se muestra sobre la imagen (para volver a activarla, desmarcar la opción del menú contextual).

Elminar y Aplicar máscara de capa.

Canales

Canales de color

Un canal de color es un componente del color del píxel. Cada canal soporta un rango de niveles de intensidad con 255 posibilidades con el que se codifica el color, siendo 0 = negro y 255 = blanco. En el caso del canal alfa, lo que se codifica es el grado de transparencia-opacidad (0 = transparente, 255 = opaco).

El sistema de escala de grises se basa en la iluminación por una luz blanca (Valor). Tiene por lo tanto un único canal.

El sistema RGB se basa en la iluminación a través de 3 luces que se corresponden con los colores primarios, constituyendo cada uno un canal (rojo, verde y azul). Algunas herramientas que trabajan con canales añaden además un pseudocanal que se correspondería con el color del píxel si se transformara en escala de grises, por lo que se le ha denominado también Valor (V).

El modo indexado se basa en que cada píxel tiene asignado un número que se corresponde con un color concreto recogido en un índice (mapa de color). Su canal por lo tanto no es un canal de color verdadero. En la pestaña de canales se le llama «canal indexado».

Las capas con transparencia además tienen un canal añadido llamado Alfa.

Desde la pestaña de canales podemos filtrar la imagen por su color, pero esto no modifica el color de los píxeles.

Para modificar la imagen a través de sus canales hay que utilizar herramientas específicas de ajustes de color.

Si «apagamos» dos de las luces (ocultamos los canales), la imagen nos muestra el canal restante, pero esto no modifica la imagen al exportarla.

Canales de selección

Son canales que se utilizan para guardar y restaurar selecciones.

Su funcionamiento es similar al de las máscaras, por lo que también se les llama «máscaras de selección».

Propiedades de las imágenes digitales

El tamaño (px)

Una imagen digital está formada por píxeles, cada uno formado por un color (como si se superpusiera una rejilla sobre la imagen). El término «tamaño» resulta un poco confuso, puesto que un píxel no tiene una medida física (se puede reproducir la imagen a cualquier tamaño, con lo que aumenta el tamaño de la rejilla, pero no el n.º de cuadrados de que consta). Sería más correcto hablar de «nitidez» de la imagen.

Redimensionar una imagen

Al redimensionar una imagen se modifica el n.º de px.

Si disminuimos el n.º de píxeles se le resta nitidez a la imagen.

Al aumentar el n.º de píxeles no se modifica la nitidez.

Es recomendable trabajar con la imagen original si tiene mayor tamaño que la imagen final deseada (redimensionando al final) y con una ampliación de la imagen original si es más pequeña (redimensionando al principio).

Para añadir texto es preferible hacerlo con el tamaño final, ya que el renderizado del mismo ofrece mejor calidad que el redimensionado.

La resolución de las pantallas

La pantalla muestra las imágenes traduciendo el color de cada píxel de la imagen en los colores primarios, que muestra a través de puntos de luz (dots). Estos puntos de luz están agrupados (rojo, verde y azul) en unidades de pantalla que también se denominan píxeles. Nuestro ojo integra la luz haciendo parecer la imagen continua.

El tamaño óptimo de la imagen (px. de la imagen) depende de la resolución de la pantalla en la que se va a visualizar (px. de la pantalla).

Si cada píxel de la imagen se corresponde con un píxel de la pantalla, la imagen digital se va a visualizar con una nitidez perfecta.

Si un píxel de la imagen se corresponde con varios de la pantalla, la imagen se ampliará, llegando un momento en que la veremos pixelada.

Si un píxel de la pantalla se corresponde con varios píxeles de la imagen (representará un color «ponderado» de los mismos), la imagen pierde nitidez, aunque no se apreciará por la reducción simultánea del tamaño de reproducción.

La profundidad del color o «Modo de color» (bpp)

Los bits por píxel (bpp) se refieren a la cantidad de bits de información necesarios para representar el color de un píxel en una imagen. Los bits se almacenan en bloques de 8. Puesto que cada bit puede representar dos colores, las combinaciones de los 8 bits de un píxel dan una paleta de 256 colores posibles. Cada bloque de 8 bits forma por lo tanto un canal.

Aunque GIMP puede trabajar con imágenes indexadas, se recomienda trabajar en modo RGB, ya que muchas de las funcionalidades de GIMP se desactivan en el modo indexado.

Trabajar en modo RGB permite sacar el máximo potencial a GIMP

Imágenes de 8 bits

Imágenes indexadas: Cuando una imagen está formada por pocos colores, se recogen estos en una tabla (índice o mapa de color). La expresión mínima de una imagen indexada sería que tuviera un solo color («1-bit-map»), lo que resultaría en imágenes monocromáticas. Cuando las imágenes tienen una profundidad de color grande, se vuelven inmanejables por la cantidad de colores que tiene que indexar en el mapa de color, lo que requiere mucha memoria.

Imágenes en escala de gris: Tienen un único canal que representa la luminosidad o Valor (V), limitándose los colores a 256.

Imágenes de 24 bits (RGB)

Las imágenes con muchas profundidades de color se suelen codificar descomponiendo el color en los colores primarios: con solo 3 canales (y sus 256 colores por canal) se pueden representar hasta 16.777.216 colores diferentes. El ojo humano no puede diferenciar las sutilezas del cambio de color y lo aprecia como un color continuo, por lo que se llama también «color verdadero».

Imágenes de 32 bits (RGBA)

Es una imagen en modo RGB a la que se añade un canal extra (alfa) que codifica la transparencia (una por cada uno de los 256 tonos primarios).

Imágenes de alta definición

Codifican la información de color de cada píxel en 2 canales en lugar de en uno, lo que multiplica el n.º de colores posibles.

16 bits: escala de grises / indexado.

48 bits: RGB.

64 bits: RGBA (RGB con canal alfa).

GIMP aún no soporta imágenes en alta definición.

Resolución de la imagen (ppp = ppi)

Este parámetro determina cómo se pasa de la imagen digital a la imagen impresa y viceversa, aplicando una medida física a cada píxel de la imagen (píxeles por pulgada, siendo una pulgada = 2.54 cm.).

Una vez que la imagen está digitalizada, no influye en cómo se visualizará en una pantalla.

Al digitalizar una imagen, la resolución determina el n.º de píxeles en que se va a representar la imagen.

Al imprimir una imagen, la resolución determina el tamaño de la impresión.

En GIMP la resolución de la imagen se puede volver a definir al imprimir (Menú principal / Imagen / Tamaño de impresión: Resolución) o al redimensionar (Menú principal / Imagen / Escalar imagen: Resolución).

El formato de guardado

Los archivos gráficos suelen tener tamaños muy grandes, lo que ha llevado al desarrollo de tecnologías capaces de comprimirlos, de ahí los diferentes formatos de guardado. Cada sistema de compresión utiliza un algoritmo matemático propio para reducir la cantidad de bits necesarios para describir la imagen. Los principales formatos que utilizamos en un libro electrónico son jpg, png y gif.

JPG = JPEG

Es un formato de compresión con pérdidas (desecha en primer lugar la información no visible, pero si se produce sobrecompresión se altera la información visible produciéndose muestras de color borrosas e imprecisión en las zonas de mayor contraste). No soporta las transparencias ni el indexado (puede tener por lo tanto una profundidad de color de 8 y 24 bits).

La compresión se produce cada vez que se guarda el archivo, por lo que guardados sucesivos provocan una apreciable degradación de la imagen.

PNG

Es un formato de compresión sin pérdidas y que admite las transparencias y el indexado (por lo tanto puede tener profundidad de color de 8, 24 y 32 bits).

Tiene el inconveniente de que en imágenes indexadas a veces cambia algunos colores inexplicablemente al visualizarse en ADE y en otros soportes electrónicos.

GIF

Es un formato de compresión sin pérdidas, que admite las transparencias. Solo permite imágenes indexadas (por lo tanto tiene profundidad de color de 8 bits, 256 colores). Su principal atractivo es que además admite animaciones, aunque en un ePub tiene poca relevancia.

El peso (kb)

El peso de una imagen digital depende fundamentalmente del tamaño (px), de la profundidad del color (bpp) y del formato de guardado (jpg, png o gif).

Metadatos

Son datos añadidos a la imagen. Desde Menú principal / Archivo / Propiedades: «Avanzada» podemos ver todos los datos asociados a la imagen.

Imágenes vectoriales (SVG)

Las imágenes vectoriales se integran en el lenguaje HTML.

Se escalan con el texto sin perder nitidez.

Manejan 24 bits de profundidad de color.

Pueden definirse en cualquiera de los sistemas de color estándar (RGB, CMYK).

Admiten además otras características que las hacen muy versátiles: curvas Bézier, transparencias, suavizados, textos editables, fuentes tipográficas, etiquetas explicativas, animaciones, …

Su único inconveniente es el peso, por lo que para libros digitales quedan restringidas a imágenes pequeñas o esquemas de texto (deben tener < 300 kb por problemas de compatibilidad con algunos eReader).

GIMP no permite importar / exportar SVG (salvo para rutas y degradados). Hay un complemento que permite exportar la imagen como SVG, pero su rendimiento aún no está verificado en los eReader.

Primeros pasos en GIMP

Nuestro proyecto de GIMP

A través del Menú Principal / Archivo accedemos a diversas opciones de trabajo. Hay que diferenciar entre «nuestro» trabajo actual (archivo de GIMP con la extensión «.xcf») y las imágenes que utilizaremos para crearlo (jpg, png, etc.).

Nuevo

Abre un menú donde se nos ofrece diversas opciones para crear nuestro lienzo. Permite establecer las dimensiones y la orientación o bien elegir una plantilla.

Crear

Permite crear una imagen a partir de otra fuente. Vamos a ver dos opciones que pueden resultarnos útiles:

Imagen desde captura de pantalla: Se abre una ventana que nos permite seleccionar «captura de pantalla completa» o «captura de ventana». En «Captura de ventana» nos aparece una segunda ventana con una cruz, que tenemos que seleccionar y arrastrar a la ventana de nuestro ordenador que deseamos capturar. Una vez realizado, se crea un nuevo lienzo con la captura deseada.

Captura de imagen de página web: En la ventana emergente introducimos la dirección web de la página a capturar. En el ejemplo, la página de la Wikipedia dedicada a Wilber, la mascota de GIMP.

Abrir / Abrir como capas

Estas opciones permiten abrir una imagen para trabajar con ella. El comando «Abrir» nos abre la imagen en un lienzo nuevo, mientras que «Abrir como capas» la añade como una capa nueva sobre el lienzo en el que estamos trabajando.

También es posible abrir un archivo de imagen arrastrándolo a la parte superior de la caja de herramientas (sobre los «ojos de Wilber»).

Guardar

Permiten guardar la imagen que hemos creado en el formato de GIMP (.xcf). La opción «Guardar como» sirve para guardar el archivo con un nombre diferente del que tenía.

Exportar la imagen

Para exportar la imagen, basta con añadir el nombre de nuestro archivo con la extensión correspondiente.

GIMP permite importar y exportar imágenes en los siguientes formatos: jpg, png, tiff, gif y psd (Photoshop).

Para trabajar con otros formatos se precisa de complementos específicos (plugins).

JPG / JPEG

La calidad de la imagen determina el grado de compresión y por lo tanto la pérdida de datos, aunque también el tamaño final del archivo. Generalmente se obtienen buenos resultados con niveles 85 a 95 para fotos, y entre 50-80 para capturas de pantalla.

Para imágenes que se van a utilizar en el interior de un aporte: desmarcar la opción «Progresivo».

Es conveniente tener «Optimizar» activada (genera un archivo más pequeño manteniendo la calidad).

También se pueden desmarcar los datos de EXIF y XMP para anonimizar la imagen.

Podemos además guardar nuestras preferencias para recuperarlas en el futuro utilizando «Guardar predet.».

PNG

Para fotos el tamaño final de la imagen es mayor que con jpg, pero no se pierden datos; en el caso de imágenes de pocos colores (esquemas, capturas de pantalla, iconos) se reduce mucho el peso transformando la imagen en indexada antes de guardar (Menú principal / Imagen / Modo / Indexado).

Algunos medios no reproducen bien las imágenes indexadas, pudiendo provocar cambios de color inexplicables (un ejemplo es ADE).

El nivel de compresión también influye en el tamaño final de la imagen (lo ideal es 9).

Hay que desmarcar las casillas «Entrelazado» (imagen progresiva) para cualquier imagen que se vaya a utilizar en el interior del aporte.

Se aconseja desmarcar «Guardar desplazamiento de capa» (produce errores en el guardado).

También aquí podemos guardar nuestras opciones predeterminadas con el botón «Guardar predet.».

GIF

Debido a que permite imágenes animadas, se utiliza sobre todo para la publicidad en banners, botones, vínculos, iconos, fondos, divisiones, …

Otros formatos

PSD (Photoshop): se guarda toda la estructura de GIMP (capas y canales, transparencias, etc.), sin perdida información.

Formatos para recursos de GIMP: son útiles cuando creamos nuestros propios recursos. Las extensiones utilizadas dependen del recurso: GRB (pinceles), GGR (degradados), PAT (patrones), SVG (rutas y degradados).

Trabajar en GIMP

Herramientas

Para modificar las imágenes con GIMP, se disponen de múltiples de herramientas.

Herramientas pasivas: son herramientas que por sí mismas no ejercen ninguna acción sobre la imagen, pero que sirven de ayuda o apoyo para otras.

Para navegar por la imagen.

Para seleccionar partes de la imagen.

Para realizar diseños complejos.

Para seleccionar colores (gestores de color, cuentagotas, color de frente/fondo).

Recursos (pinceles, degradados, patrones, paletas de colores, fuentes tipográficas).

Información (reglas, rejilla, guías, medidas, histograma, cubo de color).

Herramientas activas: son las que se aplican sobre la imagen modificándola.

Cambiar la estructura de la imagen (cortar, pegar, redimensionar, transformar, alinear).

Pintando con GIMP (dibujo, relleno, clonar y sanear, rellenos, transparencias).

Ajustes de la imagen (equilibrio de la imagen y cambios de color).

Efectos especiales (enfocar / desenfocar, iluminar, sombras, distorsiones, relieves, bordes, etc.).

Texto en GIMP.

Cómo aplicar las herramientas activas

Las herramientas las podemos aplicar sobre una capa (o sobre un duplicado de la misma), sobre una selección, con pinceladas o sobre la imagen completa. La mayoría de las veces se puede hacer directamente, pero en ocasiones hay que utilizar métodos indirectos para conseguirlo, aplicando otras herramientas en el proceso.

Trabajar con la capa activa

Se puede trabajar con la herramienta activa directamente con la capa activa.

Trabajar con una selección

Seleccionar un área y se trabaja con la herramienta activa sobre él, en la capa activa.

En los filtros, si no es posible su aplicación directa sobre una selección, se duplica la capa y se aplica el filtro sobre la copia. Se vuelve a la capa original para realizar la selección del área de interés, se invierte el área seleccionada, luego cambiamos de nuevo a la capa-filtro, y sobre ella limpiamos la selección.

Trabajar con pinceles (herramientas de pintura)

Se utiliza el pincel directamente sobre la capa o selección (trabajando sobre la capa activa).

Para aplicar filtros de forma selectiva (a «pinceladas»): se crea un duplicado de la capa, sobre el que se aplica el filtro. Luego con la herramienta de clonar, se elige el «origen» sobre la capa-filtro y el «destino» sobre la capa original y se aplican las pinceladas (en el diálogo de la herramienta de clonar se seleccionan las opciones «Origen: Desde imagen» y «Alineación: Registrado»).

Trabajar con la imagen completa

Fusionando todas las capas en una sola (Menú principal / Imagen / Aplanar imagen).

Fusionando todas las capas visibles en una sola (Menú principal / Imagen / Combinar las capas visibles).

Creando una nueva capa que contenga una réplica de lo que se ve en ese momento (Diálogo de Capas / Nuevo a partir de lo visible). Es similar a la opción anterior, pero sin perder la estructura original en capas.

¿Por qué no funciona lo que quiero hacer?

Con frecuencia se debe al error humano.

Estamos en la capa equivocada o tenemos una selección flotante aún sin fusionar.

Intentamos usar una herramienta «fuera» de la capa (la capa es más pequeña que el lienzo).

Tenemos una selección activa y estamos aplicando la herramienta fuera de ella.

Usamos la herramienta equivocada para lo que deseamos hacer.

Las opciones de herramienta no son las adecuadas (es muy frecuente que se nos olvide desmarcar alguna opción después de utilizarla, por lo que el comportamiento de la herramienta deja de ser el «predeterminado» al que estamos acostumbrados).

El efecto que intentamos utilizar no se puede aplicar (por ejemplo hay filtros que solo funcionan con imágenes en escala de grises, otros con capas con canal alfa, en otros solo en capas con opacidad 100%, etc.).

Más raro, por fallos del programa. No obstante, hay dos herramientas que fallan con frecuencia provocando cierres inesperados del programa: Transformar rejilla y GEGL.

Deshacer y revertir

Deshacer

Cualquier cambio que hayamos hecho y que no nos guste, tenemos la posibilidad de deshacerlo.

Menú principal / Edición / Deshacer-Rehacer: nos deshace / rehace la última acción.

Historial de deshacer: permite deshacer varias acciones simultáneamente.

Menú principal / Edición / Historial de deshacer.

Caja de estructura de la imagen / pestaña Deshacer.

Revertir

Con esta opción se vuelve a cargar la imagen inicial de la que partimos al iniciar el trabajo (Menú principal / Archivo / Revertir).

Se pierden todas las modificaciones realizadas y también el historial de deshacer.

Herramientas pasivas

Navegación

Acercar y alejar la imagen (zoom)

A menudo necesitamos alternar una visión global de la imagen con ampliaciones de áreas concretas para poder trabajar los detalles. Se puede hacer fácilmente utilizando cualquiera de estas herramientas:

Menú principal / Vista / Ampliación.

Lupa de la caja de herramientas.

Teclado: + / − (aumentar y alejar).

Navegar por la imagen

Cuando la imagen está muy ampliada y necesitamos desplazarnos a otro área, disponemos de estas herramientas:

Ventana de navegación (Menú principal / Vista / Ventana de navegación): Nos crea una miniatura de la imagen que nos permite acercar y alejar la imagen, además de seleccionar el área.

Icono de navegación (esquina inferior derecha de la ventana del lienzo): Manteniendo pulsado el botón izquierdo del ratón, desplazamos el recuadro por la miniatura de la imagen hasta el punto deseado.

Ventana Imágenes

Menú contextual del diálogo / Añadir pestañas / Imágenes (alternativa: Menú principal / Ventanas / Diálogos empotrables / Imágenes): Nos abre una ventana donde aparecen en miniatura todos los lienzos que tenemos abiertos simultáneamente, lo que permite pasar de uno a otro con facilidad.

Copiar al portapapeles

Selección o capa activa (Menú principal / Editar / Copiar): si no hay ninguna selección se copia la capa activa.

Imagen (Menú principal / Editar / Copiar visible).

Seleccionar un área

Cómo seleccionar un área

Herramientas de selección

Sencillas:

Rectangular: realiza una selección con forma cuadrada / rectangular. Si se desea redondear las esquinas, en el diálogo de la herramienta hay que marcar la opción, con lo que nos aparecerá una barra deslizante donde especificamos el radio de redondeo que van a tener las esquinas.

Elíptica: realiza una selección circular / elíptica.

Libre: elegimos el área a seleccionar. Se pueden utilizar líneas rectas entre dos puntos, aunque también se puede trazar una línea continua por donde pasa el ratón.

En función del color:

Difusa: partiendo del color del píxel seleccionado en la imagen, se extiende por píxeles contiguos, hasta que encuentra un color diferente.

Por color: selecciona en la imagen todos los píxeles que tienen el color especificado, aunque no estén contiguos.

Tijeras de selección: se van colocando puntos bordeando el área que queremos seleccionar. La línea entre dos puntos se adapta automáticamente si hay suficiente contraste entre las dos zonas delimitadas; en caso contrario conviene añadir más puntos intermedios para afinar el efecto. Cuando hemos terminado de introducir todos los puntos, pulsamos la tecla «enter» para activar la selección.

Primer plano.

En la primera fase, aparece un puntero de selección libre, con el que rodeamos la figura en primer plano. Cuando cerramos el área, se crea una máscara que aísla ambas secciones.

Nos muestra ahora el puntero con forma de lápiz. En el diálogo de la herramienta seleccionamos «marcar el frente». Pintamos encima del objeto a seleccionar: basta con incluir todos los colores de la figura, sin necesidad de repasar su contorno, y con ello se habrán seleccionado todos los píxeles del área delimitada en la primera fase que se correspondan con alguno de los colores incluidos. Si nos falta algún color, seguimos pintando. Si nos hemos pasado, seleccionamos «marcar el fondo» y pintamos en el área que queremos quitar.

Cuando ya tenemos la figura completamente marcada, pulsamos «enter» para activar la selección.

Diálogo de las herramientas de selección

Opciones comunes

Modo: permite que la selección sea única o múltiple (añadir a la selección (suma), sustraer a la selección (resta), seleccionar el área de intersección).

Se pueden combinar varios tipos de selección (rectangular, elíptica, libre, …) para sumar / restar áreas. Acuérdate de ajustar el «Modo» cuando cambies de herramienta de selección.

Determinadas funciones y herramientas que se aplican sobre selecciones solo funcionan en el modo de «selección única».

Alisado: esta opción permite que se utilicen píxeles semitransparentes para quitarle dureza al borde.

Difuminar los bordes: crea un degradado en el borde.

Para selección rectangular y elíptica

Expandir desde el centro: el área de selección se inicia en punto de la imagen que queremos que esté en el centro, expandiéndose a partir de ahí en todas las direcciones (cuando está desmarcada la opción, lo hace por un borde).

Fijo: cuando está desmarcado la relación ancho-alto es libre, pudiendo modificar cualquiera de ellos de forma independiente. Cuando está marcada, podemos establecer uno de los siguientes comportamientos: proporción de aspecto (x:y = ancho-alto), anchura, altura, tamaño (ancho x alto).

Resaltado: genera una máscara gris fuera de la selección, para resaltar el área seleccionada.

Encoger automáticamente: tras crear una selección alrededor del objeto de interés, pulsando este botón se reduce automáticamente para ajustarse al él. Para que se comporte de forma adecuada, el objeto tiene que tener un contorno suficientemente diferenciado.

Encoger combinando: al estar seleccionada, al aplicar «Encoger automáticamente» se tendrán en cuenta todas las capas visibles (y no solo la capa activa).

Para selección difusa y por color

Seleccionar las áreas transparentes: para que se puedan seleccionar zonas transparentes esta opción debe estar marcada.

Muestra combinada: se tendrá en cuenta el color global de la imagen en el píxel donde se selecciona el color (si la opción está desmarcada solo se tiene en cuenta el color del píxel en la capa activa).

Umbral B/N: determina un rango de colores que se van a incluir en la selección por su «parecido» al color elegido. Por defecto viene establecido en 15.

Máscara rápida

Se activa en la esquina inferior izquierda de la ventana del lienzo (también desde Menú principal / Seleccionar / Activar máscara rápida). Se utilizan las herramientas de pintura en color negro y blanco para seleccionar el área deseada. A diferencia de la herramienta de «Selección del primer plano», es necesario perfilar por completo la figura. Para activar la selección, presionar de nuevo el icono de máscara rápida.

Truco: Realiza una selección aproximada del área con otra herramienta de selección, luego activa la máscara rápida para afinar los detalles.

Se puede modificar el color de la máscara si dificulta la visibilidad de la capa desde su Menú contextual (con el botón derecho del ratón sobre el icono de la máscara rápida) / Configurar el color y la opacidad.

Otras formas de crear una selección

Invertir selección: Menú principal / Seleccionar / Invertir.

Alfa a selección (Pestaña Capas / Menú de capas / Alfa a selección): Realiza una selección de todos los píxeles no transparentes de la capa.

En una capa de texto, permitirá convertir el texto en selección.

Desde una ruta: transforma una ruta en una selección.

Herramienta Rutas / Diálogo de Rutas / Crear una ruta a partir de una selección.

Pestaña de Rutas / Menú de Rutas / Ruta a selección (o bien: Añadir, sustraer o interseccionar con selección). También desde los iconos de acción.

Menú principal / Seleccionar / A partir de una ruta.

Desde una máscara de capa (Pestaña Capas / Menú de capas / Máscaras / Máscara a selección, añadir, sustraer, interseccionar): Realiza una selección de todos los píxeles opacos de la máscara (blancos) y una selección difuminada de los píxeles semitranparentes (grises).

Desde un canal (Pestaña Canales): Abriendo el «Menú de canales» con el ratón, disponemos de varias opciones: Canal a selección, Añadir a selección, Sustraer a selección, Interseccionar a selección.

Desde la herramienta Umbral: Se duplica la capa sobre la que se quiere hacer la selección y se aplica en la copia la herramienta Umbral (Menú principal / Colores / Umbral), con lo que se genera una imagen en blanco y negro. En esta capa realizamos nuestra selección con las herramientas de selección difusa o por color, luego activamos de nuevo la capa original para aplicar en ella la selección. Si no la necesitamos más, se puede eliminar la capa-umbral.

Modificar una selección

Una vez que se ha definido una selección, se pueden modificar algunos aspectos desde Menú principal / Seleccionar / …

Difuminar o perfilar el borde de la selección.

Agrandar (Grow) o encoger (Shrink) la selección.

Borde: cambia de seleccionar un área a seleccionar el borde de ese área (se especifica el ancho en el diálogo emergente).

Distort: distorsiona la selección en función de unos parámetros que le especificamos en el diálogo emergente.

Rounded rectangle: cambia la selección actual por un rectángulo de bordes redondeados.

Máscara y canal de selección (guardar una selección)

Editor de selección

Podemos ver la selección realizada como una «máscara de selección» mediante el «Editor de Selección»: Menú principal / Seleccionar / Editor de selección. Se abre una ventana emergente en la que se muestra una miniatura de la máscara.

Canal de selección

La selección realizada se puede guardar como un «canal de selección» para utilizarla más tarde.

Desde Menú principal / Seleccionar / Guardar en canal (también desde un icono de acción del «Editor de Selección»).

Desde los iconos de acción del «Editor de selección».

La máscara rápida genera un nuevo canal de selección transitorio (desaparece en cuanto se desactiva).

Diseños (rutas)

La herramienta de rutas permite realizar diseños, basándose en curvas de Bézier. Estas constan de anclas (círculos), unidas por segmentos (líneas) que se pueden modificar con unos tiradores (cuadrados). Modificando la posición de las anclas, su n.º y la forma de los segmentos entre ellas, se diseñan formas sofisticadas.

Las rutas son capas virtuales (no forman parte de la imagen en sí misma) donde se guardan diseños formados por una o varias curvas de Bézier. Cada curva puede estar abierta o formar una figura cerrada.

Pestaña de Rutas

Visibilidad (ojo): Permite ver la ruta sobre la imagen (sin estar trazada), apareciendo como una línea roja o azul.

Anclado (cadena): Permite unir varias rutas para que funcionen como un bloque.

Miniatura.

Nombre de la ruta: Para modificarlo, accedemos al Menú contextual de la ruta (con el botón derecho del ratón sobre la miniatura de la ruta) / Cambiar atributos de ruta).

Menú de Rutas: Con el botón derecho del ratón accedemos al menú, desde donde podemos crear una nueva ruta, duplicarla, eliminarla, combinar varias rutas, importar y exportar rutas, etc.

Una ruta se puede exportar como SVG. También es posible importar un SVG como ruta.

Herramienta «Ruta»

Diseñar una ruta: con el puntero sobre el lienzo, se van añadiendo tantas anclas como sean necesarios. Los segmentos se generan automáticamente, en forma de líneas rectas.

Anclas:

Para mover un ancla: Tirar de él con el puntero.

Para añadir un ancla: Presionar la tecla «Ctrl» a la vez que se pulsa el ratón sobre el segmento correspondiente.

Para añadir un nuevo ancla pero sin que se una por un segmento al anterior: Presionar la tecla «Mayúsc» a la vez que se añade el nuevo ancla.

Para eliminar un ancla: Presionar simultáneamente las teclas «Ctrl + Mayúsc» y pulsar sobre el ancla a eliminar.

Segmentos:

Para modificar un segmento: Arrastrando con el ratón, el segmento se curva, apareciendo los tiradores.

Para mover un segmento: La opción «Poligonal» permite mover un segmento sin que cambie su forma, cambiando la posición de las anclas de las que depende (por lo tanto, modifica los segmentos adyacentes).

Para añadir el segmento que cierra una curva: Manteniendo la tecla «Ctrl» presionada, se pulsa sobre el ancla inicial.

Para eliminar un segmento: Manteniendo presionadas las teclas Ctrl + Mayúsc, se pulsa sobre el segmento.

Tiradores: Modificando su longitud y posición se modula el segmento. Un segmento depende de dos tiradores (uno a cada extremo de la línea, situado sobre el ancla correspondiente).

Para hacer visibles los tiradores: En un segmento recto, el tirador está encima del ancla; para poder extenderlos, con la tecla «Ctrl» presionada, se pulsa sobre un ancla y se arrastran con el ratón.

Para que los dos tiradores de un mismo ancla se muevan de forma opuesta (y coordinada): Pulsar la tecla «Mayúsc» a la vez que se mueve uno de los tiradores.

Editar una ruta: permite modificar rutas previas añadiendo o eliminando anclas y segmentos (como ya se ha visto se puede hacer desde «Diseñar una ruta», por lo que no entramos en más detalles).

Mover una curva o ruta: se arrastra con el ratón la curva (desde un ancla o segmento) o la ruta activa (con todas las curvas que contenga, colocando el puntero en cualquier otro punto de la misma).

Desde «Diseñar una curva»: con la tecla «Alt» presionada.

Desde «Mover una ruta».

Otras formas de crear rutas

Desde una selección: una vez realizada una selección, se puede transformar en una ruta a través de una de estas opciones:

Pestaña Rutas / Menú rutas / Selección a ruta (o desde los iconos de acción).

Desde el «Editor de selección»: Menú principal / Seleccionar / Editor de selección - icono de «Selección a ruta».

Desde un texto: Se puede transformar un texto en una ruta desde el Menú contextual de la Capa de Texto (con el botón derecho sobre la miniatura de la capa o sobre el lienzo) / Texto a ruta.

El color

Entendiendo el color

Toda la gama de colores se forma a partir de 3 colores básicos. La mezcla de dos colores básicos genera un color que es el complementario del 3.º color primario.

Modelos de color

El color es una percepción visual que genera nuestro cerebro al interpretar la luz. En función de que hablemos de la luz directa o de la luz reflejada por los objetos, obtenemos dos modelos de color.

Modelo sustractivo (CMYK): La luz absorbida por el objeto se sustrae de la luz toda y es la que el ojo percibe. Es el modelo de las imágenes impresas. Sus colores primarios son el Cian (C), Magenta (M) y Amarillo (Y = yellow), al que se añade el Negro (K) que surge de la mezcla de los tres primarios.

Modelo aditivo (RGB): Diferentes luces se «suman» para formar el color. Es el modelo de las imágenes digitales, y por lo tanto el que vamos a utilizar en GIMP. Sus colores primarios son el Rojo (R), Verde (G = green) y Azul (B = blue). Al sumarse los colores obtenemos el Blanco.

Espacio de color

Para entender la relación entre los diferentes colores, podemos representarlos espacialmente (espacio de color). En el caso del modelo RGB, hay varias representaciones posibles.

Espacio RGB: Representa el espacio de color en base a su descomposición en los tres colores primarios (Rojo, Verde y Azul). Su representación espacial es un cubo.

Espacio HSV: Realiza una transformación no lineal para representar el espacio de color en base a tres parámetros: Tono (H = hue), Saturación (S) y Valor (V = luminosidad o brillo). Su representación espacial es un cono.

Otros espacios de color: Hay otras representaciones espaciales del color (HSL, LAN, etc.) que se usan accesoriamente en algunos filtros de GIMP.

Color de frente y color de fondo

En la caja de herramientas encontramos un área contextual que nos muestra los colores activos de frente y de fondo.

En la parte superior derecha hay una flecha que permite intercambiar ambos colores cuando se pulsa.

En la parte inferior izquierda hay una miniatura el área contextual que al pulsar reestablece los colores de frente y fondo al negro y blanco.

Pulsando sobre el color de frente / fondo, se abre el diálogo de la herramienta de gestión del color.

Herramientas de Gestión del color

Se accede pulsando sobre el color de frente / fondo. Hay varias herramientas que tienen variantes ligeramente diferentes de este gestor, pero con las mismas funciones básicas (por ejemplo la herramienta Texto).

Gestor del color

Color actual (el que seleccionamos en el gestor) y anterior (el que había al abrir el gestor de color).

Miniaturas de colores: se muestran los últimos doce colores utilizados.

Herramientas para seleccionar el nuevo color:

Pestañas con diferentes modos de representar el color.

Escalas con las propiedades del color (H, S, V – R, G, B).

Recoge-color: permite recoger un color directamente de la imagen.

Notación HTML del color (por defecto en notación hexadecimal). También se puede introducir la inicial de un color (notación CSS: Black, red, green…) y en el desplegable que nos aparece seleccionar uno de los colores (automáticamente la notación se transformará en su equivalente hexadecimal).

Pestañas del gestor de color

Se presenta el color de diferentes modos:

GIMP: consta de un área bidimensional de color donde se representa la propiedad del color elegida (mediante los botones laterales: H, S, V, R, G, B). Una tira cromática situada a la derecha del área de color muestra la propiedad elegida.

H: se representan el valor (V) x la saturación (S).

S: se representa la saturación (S) para todos los tonos (H).

V: se representa el valor (V) para todos los tonos (H).

R, G, B: se representa los 3 planos paralelos correspondientes a los 3 canales, que definen las coordenadas del color seleccionado.

CMYK: unos deslizantes permiten definir los colores (CMYK).

Rueda-Triángulo: Una rueda cromática permite elegir el tono (H) y en el triángulo se elige la saturación (S) y el valor (V).

Acuarela: Los colores se presentan como si estuvieran en una paleta de pinturas. El rojo, verde y azul ocupan los extremos de un triángulo, el resto de colores se forman al mezclarse los primarios entre sí. El concepto de «acuarela» es porque se trata de colores «diluidos», lo que quiere decir que cada vez que presionamos sobre un color, el color se refuerza (la cantidad de color «añadida» se determina con el deslizante de la izquierda).

Pulsando repetidamente sobre el mismo color podemos realizar graduaciones controladas del color.

Pulsando en diferentes colores, podemos realizar una mezcla.

Paleta de color: Muestra la paleta activa (como paleta predeterminada: «Default»).

Recoge-color GIMPToolRegoceColor

Permite seleccionar el color directamente desde el lienzo, seleccionando un píxel o un área (muestra ponderada), bien de la capa activa o de la imagen (muestra combinada).

Diálogo de la herramienta

Muestra combinada y muestra ponderada (en esta última con el deslizante se determina el radio del área a ponderar): Se utilizan para definir el origen del color.

Ambas desmarcadas: Se selecciona el color de un píxel la capa activa.

Muestra combinada: Se selecciona el color de un píxel de la imagen (del conjunto de capas visibles).

Muestra ponderada: Se selecciona el color de un área de la capa activa.

Ambas marcadas: Se selecciona el color un área de la imagen.

Modo de selección

Solo recoger: Aparece la ventana emergente de «información del recoge-color».

Definir color de frente (o de fondo): El color de frente (o de fondo) cambia al color recogido.

Añadir a la paleta: El color recogido se envía a la paleta de color activa (siempre y cuando sea una paleta personalizada, ya que GIMP no permite modificar las paletas predeterminadas).

Usar la ventana de información: Al recoger un color aparece una ventana emergente que ofrece información del color la composición del píxel en el espacio de color seleccionado (RGB, CMYK, HSV) y su código hexadecimal.

Recursos

Diálogo del recurso

En el Menú del diálogo (con el recurso activo) / Ver como… (listado o rejilla) es posible definir cómo se ven los recursos y en Menú del diálogo / Tamaño de la vista previa, el tamaño del icono.

La mayor parte de los recursos tienen un diálogo con opciones similares.

Filtro: Permite seleccionar una etiqueta (en el desplegable o escribiéndola) para buscar recursos similares.

Nombre del recurso: Aparece en la parte superior del diálogo.

Miniatura del recurso: El recurso activo está remarcado con un borde negro si la vista es en rejilla.

Etiquetas: Permiten realizar selecciones de recursos similares mediante el filtro. Además de las etiquetas predefinidas, se pueden añadir otras etiquetas personalizadas escribiéndolas a continuación, separadas por comas.

Iconos de acción:

Nuevo / Editar: Abre el diálogo del «Editor del recurso».

Duplicar: Para crear un duplicado del recurso (es útil para poder editarlo y modificarlo después).

Eliminar: Para borrar un recurso.

Refrescar: Su utilidad radica en aquellos casos en los que importamos un nuevo recurso, añadiéndolo a la carpeta correspondiente de GIMP, y sin cerrar el programa podemos actualizar la lista para poder tener acceso a él.

Pinceles

Los pinceles son mapas de píxeles que se usan para pintar (simulan un toque del pincel sobre el lienzo). Las características del mapa y el espaciado (distancia entre las estampas consecutivas) determinan el aspecto de un trazo continuo. Admiten las extensiones «.grb», «.gih», «.vbr» (según el tipo de pincel).

Tipos de pinceles

Por el tipo de trazo:

Pinceles estáticos (archivos «.grb»): Es un único mapa de píxeles que se repite por lo que el trazo que se genera es uniforme.

Pinceles dinámicos (archivos «.gih»): Están formados por varios mapas de píxeles que van alternando según un patrón fijo o aleatorio, de forma que el trazo que dejan va variando. Están señalados con un triangulo rojo en la esquina inferior derecha.

Pinceles paramétricos (archivos «.vbr»): Se generan a través del Editor de pinceles.

Por el color:

Pinceles ordinarios: Utilizan el color de frente.

Pinceles de color: estos pinceles tienen un color predeterminado que no es modificable.

Diálogo de pinceles (recurso)

Además de las propiedades comunes, hay una específica de los pinceles, el «Espaciado»: distancia entre las estampas consecutivas cuando se efectúa un trazo continuo.

Diálogos de las herramientas de dibujo (opciones comunes)

Elegir el pincel activo: Permite elegir la forma, tamaño, relación de aspecto (ancho-alto) y angulación del pincel activo.

Dinámica de pincel:

Dinámica: Permite elegir la que se desea.

Opciones de dinámica: Permite variabilidad en algunos parámetros de «Opciones de desvanecimiento» (longitud, repetición e invertido) y «Opciones de color» (algunas dinámicas de pincel utilizan el degradado activo en lugar del color de frente).

Jitter: Indica la dispersión de las marcas del pincel.

Trazado suave: Reduce la oscilación en el trazo, mediante las propiedades de calidad y peso.

Bordes duros: Ignora el borde degradado del pincel activo.

Restablecer opciones de herramienta (icono de acción): Permite volver a los valores predefinidos de la herramienta.

Dinámica de pincel

Las dinámicas aplican un aspecto más «real» al pincel conectando uno o más parámetros a la manera de usar el pincel. Están diseñadas para usarse en tabletas gráficas, aunque algunas también son operativas al dibujar con el ratón.

Como ejemplos que funcionan con el ratón:

Color from gradient: A medida que se va dibujando la línea va cambiando de color siguiendo el degradado activo.

Confetti: Va girando el pincel a medida que progresa, siguiendo el degradado activo.

Fade tappering: La línea se inicia desde la transparencia, el color va apareciendo de forma progresiva desde el centro hacia los laterales, cada vez con mayor intensidad hasta convertirse en un color sólido con un trazo de ancho normal.

Degradados

Un degradado es un conjunto de colores ordenados linealmente.

Tipos de degradados

Degradados de color variable: Usan los colores de frente y de fondo del área de color de la caja de herramientas para crear el degradado. Como recurso externo admiten archivos con extensión «.ggr» y «.svg».

En el ejemplo: Color de frente rojo / color de fondo blanco.

Frente a fondo (duro): El límite entre el color de frente y el de fondo es brusco.

Frente a fondo (RGB): Se pasa de un color al otro de forma progresiva (degradado predeterminado).

Frente a fondo (HSV) en sentido horario / antihorario: Se crea un degradado entre el color de frente y el de fondo que incluye todos los tonos intermedios (arcoiris).

Frente a transparente: Se pasa del color de frente a la transparencia de forma progresiva (degradado).

Degradados de color fijo: Son degradados cuyo color viene predeterminado y no se puede ajustar.

Diálogo de degradados

Además de las opciones comunes, podemos «Guardar como CSS»: Genera un archivo de texto con el código a incluir en CSS.

Este código CSS es útil para incluir en archivos SVG o en páginas web para determinados navegadores (Firefox, Chrome o Safari).

Patrones

Un patrón es una imagen pequeña, usada para rellenar regiones enlosando, es decir, situando copias del patrón unas al lado de las otras, como si fuera un mosaico de cerámica. Admite las extensiones: «.pat», «.png», «.jpg», «.bmp», «.gif» o «.tiff».

Creación de patrones propios

Hay dos herramientas que pueden sernos de utilidad.

El filtro «Desenfoque enlosable» (ver en Efectos especiales: «Enfocar y difuminar»): Mejora la transición entre una loseta del patrón y la siguiente.

Los guiones de GIMP orientados a la generación de patrones (Menú principal / Archivo / Crear / Patrones): Cada guion crea una imagen nueva rellenada con un tipo particular de patrón. Aparece un diálogo que le permite seleccionar parámetros para controlar los detalles de la apariencia.

Paletas de colores

Una paleta es una colección de colores limitado. Son útiles cuando se desea trabajar con un rango de colores concretos (por ejemplo por su tonalidad).

No confundir con el «Mapa de colores» de las imágenes indexadas (en el diálogo de paleta indexada).

Fuentes tipográficas

Diálogo de tipografías

Las opciones comunes del diálogo están más limitadas que en otros recursos, al no disponer de las opciones de «etiquetas» ni «filtro».

Entre las opciones propias del diálogo, permite ver una muestra ampliada de la tipografía al pulsar con el botón izquierdo del ratón sobre el icono de una fuente tipográfica concreta (funciona cuando el idioma está definido en ingles, «Pack my box with five dozen liquor jugs», pero no en español, que debería poner «El veloz murciélago hindú comía feliz cardillo y kiwi. La cigüeña tocaba el saxofón detrás del palenque de paja»).

Menú contextual de tipografías (pulsando el botón derecho del ratón sobre cualquier tipografía) / Render font-map: Permite previsualizar un texto de nuestra elección (en el campo «Text») con diferentes tipografías, que se delimitan introduciendo parte del nombre de la fuente en el campo «Filter (regexp)»: Por ejemplo si escribimos «arial» nos mostrará la familia completa de la fuente (redonda, cursiva, negrita, negrita cursiva, etc.), pero también podemos utilizar alguna de las características que con frecuencia forma parte del nombre de la fuente («sans», «serif», «mono», etc.). Si no se introduce ningún parámetro, en teoría realiza una previsualización de todas las fuentes, aunque con frecuencia falla (lo que genera el script es un nuevo lienzo con una capa por cada fuente; si el número de fuentes es elevado, es inmanejable para el programa).

Herramientas de información

Herramienta de Medir GIMPToolMedir

La herramienta genera una línea que nos permite conocer la distancia entre dos puntos de la imagen (en px.) y su angulación respecto a la horizontal. La información se muestra en la barra de estado (o en una ventana emergente si se marca en el diálogo de la herramienta «Ventana de Información»).

Cómo se usa: en el lienzo se pulsa sobre el punto inicial y se arrastra hasta el punto final, donde se suelta, pudiendo modificar la posición de los extremos posteriormente si se precisa.

Teclas especiales

Manteniendo la tecla «Ctrl» pulsada antes de colocar el punto final, la línea solo puede adoptar determinadas angulaciones (múltiples de 15º).

Tras fijar la primera medida, mantenemos pulsada la tecla «Mayúsc» mientras realizamos una segunda medida (partiendo de uno de los extremos de la primera). Esto nos permite conocer la angulación entre ambas.

Mover una medida: Manteniendo las teclas «Ctrl + Alt» pulsadas se puede mover la medida por el lienzo arrastrándola con el ratón.

Reglas

Para mostrar las reglas laterales: Menú principal / Vista / Mostrar reglas.

Rejilla

Cada imagen tiene una rejilla invisible asociada.

Para hacerla visible: Menú principal / Vista / Mostrar rejilla.

Por defecto viene dividida de 10 en 10 píxeles. Se puede modificar en: Menú principal / Imagen / Configurar rejilla.

Guías

Son líneas verticales y horizontales que se puede mostrar, de manera temporal, sobre una imagen mientras se trabaja en ella. Aparecen en azul.

Crear una guía:

Pulsando sobre la regla, arrastrar con el ratón sobre la imagen y soltar en el punto deseado.

Desde: Menú principal / Imagen / Líneas de guía y elegir una de las opciones (Guía nueva, Guía por porcentaje o Guía desde selección).

Para crear una guía en un punto concreto: Con la herramienta de medir y presionando «Ctrl» para una guía horizontal, o «Alt» para una guía vertical.

Creación de guías en los extremos de una medida: A la vez que se pulsa con el ratón sobre el extremo de la medida, se pulsa la tecla «Ctrl» para colocar una guía horizontal, o «Alt» para una guía vertical.

Mover una guía: con la herramienta «Mover» GIMPToolMover, en la pestaña de las opciones de la herramienta se elige «Mover: capa», y se marca «Escoger una capa o guía». La guía aparece en rojo al acercar el puntero, y se puede arrastrar con el ratón a otra posición.

Ocultar las guías: Menú principal / Vista / Mostrar guías (deseleccionar).

Eliminar guías:

Eliminar una única guía: Basta con arrastrar la guía fuera del lienzo.

Eliminar todas las guías: Menú principal / Imagen / Líneas de guía / Eliminar todas las guías.

Histograma

Menú principal / Colores / Info / Histograma.

Es una herramienta meramente informativa sobre la distribución estadística de los valores de color en la capa o selección activa. Es útil para probar un balance de color (Una IMAGEN con un buen balance es aquella que en el histograma tiene niveles distribuidos por todo el rango.

Se representa en una gráfica: el eje X es el nivel de entrada en el canal seleccionado; el eje Y representa el n.º de píxeles que contiene ese nivel.

Los niveles de entrada se dibujan en negro (salvo al utilizar el canal RGB).

Si se utiliza una herramienta que modifique los niveles de salida (por ejemplo «Curvas» o «Niveles»), los niveles de salida se dibujan en gris. Cuando se estira el histograma con alguna de estas transformaciones se crean vacíos entre las columnas de los píxeles, dando una vista rayada.

Diálogo del histograma

Canales: Valor, rojo, verde, azul, RGB, Alfa.

Modo:

Lineal: Para fotografías.

Logarítmica: Para imágenes con áreas extensas de color constante.

Rango de niveles: Se delimita por los niveles de referencia blanco y negro (los extremos). En el canal Valor referencia la luminosidad, en RGB el color, y en Alfa la transparencia. El punto gamma (punto de inflexión entre el blanco y el negro) no está representado en el histograma, pero sí en otras herramientas basadas en él.

Análisis del cubo de color

Menú principal / Colores / Info / Análisis del cubo de color.

Aparte de una representación en color del histograma, nos indica el n.º de colores de nuestra imagen.

Modificando la estructura de la imagen

Crear o eliminar estructuras

Crear nueva / Eliminar

Capa: Pestaña de Capas / Menú de Capa / Capa nueva - Eliminar la capa.

Canal: Pestaña de Canales / Menú de Canales / Canal nuevo - Eliminar canal.

Ruta: Pestaña de Rutas / Menú de rutas / Ruta nueva - Eliminar ruta.

Selección flotante

Se genera una nueva capa provisional que contiene el área seleccionada (cuyo contenido además se guarda en el portapapeles).

Se puede «despegar» de la capa (queda el área vacía): Desde Menú principal / Seleccionar / Selección flotante (o presionando simultáneamente las teclas «Ctrl + Alt» a la vez que se mueve la selección).

Se puede «copiar» el área seleccionada: Desde Menú principal / Seleccionar / Copiar y luego en el mismo menú Pegar (o manteniendo pulsadas las teclas «Mayúsc + Alt» a la vez que se desplaza la selección).

La selección flotante hay que volver a incrustarla en una capa o eliminarla: Menú contextual de la capa «Selección flotante»: «Anclar a capa» (la devuelve a la capa original), «A una capa nueva» (la convierte en una capa normal) o «Eliminar la capa».

Pegar (desde el portapapeles)

Esta opción permite pegar lo que se haya copiado previamente en el portapapeles (mediante las opciones de copiar, cortar o selección flotante). Las opciones de pegado son:

Creando un lienzo nuevo: Menú principal / Edición / Pegar como / Imagen nueva.

Creando una capa nueva.

Capa normal: Menú principal / Edición / Pegar como / Capa nueva (el fragmento copiado se sitúa en la esquina superior izquierda de la imagen).

Selección flotante: Menú principal / Edición / Pegar ó Pegar en: el fragmento copiado no se hace visible hasta que la selección flotante no se incruste en una capa (quedará además en la posición original del fragmento copiado).

Creando un pincel (recurso): Menú principal / Edición / Pegar como / Pincel nuevo (New Brush).

Creando un patrón: Menú principal / Edición / Pegar como / Patrón nuevo (New Pattern).

Duplicar

Imagen (Menú principal / Imagen / Duplicar): duplica el archivo «.xcf» (la imagen con todas sus capas, canales y rutas), abriéndolo en un nuevo lienzo.

Capa

Menú principal / Capas / Duplicar la capa.

Pestaña de Capas, pulsar con el botón derecho del ratón sobre la capa: Menú de Capas / Duplicar la capa.

Selección: manteniendo pulsadas las teclas «Mayúsc + Alt» a la vez que se arrastra la selección.

Canal: Menú contextual de Canales (pulsando el botón derecho del ratón sobre la miniatura del canal) / Duplicar canal.

Ruta: Menú contextual de Rutas (pulsando el botón derecho del ratón sobre la miniatura de la ruta) / Duplicar ruta.

Mover y alinear

Herramienta de Mover GIMP-ToolMover

Se pulsa sobre un punto de la imagen y se arrastra la capa / ruta hasta el punto deseado.

En el diálogo de la herramienta, disponemos de varias opciones:

Mover: permite escoger si lo que se va a mover es una capa (o guía), una selección (mueve el marco de la selección pero no su contenido) o una ruta. Se puede actuar sobre varias capas a la vez, siempre que estén encadenadas o formen parte de un grupo de capas.

En «Mover selección»: si al moverla la selección sobrepasa el lienzo, ese área se resta de la selección.

Activar la herramienta: esta opción está disponible para «Mover capa» y «Mover ruta». Permite dos opciones:

Escoger una capa o guía / Escoger una ruta: En los elementos de la capa / ruta activa el puntero aparecerá como una cruz que permite mover la capa / ruta. Si estamos en un área transparente, el puntero se transforma en una mano y lo que moverá es el elemento visible (que pertenece a cualquier otra capa o ruta).

Mover la capa activa / Mover la ruta activa: Solo se mueve la capa / ruta activa, aunque se esté sobre un área transparente de la misma.

Herramienta de Alinear GIMP-ToolAlinear

Esta herramienta permite alinear capas respecto a un elemento de la imagen (objetivo). Hay 3 variables a determinar:

Las capas que se van a alinear: Con la capa (o grupo de capas) a alinear activa, se pulsa sobre el área del lienzo para activar las marcas (unos cuadraditos en los bordes de la capa).

El objetivo: puede ser la imagen, una capa, un canal, una selección, una ruta o el primer elemento (cualquier capa que pasamos a un primer plano (capa activa), que no tiene por qué ser la misma que la capa seleccionada previamente para alinear).

El tipo de alineación:

Alineado: Alinea las capas con el objetivo.

Desplazamiento: Alinea la capa con el objetivo añadiéndole un desplazamiento respecto a este en la posición que se elija. Se determina también el alcance del desplazamiento en px. (puede ser un valor positivo o negativo).

Otras formas de mover y alinear

Desplazar una capa (Menú principal / Capa / Transformar / Desplazamiento): Desplaza la capa activa en el eje X ó Y en la cantidad que se indique.

Alinear las capas (Menú principal / Imagen / Transformar / Alinear capas visibles): Esta opción abre un menú donde se selecciona la forma en que se van a ordenar las capas (tiene que haber al menos 3 capas visibles). Está orientado a imágenes animadas, resulta poco práctica para los propósitos de este manual.

Alinear con el lienzo, guía, rejilla o ruta (Menú principal / Vista / Ajustar a… borde del lienzo, las guía, la rejilla, la ruta activa): Al mover un objeto cerca de una línea de la rejilla, se «imanta» con facilidad a la línea, por defecto se imanta a una distancia menor o igual a 8 px. de la línea (para modificar este parámetro: Menú principal / Editar / Preferencias / Opciones de herramienta - Ajuste a la rejilla y a la guía: distancia de ajuste).

NOTA: En el caso de la rejilla, si el tamaño de la cuadrícula es muy pequeño, no funcionará porque no podrá diferenciar a que borde se debe imantar (sería preferible usar en ese caso una guía o cambiar el tamaño de la rejilla).

Transformar

Herramientas de transformar

Con muchas de estas herramientas aparecerá una ventana emergente con información extra sobre el grado de rotación / inclinación / etc, que se puede utilizar para afinar el resultado deseado.

Redimensionar

Permite cambiar de tamaño la capa, selección o guía al mover los bordes (en el diálogo emergente nos muestra el tamaño resultante en px, también una cadena que nos indica si el escalado va a ser proporcional o no a la imagen original).

Rotación

Permite girar la capa o selección sobre sí misma. Con el diálogo emergente se puede realizar una rotación más precisa, ajustando los parámetros.

Inclinación

Permite inclinar la capa, selección o guía sobre uno de sus ejes (X ó Y). Con el diálogo emergente se puede ajustar los parámetros.

Perspectiva

Permite modificar la perspectiva de la capa, selección o guía, en cualquiera de sus laterales (uno o varios). El diálogo emergente solo aporta información técnica.

Voltear GIMP-ToolVoltear

Permite darle la vuelta a la capa, selección o guía. El eje se determina en el diálogo de la herramienta.

Deformar GIMP-ToolDeformar

Permite deformar la imagen. Se selecciona el área a deformar («Crear o ajustar rejilla»), luego se tira de las anclas para deformar la imagen («Deformar la rejilla para deformar la imagen»).

En la versión 2.8 de GIMP provoca un cierre inesperado del programa.

Diálogo de las herramientas de transformación

Es un diálogo común para todas las herramientas de transformación, excepto para la herramienta de deformar. Encontramos varias opciones:

Transformar: permite elegir si vamos a actuar sobre una capa, una selección o una ruta.

Se puede actuar sobre varias capas a la vez, siempre que estén encadenadas o formen parte de un grupo de capas.

Dirección: normal (la imagen se transforma igual que la rejilla-guía) o correctivo (se redimensiona en sentido inverso). Esta última opción es especialmente útil para correcciones de inclinación o perspectiva, ya que podemos ajustar la rejilla-guía a la imagen para conseguir «enderezarla».

Mostrar vista previa: previsualiza la imagen transformada, se puede además seleccionar la opacidad con que se muestra la previsualización.

Guías: se puede mostrar o no una rejilla, las diagonales y otras opciones que nos ayudan al transformar la imagen.

En herramienta de «Redimensionar», Mantener la proporción: permite mantener la relación entre ancho y alto previo. También se puede seleccionar en el diálogo emergente, anclando las proporciones con la cadena.

Otras formas de transformar (Menú principal)

Redimensionar

Lienzo: modifica el tamaño del área de trabajo.

Para ajustar el tamaño del lienzo automáticamente de forma que ninguna capa quede parcialmente fuera: Menú principal / Imagen / Ajustar lienzo a las capas. El contenido del área de trabajo no se redimensiona.

Para personalizar el tamaño del lienzo (Menú principal / Imagen / Tamaño del lienzo): especificar las medidas. Permite además recolocar la imagen en el nuevo lienzo (centrarla o desplazarla).

Imagen o capa: aquí modificamos el tamaño de nuestra imagen (Menú principal / Imagen / Escalar la imagen) o de la capa activa (Menú principal / Capa / Escalar capa).

NOTA: Al escalar la imagen, se escala también el lienzo, pero no al escalar una capa.

Selección (Menú principal / Seleccionar… Encoger (Shrink), Agrandar (Grow)): Con estas opciones podemos aumentar o reducir la selección.

Voltear: Menú principal / Imagen o Capa / Transformar / Voltear…

Rotar: Menú principal / Imagen o Capa / Transformar / Rotar…

Cortar

Herramienta de recortar GIMP-ToolRecortar

Esta herramienta crea una «ventana» sobre la capa activa (una selección en la que el área exterior a recortar queda en gris), se ajusta el tamaño y la posición y se presiona la tecla «Enter» para aplicar el recorte. En la pestaña de la herramienta accedemos a varias opciones para modificar su comportamiento.

Solo la capa actual: la herramienta recorta únicamente la capa activa; cuando se desactiva, la opción recorta la imagen (todas las capas).

Permitir agrandar: permite que el área de recorte sea mayor que el lienzo. Esta zona mostrará la parte no visible de las capa(s), y de no haberla(s), será un área transparente.

Fijo: marcando esta opción podemos definir el marco de recorte por su proporción (ancho:alto), tamaño (ancho x alto), anchura o altura, al igual que sucede con las herramientas de selección rectangular y elíptica.

Otras formas de recortar

Autorrecortar

Hace un recorte rectangular quitando los márgenes libres utilizando la capa activa para determinarlos. El recorte se aplica a la imagen (Menú principal / Imagen / Autorrecortar imagen) o a la capa activa (Menú principal / Capa / Autorrecortar capa).

Recorte Zealous

Hace un recorte rectangular eliminando los bordes libres de todos los elementos del recorte (márgenes y centro), utilizando la capa activa para determinarlos. El recorte se aplica a la imagen (Menú principal / Imagen / Recorte Zealous).

Recortar a la selección

Recorta la imagen utilizando una selección previamente definida. Si la selección es irregular, realizará un recorte rectangular en los límites de la misma. Aplicable a imagen (Menú principal / Imagen / Autorrecortar imagen) o capa activa (Menú principal / Capa / Autorrecortar capa).

Cortar

Menú principal / Edición / Cortar: elimina la capa activa generando una copia en el portapapeles.

Si en la capa está definida alguna selección, lo que se corta es únicamente la selección.

Recorte flotante ó selección flotante

Menú principal / Edición / Flotante (vs. presionando simultáneamente las teclas «Ctrl + Alt» a la vez que se mueve la selección): se recorta la selección de la capa activa (la «despega»).

Guillotinar

Menú principal / Imagen / Transformar / Guillotina: utilizando guías previamente definidas, corta la imagen generando un nuevo lienzo con cada parte.

Pintando con GIMP

Dibujar y retocar

Herramientas de dibujo

A través de estas herramientas se pueden realizar líneas sobre la capa activa guiándolas con el ratón.

Borrador: Es la única que utiliza el color de fondo o la transparencia (si la capa tiene canal alfa) para «dibujar» un trazo.

Lápiz: Con el color de frente, dibuja un trazo de borde duro.

Pincel (no confundir con el recurso «pincel»): Con el color de frente, dibuja un trazo de borde suave.

Aerógrafo: Con el color de frente, dibuja un trazo con presión variable.

Tinta: Con el color de frente, dibuja un trazo que imita a una pluma.

Teclas especiales

Tecla «Ctrl»: Permite recoger el color del píxel seleccionado de la capa activa (será el color de frente para las herramientas de lápiz, pincel, aerógrafo y tinta, y el color de fondo para el borrador).

Diálogo de herramientas Lápiz, Pincel y Borrador

Incremental: Cuando esta opción está desmarcada (predeterminado) y se dibuja con un pincel semitransparente en un solo trazo, el hacer varias pasadas sobre el trazo no cambia el color; cuando se marca esta opción el color se incrementa con las sucesivas pasadas (además, como el pincel va pasando sobre sí mismo, el trazo tiene mayor opacidad). El efecto es similar al que se obtendría de no utilizar un trazo continuo.

Opciones adicionales para Borrador:

Bordes duros: Obvia los bordes degradados de algunos pinceles, asumiendo siempre un borde limpio de borrado.

Antiborrado (en capas con canal alfa): Borra la transparencia, manteniendo el color.

Diálogo de herramienta Aerógrafo

Tasa: ajusta la velocidad de la aplicación del color.

Flujo: controla la cantidad de color.

Diálogo de la herramienta Tinta

Ajuste: Tamaño (anchura del plumín) + Ángulo (relativo a la horizontal).

Sensibilidad: Tamaño (tamaño del plumín) + Inclinación (relativo a la horizontal) + Velocidad (la velocidad modifica el tamaño efectivo del plumín: cuanto más rápido, el trazo es más fino).

Forma del plumín: Redondo, cuadrado o romboidal.

Herramientas de retoques (clonar y sanear)

Permite realizar retoques en la imagen copiando (la imagen o la textura) desde un área (origen) a otro (destino), para lo que utiliza el pincel activo.

El origen se elige con la tecla «Ctrl» y pulsando sobre la capa, máscara de capa o el canal deseado.

Clonar: Copia la imagen (se copia el color de los píxeles de origen en el destino).

Sanear: Copia la textura y parcialmente el color (antes de copiar los píxeles de origen, los transforma mediante un algoritmo que tiene en cuenta el color de los píxeles del destino).

Clonar con perspectiva: Copia la imagen añadiéndole perspectiva. Se elige en el diálogo de la herramienta «Modificar perspectiva» para generar la rejilla y modificarla, luego se marca en el diálogo «Clonar con perspectiva». Se fija el origen con la tecla «Ctrl» y se pinta en el lugar deseado.

Limitaciones

No se pueden clonar transparencias:

Sobre un destino semi-transparente se va perdiendo la transparencia.

Sobre un destino sólido se genera un color sólido.

Si se usa un pincel demasiado grande para sanear el algoritmo tarda en generarse, por lo que el pincel se atasca y va a trompicones, quedando un trabajo poco fino.

Diálogo de la herramienta

Origen (solo para clonar).

Desde la imagen. Si está marcada la casilla «Muestra combinada», se clona desde la imagen.

Desde un patrón: Se selecciona el patrón que se desea clonar.

Alineación: Define la relación entre la posición de origen (O) y la de destino (D).

Ninguno: Al iniciar cada pincelada, el origen vuelve al punto «O».

Alineado: Al iniciar cada pincelada, el origen se desplazará del punto «O» en la misma proporción que el pincel del punto «D».

Registrado (para clonar entre dos capas o imágenes): El origen «O» tendrá las mismas coordenadas (x, y) que el pincel en la capa de destino «D».

Fijo: El origen «O» se mantiene fijo mientras se mueve el pincel, por lo que se clona siempre el mismo punto de la imagen original.

Delinear (trazar)

Trazar una línea recta

Con cualquiera de las herramientas que utiliza el recurso pincel.

Tecla «Mayúsc»: Permite dibujar una línea recta. Se pulsa sobre la imagen en el punto de inicio de la recta, se mantiene la tecla «Mayúsc» presionada y se pulsa en el punto final de la recta, que automáticamente se dibuja.

Teclas «Ctrl + Mayúsc»: Permite dibujar una línea recta igual que con la tecla «Mayúsc», la diferencia es que solo admite algunas angulaciones (múltiplos de 15º).

Trazar una selección

Una selección se puede dibujar sobre una capa, con lo que pasarían a formar parte de la imagen:

Menú principal / Editar / Trazar selección.

Desde el «Editor de selección» (Menú principal / Seleccionar / Editor de selección): Con el icono de acción correspondiente.

En el diálogo de opciones emergente se puede elegir el grosor de la línea, el acabado de los extremos, el tipo de unión entre las anclas, etc. El color se corresponderá con el color de frente seleccionado («Color sólido») o con el patrón activo («Patrón»).

Esta opción permite dibujar desde formas básicas como un rectángulo o una elipse a formas más complejas mediante otras herramientas de selección (por ejemplo con selección por color). Combinando áreas (sumar, restar, intersecciones) se pueden conseguir formas geométricas variadas.

Trazar una ruta

Las rutas se pueden dibujar sobre una capa, con lo que pasarían a formar parte de la imagen. Se puede acceder a esta opción por alguno de estos métodos:

Herramienta Rutas / Diálogo de Rutas / Trazar ruta.

Pestaña de Rutas / Menú de Rutas / Trazar ruta.

Pestaña de Rutas / Iconos de acceso rápido / Pintar a lo largo de la ruta.

En el diálogo de opciones emergente es igual que en «Trazar selección», permitiendo elegir el grosor de la línea, el acabado de los extremos, el tipo de unión entre las anclas, etc., bien con el color de frente («Color sólido») o con el patrón activo («Patrón»).

Rellenar

Herramienta de relleno

Con la herramienta de relleno seleccionada, se pulsa sobre el área a rellenar.

Diálogo de la herramienta

Tipo de relleno: color de frente, color de fondo o con un patrón.

Área:

Rellenar la selección completamente: Se rellena todo el área seleccionada independientemente de los colores que contenga.

Rellenar colores similares: El relleno se extiende solo sobre el área de color similar al píxel seleccionado, deteniéndose cuando el cambio de color sobrepasa el rango establecido.

Buscando colores similares: Permite definir el grado de similitud de color que se aplicará en la selección.

Rellenar áreas transparentes: No es posible rellenar áreas transparentes salvo que esta opción esté activa.

Muestra combinada: Permite que la similitud de colores se determine por la imagen y no por la capa activa.

Umbral B/N: Determina el rango de similitud del color que se rellenará.

Rellenar con: Compuesto, Rojo, Verde, Azul, Tono, Saturación y Valor. La opción elegida funcionará como un canal sobre el que se aplica el relleno de colores similares.

Herramienta de mezclas

Se rellena el área con el degradado activo. Los colores del degradado se distribuirán perpendicularmente a la dirección de el arrastre del ratón y según la longitud de dicho arrastre, rellenándose el resto de la selección o capa con los colores de los extremos del degradado.

Diálogo de la herramienta

Degradado: Permite seleccionar el tipo de degradado a aplicar (degradado activo).

Dirección: Permite invertir la dirección del degradado.

Forma: Determina como se comporta el degradado.

Lineal. Se dispone de dos opciones: Lineal (el degradado sigue la línea trazada por el ratón) y Bilineal (el degradado sigue la línea trazada con el ratón, pero también una línea «en espejo» con un degradado inverso).

Radial: El degradado forma un círculo, la línea del ratón determina el radio, y su punto inicial es el centro.

Cuadrado / contorno: Genera un degradado con forma cuadrada. Se puede elegir una de las siguientes variantes: Cuadrado, Contorno angular, Contorno esférico, Contorno con hoyuelos.

Cónica: Da la sensación de mirar la punta de un cono desde arriba. Las opciones son: Cónica simétrica (se inicia y termina con el color de frente) o Cónica asimétrica (se inicia con el color de frente y termina con el color de fondo).

Espiral (en sentido horario o antihorario).

En el ejemplo degradado RGB del color rojo (frente) y blanco (fondo), con las diferentes formas de relleno. La flecha representa el origen y final del degradado que «dibujamos» en el lienzo.

Repetición:

Ninguno

Dientes de sierra: Cuando llega al final del degradado, se reinicia.

Onda triangular: Cuando llega al final del degradado, lo aplica en dirección inversa hasta el principio.

Desplazamiento: Determina el punto donde se inicia el degradado (la barra de desplazamiento representa la línea trazada con el ratón, el degradado se iniciará en el punto marcado y continuará hasta el final de la línea).

Difuminado.

Sobremuestreo adaptativo: Permite suavizar el efecto «escalonado» de una transición nítida de color a lo largo de una línea o curva.

Renderizados

Menú principal / Filtros / Renderizados.

Crean contenido a partir de cero. Pueden ser útiles para crear fondos o máscaras. Aquí solo se ofrece una muestra de lo que se puede conseguir con ellos:

1.º fila: Difference Clouds (imagen en Escala de grises 8 bits), Fog, Plasma, Ruido sólido, Fractal IFS, Llama, Examinador CML.

2.º fila: Laberinto, Patrones de difracción, Puzzle (aplicado sobre imagen), Obista, Rejilla, Seno, Tablero de ajedrez.

3.º fila: Circuit, Diseñador de esferas, Examinador de fractales, Lava, Line nova, Spirogimp.

Transparencias

Canal alfa de la capa

El añadir a una capa el canal alfa amplia las posibilidades al poder jugar con las transparencias. Por ejemplo, se puede utilizar limpiar una selección o utilizar el borrador para crear un área transparente.

El nombre de la capa deja de estar en negrita cuando tiene canal alfa.

Para añadir el canal alfa: En la pestaña Capas se accede al menú contextual de la capa (pulsando con el botón derecho del ratón sobre la miniatura de la capa) / Añadir canal alfa.

Eliminar el contenido

Para eliminar el contenido de una capa o selección, disponemos de varias alternativas:

Limpiar (Menú principal / Edición / Limpiar, vs. tecla «Supr»): El área que se «limpia» queda transparente si la capa tiene canal alfa, y del color de fondo en caso de que la capa sea opaca.

Capa activa: Queda la capa vacía de contenido.

Selección: Teniendo un área seleccionada, al aplicar el comando se elimina únicamente el contenido de la selección, manteniendo intacta el resto de la capa.

Pincel: Con la herramienta borrador (el trazo queda transparente o con el color de fondo, dependiendo de si la capa tiene canal alfa o no).

Opacidad de la capa

En la pestaña de Capas se puede seleccionar el grado de opacidad de la capa activa, permitiendo ver las capas inferiores. Este parámetro es independiente de que la capa tenga o no canal alfa.

Máscaras de capa

Una máscara de capa permite mostrar u ocultar el contenido de la capa. Para ello se utilizan las herramientas de pintura (colores blanco y negro) para delimitar las áreas transparentes u opacas. Se pueden conseguir transparencias variando la opacidad del pincel utilizado, o bien utilizando otros colores diferentes del blanco y el negro (el grado de semi-transparencia es fijo para cada tono de color).

Las máscaras de capa aparecen al lado de la capa a la que afectan.

Crear una máscara de capa

En la Pestaña de Capas, se accede al menú contextual de la capa (pulsando el botón derecho del ratón sobre la miniatura de la capa) / Menú de Capas / Añadir máscara de capas.

Blanca: Muestra la capa activa.

Negra: Oculta la capa activa (la vuelve transparente).

Transferir canal alfa de la capa: Crea una máscara a partir del canal alfa de la capa.

Selección: Crea una máscara a partir de una selección, que deja visible únicamente el área de la capa activa que se corresponde a la selección.

Copia en escala de grises de la capa

Canal: Permite crear una máscara a partir de un canal (tiene que ser un canal de selección).

Para crear una máscara desde un canal de color (RGBA), primero hay que duplicar el canal para convertirlo en un canal de selección.

Invertir la máscara: Permite que la máscara que estamos creando tenga los colores invertidos.

Mostrar y Desactivar una máscara de capa

Mostrar una máscara de capa (marco verde): Pestaña de Capas, pulsar el botón derecho con el ratón sobre la capa, Menú de Capas / Mostrar máscara de capas. Para ocultarla, desmarcar la opción.

Desactivar una máscara de capa (marco rojo): Pestaña de Capas, pulsar el botón derecho con el ratón sobre la capa, Menú de Capas / Desactivar máscara de capas. Para reactivarla, desmarcar la opción.

Aplicar y Eliminar una máscara de capa

Aplicar una máscara de capa: Pestaña de Capas, pulsar el botón derecho del ratón sobre la miniatura de la capa para acceder al menú contextual de Capas / Aplicar máscara de capas. La capa y la máscara se convierten en una única capa.

Eliminar una máscara de capa: Pestaña de Capas, pulsar el botón derecho del ratón sobre la miniatura de la capa, Menú de Capas / Eliminar máscara de capas.

Otras formas de crear o modificar transparencias

Herramientas de pintura con opacidad semi-transparentes (Diálogo de la herramienta de pintura / Opacidad): No afecta a la transparencia de la capa, solo a la «pintura» que añadimos, lo que permite ver parcialmente la capa original.

Color a alfa (Menú principal / Colores / Color a alfa, también Menú principal / Capa / Transparencias / Color a alfa): Se selecciona el color que se desea convertir en transparente. Si se aplica sobre una capa que no tenía canal alfa, se lo añade automáticamente.

Umbral a alfa (Menú principal / Capa / Umbral a alfa): Convierte las áreas semitransparentes de la capa activa en áreas transparentes y opacas, según el umbral seleccionado (todos los valores de transparencia por encima de este umbral se volverán opacos y todos los valores iguales o por debajo se volverán completamente transparentes, con una transición brusca). El umbral es un valor comprendido entre 0-255.

Herramientas de Curvas: Seleccionando el canal alfa en el menú emergente, y luego modificando la curva.

Herramientas de Niveles: Seleccionando el canal alfa en el menú emergente, y luego modificando los niveles de entrada y/o salida.

Ajustando la imagen con GIMP

NOTA: Se indica entre paréntesis la propiedad que modifica cada herramienta.

Equilibrando la imagen

Herramienta Curvas (V, RGB, Alfa)

Menú principal / Colores / Curvas.

Basándose en el histograma, permite ajustar el color, la luminosidad, el contraste o la transparencia.

Diálogo emergente

Canal: Valor (V), RGB (rojo, verde o azul) y Alfa (transparencia).

Área de edición: Los ejes representan una escala tonal (graduada), siendo el eje X los niveles de entrada y el eje Y los niveles de salida.

Histograma del canal: Lineal o logarítmico (su función es meramente informativa, se representa los niveles de entrada en color gris).

Curva: de manera predeterminada es una recta (todos los niveles de entrada se corresponden con los mismos niveles de salida). Está delimitada por dos anclas, que se corresponden con los niveles de referencia para el negro y el blanco (definidos de forma predeterminada con los valores (0,0) y (255,255)).

Tipo de curva:

Suave (predeterminado): La línea es suave y con tensión. Es más realista. Cuando se pulsa sobre un punto del área, se genera un nuevo ancla que imanta la curva (para eliminarlo arrastralo hasta fusionarlo con otro ancla). Se puede generar un ancla correspondiente a un píxel determinado: a la vez que se selecciona el píxel en el lienzo se mantiene presionada la tecla «Mayúsc» (genera un ancla en el canal activo) o la tecla «Ctrl» (genera un ancla en todos los canales).

Mano alzada: La línea se imanta al punto seleccionado en el área (o al paso del ratón si se mantiene el botón izquierdo pulsado).

Píxel seleccionado: Cuando se pulsa con el ratón en el lienzo, se genera una línea vertical en el histograma que se corresponde con la propiedad del canal elegido para ese área (V, R, G, B, alfa).

Diálogo de la herramienta

Histograma: Permite elegir la representación del histograma de la curva (se puede hacer también desde el diálogo emergente de la herramienta).

Muestra ponderada: Cuando se marca esta opción, al utilizar la función de «Pixel seleccionado» del diálogo emergente se selecciona el píxel de todas las capas y no solo de la capa activa.

Radio: Determina el tamaño del área seleccionada al utilizar la función de «Pixel seleccionado» del diálogo emergente (para un único píxel, el radio debe ser 1).

Entendiendo la herramienta Curvas

| V | Alfa | R / G / B
Reducir eje X (entrada) | colores más intensos y contrastados | variación en áreas semi transparentes | variación entre colores y saturación complementarios
Reducir eje Y (salida) | colores grisáceos y menos contraste | variación en la transparencia de la capa | variación entre colores y saturación complementarios
Invertir curva | imagen en negativo | inversión de transparencias | inversión al color y saturación complementarios
Modificar curva (anclas) | juego de intensidad y luminosidad | se potencian algunas semi transparencias y se disminuyen otras | juego entre colores y saturaciones complementarios

Herramienta Niveles (V, RGB, Alfa)

Menú principal / Colores / Niveles.

Basándose en el histograma permite cambiar el balance de tonos claros y oscuros (luminosidad o brillo). De forma indirecta, al permitir trabajar con cada canal por separado, también permite modificar el reparto de color.

Diálogo emergente

Canal: se elige el canal que se va a modificar (Valor, R, G, B, Alfa).

Histograma del canal: Lineal o logarítmico (su función es meramente informativa, se representa en negro).

Niveles de entrada: Se pueden modificar los niveles de referencia (blanco, negro y gamma) con los deslizantes, en las cajas de texto numérico o bien con el recoge-color sobre la capa activa. El efecto equivale a reducir el eje X en Curvas.

Niveles de salida: Fuerzan el rango de niveles para que se ajuste a unos nuevos límites (se fijan los niveles para el blanco y el negro mediante deslizantes o cajas de texto numérico). El efecto equivale a reducir el eje Y en Curvas.

Todos los canales: Se realiza un ajuste automático (auto) o manual (se seleccionan los niveles de referencia para el blanco, negro y gamma con el recoge-color sobre la capa activa).

Editar estos ajustes como curvas: Permite cambiar a la herramienta Curvas manteniendo los mismos ajustes.

Diálogo de la herramienta: No aporta ninguna opción de interés adicional al diálogo emergente.

Herramienta Balance de color (RGB)

Menú principal / Colores / Balance de color.

Está herramienta es adecuada para corregir los colores predominantes.

Diálogo emergente

Seleccionar rango para ajustar: Limita los colores a los que se aplica el cambio. Se puede elegir entre píxeles de colores oscuros (Sombras), colores intermedios (Tonos medios) o de color claro (Puntos de luz).

Ajustar los niveles de color: Hay tres deslizantes que representan los colores primarios en un extremo y sus complementarios en el otro. Siempre que se ajusta un color, se ajusta también su opuesto.

Conservar la luminosidad: El valor (V) de los píxeles más luminosos no cambia.

Diálogo de la herramienta: No tiene.

Herramienta Tono y saturación (HSV)

Menú principal / Colores / Tono y saturación.

Permite ajustar los niveles del tono, saturación y luminosidad para un rango de color.

Diálogo emergente

Seleccionar el color primario para modificar: Se muestran los colores primarios y sus complementarios distribuidos en un círculo. Se selecciona el color que se va quiere ajustar (el efecto se observará en la muestra de color). Si se selecciona «Principal» (en el centro), los cambios afectan a todos los colores.

Solapar: permite establecer el rango de colores que se van a solapar (solo funciona en colores muy cercanos).

Ajustar el color seleccionado:

Tono: Selecciona un color (H).

Luminosidad: Permite seleccionar el valor (V).

Saturación: Permiten seleccionar la cantidad de color (S).

Diálogo de la herramienta: no tiene.

Herramienta Brillo y contraste (V)

Menú principal / Colores / Brillo y contraste.

Ajusta los niveles de Valor (V) para los niveles de entrada (contraste) y salida (brillo). Es una herramienta poco sofisticada, pero fácil de usar.

Diálogo emergente

«Brillo» y «Contraste»: Mover los deslizantes al punto deseado.

Editar estos ajustes como niveles: Abre la herramienta de Niveles manteniendo los ajustes fijados en brillo y contraste.

Diálogo de la herramienta: No tiene.

Paquete de filtros (RGB + HSV)

Menú principal / Colores / Auto / Paquete de filtros.

Es una colección de filtros para tratar la imagen unificados en una sola herramienta. Se trabaja simultáneamente con la ventana principal de la herramienta y las ventanas emergentes para las diferentes opciones: en la ventana principal se va seleccionando a qué se quiere aplicar el efecto y con las ventanas emergentes se aplica el efecto.

Previsualización:

Vistas previas: Se muestra una miniatura de la imagen original y actual (con los filtros aplicados).

Mostrar: Permite configurar lo que se quiere previsualizar (imagen, selección o selección con parte de la imagen para contextualizar).

Alcance del efecto:

Rango afectado: Sombras, tonos medios o puntos de luz.

Selección de píxeles por: Determina el canal en el cual se seleccionarán los píxeles donde se aplicará el efecto (H, S, V).

Rugosidad: Permite graduar el cambio aplicado (entre 0-1).

Ventana Avanzado: En la ventana emergente se puede definir con más precisión el rango al que se va a aplicar el cambio (se determina mediante unos deslizantes triangulares), la forma de la curva representa la importancia de los cambios aplicados (se modula con otro deslizante). La altura de la curva viene definida por la «rugosidad».

Efectos (ventanas): Al pulsar sobre las propiedades se abre un desplegable con las opciones. En cada una de ellas se mostrará la vista actual y otras miniaturas que muestran el resultado de aplicar el efecto. Para añadir el efecto, basta con pulsar sobre la imagen correspondiente; pulsaciones repetidas incrementarán el efecto.

Tono: Permite añadir un color (para sustraerlo hay que pulsar en el color complementario).

Saturación: Permite graduar la saturación.

Valor: Permite graduar la luminosidad.

Retinex (RGB + HSV)

Menú principal / Colores / Retinex.

Mejora la representación visual de una imagen cuando las condiciones de iluminación no son buenas. Además permite hacer visible información que quedaba oculta en las sombras de la imagen.

Diálogo emergente

Nivel: delimita el rango de variación de color e iluminación (HV) en las zonas en sombras.

Uniforme: Disminuye la oscuridad de las sombras (iguala la luminosidad con el resto de la imagen).

Bajo: Elimina las sombras (como si las iluminara un foco de luz directo).

Alta: Las sombras «retroceden» (se encoge el área de sombras).

Escala: Determina la profundidad del efecto.

Divisiones de escala: Un valor demasiado alto tiende a introducir ruido en la imagen.

Dinámico: Como el filtro tiende a aclarar la imagen, este deslizante permite ajustar la saturación para conseguir resultados óptimos.

Ajustes automáticos

Menú principal / Colores / Auto

Ecualizar (V): Realza automáticamente el contraste (se alisa el canal valor en el histograma). Es una herramienta muy potente, aunque el resultado varía dependiendo de la imagen.

Balance de blancos (RGB): Corrección automática del balance de blancos (sirve para ajustar las imágenes con blancos y negros pobres). Optimiza los colores separados por sus canales RGB, despreciando los valores extremos.

Estirar HSV (HSV): Amplía el contraste para que cubra el mayor rango posible, modificando cada propiedad por separado. A veces se consiguen efectos raros.

Normalizar (V): Amplía la luminosidad para que cubra todo el rango posible.

Realzar color (S): Amplía la saturación para que cubra el mayor rango posible.

Realzar el contraste (HSV): Amplía el contraste para que cubra el mayor rango posible (actúa simultáneamente sobre las 3 propiedades).

Otros ajustes de color

Herramienta Umbral (V) = blanco y negro

Menú principal / Colores / Umbral.

Diálogo emergente: ajustando el deslizante fijamos un umbral, lo que transforma la imagen a blanco y negro (mostrará en blanco lo que está dentro del umbral, y en negro el resto).

Diálogo de la herramienta: no tiene.

Herramienta Desaturar (V) = grises

Menú principal / Colores / Desaturar.

Se convierten todos los colores en tonos de gris, manteniendo el valor (V).

Diálogo emergente

El nivel de gris se puede calcular por tres métodos diferentes.

Claridad: Tiene en cuenta el valor (V) máximo y mínimo de los canales RGB.

Luminosidad: Se calcula por un porcentaje fijo diferente en cada canal RGB.

Media de brillo: Se realiza la media con el valor del píxel en cada canal RGB.

Diálogo de la herramienta: No tiene.

Herramientas Colorear (HSV) y Colorear (RGB) = monocromáticos

Menú principal / Colores / … Colorear y Colorear.

En inglés las herramientas se llaman «Colourise» (HSV) situada en la parte superior del menú y «Colourify» (RGB) situada en la parte inferior, que en la versión española han traducido en ambos casos por «Colorear».

Convierte la capa activa o selección en una imagen en escala de grises vista a través de un cristal coloreado.

Diálogo emergente (HSV)

Tono: se selecciona un color (H) mediante el deslizante.

Luminosidad: permite seleccionar el grado de luminosidad (V).

Saturación: permiten seleccionar la cantidad de color (S).

Diálogo emergente (RGB)

Colores: Se ofrecen los colores primarios (RGB), los complementarios (CMY) y el blanco.

Color personalizado: Abre el gestor de color, permitiendo elegir cualquier otro color.

Diálogos de las herramientas: no tienen.

Inversiones de color (RGB) o valor (V)

Invertir el color (Menú principal / Colores / Invertir): Invierte los colores (RGB).

Inversión de valor (Menú principal / Colores / Inversión de valor): Invierte el valor (V).

Herramienta Posterizar

Menú principal / Colores / Posterizar.

Esta herramienta reduce los colores de la capa activa a un n.º limitado de colores, manteniendo el parecido con las características de la capa original.

Diálogo emergente: permite seleccionar el n.º de «Niveles de posterización» (entre 2-256). Este n.º se aplica a cada canal de RGB, por lo que el n.º total de niveles es el n.º seleccionado elevado al cubo.

Diálogo de la herramienta: no tiene.

RGB máx

Menú principal / Colores / RGB máx.

Para cada píxel de la imagen, este filtro mantiene el canal RGB con la máxima (o mínima) intensidad, llevando los otros a 0.

Mantener los canales máximos.

Mantener los canales mínimos.

Colorear desde mapas

Menú principal / Colores / Mapa / …

Mapa de degradado: Este filtro aplica el degradado activo sobre la imagen, los extremos del degradado los define en función de los píxeles de color más oscuros y más claros de la imagen. Se accede desde: Menú principal / Colores / Mapas / Mapa de degradado.

Mapa de paleta: Este filtro colorea la imagen usando los colores de la paleta activa (la paleta activa se especifica en: Menú principal / Ventanas / Diálogos empotrables / Paletas). Los colores extremos de la paleta se aplican a los colores más oscuros y más claros de la imagen.

Mapa alienígena: Este filtro reinterpreta los colores aplicando funciones trigonométricas, lo que los modifica mucho. Se elige el espacio de color con el que se va a interactuar (RGB o HSV) y los canales que se van a visualizar. Con los deslizantes se van modificando los colores de sustitución.

Establecer mapa de colores = Set Colormap (solo aplicable a imágenes indexadas): permite cambiar el mapa de colores de la imagen por uno nuevo (se eligen los colores de una de las paletas disponibles desde el diálogo emergente).

Componentes del color

Menú principal / colores / Componentes / …

Este submenú nos ofrece varias posibilidades para trabajar con la imagen según sus canales en diferentes espacios de color (RGB, RGBA, CMY, CMYK, HSV, HSL, LAN, YCbCr).

Descomponer: Descompone la capa activa en los correspondientes canales del espacio de color seleccionado, que estarán en modo «Escala de grises» (8 bits). Según hayamos marcado o no la opción «Descomponer en capas», abrirá cada capa en un nuevo lienzo o todas las capas formando parte de una única imagen.

La opción «Color de frente como color de registro» está orientada para profesionales de la fotografía, de cara a la impresión de la imagen.

Componer (solo aplicable a imágenes en «Modo: Escala de grises»): A partir de varias capas , se «compone» una nueva imagen en el espacio de color que elegimos. En los desplegables de cada canal podemos modificar cual va a ser el canal de salida. Esto permite crear efectos de color interesantes, ya que no solo se puede cambiar el espacio de color, sino también intercambiar los canales de salida en un mismo espacio de color.

Recomponer: Reconstruye automáticamente una imagen desde sus componentes.

Mezclador de canales

Menú principal / Colores / Componentes / Mezclador de canales.

Permite combinar los valores de los canales RGB en un único canal. El canal de salida depende de lo que se quiera conseguir: El canal rojo ajusta bien las modificaciones de contraste, el canal verde se adapta bien a los cambios de detalles y el canal azul al ruido (a los cambios de grano).

Colorear desde muestra

Menú principal / Colores / Mapa / Colorear desde muestra.

Permite colorear una imagen (solo aplicable a imágenes RGB).

Para colorear una imagen que está en «Escala de grises» (8 bits), primero hay que modificar el «Modo» (Menú principal / Imagen / Modo / RGB).

Imagen origen: Es la imagen que queremos colorear (no se muestra en el diálogo emergente).

Imagen destino (izquierda): La imagen a colorear inicialmente se muestra en tonos de gris.

Con los deslizantes (o en las cajas de texto numérico) se fija la importancia de los tonos oscuros, medios y claros.

Mantener intensidad: La intensidad media de la luz de la imagen destino será la misma que la de la imagen origen. Si además se marca «Intensidad original», se preservará la intensidad de la imagen origen sin tener en cuenta la intensidad de la imagen destino.

Imagen muestra (derecha): Se selecciona la imagen de la que vamos a extraer los tonos con los que colorearemos la imagen destino (puede ser otra capa de nuestro trabajo, u otro lienzo, en cuyo caso tiene que estar abierto con GIMP para que aparezca en el desplegable).

Con los deslizantes (o en las cajas de texto numérico) seleccionamos el rango de degradado a aplicar.

Suavizar colores: Hace que las transiciones de color en el degradado sean más suaves cuando tiene pocos colores.

Usar subcolores: Mezcla los colores RGB de los píxeles con el mismo valor (V) antes de aplicarlo (si no está marcada, se aplica el color dominante).

Obtener colores de muestra: Extrae de la imagen muestra el gradiente de color que aplicaremos sobre la imagen destino (el gradiente se puede ver debajo de la imagen muestra).

Rotar colores

Menú principal / Colores / Mapa / Rotar colores.

Permite cambiar un rango de color por otro. El diálogo emergente muestra dos secciones:

Pestaña de «Opciones principales»: en las ruedas cromáticas se ajusta el rango de color que queremos modificar («Desde») y el que lo va a sustituir («Hasta»).

Pestaña de «Opciones de gris»: En el círculo cromático se desplaza el punto que representa al gris para seleccionar la tonalidad que lo va a sustituir.

Según la opción que se escoge en «Modo de gris» se determina si el color seleccionado es el que sustituye a los tonos de gris («Tratar como este») o se si se le aplica la misma rotación determinada en la pestaña original para el resto de colores («Cambiar a este»).

Umbral de gris: Especifica el grado de saturación por debajo del cual se considerará gris.

Intercambio de color

Menú principal / Colorear / Mapa / Intercambio de color.

Permite sustituir un color por otro. Se seleccionan los colores de origen y de destino (bien ajustando los deslizantes, o pulsando en el área de color para abrir el gestor de colores). El umbral determinará el n.º de píxeles se verán afectados (si marca la opción de «Bloquear umbrales», se mueven los 3 simultáneamente).

Efectos especiales

Fusiones

Las fusiones («Modo») permiten cambios complejos en el color.

Modos de herramientas de pintura (diálogo de la herramienta): Se fusiona el trazo de color (dibujo, relleno, etc) con la capa sobre la que se aplica.

Modos de capa (pestaña de Capas): Se fusiona la capa sobre la que se aplican con la capa inmediatamente inferior, con efecto acumulativo (si la capa inferior ya tenía un modo de capa aplicado, el actual se aplica sobre el conjunto).

Se pueden usar la capa superior como si fuera una máscara para crear un efecto en la capa inferior.

En el desplegable de los modos se observa que están agrupados. Esto se debe a que muchos tienen efectos similares, aunque dependiendo de la imagen puede haber diferencias importantes. Los modos se generan mediante fórmulas matemáticas aplicadas a los píxeles en posición equivalente de las dos partes implicadas, elemento superior + elemento inferior (capa superior + capa inferior / pintura + capa), lo que puede llevar a que en algunos casos, si hay valores extremos (blanco o negro), no tiene efecto visible sobre el píxel o se vuelve completamente blanco o negro.

La mejor manera es probar las opciones del grupo, y quedarnos con la que mejor se adapte a nuestro propósito.

Normal

No hay fusión de colores (solo se ve el elemento inferior si el superior tiene transparencias).

Capas con canal alfa

Disolver:

Las herramientas de pintura crean un patrón de píxeles aleatorios transparentes en el trazo de pintura, lo que permite ver la capa.

Cuando se aplica el modo «disolver» a una capa, se crea un patrón aleatorio en los píxeles transparentes o semitransparentes de la capa superior (los píxeles opacos no se modifican).

Detrás (solo herramientas de pintura): Aplica el color solo a áreas transparentes o semitransparentes, aumentando la opacidad. No tiene ningún efecto sobre zonas opacas

Borrar color (solo herramientas de pintura), en capas con canal alfa: reemplaza el color seleccionado por píxeles transparentes.

Aclaran el color

Oscurecen el color

Solapar imágenes

Modifican el color (HSV)

Tono: adquiere el tono del elemento superior y la saturación del inferior.

Saturación: Adquiere la saturación (S) del elemento superior y el tono (H) del inferior.

Color: Adquiere el tono y saturación (HS) del elemento superior y el valor (V) del inferior.

Valor: Adquiere el valor (V) del elemento superior, y el tono y saturación (HS) del inferior.

Efectos especiales

Diferencia: Toma el valor absoluto de la diferencia de valores (V).

Sustraer: En elemento inferior, resta los valores (V) del elemento superior.

Extraer / Combinar granulado: eliminan o añaden grano al elemento.

Dividir: Se generan imágenes muy claras, que a veces parecen incluso quemadas.

Enfocar y difuminar

Los efectos de «enfoque» deben aplicarse siempre al final, para evitar deshacerlos con otros retoques.

Herramienta de Difuminar / Perfilar

Es una herramienta de dibujo (se usa en «pinceladas» difuminando o perfilando la imagen a su paso.

Difuminar: se utiliza para suavizar elementos de la imagen que resaltan mucho.

Perfilar: incrementa el contraste donde se aplica el pincel. Si se aplica en exceso producirá ruido.

Diálogo de la herramienta

Tasa: ajusta la intensidad del efecto.

Tipo de convolución: utilizando un algoritmo matemático se convierten los píxeles vecinos para que se parezcan / diferencien de los del trazo, de forma que se difumine / enfoque la imagen por donde pasa el pincel.

Desenfoques gaussianos

Menú principal / Filtros / Difuminar / …

Desenfoque gaussiano

Desenfoca cada píxel en función del radio establecido (con el icono de la cadena, se define si es proporcionado o no). El método de desenfoque es indiferente en cuanto al resultado, pero sí determina la velocidad con que se procesa la imagen:

IIR: trabaja mejor con radios grandes y con imágenes que no fueron generadas por ordenador.

RLE: funciona mejor para imágenes generadas por ordenador o aquellas con grandes áreas de color de intensidad constante.

Desenfoque gaussiano selectivo

Se aplica cuando la diferencia entre el valor (V) del píxel y los adyacentes es inferior a «Delta máx», la magnitud del desenfoque se determina por el «Radio de desenfoque». Los contrastes se conservan, desenfocando el fondo y añadiendo sensación de profundidad.

Desenfoques de movimientos

Menú principal / Filtros / Difuminar / Desenfoque de movimiento.

El desenfoque crea un efecto de movimiento (lineal, radial o de acercamiento).

Cada uno de estos movimientos se pueden ajustar con los parámetros de longitud ± ángulo.

«Desenfoque central» (para desenfoque radial o de acercamiento): se definen las coordenadas (x,y) del origen del desenfoque.

Máscara de desenfoque (= enfocar)

Menú principal / Filtros / Realzar / Máscara de desenfoque.

Es el rey de los filtros de enfoque.

Enfoca los bordes de los elementos sin incrementar el ruido o las imperfecciones. Para prevenir la distorsión de color se recomienda descomponer la imagen en HSV y trabajar con la capa V (valor), luego volver a componer la imagen (Menú principal / Colores / Componentes).

Radio: determina el n.º de píxeles de cada lado del borde que se ven afectados por el enfoque (las imágenes de alta resolución permiten usar radios más altos).

Cantidad: indica la fuerza del enfoque.

Umbral: determina la diferencia mínima de tono que tiene que existir para aplicar el enfoque (se protegen de esta forma las áreas de transición tonal evitando la creación de imperfecciones).

Otros formas de desenfocar

Menú principal / Filtros / Difuminar / …

Desenfocar: produce un efecto similar a una cámara con el objetivo mal enfocado. Su efecto es apenas perceptible en imágenes grandes, y demasiado fuerte en imágenes pequeñas.

Pixelizar: representa la imagen usando grandes bloques de color. Se puede definir el tamaño de los pseudo-píxeles.

Desenfoque enlosado («Tileable Blur»): además de desenfocar la imagen, mezcla los bordes.

Se usa a menudo para suavizar las uniones enlosadas en las imágenes utilizadas para patrones, para conseguir una unión de las losas más fluidas. En estos casos interesa desenfocar únicamente el borde del patrón, para lo cual:

Se duplica la capa para crear el borde (capa borde) y se le añade el canal alfa si no lo tuviera.

Se selecciona toda la capa, se transforma la selección en un borde y se invierte la selección, se difumina el borde de la selección y se presiona la tecla «Supr», con lo que nos queda únicamente el borde con los contornos difuminados.

Sobre la capa borde, aplicamos el filtro «Tileable Blur» (desenfoque enlosado).

Finalmente se fusionan la capa borde (superior) con la capa original (inferior) y ya tenemos la imagen del patrón.

Otros formas de realzar / enfocar

Menú principal / Filtros / Realzar / …

Son filtros que utilizan para compensar imperfecciones de la imagen o la falta de nitidez.

Filtro NL

Aplicable solo en capas SIN canal alfa. NO funciona sobre selecciones.

Es un filtro que combina varios efectos:

Media seccionada alfa: elimina el ruido del píxel, sin extenderlo ni manchar los detalles de la imagen.

Estimación óptima: aplica un filtro de suavizado adaptativo sobre la imagen.

Realce de bordes: debe aplicarse al final, o su efecto se deshará por el efecto de los otros dos.

Desparasitar

Elimina pequeños defectos debidos a polvo o rayas y también el efecto de muaré en una imagen escaneada de una revista. Se delimitan los valores extremos (blanco y negro) a partir de los cuales se considerará «ruido» a eliminar y se establece el radio de acción (si se marca «adaptativo» el radio tiene en cuenta el histograma de la región alrededor del píxel que analiza). Marcando «recursivo» el filtro se aplica por duplicado, con lo que tiene más fuerza.

Una aplicación indirecta de este filtro es que se puede utilizar para generar un efecto de pintura.

Antialias

Alisa los bordes transformando algunos píxeles en transparentes (similar a lo que se veía en la opción «Alisado» de las herramientas de selección).

Quitar ojos rojos

Se selecciona primero el contorno del iris (con selección elíptica), luego se aplica el filtro, especificando el «Umbral» (cantidad de color rojo a eliminar).

Enfocar

Acentúa los bordes. Mediante el deslizante de «Nitidez» se gradúa el efecto. Al incrementar la nitidez, puede incrementar las imperfecciones de la imagen.

Puede crear ruido extra en áreas de color gradual como el cielo o una superficie de agua.

Desentrelazar

En capturas de vídeo con movimiento las imágenes aparecen desenfocadas y estriadas, con objetos partidos (se debe a la superposición de dos imágenes en el mismo fotograma). Este filtro deja una sola imagen, y reemplaza los píxeles faltantes con un degradado entre los colores que los delimitan. Tiene la opción de mantener los campos pares o impares: se prueban ambos y se elige el que mejor resultado obtenga.

Quitar bandas

Se utiliza para quitar las bandas verticales producidas por algunos escáneres, añadiendo un patrón que interferirá con la imagen (si se consigue una configuración adecuada se consiguen quitar las bandas, pero en caso contrario se pueden crear artefactos extras). El deslizante y la caja de entrada permiten seleccionar la «fuerza» del filtro (2-100), casi nunca será necesario más de 60. Si después de una primera pasada las bandas persisten, se realiza una selección rectangular en el área y se aplica de nuevo el filtro.

Luces y sombras

Herramienta Marcar a fuego / Quemar

Utiliza el pincel activo para aclarar u oscurecer los colores de la imagen, por donde pasa el pincel. El efecto se aplica solo sobre algunos píxeles, dependiendo de su grado de iluminación.

Diálogo de la herramienta

Tipo: Blanquear / Oscurecer.

Rango: restringe el efecto de la herramienta a los píxeles de tonos oscuros (sombras), intermedios (tonos medios) o claros (puntos de luz).

Exposición: define la intensidad del efecto.

Efectos de iluminación

Menú principal / Filtros / Luces y sombras / Efectos de iluminación.

Este filtro permite crear efectos de iluminación complejos con varios focos de luz.

Pestaña «Luz»: se puede trabajar con hasta 6 focos de luz (luz1, luz2, etc).

Para cada uno de ellos se especifica el tipo de luz: focal (punto), direccional o ninguna (se apaga).

Además se escoge el color de la iluminación, la intensidad, la posición del foco de luz (Z determina la distancia a la fuente) y la dirección del foco de luz.

La opción «alisar» permite ocultar las otras fuentes de luz mientras se configura una de ellas.

Pestaña «Material»: aquí se determina cómo afecta la luz a los objetos (luz reflejada).

Incandescencia (representa la cantidad de color que se mostrará en las zonas no iluminadas).

Brillo (intensidad de la luz).

Lustre (como se comporta la luz).

Pulido (el grado de concentración del haz de luz).

Metálico (las superficies iluminadas parecen metálicas).

Pestaña «Mapa de relieve»: Permite dar relieve a la imagen iluminada. Las opciones son: activar el mapeo de relieve (las zonas luminosas se elevan, las oscuras se hunden), imagen del mapa de relieve (la luminosidad (V) de la imagen elegida actuará como un mapa de relieve), curva (el relieve se aplicará de forma lineal, logarítmica, sinusoidal o esférica) y la altura máxima (límite del relieve).

Otros efectos de luces

Menú principal / Filtros / Luces y sombras / …

Moteado

Añade motas utilizando los puntos más claros según el umbral determinado. Es difícil prever dónde aparecerán, pero se pueden forzar la localización poniendo puntos blancos en la imagen.

Motas:

Umbral de luminosidad (determina las áreas afectadas por el moteado).

Intensidad del destello (tamaño de la mancha central y rayos).

Longitud de las puntas (distancia que alcanzan los rayos).

Puntos de las puntas (n.º de rayos).

Ángulo de las puntas (angulación entre el 1º rayo y la horizontal).

Densidad de las puntas (n.º de motas que aparecerán en la imagen).

Color y luminosidad de la mota: transparencia, tono aleatorio, saturación aleatoria, conservar la luminosidad.

Destello de lente

Crea un único destello como si pegara el sol de frente al sacar una fotografía. El efecto no se puede graduar, solo se puede definir el punto de aplicación.

Destello con degradado

Se genera un haz de luz con un halo y radiaciones alrededor de la fuente.

Pestaña «Configuración»: Se ajustan las coordenadas del origen (también se puede hacer con el ratón sobre la previsualización) y los parámetros del haz de luz:

Radio (alcance del efecto).

Rotación (dirección del halo).

Rotación de tono (cambia el color de la luz).

Ángulo y longitud del vector (para los destellos secundarios).

Permite mejorar el cálculo mediante un supermuestreo adaptativo (la profundidad limita la amplitud del muestreo, y el umbral especifica un rango por encima del cual se realiza un nuevo muestreo para conseguir mejor calidad).

Pestaña «Selector»: Permite elegir un patrón de destello, también permite crear y modificar patrones personalizados.

Supernova

Crea el efecto de una estrella grande que recuerda a una supernova. Se determina el origen («Centro de la nova»), el color y radio de la estrella central, el n.º de rayos y si el color de los mismos varía (tono aleatorio).

Sombras

Menú principal / Filtros / Luces y sombras / …

Sombra base

Añade una sombra base a la selección activa o a la imagen. Se seleccionan las opciones: radio de desenfoque, color y opacidad. La sombra se añade con fondo transparente. Si afecta a toda la imagen, puede ser necesario redimensionarla («Permitir redimensionado») para hacer la sombra visible.

Perspectiva

Añade una capa por debajo de la capa activa donde genera una sombra en perspectiva de la región seleccionada. Se determina el ángulo (respecto a la horizontal), la distancia al horizonte, la longitud, el radio de desenfoque, el color y la opacidad. «Interpolación» aplica diferentes fórmulas matemáticas para evitar bordes dentados y cambios de color en la sombra («lineal» suele dar buenos resultados, si no, es cuestión de probar con las otras alternativas).

Como se crea una capa extra para la sombra, también se puede retocar manualmente el resultado.

Efecto Xach

Aplicable a una selección (de cualquier tipo).

Añade un sutil efecto 3D translúcido a la región seleccionada, como si colocáramos un cristal encima de la imagen. Se selecciona el color y la opacidad del cristal («brillo») y su desplazamiento. Por otro lado se definen las características de la «sombra» que genera el cristal: color, opacidad, radio de desenfoque y desplazamiento.

Distorsiones

Herramienta Emborronar

Es una herramienta de dibujo (usa el pincel activo). Al pasar el pincel se van tomando los colores que se encuentran dentro del trazo y los mezcla con los colores próximos.

Diálogo de la herramienta

Bordes duros: Elimina el degradado del borde del pincel.

Tasa: Ajusta la intensidad del efecto de emborronar.

IWarp

Menú principal / Filtros / Distorsiones / IWarp.

Este filtro permite deformar interactivamente partes seleccionadas de la imagen, aplicándolo a la imagen con pinceladas. Las opciones incluyen: desplazar, agrandar, encoger y crear un remolino (la opción «remover» elimina el efecto al pasar el pincel sobre la zona deformada).

Se define el «Radio de deformación» y la «Cantidad de deformación» (importancia de la deformación).

La opción «bilineal» suaviza el efecto de la deformación.

Supermuestreo adaptativo: Mejora los resultados mediante cálculos matemáticos, que se condicionan a los valores de «Profundidad máxima» y «Umbral» (la profundidad limita la amplitud del muestreo, y el umbral especifica un rango por encima del cual se realiza un nuevo muestreo para conseguir mejor calidad).

Doblar según curva

Menú principal / Filtros / Distorsiones / Doblar según curva.

Se crea una o dos curvas que delimitan un área (se llaman superior e inferior y van de un extremo al otro en paralelo). Modificando el aspecto de las curvas, la imagen se distorsiona para adaptarse.

Se puede cambiar la dirección de la línea con el parámetro «Rotar»: 0 para límites inferior y superior, 90 para derecha e izquierda, etc.).

El aspecto de la curva se modifica mediante anclas (similar a lo que se hace en la herramienta de Curvas de ajuste del color). Además hay una serie de botones que interaccionan con las curvas:

Copiar: Copia la curva ya creada como modelo para la otra curva (superior / inferior).

Reflejar: Usando como molde la curva copiada, la invierte para que sea un «reflejo».

Intercambiar: Convierte la curva superior en inferior y viceversa.

Para que los bordes no sean dentados, marcar suavizado y antialias.

También permite que la modificación se genere en una nueva capa en lugar de la capa original («Trabajar con una copia»).

Coordenadas polares

Menú principal / Filtros / Distorsiones / Coordenadas polares.

Se genera una distorsión que puede adoptar dos formas.

Marcando «a polares»: La imagen se distorsiona para conseguir que el borde derecho e izquierdo se cierren formando un radio de la imagen. El resultado final puede ser desde circular a rectangular en función de la «Profundidad circular» elegida.

Desmarcando «a polares»: Se desdobla un radio de la imagen, y estiran ambos bordes para convertirlos en los laterales de la imagen.

Otros efectos de distorsión

Menú principal / Filtros / Distorsiones / …

Página doblada

Se elige la equina y la orientación, luego el color del doblez.

Repujado

Estampa y esculpe la imagen, dándole relieve. Las áreas claras se alzan y las oscuras se hunden. Se puede regular la iluminación («azimut») y la elevación. El relieve puede ser en color («Mapa de relieve») o en escala de grises («Repujado»).

Mosaico

Se generan polígonos, ligeramente elevados y separados por juntas, dando el aspecto de un mosaico. Se puede especificar la forma de las piezas, y varias características más. En el lateral aparecen otra serie de opciones: alisado de los bordes, ponderación del color, permitir la división del mosaico (divide los mosaicos en áreas con muchos colores para una mejor graduación y detalle en esas zonas), superficie con hoyos (el mosaico parece picado), iluminación.

Ondular

Crea ondulaciones que recuerdan un reflejo en agua agitada. Para evitar la pérdida de datos en los bordes, hay una serie de opciones de relleno: Ajustar (rellena con lo que se salen del borde contrario), manchar (estira los px. vecinos), vacío (sustituye por negro).

Ondas

Se generan ondas concéntricas, como en una superficie de agua al caer una piedra. Se ajustan: amplitud (grado de giro de la imagen en cada onda), fase (relieve de la onda) y longitud de onda (distancia entre las ondas). Los píxeles que se pierden en el borde se rellenan con una de estas opciones: manchar (estira los px. vecinos), vacío (sustituye por negro). La opción «reflexivo» implica que las ondas «regresan» interfiriendo con las que van.

Remolino y aspiración

Tiene las siguientes opciones de ajuste:

Ángulo del remolino: Determina el grado de giro de remolino.

Cantidad de pellizcos: Indica el grado de aspiración (se «chupa» o se «empuja» la imagen desde atrás). Pueden adoptar valores negativos o positivos, lo que determina la dirección del efecto.

El radio implica la cantidad de imagen que se ve afectada por la distorsión.

Al ser una imagen con distribución radial, el efecto de aspiración no es muy evidente, por lo que se ha añadido un rectángulo rojo antes de aplicar el efecto.

Distorsión de lente

Simular (o corrige) el efecto de distorsión de una lente. Se ajustan los siguientes parámetros:

Principal (la convexidad positiva o negativa a aplicar).

Borde (indica si los bordes adoptan la deformación o no).

Ampliación (grado de aumento de la lente).

Aclarar (ilumina u oscurece el borde).

Desplazamiento X / Y (perspectiva que adopta la lente).

Aplicar lente

Una parte de la imagen se representa como si se viera a través de una lente esférica. Se elige la convergencia de la lente («índice de refracción»), y se especifica cómo se tratará el área de la imagen que queda fuera de la lente (se mantiene, se pasa a color de frente, o se vuelve transparente).

Viento

Crea un desenfoque de movimiento, representando líneas negras y blancas finas, que desenfocan los bordes de la imagen.

Con «Umbral» y «Fuerza» se determina la gradación del efecto.

Las opciones de «Viento» y «Ráfaga» se diferencian en el grosor de las líneas que se crean.

Hay que definir además de donde parte el efecto, si delante de los objetos, detrás o en ambos.

Desplazamiento

Mueve toda la fila de píxeles (horizontal o verticalmente) a una distancia aleatoria dentro de los límites fijados.

Propagar valor

Esparce píxeles de los bordes de color que difieren en una manera específica de sus píxeles adyacentes. Hay varias opciones que crean efectos diferentes.

En este ejemplo se ha utilizado la opción «Más negro». El efecto se aplica a toda la imagen, aunque se ha señalado el área donde destaca más.

Persiana

Genera un efecto de persianas con listones horizontales o verticales. Se puede regular la apertura y el n.º de listones.

Grabado

La imagen se vuelve blanca y negra y se dibujan líneas horizontales dependiendo de los píxeles subyacentes, creando un efecto similar al de los grabados de los libros antiguos y de las monedas.

Borrar las otras filas («Erase every other row»)

Borra líneas de la imagen en horizontal o vertical, o las cambia de color. Si la capa tiene canal alfa, las líneas serán transparentes, dejando ver la capa inferior.

Video

Simula una pantalla RGB de baja resolución. Hay diversos patrones para escoger. El resultado se puede superponer o no a la imagen original (aditivo) y rotar.

Papel de periódico

Hace un fotograbado de la imagen usando un motivo de puntos agrupados, sacrificando la resolución a favor de una mayor profundidad tonal. Los parámetros fundamentales son: el tamaño de la celda, la extracción del negro, el espacio de color y la forma de los puntos.

Bordes

Menú principal / Filtros / Detectar bordes / …

Diferencia de gaussianos (solo aplicable a capas sin canal alfa): obtiene los bordes de una imagen mediante desenfoques gaussianos y sustracciones. Se suelen obtener mejores resultados cuando el radio 2 es inferior al radio 1, pero no siempre (hay que probar). «Normalizar» mejora el contraste e «Invertir» invierte el resultado.

Arista: detecta los bordes creando efectos interesantes, sobre fondo negro.

Laplace: produce bordes finos de un píxel de ancho, sobre un fondo transparente.

Neón: detecta los bordes dándoles un aspecto de neón.

Sobel: detecta los bordes horizontales y verticales separadamente sobre una imagen en escala de grises, el resultado es una imagen con los bordes en negro, fondo transparente y algún resto de color.

Mapas

Menú principal / Filtros / Mapas / ….

Mapa de relieve

Crea efectos 3D: Realza una imagen (el molde) y la mapea en otra imagen. Se elige la imagen que servirá de molde (mapa de relieve) y se elige el tipo (lineal, sinusoidal o esférico). Los colores claros van a producir relieve y los oscuros depresiones (se puede invertir el efecto con «invertir el mapa de relieve»). El mapeo tiende a oscurecer la imagen, lo que se puede evitar marcando «compensar para oscurecer» (una mala traducción no se ajusta al original (compensate for darkening), que debería ser: «compensar el oscurecimiento»).

Se ajustan los diferentes controles hasta obtener los efectos deseados (se verán en la pantalla de previsualización):

Azimut (dirección de la luz).

Profundidad y elevación (de los tonos oscuros y claros respectivamente).

Desplazamiento (posición del mapa sobre nuestra imagen).

Nivel del mar (controla el color de las áreas transparentes para que no aparezcan oscuras).

Ambiental (determina la intensidad de la luz ambiente).

Otros mapas

Traza fractal: Se mapea la imagen al fractal.

Mapear objeto: Mapea una imagen a un objeto (plano, esfera, caja o cilindro).

Espejismo: Crea muchas copias de la imagen, parcialmente estampadas, recortadas y con transparencias, poniéndolas alrededor de la imagen (se asimila a un caleidoscopio).

Enlosado de papel: Corta la imagen en muchas piezas, con forma cuadrada, y las desliza parcialmente solapándolas o separándolas.

Deformar: Desplaza los píxeles de la imagen según la pendiente del degradado en el «mapa de desplazamiento». Se puede utilizar otra imagen como mapa, pero tiene que tener exactamente la misma medida que la capa (o selección) a la que se está aplicando.

Desplazamiento: El desplazamiento de los píxeles de la imagen está determinado por el «Grado de desplazamiento» multiplicado por el valor (V) del «Mapa de desplazamiento». Para cada eje, se puede elegir un «Mapa de desplazamiento» diferente (debe ser una imagen en «Modo: Escala de gris» exactamente del mismo tamaño que la imagen sobre la que se aplica, se podría utilizar por ejemplo un degradado). Se pueden crear interesantes efectos de distorsión.

Modo de desplazamiento: Cartesiano (los píxeles se desplazan en dirección X o Y) o polar (desplazamiento¡ radial o tangencial de los píxeles).

Comportamiento del borde (para evitar pérdida de información): Ajustar (se rellena con lo que sale por el borde contrario), manchar (estira los px. adyacentes) o negro (rellena con el color negro).

Enlosar y Baldosas pequeñas: Reduce la imagen y enlosa con ella la imagen («Baldosas pequeñas» utiliza la imagen original, mientras que «Enlosar» genera un nuevo lienzo).

Crear sin costuras: Crea un enlosado de la imagen sin bordes internos.

Ruido

Menú principal / Filtros / Ruido / …

Estos filtros añaden ruido (grano) a la imagen.

HSV: utiliza la tonalidad (H), saturación (S) y valor (V) para generar el ruido. El deslizante «Soltura» controla la variación de color permitida en el nuevo píxel respecto al original, lo que regula el impacto del efecto.

RGB: utiliza los canales R, G, B y alfa para generar el ruido.

Escoger: sustituye el valor (V) del píxel afectado el de uno de los ocho vecinos, de forma aleatoria.

Manchar: produce un efecto de derretir la imagen.

Esparcir: intercambia cada píxel con otro elegido de forma aleatoria en las proximidades (definido por el parámetro «esparcimiento»). No genera un nuevo color, ni tiene efecto sobre zonas de color plano. Su efecto es máximo sobre las transiciones de color.

Lanzar: cambia cada píxel afectado a un color aleatorio.

Artísticos

Menú principal / Filtros / Artísticos / …

Son filtros que aplican efectos artísticos a la imagen.

GIMPresionista

Es el principal de los filtros artísticos. Tiene varias pestañas de opciones.

Preajustes: Permite guardar los diseños que se creen con GIMPresionista para un uso futuro, y cargar los ya guardados. Tiene muchas opciones ya predefinidas.

Papel: Permite «confeccionar» el tipo de lienzo que vamos a aplicar a la imagen.

Pincel: Permite seleccionar el tipo de pincel con el que vamos a «pintar» la imagen.

Orientación: Se selecciona la orientación de las pinceladas, permitiendo variación entre ellas para asimilarlo a una pintura real.

Tamaño: Se seleccionan los tamaños de pincel a utilizar.

Posicionamiento: Se selecciona como se van a distribuir las pinceladas.

Color: Permite elegir el color que se va a utilizar (el del píxel central o un promedio del área que abarca el pincel) y la posibilidad de introducir «ruido» en las pinceladas para que parezcan menos homogéneas.

General: Permite definir cómo será el fondo y el relieve de las pinceladas.

Decorativos

Menú principal / Filtros / Decorativos / …

Crean bordes decorativos, y algunos añaden algún efecto bonito a la imagen.

Bisel.

Borde.

Manchas de café.

Difuminar borde.

Efecto foto antigua.

Esquinas redondeadas.

Diapositiva.

Esculpido troquelado.

Cromado troquelado.

Logotipos

Menú principal / Filtros / Alfa a logotipo.

Añaden efectos especiales a los píxeles transparentes o semitransparentes.

Herramienta GEGL («Generic Graphical Library»)

Es una librería para el procesamiento de la imagen basada en gráficos, diseñada para manejar varias tareas del procesamiento de la imagen necesarias en GIMP. Hay múltiples operaciones que se pueden realizar: desde rellenar con un color sólido («Color»), hasta producir patrones complejos con fractales («Fractal Explorer»). Se pueden conseguir efectos muy interesantes.

Es una herramienta EN FASE EXPERIMENTAL (aún en desarrollo), por lo que algunas operaciones no funcionan o puede verse modificadas en versiones futuras. Algunas operaciones provocan fallos inesperados en GIMP que fuerzan su cierre.

NOTA: Antes de utilizar esta herramienta, guarda tu trabajo para evitar perder el trabajo previo en caso de cierre inesperado del programa.

Diálogo emergente

Operación: Se selecciona la operación a realizar y dónde se aplica (si no se especifica, se aplicará a la capa activa).

Ajustes de la operación: Permite adaptar la operación seleccionada mediante opciones específicas.

Escribiendo con GIMP

Herramienta de Texto

Al seleccionar esta herramienta y pulsar sobre cualquier parte de la imagen, se abre un cuadro de texto para escribir y un editor de texto emergente sobre el mismo. En el momento en que se introduce la primera letra, se genera automáticamente una capa de texto.

Esta capa permite todo tipo de manipulaciones posteriores, convirtiéndose en una capa normal (las únicas herramientas de acción que no la transforman son «mover» y «alienar»).

Es posible volver a editar el texto con posterioridad, pero se perderán todos los demás cambios realizados.

Diálogo de la herramienta

Permite ajustes globales del texto (afecta a todo el texto de la capa).

Fuente tipográfica: Se elige la fuente a utilizar entre las disponibles, bien en el desplegable, o bien escribiendo el nombre.

Tamaño de texto: Permite definir el tamaño el texto y en qué unidades (habitualmente utilizaremos px. al igual que en otras herramientas de GIMP).

Editor de texto: Abre una ventana de edición externa para editar el texto superponible al «Editor de texto emergente», que permite aplicar cambios específicos a parte del texto (sin tener que afectar necesariamente a todo el texto de la capa). Además se añade la posibilidad de escribir de derecha a izquierda, lo que puede ser útil para escribir en determinados alfabetos, o importar texto desde un documento.

Alisado: Suaviza los bordes y las curvas de las letras con un suave desenfoque (usar con precaución si no se trabaja en RGB).

Hinting: Es un índice de ajuste que modificar los caracteres para producir letras claras cuando el tamaño tipográfico es pequeño.

Color: Para elegir el color del texto.

Justificar: Permite alinear a la derecha / izquierda, centrar o justificar el texto en la caja de texto.

Ajustes de texto:

Sangrado de la 1.º línea.

Espacio entre líneas (interlineado): El n.º indica cuántos px. se suman o se restan al valor establecido por defecto (por lo tanto, puede ser un valor negativo).

Espaciado entre caracteres (kerning): Ídem.

Dinámica / Fija: La caja de texto se adapta al texto según se va escribiendo («dinámica», configuración por defecto). Si la adaptamos manualmente con el ratón, pasa a «fija».

Idioma: Es importante seleccionar el idioma en que se va a escribir, porque el renderizado del texto (generar la imagen desde el modelo de la fuente) depende de ello.

Menú contextual del cuadro de texto

Pulsando el botón derecho del ratón sobre el cuadro de texto (en el lienzo) nos permite opciones adicionales.

Cortar, copiar, pegar (desde el portapapeles), eliminar: actúan sobre el texto seleccionado.

Limpiar: elimina todo el texto (aunque no esté seleccionado).

Efectos especiales de texto

Editor del texto emergente

Permite ajustes concretos para caracteres del texto (sin afectar al resto del texto). Se selecciona la parte del texto sobre la que se van a aplicar los cambios:

Cambio de fuente tipografía (se comienza a escribir el nombre de la fuente deseada y en el desplegable que se abre se elige la deseada).

Cambio de tamaño.

Cambio de interlineado respecto al resto del texto y /o de kerning.

Cambio tipográfico: negrita, cursiva, subrayado, tachado.

Cambio de color.

Seleccionando un texto

Al tratarse de una capa de texto, los únicos píxeles de color son los del texto, por lo que automáticamente quedan seleccionadas las letras: Menú contextual de la capa Texto (pulsando con el botón derecho del ratón sobre la miniatura de la capa) / Alfa a selección.

Esto permite aplicar al texto cambios de color, patrones, transparencias, filtros y cualquier otra herramienta que se aplique en selecciones.

También es posible generar un borde creando una nueva capa, agrandando la selección y pintando del color deseado. Luego se reordena esa capa para que quede por debajo de la capa de texto inicial.

Se puede crear una sombra duplicando la capa y pintando el texto e otro color, luego se reordena la capa para que quede por debajo de la capa de texto inicial, y se la desplaza para hacerla visible. Si se desea, se puede utilizar un filtro de desenfoque (desenfoque gaussiano por ejemplo) para difuminar la sombra.

Rediseñando el texto

Ruta desde texto (Menú contextual de la capa Texto / Ruta desde el texto): cada letra se bordeará con un componente de ruta (curva de Bézier), lo que permite modificar las anclas y segmentos correspondientes para modificar la forma de las letras. Para hacer visible la ruta, hay que ir a la pestaña de Rutas y activar su visibilidad (el ojo).

Filtro IWarp (Menú principal / Filtros / Deformaciones / IWarp).

Cualquier otro filtro de distorsión.

Desplazamiento del texto

Texto siguiendo una ruta (Menú contextual de la capa Texto (pulsando el botón derecho del ratón sobre la miniatura de la capa de texto)/Texto siguiendo a ruta): con una ruta ya diseñada y activa que sirve de guía, al escoger esta opción se crea una nueva ruta en la que cada letra del texto es una curva de Bézier (por lo tanto modificable como en el caso anterior), con la peculiaridad de que la línea de texto se adapta a la línea de la ruta guía.

Filtro Doblar según curva (Menú principal / Filtros / Distorsiones / Doblar según curva).

Filtro Desplazar (Menú principal / Filtros / Mapas / Desplazar): utilizando por ejemplo un degradado como «mapa de desplazamiento».

Logotipos

Menú principal / Archivo / Crear / Logotipos.

Se selecciona el script deseado. En la ventana emergente introducimos el texto que va a servir de base del logotipo. Una vez completadas las opciones, aceptamos y nos abre una nueva imagen (lienzo) con el logotipo. Esta imagen la podemos copiar en el portapapeles, y pegar como capa en nuestro proyecto, para adaptarla a nuestras necesidades.

Pincel de texto

Menú principal / Archivo / Crear / Nuevo pincel desde texto («New brush from text»).

Se selecciona el texto, el tamaño y la fuente tipográfica. Se genera automáticamente un pincel dinámico que en cada toque irá colocando una de las letras del texto. Se puede modificar el espaciado para que las letras queden más o menos juntas.

Casos prácticos

Foto de autor para la web

Una vez que hemos encontrado por la red una foto del autor, la abrimos con GIMP.

Pulsamos sobre el icono de la herramienta de «selección rectangular», y entre las opciones del diálogo, señalamos «Modo» único, y «Fijo: Proporción de aspecto, 2:3». Luego sobre la imagen del autor seleccionamos el área. Para recortar: Menú principal / Imagen / Recortar a selección. Esto mismo se puede realizar directamente con la herramienta de Recortar.

Redimensionamos la imagen a 200×300 px. (Menú principal / Imagen / Escalar imagen).

Si la imagen tiene poca calidad, se puede retocar:

Para enfocar: Menú principal / Filtros / Enfoque / Máscara de desenfoque.

Ajustes de color: Menú principal / Colores / Curvas.

Modificar el fondo: Con las herramientas de selección, se selecciona bien el primer plano y luego invertir, o bien el fondo directamente. Luego se aplican otras herramientas según nos interese (clonar, sanear, pincel, degradados, desenfoque gaussiano, limpiar, etc.).

Arreglar una portada

Una vez que disponemos de una portada, realizamos ajustes de tamaño, color y contraste, le quitamos el logo y arreglamos cualquier desperfecto que presente para intentar que la calidad sea óptima.

Imágenes que no son buenas candidatas

Las imágenes pequeñas: Al agrandarlas para cumplir con el estándar se verán pixeladas.

Las imágenes borrosas: Aunque se puede mejorar el enfoque, los resultados dependen de la habilidad que se tenga en el retoque de imágenes. Si no se dispone de otra imagen de mejor calidad, se puede utilizar como fondo de la portada, pero rehaciendo el texto, de forma que parezca que la falta de nitidez es voluntaria.

Las imágenes muy deterioradas: Requiere mucho tiempo conseguir corregir las imperfecciones y los resultados son variables.

Las imágenes distorsionadas, con mucha perspectiva o difíciles de ajustar al tamaño deseado (por ejemplo cuando la imagen está muy pegada a los bordes y no se puede recortar).

En nuestro ejemplo, vamos a retocar una imagen de Las mil y una noches. Elegimos esta, que tiene casi todo lo que hemos comentado que se debe evitar: ideal para nuestros propósitos de enseñanza.

Primero de todo es aconsejable añadirle un canal alfa a la capa (la única que tenemos en este momento). Se podría hacer más adelante si necesitamos jugar con transparencias, pero como en muchas ocasiones trabajaremos con duplicados de la capa, así que haciéndolo al principio ahorramos trabajo.

Ajustes de perspectiva, redimensionado y alineación:

Con la herramienta de «selección rectangular», creamos un área de selección que incluya toda la portada. Lo ajustamos lo más posible en la parte más ancha de la misma. En la parte superior dejamos un pequeño margen extra para compensar la perspectiva que tiene. Luego recortamos a la selección (Menú principal / Imagen / Recortar a la selección).

Con la herramienta de «Perspectiva», marcando la opción «Correctivo» en el diálogo de la herramienta, ajustamos los 4 ángulos a los de la portada y pulsamos la tecla «Enter». Anclamos la selección flotante resultante a la capa original.

Redimensionamos la imagen (Menú principal / Imagen / Redimensionar imagen). Al introducir uno de los parámetros, se modifica el otro, lo que nos permite decidir cual vamos a utilizar como referencia. En este caso si utilizamos el alto (900), el ancho superaría el estándar (600) y habría que recortar parte de la imagen o distorsionarla para ajustarla. Como el texto está al borde izquierdo, y la imagen pegada al borde derecho, no tenemos margen de maniobra, así que ajustamos el ancho a 600.

Como nuestra imagen no tiene la altura estándar, ampliamos el lienzo (Menú principal / Imagen / Ajustar tamaño del lienzo), con la cadena separada fijamos el alto en 900 px., y se mantiene el ancho en 600.

Con la herramienta «Mover» (seleccionando «Mover capa activa» en las opciones del diálogo), pulsamos con el cursor sobre el lienzo. Movemos la imagen hasta que visualmente quede equilibrada (en este caso solo es necesario en la vertical). Nos podemos ayudar de la herramienta de alineación, de las reglas y guías.

Arreglar los bordes:

Creamos una nueva capa transparente, que colocamos debajo de la portada (capa fondo).

Para rellenar el borde superior:

Creamos una selección rectangular que abarque la parte superior de esa capa, excediendo los bordes.

Pulsando sobre el color de frente, se abre el «gestor de color». Con el «cuentagotas», seleccionamos sobre la imagen un píxel de color oscuro cerca del borde superior de la imagen.

Con la herramienta de «Relleno» (y la capa fondo activa), pulsamos sobre la imagen. Como teníamos una selección limitando el espacio, el color solo rellena ese área.

Para rellenar el borde inferior: Realizamos el mismo proceso seleccionando un píxel de color cercano al borde inferior.

Fusionamos la imagen con la capa fondo.

Para conseguir dar textura a los bordes recién creados, usamos la herramienta «sanear»: seleccionamos el área del cielo de la izquierda superior, y vamos saneando el borde creado para que no se note la transición. Incluso nos «clona» alguna estrella, lo que le da más realismo. Repetimos el proceso en el borde inferior.

Se subsana cualquier otro desperfecto de la imagen con las herramientas de «clonar» y «sanear». Corregimos la esquina superior derecha. Igualmente quitamos la macha blanca que hay en el centro, y en la medida de lo posible borramos las «líneas» del lateral izquierdo de la imagen. En las zonas delicadas (cerca del título, por ejemplo) creamos un área de selección en la zona a corregir, para evitar que si se nos va el pincel modifiquemos por error las letras.

Hay que tener cuidado con la herramienta de sanear, porque aunque con el truco de la selección no vamos a modificar el exterior, cuando el pincel incluye un área de contraste de color (por ejemplo el borde de una letra), ese color lo toma como referencia para el resultado, lo que nos emborrona la imagen en vez de mejorarla.

Últimos ajustes:

Enfocamos un poco la imagen (Menú principal / Filtros / Enfoque / Máscara de desenfoque, con los parámetros 2.0, y 0.5).

Ajustemos el color: con la herramienta «Curvas», primero modificamos las anclas que lo delimitan para mostrar más detalles y hacer la imagen más luminosa. Le damos a aceptar y la abrimos de nuevo la herramienta, modificando ahora la curva para que adquiera una forma de S, lo que le añade contraste (se podría hacer en el paso anterior sobre la línea redefinida, pero de esta forma es más fácil mantener las referencias y controlar el efecto).

Como el resultado aún no me convence (en las letras sobre todo), duplicamos la capa (capa copia). Aplicamos de nuevo el filtro de máscara de desenfoque, con más potencia (5.0 y 0.5), y de nuevo las curvas intentando definir aún más las letras. Le aplicamos un poco de transparencia regulando la opacidad de la capa, para que se fusione con la anterior. Las letras mejoran, pero se oscurece la parte superior.

Para compensar la parte superior, añadimos una máscara de capa blanca (opaca) a la capa copia. Utilizamos luego sobre la máscara un degradado en negro en la parte superior. Al aplicarse el efecto de la máscara sobre la capa, la parte superior la capa copia será transparente, con una transición suave hacia la opacidad siguiendo el degradado de la máscara.

Añadimos el logo de EPL y guardamos la imagen como «jpg» no progresivo.

Pese a las mejoras conseguidas, la portada sigue siendo visualmente la misma, por lo que NO se puede considerar un «Retoque de portada».

Diseñar una portada

Un diseño de una portada es crear una portada nueva, que no existe previamente. Utilizamos imágenes que encontramos en la red, escogemos una tipografía, decidimos la distribución, y cualquier otro aspecto gráfico de la portada.

Hemos elegido una imagen para empezar, que tiene un tamaño adecuado (casi 600 px. de ancho), aunque es un poco corta. Nos viene bien, porque es fácil de fusionar con un fondo blanco, y permite espacio para el título.

Abrimos la imagen con GIMP. Añadimos el canal alfa y la redimensionamos para que el ancho sea exacto. Redimensionamos el lienzo para que se adapte al estándar (600×900 px.) y centramos la imagen al gusto.

Creamos una nueva capa fondo blanca que colocamos por debajo de la imagen. Con ello vemos que contrastan los bordes de la imagen con el fondo. Para corregirlo, sobre la capa de la imagen (capa activa), podemos aplicar el borrador con un borde difuminado (pincel activo), de gran tamaño, y pasarlo por el borde para eliminar parcialmente la imagen. También podemos utilizar un degradado hacia el transparente, o de nuevo una máscara de capa como hicimos en el arreglo de la portada anterior. Cuando el resultado es el que buscamos, fusionamos ambas capas.

Buscamos ahora una fuente tipográfica que tenga aires árabes y la añadimos como recurso externo a GIMP. Refrescamos las fuentes para tenerla disponible. Con la herramienta «Texto», elegimos la nueva fuente y elegimos el tamaño de la letra (por ejemplo 50 px.). Pulsamos sobre el lienzo para escribir el título. Queda un poco soso, porque la fuente utilizada no diferencia entre mayúsculas y minúsculas, así que seleccionamos algunas letras y les modificamos el tamaño desde el «editor de texto emergente».

Añadimos el logo de EPL y ya tenemos una bonita portada.

¿Qué sería un retoque de una portada?

Son cambios introducidos en una portada ya existente.

Partiendo de la que hemos creado hace un momento, vamos a retocarla.

Invertimos el color de la imagen (Menú principal / Colores / Invertir), consiguiendo un interesante efecto de negativo. Hacemos lo propio con el título (capa de texto) para que se vea.

Con la capa de la imagen activa, aplicamos el filtro artístico «brillo suave» (Menú principal / Filtros / Artístico / Brillo suave).

Seleccionamos el color negro (con la herramienta de «selección por color») y con la herramienta «lápiz» a gran tamaño, pintamos de un color gris oscuro todo menos lo que se ve a través de la ventana.

Pasamos ahora a la capa de texto, y aplicamos una distorsión con el filtro «doblar según curva» (Menú principal / Filtros / Distorsiones / Doblar según curva). Luego movemos la capa hasta que el título quede en la posición deseada.

Ya solo falta añadir el logo de EPL para completar nuestra segunda portada…

Procesamiento de imágenes por lotes en GIMP

El Procesamiento por lotes (Batch) consiste en ejecutar una o varias operaciones a la vez sobre un grupo más o menos numeroso de imágenes.

Vamos a utilizar el complemento DBP (David’s Batch Processor) para GIMP, que se puede descargar en:

http://members.ozemail.com.au/~hodsond/dbp.html

Para instalarlo se copia el archivo dpb.exe en la carpeta de complementos como se describe en el apartado de instalación de un complemento.

Ajustar parámetros de Salida en GIMP

Antes de iniciar el complemento se deben ajustar los parámetros de salida en GIMP en «Archivo/Exportar». En el formulario que aparece presionar botón «Exportar» y se muestra este otro:

Expandiendo «Opciones avanzadas».

Las imágenes no deben ser progresivas y para ello se marca la casilla «Optimizar».

Para borrar los metadatos deben desmarcarse las casillas: «Guardar los datos EXIF» y «Guardar los datos XMP».

Después presionar botón «Guardar predet».

Inicio y opciones del complemento DBP

Una vez instalado, en el Menú Filtros seleccionar «Batch Process». Se mostrará un formulario con diversas pestañas que iremos explicando:

La pestaña «Input» permite añadir los archivos a procesar mediante el botón «Add Files».

En caso de querer modificar los tamaños horizontal/vertical se establece en la pestaña «Resize». Por defecto está establecido 1.00, es decir sin cambios. Si se marca la casilla «Enable» hay dos opciones:

Relative: especifica una modificación relativa en porcentaje que se marcará mediante los cursores situados más abajo. Si la casilla «Keep Aspect» está marcada se mantendrá la relación de aspecto ancho-alto del original.

Absolute: permite especificar un tamaño fijo en píxeles.

La pestaña «Rename» se utiliza para especificar donde se guardará los archivos resultantes. DBO no sobreescribe nunca las imágenes originales. Si se guardan en la misma carpeta de las originales («Source Dir») deberá indicarse prefijo o sufijo para el nombre de archivo. Si se guarda en otra carpeta deberá indicarse mediante el botón «Select Dir».

La pestaña «Output» permite establecer otros parámetros de salida de las imágenes. El más importante es el tipo de formato que se establece en «Format» (JPG u otros). También la calidad fijada en «Quality». Por defecto la calidad es 0,75 que obtiene una relación calidad/peso de la imagen bastante aceptable para un ePub.

Esta pestaña también permite evitar que las imágenes sean Progresivas, aunque ya lo habíamos prefijado en los parámetros de salida de GIMP.

Una vez fijado los parámetros que deseamos aplicar a nuestro grupo de imágenes solo hay que presionar el botón «Start».

Ejemplos

Seleccionando los parámetros adecuados explicados anteriormente se puede conseguir diversos tipos de procesamiento por lotes:

Reducir todas las imágenes escaneadas, que suelen ser bastantes grandes, a un tamaño proporcional para todas ellas utilizando la pestaña «Resize».

Cambiar el formato de todas las imágenes mediante Format de la pestaña «Output».

Eliminar los metadatos de todo un grupo de imágenes. Se puede usar solo para este caso, pero al haber marcado al principio en GIMP este tipo de salida, cualquier transformación en una imagen no contendrá metadatos.

GRÁFICOS SVG

Creación de SVG

Introducción a SVG

SVG, acrónimo de Scalable Vector Graphics (Gráficos Vectoriales Escalables), es un estándar que define un lenguaje basado en XML para describir gráficos vectoriales en dos dimensiones. En estos momentos la especificación SVG está en la versión 1.1, que es la que soportan la mayor parte de los dispositivos de lectura, si bien se espera que SVG 2 se convierta pronto en Recomendación.

El nombre SVG se debe fundamentalmente a:

Scalable: Los gráficos SVG pueden ser mostrados con diferentes resoluciones.

Vector: Los gráficos tienen formato vectorial (líneas y curvas), frente a los formatos raster (matriz de puntos) que almacenan información por cada píxel del gráfico.

Graphics: Proporciona la sintaxis para describir gráficos usando XML.

La particularidad inherente a los gráficos vectoriales es que el mismo gráfico es independiente del tamaño y resolución con que se muestre, de forma que al modificar sus dimensiones (ampliarlo o reducirlo) aparece siempre uniforme en la pantalla sin pérdida de calidad (ni pixela ni pierde nitidez), al contrario de lo que ocurre con los formatos de mapa de bits.

SVG permite la utilización de tres tipos de objetos gráficos:

Objetos gráficos vectoriales (líneas y curvas).

Imágenes.

Texto.

A continuación, se muestran algunas de las ventajas que presenta el uso de SVG en lo que respecta al formato ePub:

Por lo general, el tamaño de los SVG es reducido.

Produce gráficos escalables, que pueden aumentar o disminuir de tamaño sin pérdida de calidad, lo que los hace adaptarse sin problemas a cualquier resolución de pantalla.

Al ser un formato de gráficos vectoriales, los gráficos resultan editables, y admiten curvas Bézier, transparencias, suavizados, etc. También son capaces de incluir, si es preciso, bitmaps.

La calidad del color es muy buena, manejando 24 bits de profundidad, pudiendo además usarse en su definición cualquiera de los sistemas estándar, como RGB.

Pueden mostrarse de forma progresiva (igual que los GIF), no teniendo que esperar a que todo el documento sea cargado.

Es posible incluir textos editables y admite las fuentes escalables más comunes, como TrueType o Type 1.

El código que genera el fichero SVG no es binario, sino que es simple texto plano, por lo que puede ser editado y modificado con cualquier editor de textos.

Soporta hojas de estilos CSS, permitiendo con ello definir con exactitud el formato de presentación que van a tener los elementos del gráfico.

Al ser el código interno de un fichero SVG código en texto plano, lo único que hace falta para crear un gráfico en este formato es un editor de textos, aunque es necesario tener conocimientos del lenguaje XML y de la propia sintaxis SVG.

Por ello, para crear y manipular de forma rápida y práctica este tipo de archivos, se puede recurrir al empleo de cualquier aplicación que trabaje de forma nativa con SVG. En los apartados siguientes se muestra el uso de dos de las herramientas más usuales, como son CorelDraw e Inkscape.

CorelDraw

CorelDraw es un programa de creación y manipulación de imágenes. Con él, podemos crear archivos de diversos formatos, entre ellos el SVG.

Pasamos a explicar algunas nociones básicas sobre su uso.

La versión utilizada para este tutorial es la X7 con el espacio de trabajo definido como «Classic». Tenemos varias opciones de visualización, tal y como aparece en la imagen. En cualquier momento podremos cambiarlo en Ventanas → Espacio de trabajo.

Después, se debe configurar un documento nuevo y nos aparecerá un menú como el de la imagen siguiente. Es importante seleccionar el color RGB para evitar errores posteriormente. Debería quedar algo similar a esto:

Y… ¡Ya estamos listos para empezar a trabajar!

Podemos dividir en tres partes el espacio de trabajo, de esta manera:

Parte 1. Podemos elegir el tamaño del papel. Es recomendable no superar las dimensiones de un A4, por lo que, lo más fácil, es dejarlo por defecto y más tarde ajustar el papel a la imagen, que deberá ser más pequeña.

En esta parte, también encontramos los menús a los que iremos haciendo referencia siempre. Si tenemos más de un archivo abierto, también será este el lugar donde aparecerán las diferentes pestañas.

Parte 2. Es el espacio para las herramientas de dibujo. Más adelante explicaremos las más útiles para la creación de imágenes sencillas.

Parte 3. Aquí podremos encontrar por defecto las ventanas acoplables para editar las opciones del dibujo o texto que elijamos. Por defecto, con esta plantilla, nos aparece la paleta de color a la derecha, aunque se puede mover de lugar.

Para elegir ventanas acoplables nos dirigimos a Ventanas → Ventanas acoplables → (Propiedades de objeto y Administrador de objetos). Estas dos las utilizaremos muy a menudo. Para realizar dibujos con caracteres especiales debemos irnos a Ventanas → Ventanas acoplables → Texto → Insertar caracteres.

Para elegir paletas de colores nos dirigimos a Ventanas → Paletas de colores → RGB predeterminada. Así los colores que usemos ya serán RGB y nos evitaremos un error al exportar el archivo. Podemos eliminar entonces la paleta que venía por defecto, que ya nos sobra.

Con todo esto, ya tenemos el espacio de trabajo listo para empezar a dibujar nuestra imagen.

Existen dos formas de trabajar, dependiendo de la imagen de la que partamos y lo que queramos conseguir. Primero veremos cómo vectorizar una imagen y luego procederemos a crear una desde el principio.

Pueden combinarse perfectamente dependiendo del caso, pero, en esta ocasión, lo haremos por separado.

Vectorizar una imagen

Con esta herramienta podemos vectorizar cualquier imagen. Esto quiere decir que podemos convertir una imagen jgp, png, etc. en líneas. Es un proceso similar al OCR y podremos manipular la imagen como deseemos.

No es muy recomendable utilizarla para todo, ya que genera muchas líneas y nodos innecesarios, por lo que incrementa el peso considerablemente. Cuanta más definición queramos conseguir, más peso. Es útil para pequeños dibujos, logos o algunos símbolos que son complicados de realizar a mano o que no merece la pena el trabajo que conllevaría hacerlo así.

En muchas ocasiones podremos combinar una imagen vectorizada con otros tipos de curvas y textos, como podemos ver en el ejemplo siguiente:

Lo primero que debemos hacer es introducir la imagen con la que queramos trabajar. Pinchamos sobre ella y pulsando el botón derecho del ratón nos aparecerá el menú que vemos en la parte superior:

Como podemos ver, tenemos tres formas para vectorizar. Es cuestión de probar cada una y ver cuál se ajusta más a nuestra situación en cada momento. Lo habitual es «Vectorizar por contorno». De momento, seleccionamos cualquier opción y veremos que nos aparece una ventana similar a esta:

Vamos haciendo los ajustes necesarios para obtener la mejor calidad. En la parte superior siempre podremos ir cambiando el tipo de imagen y veremos cómo cambian los colores y cantidades de líneas y nodos de la imagen. Como ya hemos comentado, esto nos influirá en el peso total de la imagen vectorizada.

Una vez consigamos la imagen que queremos, podemos manipularla y eliminar algunas zonas que no deseemos, limpiarla o ajustarla. Solo tenemos que seleccionar la imagen y, en la parte superior, como indica la flecha, presionar en «Desagrupar objetos».

En este caso, lo mejor sería eliminar el texto, que no queda definido, e introducirlo de nuevo como veremos posteriormente.

Crear una imagen

Lo normal, para los casos que nos vamos a encontrar, es partir de una imagen en cualquier formato y volver a dibujarla en Corel desde el principio. Tendremos que introducir de nuevo los símbolos, curvas y textos que aparezcan.

Añadimos la imagen al programa y, una vez ahí, le cambiamos el tamaño antes de comenzar. Lo recomendable es no superar las dimensiones de un A4, puesto que se ha notado que afecta a su correcta visualización en algunos lectores. Si no hacemos esto al principio y, posteriormente, tenemos que ajustar la imagen, tendremos que modificar el tamaño del texto.

Ajusta el tamaño de papel a la imagen que desees, posteriormente, al exportar la imagen, ese será el tamaño que se adopte.

Introducir texto. Para incluir el texto debemos ir a la parte izquierda, al punto 1, y pulsar sobre la «A». A continuación, creamos una ventana y escribimos ahí el texto a insertar.

En los puntos 2 y 3 se puede elegir el tamaño y tipo de la fuente y, también, darle todas las propiedades que desees. Para introducir subíndices o superíndices, entre otras cosas, debes acudir al lugar señalado en el punto 4.

Dependiendo del tipo de letra elegido, el interlineado será mayor o menor. Puedes ajustarlo en la parte de «Párrafo» y manipular los porcentajes como convenga.

Por ejemplo, lo más sencillo sería abrir una ventana de texto por cada línea en una tabla. Así podemos ajustarlo con facilidad al resultado que queramos conseguir.

Introducir símbolos. Si el texto contiene letras griegas, símbolos matemáticos u otro tipo de símbolos, debemos sacar una ventana acoplable para facilitar la tarea, tal y como se explicó anteriormente. Simplemente, elige la fuente que desees e inserta el carácter.

Introducir líneas o curvas. Para introducir líneas, figuras o curvas hay varias posibilidades. Las más usuales las puedes encontrar en los puntos 2 y 3. Si dejas pulsado, saldrá un menú desplegable con varias opciones. Lo más sencillo es utilizar «Línea de dos puntos» para hacer líneas simples y «Curva de tres puntos» para cualquier curva. Si quieres que la línea sea recta, créala mientras pulsas «Ctrl».

En los puntos 4, 5 y 6 puedes manipular las características de las curvas añadiendo flechas a los extremos, convirtiéndolas en líneas punteadas o discontinuas, cambiando el grosor y color, entre otras cosas. El punto 1 lo utilizaremos si queremos recortar algún tramo.

Corel, y otros programas vectoriales, funciona con «nodos». Puedes modificar cualquier curva moviendo sus nodos. Si pulsas sobre una línea o curva dos veces, verás que puedes moverla, deformarla o lo que necesites. También se pueden crear nuevos nodos de ser necesario. Esto es útil para las curvas porque así podremos ajustarlas de forma más precisa.

Si se pincha dos veces sobre una línea, se pueden modificar los nodos y, si ahora pinchas dos veces en alguna parte de la línea, se creará un nuevo nodo. Cuando se crea una curva, solo aparecen dos nodos, los de inicio y fin. Para poder modificarla bien, se puede crear un nodo a mitad de la curva y jugar con las flechas de los nodos para cambiar su curvatura. De esta manera, podrían crearse las llaves, combinando con la simetría, por ejemplo.

Líneas punteadas, discontinuas y otros tipos de líneas. Este tipo de líneas no se visualizan bien en algunos dispositivos. Para su correcto visionado, hay que señalarlas e ir a Objeto → Convertir contorno en objeto. Con ello, verás que han dejado de ser líneas, para ser objetos individuales. Lo mismo sería necesario hacer con las flechas.

Colores, degradados y transparencias.

Colores. Es posible el uso de colores, siempre recordando que sean RGB. Para asignar un color, lo podemos hacer con las opciones que aparecen dentro de cada figura o pulsando sobre la paleta de color que se acopló anteriormente.

Si seleccionamos un rectángulo, o cualquier otro objeto, y pulsamos con el botón derecho del ratón sobre la paleta de colores, es una forma rápida de asignar el color elegido al contorno del objeto seleccionado.

Si pulsamos con el botón izquierdo del ratón, asignaremos el color elegido al relleno.

Degradados. No utilizar ningún tipo de degradado. Está totalmente desaconsejado. Dan errores muy aleatorios, unas veces se ven y otras no. Con el mínimo cambio, comienzan a desaparecer otros elementos y fallan en algunos dispositivos. No utilizar degradados.

Transparencias. Para crear transparencias lo primero es asignar al elemento un color. Una vez asignado vamos al punto 1, «Herramienta transparencia» y en el punto 2 elegimos la primera opción «Transparencia uniforme». El resto queda descartado ya que se tratarían de degradados. Para manipular la opacidad podemos hacerlo donde señala el punto 3.

Exportar como SVG

Antes de exportar nuestra imagen en SVG debemos valorar la cantidad de texto y de imágenes que vamos a necesitar al final.

Si las imágenes contienen muy poco texto y son similares a pequeños esquemas, bocetos, dibujos explicativos o tablas reducidas y puntuales entonces lo mejor es convertir el texto en curva y exportarlo como curva como explicaremos a continuación.

Si las imágenes necesitan gran cantidad de texto y hay bastantes en el ePub debemos contemplar la opción de dejar el texto como texto por lo que al final habría que incrustar o referenciar la fuente en el archivo SVG para la correcta visualización en todos los dispositivos. Esto reduciría muchísimo el peso de los SVG pero habría que valorar también el peso de la fuente elegida.

En este último caso podemos optar por incrustar la fuente en cada SVG, solo los caracteres necesarios, o bien referenciar en el SVG la fuente utilizada, como una fuente incrustada normal de un ePub. Según las pruebas que se han realizado, la primera opción puede dar problemas en algunos dispositivos, y es mejor la opción de referenciar la fuente en el archivo. Así se puede usar una única fuente reutilizable para varios SVG en un mismo ePub.

Los archivos SVG individuales NUNCA DEBEN SUPERAR LOS 300 Kb, dado que el código interno de un fichero SVG es texto plano en lenguaje XML. Hay que valorar en cada caso las primeras dos opciones anteriores.

Para exportar nuestra imagen vamos a Archivo → Exportar → svg y verás la pantalla de esta imagen:

Es importante que la configuración esté como en la imagen, sobre todo, la de arriba:

Compatibilidad: SVG 1.1.

Método: UTF-8.

Opciones de: Atributos de presentación.

La configuración del documento hay que dejarla como está por defecto. Como vemos, podemos señalar la opción de texto o curva.

Si hemos optado por dejar el texto como tal e incrustar en el ePub la misma fuente utilizada para crear el SVG, debemos marcar como «Texto», sin más, y ya estaría listo.

Si en cambio queremos exportarlo como curva, antes de llegar a este punto debemos modificar el texto que hayamos dibujado. Le damos a cancelar para poder manipular la imagen con la que trabajábamos. Seleccionamos todo el texto (nos podemos ayudar con la ventana acoplable «Administrador de objetos»). Una vez hayamos seleccionado todo el texto nos dirigimos a Objeto → Convertir a curvas. Antes de hacer este cambio guardar el archivo ya que ahora no podremos editar el texto en un futuro si lo necesitamos porque pasará a convertirse en curva y relleno.

Una vez tengamos esto realizado volvemos a exportar y esta vez marcamos la opción de «Curva».

Lo de exportar como mapa de bits, en principio, no afecta a nada, ya que no exportamos mapa de bits en ningún momento. Si combinamos el SVG con alguna imagen debemos seleccionar el formato que le damos y marcar la opción «Enlazar imagen». También nos exportará un jpg o png (lo que hayamos elegido) que habrá que incorporarlo al ePub.

Posibles errores

Identificadores ID repetidos. Si estamos trabajando con otra versión que no sea la X7, posiblemente los validadores de ePub siempre arrojen un error de ID repetido, o con formato erróneo. Para resolver esta situación, pueden eliminarse tranquilamente estos identificadores del archivo SVG, bien editando el fichero con un editor de texto, o haciéndolo desde el propio Sigil.

Color RGB. Si no usas color RGB nos saldrá un error a la hora de exportar marcando que hay un problema. Para solucionarlo, señala toda la imagen y pincha en el botón derecho, verás algo así:

Asegúrate de tener marcado RGB como aparece en la imagen y acepta. Ya no debe dar el error de color al exportar.

Inkscape

Inkscape es un editor de gráficos vectoriales en formato SVG que tiene como objeto proporcionar a los usuarios una herramienta de código abierto y multiplataforma para la elaboración de gráficos en formato vectorial escalable (SVG) que cumpla completamente con los estándares XML, SVG y CSS2.

Las características de SVG soportadas incluyen formas básicas, trayectorias, texto, transformaciones, gradientes de color, transparencias, edición de nodos, exportación de SVG a PNG, vectorización de mapa de bits, agrupación de elementos, etc.

A continuación se comentan algunas nociones básicas para su uso. La versión utilizada para este pequeño tutorial es la 0.91.

El espacio de trabajo por defecto será similar al que se muestra en la imagen superior. Las opciones para configurar un documento nuevo se pueden encontrar en Archivo → Propiedades del documento. Se utiliza esta opción fundamentalmente para elegir las dimensiones del formato. No se recomienda superar el tamaño de un A4, ya que se han detectado posibles errores de visualización en algunos dispositivos. El aspecto de este cuadro de opciones debería ser similar al que muestra la siguiente imagen.

También se puede optar por utilizar las dimensiones que vienen por defecto, y una vez creado el gráfico SVG, ajustar la página al contenido. Para ello, en el recuadro Tamaño personalizado se abre el desplegable Ajustar página a contenido y se selecciona el comando Ajustar página a dibujo o selección, que redimensiona la página para que se ajuste a la parte que se haya seleccionado o al dibujo completo si no hay selección.

El espacio de trabajo se puede dividir en tres partes principales:

Parte 1. Esta barra vertical se denomina Caja de herramientas y muestra las opciones de dibujo y selección de Inkscape. Conforme se vayan utilizando estas herramientas de dibujo, aparecerá en la parte superior de la ventana de la aplicación la correspondiente Barra de control de herramientas, con comandos y controles detallados para cada una de ellas.

Parte 2. En la parte superior de la ventana se encuentra situada la Barra de menús, que contiene los menús desplegables más importantes. Bajo ella se sitúa la Barra de control de herramientas a la que se hacía mención en el punto anterior, que cambia en función del elemento de dibujo que se esté utilizando, y que contiene los controles que son especiales para cada herramienta. Más adelante se realiza una descripción de las herramientas que resultan de mayor utilidad en la creación de imágenes sencillas.

Parte 3. A la derecha de la interfaz de trabajo se sitúan dos barras verticales de herramientas. La Barra de comandos es la que se encuentra situada a la izquierda, con los botones de control general (Abrir, Guardar, Copiar, Zoom…). A su derecha se sitúa la Barra de control de ajustes, que contiene unas herramientas destinadas a conseguir precisión en la colocación de los elementos gráficos, con opciones relativas al posicionamiento y comportamiento de los nodos y objetos. Se puede cambiar la ubicación de estas barras de herramientas recurriendo al menú Ver. Así por ejemplo, seleccionando Ver → Predeterminada, la Barra de comandos se situará en su posición más habitual, bajo la Barra de menús.

También es el lugar donde aparecen por defecto las ventanas acoplables para editar las opciones del gráfico o texto que se seleccione. El acceso a estas ventanas se realiza desde las opciones localizadas en los distintos menús desplegables, como por ejemplo: Texto → Texto y Tipografía; Texto → Glifos; Objeto → Relleno y borde; Trayecto → Vectorizar mapa de bits; etc. Algunas de estas ventanas acoplables se pueden llamar desde la Barra de comandos. Si no aparecen porque están ocultas por falta de espacio, se puede acceder a ellas haciendo clic sobre la flecha hacia la derecha (») situada en la parte inferior de la barra.

En la parte inferior de la ventana de la aplicación se encuentra situada la Paleta de colores. Los colores se pueden arrastrar desde la paleta hasta los objetos para cambiar el color de su Relleno. Si se mantiene presionada la tecla «Mayús.» al arrastrar un color, cambiará el color del Borde del objeto. El color usado por algunas herramientas se puede elegir haciendo clic sobre una de las muestras de color. La paleta se puede cambiar haciendo clic sobre la flecha que se encuentra en el extremo derecho de la paleta. El programa incluye muchas paletas predefinidas. Si el número de muestras de color de una paleta excede el espacio disponible, se puede usar la barra de desplazamiento situada debajo de la paleta para acceder a las muestras de color ocultas. Una vez aplicados los colores, haciendo clic en el color de relleno o en el color de trazo que aparece seleccionado en la Barra de estado, se abre una pequeña ventana acoplable («Relleno y borde»), y ahí habrá que marcar la opción de RGB. Es muy importante para evitar luego errores.

Bajo la Paleta de colores, se encuentra la Barra de estado, un lugar utilizado por Inkscape para situar los mensajes de interacción con el usuario, mostrando información sobre lo que se está haciendo y consejos según el elemento seleccionado. También permite establecer ciertas propiedades de los objetos y opciones del programa.

Con estas nociones básicas sobre el espacio de trabajo, ya se puede empezar a dibujar.

Existen dos formas de trabajar, dependiendo de la imagen de la que se parta y de lo que se quiera conseguir. En primer lugar se va a ver el procedimiento a seguir para vectorizar una imagen, y posteriormente se procederá a crear una desde el principio. Ambas formas pueden combinarse perfectamente a la hora de crear un gráfico; dependerá de cada caso, si bien en esta ocasión se realiza por separado.

Vectorizar una imagen

Con esta herramienta se puede vectorizar cualquier imagen de mapa de bits. Esto quiere decir que se puede convertir una imagen jgp, png, etc. en líneas. Es un proceso similar al OCR y se puede manipular la imagen a voluntad.

No es muy recomendable utilizarla para todo, ya que genera muchas líneas y nodos innecesarios, incrementando con ello considerablemente el peso del archivo. Cuanta más definición se quiera conseguir, mayor será el tamaño del archivo. Es útil para pequeños dibujos, logos o algunos símbolos que son complicados de realizar a mano (o cuando no merece la pena el trabajo que conllevaría hacerlo así).

En muchas ocasiones se puede combinar una imagen vectorizada con otros tipos de curvas y textos, como ocurre en el ejemplo que se muestra a continuación.

Lo primero que se debe hacer es importar la imagen con la que se quiera trabajar mediante la opción Archivo → Importar. Una vez situada la imagen en el área de trabajo, se selecciona pinchando sobre ella y pulsando el botón derecho del ratón se accede al menú que se muestra en la siguiente imagen:

Como se puede observar, aparece la opción «Vectorizar mapa de bits» (también se puede acceder a ella desde el menú Trayecto → Vectorizar mapa de bits). Al seleccionar esta opción aparece un cuadro de diálogo muy parecido al de la imagen inferior:

Llegados a este punto, se van realizando los ajustes necesarios para obtener la mejor calidad. Siempre hay que asegurarse de tener seleccionada la imagen; si no fuera así, los cambios no se aplicarían. Dependiendo del caso, será recomendable una opción u otra, pero las más comunes serían estas dos: «Corte de luminosidad» y «Pasos de luminosidad». Habrá que ir jugando con los distintos parámetros para conseguir el mejor resultado posible, y se debe tener mucho cuidado con el peso de la imagen en este proceso, ya que cuanto más parecido sea el resultado a la imagen original, más pesará el archivo al contar con un mayor número de curvas y nodos. Hay que equilibrar calidad y peso a base de pruebas (el tamaño máximo de un archivo svg no debe superar los 300 Kb).

Una vez conseguido el resultado deseado, se puede manipular la imagen para eliminar aquellas zonas que no interesen, o para limpiarla o ajustarla. Solo hay que pinchar dos veces sobre la imagen y observar cómo aparecen todos los nodos y líneas de los que se compone.

En caso de existir un texto, lo mejor sería eliminarlo, ya que no va a quedar bien definido, e introducirlo de nuevo como se muestra posteriormente.

Crear una imagen

Lo normal, para los casos que se encuentran más habitualmente, es partir de una imagen en cualquier formato y volver a dibujarla desde el principio, para lo que habrá que introducir de nuevo los símbolos, curvas y textos que aparezcan.

Para ello, en primer lugar se importa la imagen al programa y, una vez en el área de trabajo, se cambia el tamaño de esta antes de comenzar a trabajar (tal y como se explicó al hablar del espacio de trabajo). Lo recomendable es no superar las dimensiones de un A4. Si no se realiza este paso al principio y, posteriormente, se tiene que ajustar la imagen, habrá que modificar también el tamaño del texto.

Al ajustar el tamaño de papel a la imagen deseada, este será también el tamaño que adopte el SVG cuando se exporte.

Introducir texto. Para incluir el texto habrá que ir a la Caja de herramientas situada en la parte izquierda del espacio de trabajo y pulsar sobre la Herramienta Texto «A» (punto 1). A continuación, se pincha en la parte de la imagen donde se quiere insertar y se escribe ahí el texto.

En la Barra de control de herramientas que aparecerá (punto 2) se puede elegir el tamaño y el tipo de fuente, así como modificar las características de los distintos controles disponibles. Para ampliar las opciones se puede acudir a la Barra de comandos situada a la derecha del espacio de trabajo y pulsar sobre la herramienta «T», tal y como se indica en el punto 3, tras lo que aparecerá la ventana acoplable Texto y tipografía.

Dependiendo del tipo de letra elegido, el interlineado será mayor o menor. Se puede ajustar dentro de estas nuevas opciones y manipular los porcentajes a conveniencia.

Por ejemplo, lo más sencillo sería abrir un cuadro de texto por cada fila en una tabla. Así se podrá ajustar con facilidad al resultado que se pretenda conseguir.

Hay dos formas de añadir texto en un dibujo de Inkscape.

Texto normal:

Para añadir texto normal en un documento de Inkscape, hay que hacer clic con la Herramienta Texto en el punto del gráfico donde se quiere que comience el texto. Entonces Inkscape pasa al modo de funcionamiento de introducción de texto, lo que se indica por la aparición de un cursor (en forma de barra vertical intermitente) cuya posición señala el lugar donde empezará el texto que se va a añadir. Para introducir el texto, solo hay que comenzar a teclearlo. El texto añadido puede aparecer en varias líneas introduciendo manualmente los saltos de línea correspondientes. La caja que contiene el texto irá aumentando de tamaño conforme se vaya añadiendo texto.

Texto fluido:

Para añadir texto fluido, con la Herramienta Texto hay que hacer clic y arrastrar el cursor sobre la parte de la imagen donde se vaya a insertar, para crear un caja rectangular azul que va a contener el texto que se va a introducir. Después de dibujar esta caja, se puede comenzar a añadir el texto mediante el teclado. Cuando el texto alcanza el lado derecho de la caja, el salto de línea se realiza automáticamente. Se puede aumentar el tamaño de la caja o variar las proporciones de la misma arrastrando del tirador situado en la esquina inferior derecha de la caja con la Herramienta Texto.

El objeto de texto fluido incluye tanto el texto introducido, como la caja que lo contiene, y por lo tanto ambos se mueven y transforman de forma conjunta.

Se recomienda utilizar la opción de texto normal para no tener posteriormente problemas con los validadores de ePub. El texto fluido fue un proyecto preliminar dentro del borrador del estándar SVG 1.2, borrador que no fue adoptado finalmente. Al no pertenecer a la Recomendación SVG 1.1, siempre que aparece los validadores arrojan un error, y pudiera ocurrir que no se visualizara correctamente en los lectores. Para evitar este tipo de problemas, lo mejor es convertir el texto fluido en un objeto de texto normal antes de guardar el dibujo.

Introducir símbolos. Si el texto contiene letras griegas, símbolos matemáticos u otro tipo de caracteres, para poder incluirlos hay dos posibles opciones que facilitan la tarea. Si tras haber pulsado la herramienta «T» está visible la ventana acoplable Texto y tipografía, se puede señalar el comando [Glifos] que aparece dentro de la misma, tal y como se puede observar en la captura que se muestra más abajo. La otra opción consiste en utilizar el menú Texto → Glifos, tras lo cual aparecerá a la derecha del área de trabajo la ventana acoplable Glifos. Al seleccionar la fuente que se esté utilizando, se mostrarán los símbolos disponibles de cada una de ellas. Simplemente, hay que elegir la fuente deseada e insertar el carácter.

Por defecto, al añadir un texto a un gráfico de la forma en que se acaba de comentar, este no se visualizará una vez que el dibujo se exporte a SVG. Aunque al abrir el archivo SVG en Inkscape sí que se muestra, en cualquier dispositivo de lectura o navegador no lo hará. Para lograr que se visualice, previamente habrá que seleccionar el texto y, o bien convertirlo a curva, o bien convertirlo a texto. En el primer caso se utilizará el menú Trayecto → Objeto a trayecto (antes de hacer este cambio es conveniente guardar una copia del archivo original, ya que tras la conversión no se podrá editar el texto para por ejemplo cambiar la tipografía, dado que se ha convertido en un trazo); en el segundo, el menú Texto → Convertir a texto. La diferencia entre ambas opciones se explica con posterioridad en el apartado Exportar como SVG.

Introducir líneas o curvas. Para introducir líneas, figuras o curvas hay varias posibilidades dentro de la Caja de herramientas. Las más usuales son las herramientas que se muestran en los puntos 1 (crea rectángulos y cuadrados), 2 (crea círculos, elipses y arcos) y 3 (dibuja curvas Bézier y segmentos de recta) de la siguiente figura. Al seleccionar cada una de estas herramientas, aparecerá su correspondiente Barra de control de herramientas en la parte superior de la ventana de la aplicación, desde donde se puede seleccionar más específicamente la opción a representar. Por ejemplo, al seleccionar la herramienta «Dibujar curvas Bézier y líneas rectas» (punto 3), en la correspondiente barra de control se puede seleccionar el modo de dibujo, a saber: «Crear un trayecto Bézier normal»; «Crear trayecto Spiro»; «Crear una sucesión de segmentos rectos»; y «Crear una sucesión de segmentos pariaxiales».

Para lograr que la línea dibujada sea recta, hay que crearla mientras se pulsa la tecla «Ctrl». Para terminar la curva habrá que hacer doble clic con el botón derecho del ratón, o acabar pinchando en el punto de inicio si es una curva cerrada.

En el punto 4 está representada la ventana acoplada Relleno y borde (a la que se puede acceder desde el menú Objeto → Relleno y borde). Este cuadro de diálogo permite manipular las características de las figuras y curvas añadiendo flechas a los extremos, convirtiéndolas en líneas punteadas o discontinuas, cambiando el grosor y color, etc. Contiene tres pestañas con diferentes opciones de personalización: [Relleno], [Color de trazo] y [Estilo de trazo].

Para aplicar un recorte a un objeto, en primer lugar hay que seleccionar tanto el objeto como el trazo del recorte. Cualquier trazo, forma regular, u objeto de texto regular se puede utilizar como trazo para un recorte. El trazo del recorte debe estar situado justo encima del objeto al que se quiera aplicar el recorte. Después hay que ejecutar el comando Objeto → Recorte → Aplicar.

Se puede aplicar a la vez un mismo recorte a más de un objeto. Solo hay que seguir las instrucciones del párrafo anterior, pero incluyendo en la selección inicial a todos los objetos a los que queremos aplicar el recorte (y colocando el trazo del recorte justo encima de todos ellos).

Para quitar la aplicación de un recorte a un objeto, hay que seleccionar ese objeto, y después ejecutar el comando Objeto → Recorte → Liberar.

Inkscape dispone también de una serie de comandos para crear nuevos trazos a partir de dos o más trazos previamente existentes (dependerá del comando utilizado el que se pueda aplicar a dos, o a más de dos). Se encuentran disponibles en el menú Trayecto («Unión»; «Diferencia»; «Intersección»; «Cortar trayecto»…). El orden de los trazos implicados en estas operaciones es importante. En todas ellas, excepto en el caso del comando «Cortar trayecto», el nuevo trazo resultante hereda las características de Relleno y borde del trazo inferior. Para el propósito de estas operaciones, cualquier trazo abierto implicado en las mismas es tratado por Inkscape como un trazo cerrado por una línea que conecta los puntos finales del trazo.

Al igual que otros programas vectoriales, Inkscape funciona con nodos. Se puede modificar cualquier curva editando y moviendo sus nodos. La forma rápida de trabajar con los nodos de un objeto es haciendo doble clic rápidamente sobre el mismo, o bien seleccionando el objeto y utilizando la herramienta disponible para ello en la Caja de herramientas.

También se pueden crear nuevos nodos de ser necesario. Esto es útil para las curvas porque así se podrán ajustar de forma más precisa. Una vez que se han editado los nodos de la forma en que se indica en el párrafo anterior, si nuevamente se hace doble clic en alguna parte del trazo, se creará un nuevo nodo. Cuando se crea una curva, solo aparecen dos nodos, los de inicio y fin. Para poder modificarla bien, se puede crear un nodo a mitad de la curva y jugar con las flechas de los nodos para cambiar su curvatura. De esta manera, podrían crearse las llaves, combinando con la simetría, por ejemplo.

Líneas punteadas, discontinuas y otros tipos de líneas. Este tipo de líneas no se visualizan correctamente en algunos dispositivos. Para su correcto visionado, hay que seleccionarlas e ir a Trayecto → Borde a trayecto. Con ello, dejan de ser líneas (el trazo de un borde), para convertirse en objetos con relleno. Lo mismo sería necesario hacer con las flechas.

Colores, degradados y transparencias.

Colores. Es posible usar colores en los gráficos, siempre y cuando sean RGB. Para asignar un color, se puede seleccionar el objeto y utilizar la ventana acoplable Relleno y borde (mediante las pestañas [Relleno] y [Color de trazo]), o se puede recurrir a la Paleta de colores situada en la parte inferior de la ventana de la aplicación.

Una forma rápida de asignar un color al relleno de un objeto consiste en pinchar sobre el color elegido de la Paleta de colores y arrastrarlo hasta el relleno del objeto en cuestión. También se puede seleccionar el objeto y pulsar con el botón izquierdo del ratón sobre el color de la Paleta.

Para asignar un color al borde se puede arrastrar el color de la Paleta pero manteniendo presionada la tecla «Mayús.». También se puede pulsar con el botón derecho del ratón sobre los colores del Relleno y del Trazo que aparecen a la izquierda de la Barra de estado, tras lo que aparecerá un pequeño menú para elegir dónde se aplica el color, y algunas otras opciones más.

Degradados. No utilizar ningún tipo de degradado. Está totalmente desaconsejado. Su aplicación origina errores muy aleatorios, unas veces se ven y otras no. Con el mínimo cambio, comienzan a desaparecer otros elementos y fallan en algunos dispositivos. No utilizar degradados.

Transparencias. Para crear transparencias lo primero que hay que hacer es asignar un color al relleno del objeto. Una vez asignado, se selecciona el objeto y en la pestaña [Relleno] de la ventana acoplable Relleno y borde se manipula el valor del parámetro «Opacidad», que está situado en la parte inferior de la ventana. Esta función habría que utilizarla con precaución, porque no se ha probado mucho cómo funciona en los dispositivos al hacerlas con este programa, por lo que no se puede asegurar que su uso no conlleve problemas de visualización.

Exportar como SVG

Antes de exportar la imagen elaborada a formato SVG hay que valorar la cantidad de texto y de gráficos que va a contener la misma.

Como ya se comentó al hablar de cómo hay añadir texto a un gráfico en Inkscape, para que el texto se visualice en el archivo SVG, antes de exportar la imagen hay que seleccionar el texto y, o bien convertirlo a curva (Trayecto → Objeto a trayecto), o bien convertirlo a texto (Texto → Convertir a texto).

Cuando se convierte el texto a curva, no hay problemas de visualización en los dispositivos de lectura. Sin embargo, el eleveado grado de definición (número de nodos) que utiliza Inkscape hace que aumente mucho el tamaño del archivo resultante si la cantidad de texto que contiene es elevada.

Por otro lado, si se convierte a texto, el peso del archivo SVG se reduciría muchísimo, pero para que se visualizara correctamente en todos los dispositivos habría que incrustar o referenciar en el propio archivo SVG la fuente que se utilizó en Inkscape para crearlo.

Por ello, si las imágenes contienen muy poco texto y son similares a pequeños esquemas, bocetos, dibujos explicativos o tablas reducidas y puntuales, entonces la mejor opción es convertir el texto en curva.

Por contra, si las imágenes necesitan gran cantidad de texto y hay bastantes en el ePub, se deberá de contemplar la opción de convertir a texto y añadir la fuente en el archivo. Esto reduciría mucho el peso de los SVG, pero habría que valorar también el tamaño del archivo de la fuente elegida. En este caso, se puede optar bien por incrustar la fuente en cada SVG, solo los caracteres necesarios, o bien referenciar en el SVG la fuente utilizada, como una fuente incrustada normal de un ePub. Según las pruebas que se han realizado, la primera opción puede dar problemas en algunos dispositivos, y es mejor la opción de referenciar la fuente en el archivo. Además, al hacerlo de esta forma, se puede usar una única fuente reutilizable para varios SVG en un mismo ePub.

Los archivos SVG individuales NUNCA DEBEN SUPERAR LOS 300 Kb, dado que el código interno de un fichero SVG es texto plano en lenguaje XML. Hay que valorar en cada caso las primeras dos opciones anteriores.

Para exportar la imagen creada se utiliza el menú Archivo → Guardar como. De entre todos los tipos de archivos a los que se puede exportar, hay tres opciones para convertir a formato SVG: SVG de Inkscape, SVG plano y SVG optimizado.

Los elementos (y atributos) que aparecen en un archivo de Inkscape se pueden clasificar en dos categorías: por una parte los elementos incluidos dentro del estándar del lenguaje SVG, y por otra parte aquellos elementos que son propios de Inkscape.

Estos elementos propios e internos de Inkscape deberían ser ignorados por otros programas visualizadores de gráficos SVG. Sin embargo, esto no ocurre siempre así, y por esta razón Inkscape ofrece la posibilidad de exportar un dibujo sin incluir los elementos propios de Inkscape.

Por ello, la mejor opción para exportar a SVG es la de guardar como SVG optimizado, que es la única que permite eliminar del archivo estos elementos. Además, simplifica mucho el código y elimina bastante código sucio, reduciendo el tamaño del archivo y evitando que se produzcan algunos de los errores de validación que se comentan en el apartado siguiente.

Al seleccionar esta opción, aparecerá el siguiente cuadro de diálogo:

El cuadro contiene cuatro pestañas. Las dos primeras ([Opciones] e [Ids]) se utilizan para configurar el archivo SVG de salida, y las dos últimas proporcionan información de ayuda relativa a las diferentes opciones de configuración que se pueden marcar. Es aconsejable que, al menos, estén marcadas las siguientes:

[Opciones]

Acotar valores de color: Deberá estar marcada. Convierte todos los colores a formato RGB.

Incrustar imágenes: Deberá estar marcada cuando se haya añadido una imagen de mapa de bits al gráfico SVG. Los datos incluidos de la imagen son codificados según el formato base64.

Mantener datos del editor: Deberá estar desmarcada. Si se marca esta opción, se añadirán al archivo SVG todos los elementos propios e internos de Inkscape.

Eliminar metadatos: Deberá estar marcada. Elimina las etiquetas y el contenido del elemento <metadata>. Es recomendable hacerlo porque algunas de las etiquetas que incluye provocan un error en los validadores.

[Ids]

Eliminar nombres de ID no usados para elementos: Deberá estar marcada.

Acortar IDs: Deberá estar marcada.

Posibles errores

Como se ha comentado en el apartado anterior, Inkscape es un programa que genera mucho código sucio dado que utiliza elementos y atributos internos que no son propios del estándar del lenguaje SVG. Esta circunstancia puede dar lugar a que determinados archivos SVG den problemas a la hora de validar el ePub en el que se incluyen, aunque se visualicen correctamente. Cuando esto ocurra, habrá que editar el fichero para corregir el código manualmente, utilizando para ello cualquier editor de texto, o bien haciéndolo directamente desde el propio Sigil. A continuación se enumeran los errores de validación más comunes, así como una posible solución a los mismos:

Versión. En algunas ocasiones la versión que aparece dentro de la etiqueta <svg> es version=“1.0” o version=“1.2”, en cuyo caso habrá que sustituirla por version=“1.1” para que el validador de ePub no de un error.

Identificadores ID repetidos. Puede ocurrir que Inkscape utilice el mismo identificador ID en varios elementos dentro de un mismo archivo SVG, o que el formato dado al identificador sea incorrecto según el estándar ePub 2, en cuyo caso cualquier validador de ePub arrojará un error. Para resolver esta situación, pueden eliminarse tranquilamente estos identificadores del archivo SVG.

Elemento <metadata>. Algunos de los contenidos de este elemento dan problemas en los validadores, como ocurre con la etiqueta <rdf:RDF>. Pueden eliminarse los contenidos de este elemento, o incluso el elemento completo.

Elementos y atributos propios de Inkscape. Al no cumplir el estándar, siempre que alguno de estos elementos esté presente en el archivo SVG, el ePub no pasará la validación correspondiente. Como son elementos internos propios del programa, no afectan a la visualización de la imagen SVG, por lo que se pueden eliminar. En cualquier caso, es conveniente realizar la modificación en una copia del archivo y comprobar que al ser suprimidos no se produce cambio alguno en la visualización de la imagen.

Elementos propios del borrador del estándar SVG 1.2. El estándar SVG oficial es la especificación 1.1, que es la implementada en los validadores y en el estándar ePub 2. Durante algún tiempo se estuvo trabajando en un borrador preliminar de la recomendación SVG 1.2, que finalmente no fue adoptada y quedó obsoleta. Inkscape, además de utilizar elementos internos propios, también utiliza algunos de los elementos nuevos que sacaron para esta revisión 1.2 (y que no existían en la 1.1), como pueden ser los elementos <flowRoot>, <flowRegion> o <flowPara> que aparecen cuando se añade Texto fluido. Al no pertenecer a la Recomendación SVG 1.1, no se interpretan ni visualizan correctamente en los lectores, y siempre que aparecen los validadores arrojan un error. Por tanto, se puede editar el archivo y borrar tanto la etiqueta como el contenido, comprobando previamente que al ser suprimidos no se produce cambio alguno en la visualización de la imagen.

Optimizar archivos SVG. Enlaces de interés

Algunas páginas web proporcionan herramientas que pueden resultar de utilidad a la hora de optimizar los archivos SVG, o para ampliar la información sobre los posibles errores que muestren los validadores utilizados habitualmente. A continuación se comentan varias de las más interesantes:

SVG Editor: http://petercollingridge.appspot.com/svg-editor

Esta web es útil para limpiar código innecesario de los archivos SVG y poder reducir de esta manera su tamaño. Dependiendo del programa de creación utilizado, se reducirá más o menos. Hay que tener mucho cuidado y observar que no se pierdan elementos o calidad en la imagen final, por lo que es recomendable comprobar siempre el original con el resultado.

Validador W3C: http://validator.w3.org/

Este validador puede ampliar un poco más la información sobre los errores, y permite introducir archivos SVG independientes. Hay ocasiones en las que resulta complicado detectar cuál es el error exacto arrojado por los validadores utilizados normalmente, así que se puede acudir a esta web si se necesita un poco de ayuda para identificar el error.

Inserción de SVG en un ePub

Existen dos posibles opciones a la hora de incluir un gráfico SVG en un ePub. Por un lado, se puede añadir como un archivo de imagen independiente con extensión .svg, como los que proporcionan los programas de diseño comentados en el apartado anterior. Por otro, al ser el estándar SVG un lenguaje basado en XML, se podría añadir el código SVG en línea dentro del documento XHTML del ePub.

SVG como archivo de imagen

En este caso, al ser el gráfico SVG un archivo de imagen de extensión .svg, se puede añadir al ePub mediante el elemento <img>, incluyéndolo dentro del atributo SRC:

<img alt="" src="../Images/ImagenSVG.svg" />

A su vez, el elemento <img> puede ir dentro de un contenedor <div> o de cualquier otro elemento, y se le podrán aplicar estilos CSS. Es decir, que el SVG así utilizado admite las mismas propiedades CSS que cualquier otro formato u extensión (jpg, png, gif…), tal y como se muestra en el siguiente ejemplo:

<div class="ilustra"><img alt="" src="../Images/ImagenSVG.svg" /></div>

Sin embargo, el formato SVG presenta una gran ventaja respecto a los formatos de mapa de bits, y es que como se comentaba en el apartado anterior, la particularidad inherente a los gráficos vectoriales es que el mismo gráfico es independiente del tamaño y resolución con que se muestre, de forma que al modificar sus dimensiones (ampliarlo o reducirlo) aparece siempre uniforme en la pantalla sin pérdida de calidad (ni pixela ni pierde nitidez), al contrario de lo que ocurre con los formatos de mapa de bits.

Esta particularidad los hace idóneos a la hora de representar cualquier imagen que se pretenda escalar con el tamaño de letra del lector, sobre todo aquellas que contengan algún tipo de texto, como pueda ser una gráfica, tabla, ecuación, etc.

Para escalar este tipo de imágenes se puede recurrir a CSS, tal y como se explica en detalle en la sección Imágenes escalables.

A continuación se comenta una posible alternativa que puede resultar muy versátil cuando el número de imágenes escalables es significativo, y que consiste en definir en el style.css una regla del tipo:

.escalarsvg { width:10em; max-width:100%; }

Esta regla ocasiona el escalado de la imagen con el texto, y podría aplicarse en conjunción con otra clase más genérica que se haya creado para dar estilo a las imágenes, como por ejemplo puede ser la clase «.imagenesc» que se define a continuación:

.imagenesc { display:inline-block; margin:1em 0; text-indent:0; }

.imagenesc img { width:100%; }

Aplicadas en el documento XHTML del la forma:

style.css

.imagenesc { display:inline-block; margin:1em 0; text-indent:0; }

.imagenesc img { width:100%; }

.escalarsvg { width:10em; max-width:100%; }

Section0001.xhtml

<div class="centrado">

<p class="imagenesc escalarsvg"><img alt="" src="../Images/Imagenes_eq.svg" /></p>

</div>

Así, en función de las dimensiones de las imágenes que haya que representar, se podrían crear tantas clases del tipo «.escalarsvg» como fueran necesarias. El resultado de aplicar dicho código se muestra a continuación (el valor de la propiedad «width» se ha ajustado para que el tamaño del texto de la expresión matemática sea similar al del texto base):

Esta opción también podría utilizarse en imágenes que estén en línea con el texto, como la que se muestra a continuación para representar la runa Tyr: Runa Tyr. Para ello, se ha definido una clase similar a la anterior pero añadiéndole la propiedad «vertical-align», que permite alinear verticalmente la imagen para que quede centrada respecto al texto.

style.css

.escalar { display:inline-block; width:.55em; max-width:100%; text-indent:0; vertical-align:-.1em; }

.escalar img { width:100%; }

Section0001.xhtml

<p>… la runa Tyr: <span class="escalar"><img alt="" src="../Images/Imagenes_Tyr.svg" /></span>. Para ello, …</p>

La runa Tyr: Runa Tyr.

La única pequeña pega de usar el SVG de esta forma es que es tratado como un todo, con independencia de los elementos SVG que lo conformen. Por lo tanto, se pierde la posibilidad de manejar cada elemento SVG por separado y actuar de forma individual sobre cada uno de ellos, ya sea para modificar su apariencia (colores, tamaños…) o su comportamiento.

SVG en línea

Aunque se comenta esta posibilidad, en principio no se recomienda su uso dado que aún se están realizando pruebas para ver el comportamiento que tiene en los distintos dispositivos de lectura.

Para introducir un gráfico SVG en línea dentro del documento XHTML, solo hay que incluir el código obtenido al crearlo en el lugar donde se quiera mostrar.

La ventaja que tiene hacerlo de esta forma es que permite controlar los elementos que conforman el SVG, ya que se pueden crear selectores (clases, ID…) en la hoja de estilos style.css (o declaraciones CSS en línea) y aplicarlos en los elementos SVG. También admite la opción de incluir enlaces dentro del SVG, lo que podría resultar de utilidad para incluir notas o referencias dentro de las imágenes.

La gran desventaja que presenta es que al incluir el código XML dentro del documento XHTML, el tamaño del mismo se puede incrementar notablemente si el número de imágenes SVG es elevado, o si contienen mucho código, lo que puede suponer un problema debido a la limitación de 300 Kb por archivo. Además, este código adicional hace que se incremente (en ocasiones en mucho) el número de páginas del ePub que muestra Adobe Digital Editions o el dispositivo de lectura, falseando el resultado al no ser un valor real.

Para introducir un gráfico SVG en el documento se utiliza el elemento <svg>, que es el contenedor dentro del cual se incluyen el resto de elementos SVG que darán forma al gráfico. Se debe indicar siempre mediante los atributos «witdh» y «height» la anchura y la altura de este elemento contenedor, o se puede indicar también mediante codigo CSS.

La imagen que se muestra en la parte inferior es un gráfico SVG que se ha introducido en línea dentro del XHTML. Para darle estilo, se han creado en el style.css las siguientes reglas:

.centsvglin { margin:1em 0; text-align:center; text-indent:0; display:block; }

.escsvglin { max-width:100%; max-height:11.5em; width:18em; border:1px solid; }

@font-face { font-family:"Baskerville"; font-style:normal; font-weight:normal; src:url(../Fonts/Baskerville.ttf) }

Sobre el elemento <svg> se ha aplicado la clase «.escsvglin» para indicar las dimensiones que tiene el gráfico SVG y hacer que escale con el tamaño de letra. Este elemento se ha incluido dentro de un contenedor <div>, al que se le aplica la clase «.centsvglin» para dar un margen de separación a la imagen y hacer que quede centrada respecto de la página. Además, se ha incrustado en el ePub la fuente Baskerville y se ha aplicado a cada elemento SVG <text> (que se utiliza para insertar texto dentro de un gráfico de SVG) mediante la propiedad «font-family».

Adaptación de SVG de texto a un ePub

Como vimos en el apartado de creación de los SVG, tenemos dos opciones para exportarlos. Una de ellas es la opción de curva y la otra como texto. Hasta hace poco se usaba la primera opción en todos los casos. Pero si el contenido de texto es grande, al exportar el SVG como curva y no como texto (código de referencia a los caracteres de una fuente), el archivo resultante es muy pesado. Por otro lado un SVG es realmente un archivo de texto con código xml que contiene instrucciones de dibujo y el eplValidator da error si tiene un peso de más de 300 Kb ya que puede dar problemas en algunos dispositivos.

Se hicieron pruebas con SVG exportados como texto y la diferencia de peso, en el ejemplo que veremos después, era de 318 Kb si se exportaba como curva y solo 5 Kb exportado como texto.

En el caso de exportarse como texto, las coordenadas de representación del SVG se ajustan a la métrica de la fuente utilizada para crearlo, que puede variar bastante de cualquier otra. Por este motivo para mostrarlo correctamente después es muy importante utilizar o tener como referencia la fuente exacta con la que se creó. Si no se hace así el lector utilizará la fuente por defecto o la elegida por el usuario y la imagen quedará descuadrada.

Hay dos formas de crear un SVG de texto:

Incrustar la fuente en el SVG: Hay que incrustar la fuente en cada SVG y no es reutilizable para otros con la misma fuente con el consiguiente aumento de tamaño. Además las pruebas no dieron buen resultado.

Referenciar en el SVG la fuente utilizada, como una fuente incrustada normal de un ePub. Tiene la ventaja de utilizar solo código de referencia al carácter de la fuente en lugar de codificar el texto como curva y que la fuente es reutilizable para varios SVG en un mismo ePub sin aumento extra del tamaño de cada uno. Las pruebas se realizaron con éxito y es el caso que vamos a utilizar como ejemplo.

Pasos para la adaptación

En primer lugar hay que crear el SVG como se explica en el apartado de creación de los SVG. Para ello se utiliza Corel, Inkscape u otros programas gráficos. Nos decantamos por Corel porque era el que generaba código más limpio y su tamaño final era menor.

Añadir el SVG creado al ePub.

Añadir al ePub la fuente/s con la que se creó el SVG.

Modificar el código del SVG para poder mostrarlo con la fuente incrustada en el ePub.

Para ello se abre en Sigil el archivo SVG. Al exportarlo como texto aparece en primer lugar el código de cabecera que comienza con:

<svg xmlns="http://…

Después el código incluido en la etiqueta <defs> y posteriormente la etiqueta <g…

El contenido de la etiqueta <defs> suele tener esta forma:

<defs>

<font id="FontID1" horiz-adv-x="722" font-variant="normal" fill-rule="nonzero" font-style="normal" font-weight="400">

<font-face

font-family="Baskerville">

</font-face>

<missing-glyph><path d="M0 0z"/></missing-glyph>

</font>

</defs>

y es aquí donde hay que añadir el código para referenciar la fuente añadida, que está situada en ../Fonts/Fuente.ttf.

Para referenciar la fuente hay dos posibilidades:

Utilizando código de CSS @font-face

Utilizando código de SVG font-face-src.

SVG-Texto normal con CSS @font-face

Utiliza la misma forma que una CSS, añadiendo después de </font>:

<style type="text/css">

@font-face { font-family: Baskerville; font-style:normal; font-weight:normal; src:url(../Fonts/Baskerville.ttf) }

</style>

Quedando el código:

<defs>

<font id="FontID1" horiz-adv-x=722" font-variant="normal" fill-rule="nonzero" font-style="normal" font-weight="400">

<font-face

font-family="Baskerville">

</font-face>

<missing-glyph><path d="M0 0z"/></missing-glyph>

</font>

<style type="text/css">

@font-face { font-family: Baskerville; font-style:normal; font-weight:normal; src:url(../Fonts/Baskerville.ttf) }

</style>

</defs>

Y se mostraría así:

SVG-Texto normal con SVG font-face-src

Utiliza la forma propia de SVG. Se añade dentro de <font-face > y después de font-family="NombreFuente"> el código siguiente:

<font-face-src>

<font-face-uri xlink:href="../Fonts/Baskerville.ttf" />

</font-face-src>

Quedando el código:

<defs>

<font id="FontID1" horiz-adv-x="722" font-variant="normal" fill-rule="nonzero" font-style="normal" font-weight="400">

<font-face

font-family="Baskerville">

<font-face-src>

<font-face-uri xlink:href="../Fonts/Baskerville.ttf" />

</font-face-src>

</font-face>

<missing-glyph><path d="M0 0z"/></missing-glyph>

</font>

</defs>

Y se mostraría de forma idéntica al ejemplo anterior:

Advertencias

Al incluir el nombre de familia en los font-family es necesario que no contenga espacios, especialmente cuando se utiliza la forma @font-face.

Una vez que se ha añadido el código que hace referencia a la fuente incrustada, el SVG resultante solo se mostrará correctamente en un ePub con esa fuente. Si se extrae del ePub, al no encontrar la referencia a la fuente, se mostrará con la fuente por defecto del dispositivo y muy posiblemente con el texto descuadrado debido a la diferente métrica.

El soporte de Sigil para SVG de texto es muy deficiente. Los muestra con fuente distinta a la indicada en el SVG (?) y es muy posible que haya texto solapado con otro. En los ejemplos aquí expuestos se han retocado ligeramente sus coordenadas para mostrarlos adecuadamente. Por tanto que nadie espere que su SVG se vea bien en Sigil, se mostrará mejor en su lector.

SVG con varias fuentes

En este caso habría en <defs> tantos grupos de definiciones <font id="FontID1" como fuentes tengamos y habría que proceder con cada una como explicamos en los dos ejemplos anteriores, aumentando el número del identificador: "FontID2", etc.

SVG con texto rotado

La única diferencia con los SVG de texto normal es que en su diseño en Corel se rotaría el texto 90 grados a la izquierda. Tiene la ventaja de mostrar la imagen más grande al situarla en posición vertical. En este caso no ponemos un ejemplo concreto ya que, aunque ha funcionado bien en todos los lectores de prueba oficiales, en algunos como Kobo había veces que se superponía texto y debemos seguir probando.

Índice temático

Si tienes dudas, nosotros tenemos las preguntas.

Sobre las imágenes

¿Puedo hacer que mi portada sea más vistosa? >>

¿Cómo puedo escribir en una imagen que tengo para convertirla en portada? >>

¿Cómo puedo modificar y diseñar mis propias imágenes? >>

¿Qué es eso de las capas de las imágenes? >>

¿Qué significa todo eso píxeles, resolución, tamaño y todas esas cosas que dicen de las imágenes? >>

¿Hay alguna forma de no tener que ir una a una para hacer las mismas cosas a cada imagen de mi libro? >>

¿Es mejor SVG que otro formato de imagen cuando lo que quiero poner es texto? >>

Agradecimientos (Ed. 2018)

Quisiera dar las gracias a barbanegra y Rusli por tomarse la molestia de revisar la documentación existente y organizar las pruebas para el nuevo ePub Base, sin cuya actualización este nuevo manual no hubiera sido posible (o hubiera sido totalmente diferente). Y especialmente a Horus, por redactar el manual sobre las etiquetas HTML.

También agradecer a Sagitario y Sedna su intensa revisión de todo el manual, a la búsqueda de aquellas cosas ya obsoletas o incompatibles con el nuevo estándar, actualizando etiquetas, eliminando estilos no usados y renovando algunas imágenes.

Y, como siempre, a todos aquellos que han colaborado en las pruebas del ePub Base, el ePLValidator y demás herramientas en el foro, o bien reportando erratas y errores del propio manual. Sin vuestra ayuda, esto no hubiera sido posible.

Muchas gracias a todos los que con vuestro tiempo e ilusión hacéis posible este Proyecto. Espero que podamos seguir compartiendo nuestra afición por muchos años y veamos muchas y mejoradas revisiones de todas las herramientas EPL.

Más libros, más libres.

Fénix

Agradecimientos (Ed. 2015)

Este manual ha sido elaborado por y para la comunidad del Proyecto Scriptorium, y no habría sido posible sin la colaboración desinteresada de muchas personas, algunas de las cuales paso a nombrar. No están todas las que son, pero son todas las que están. Espero que aquellas que inadvertidamente he omitido, me perdonen por ello.

Para empezar, quisiera dar las gracias a TaliZorah, por organizarlo cuando yo no tenía tiempo para ello, y a Mowgli, Cthulhu e Insaciable, por su colaboración inicial. A Sedna por su incansable búsqueda de códigos CSS para una maquetación avanzada. A gertdelpozo y a los demás integrantes del equipo gráfico, por los apartados de portadas y edición de imágenes. A emiferro, Horus, triangulín y Áuryn, por encargarse entre todos de darle forma. A Trujano, por su breve pero intensa colaboración a la hora de redactar los apartados que no quería nadie. A barbanegra, por tomarse la molestia de revisar y unificar el desaguisado que habíamos montado entre todos. Y finalmente, a aquellos colaboradores que han preferido permanecer en el anonimato, y que espero sigan colaborando en futuras revisiones.

Asimismo, quisiera agradecer también a todos aquellos que con sus consejos y manuales en el foro, y su deseo de mejorar continuamente las herramientas existentes, han ayudado a mejorar la calidad de la biblioteca e, inadvertidamente, también la del presente manual. Y muy especialmente a los encargados de crear y mantener dichas herramientas: Carlos., Jugaor, betatron, Tarloth, Mcphist y capitancebolleta.

Por último, pero no por ello menos importante, me gustaría nombrar a Werth, cuyo manual inicial, en una página ya desaparecida, fue la semilla que sirvió de base para crear la excelente herramienta para la maquetación que tienes ahora entre tus manos.

Muchas gracias a todos los que con vuestro tiempo e ilusión hacéis posible este Proyecto. Espero que podamos seguir compartiendo nuestra afición por muchos años y veamos muchas y mejoradas revisiones de todas las herramientas EPL.

Más libros, más libres.

Fénix

PROYECTO SCRIPTORIUM (23 de abril de 2013).

El Proyecto Scriptorium surgió cuando un grupo de editores fueron expulsados de la página en la que se encontraban por protestar por los cambios que, tras la venta de la página, se realizaron sin consultarles. Cambios que incluían la implantación de malware en las descargas, lucro (para los nuevos dueños) y censura.

Por ese motivo, en octubre de 2012 se creó un foro de emergencia (conocido como el «tk», ya que esa era su extensión), para tratar de seguir con su hobby, la maquetación de libros electrónicos, y para buscar una forma de ponerlos a disposición de todo el mundo de forma libre y gratuita.

El 23 de abril de 2013, tras 7 meses de gestación y coincidiendo con la celebración del día del libro, el escaparate del proyecto, la web epublibre.org, abrió sus puertas.

En el tiempo transcurrido, ha habido gente que se ha distanciado del proyecto, y otros nuevos han llegado para ocupar su lugar, convirtiéndose en algo dinámico y vivo, y que esperamos permanezca mucho tiempo, bajo la forma que sea, como un faro de referencia a nivel cultural y de calidad en las maquetaciones.

Más libros, más libres.