Enrera
Mòdul 2
Imatge digital
  Pràctica
1
2
3
4
5
   
Exercicis
Exercicis
 
 

Aquesta pràctica pretén que us familiaritzeu amb el treball en capes. El treball en capes és una de les característiques més importants dels editors d'imatges i una de les formes de treball més útils per fer composició d'imatges.

Què és una capa?

Una capa és una superfície d'una imatge. Una imatge pot tenir diverses capes que es poden superposar una sobre l'altra. Seria com una pila de fulls transparents, cadascun dels quals tindria algun component de la imatge. La idea més senzilla per entendre què és una imatge en capes, és pensar en el sistema antic de realitzar els dibuixos animats. Sobre un fons o paisatge (Fons o primera capa) es situaven un o més fulls transparents d'acetat on es pintaven els personatges (segona capa, tercera capa, ...). 

El disseny d'una imatge en capes ens permetrà tenir un control més acurat de cadascun dels components de la imatge i modificar-los de forma individual com si cada capa fos una imatge individualitzada. Algunes capes poden estar totalment pintades i tenir diversos graus de transparència. D'altres poden ser totalment transparents i tenir només un dibuix o imatge en una zona determinada o bé poden contenir únicament text.

Desenvolupament de la pràctica
   
Pràctica

Quan es crea una imatge amb el Gimp, aquesta té únicament una capa, què és el que s'anomena Fons. Aquesta capa apareixerà amb el color que tinguem definit a les opcions avançades de Fitxer | Nou. El color amb què estarem pintant el tindrem a la paleta de colors al requadre de primer pla.

Si volem afegir un dibuix o una imatge en una segona capa li hem d'indicar que ho faci.

  • Obriu el Gimp i creeu una nova imatge (Menú Fitxer | Nou) amb el fons de color blanc. Quan ho feu us apareixerà un quadre de diàleg com el següent si obriu les opcions avançades:

  • Creeu una nova imatge de 800 x 600 píxels i una resolució de 72 ppp (píxels/in). Aquí és on definirem les característiques de la imatge que anem a crear. L'amplada i llargada de la imatge es defineixen normalment en píxels (Veieu el mòdul 1) i la resolució normal per a una imatge que s'ha de veure en el monitor és de 72 píxels per polsada, que, recordeu, és la resolució d'un monitor normal. En l'apartat de Omple amb definirem si volem color de fons, de primer pla, blanc o transparència. Per defecte surt el color que tinguem definit a l'inici del programa com a color de fons. A Espai de color definirem Color RGB o bé escala de grisos. Accepteu amb les opcions que s'han comentat i haureu creat la vostra primera imatge, probablement en blanc.

La finestra que se'ns ha obert té una sola capa anomenada Fons. Si no teniu oberta la finestra de capes obriu-la anant a Fitxer | Diàlegs | Crear nou desplegable | Capes, canals i camins...

Fixeu-vos amb les opcions inferiors:

La primera ens permet crear una nova capa. Les dues fletxes són per ordenar les capes. La quarta icona serveix per duplicar una capa. El dibuix de l'àncora és per ancorar (fusionar) una capa flotant i la darrera (les escombreries) serveix per eliminar una capa.  
El botó que hi ha a l'esquerra  serveix per visualitzar o no la capa. Per defecte, totes les capes estan visibles. Si el premeu veureu com la capa deixa de veure's i apareix un reticulat blanc i gris indicatiu de transparència a tots els editors d'imatge.

Un altre aspecte a tenir en comte és que si deixem la pràctica a mig acabar i la desem en format gif, jpg, bmp,... o qualsevol altre que no sigui xcf (el propi del Gimp), quan recuperem la imatge ens haurà fussionat totes les capes i no podrem modificar-les. Per tant, si heu de deixar la pràctica inacabada per seguir més endavant, deseu-la en el format xcf (el propi del Gimp) i així mantindreu les capes.

  • Canvieu el color de primer pla fent clic amb el ratolí sobre el requadre de Primer pla i escolliu un color crema clar. Després premeu el botó Omple amb un color  a sobre la imatge i veureu com canvia el color de tota la capa.
  • Anem ara a crear una nova capa. Hi ha diverses formes de fer-ho. Seleccionant l'opció Nova capa del menú Capa, clicant amb el botó dret del ratolí sobre la capa Fons de la finestra de capes, o bé prement el botó Nova capa  del menú inferior de la finestra de capes. Trieu la que més us agradi. En tots els casos ens apareixerà el quadre de propietats de la nova capa:

  • Accepteu i veureu com en la Finestra de Capes ens apareix una nova capa anomenada Nova capa. Fixeu-vos que com hem triat l'opció transparència, el dibuix de la capa ens apareix amb el quadriculat gris clar/fosc típic de les zones transparents als editors d'imatges.

Anem ara a incloure un text en aquesta capa. 

  • Primer seleccioneu un color de primer pla del tipus blau fort i accepteu.  Premeu el botó  (observeu com canvia l'aspecte del ratolí). A la part inferior de la finestra Gimp apareixen les opcions de l'eina Text on triareu les característiques que mostra la imatge.

  • Situeu-vos a la zona central de la imatge i premeu el botó esquerre del ratolí. Us apareixerà un nou quadre de diàleg on escriureu el text. Escriviu la paraula Biodiversitat i Accepteu. És important tenir seleccionada l'opció Suavitzat, ja que d'aquesta manera el text ens apareixerà sense la vorera esglaonada típica dels textos d'ordinador. Tindreu ara una imatge similar a això:

  • Us haurà aparegut una nova capa, en aquest cas de text anomenada Biodiversitat. Centreu el text amb l'eina Mou les capes i les seleccions   . Per moure el text us heu de situar dins d'una lletra.

IMPORTANT: Recordeu que no podreu realitzar cap acció sobre la imatge o text d'una capa si no la teniu seleccionada des de la finestra de capes, fent clic damunt el nom de la capa sobre la que voleu treballar. Les capes situades més amunt són les que es veuran per sobre de les inferiors. Així, si una capa situada a dalt no és transparent, o no té parts transparents, no es veuran les inferiors.

Anem ara a donar una mica d'ombra al text.

  • Seleccioneu un color de primer pla Negre i accepteu.  Premeu el botó  i torneu a escriure la paraula Biodiversitat amb les mateixes característiques d'abans. Us apareixerà una nova capa anomenada Biodiversitat#1.
  • Apliqueu in Filtre | Difumina | Difuminació Gaussiana per enterbolir la paraula que heu escrit en color negre.
  • Seleccioneu amb el ratolí la nova capa Biodiversitat#1 i situeu-la amb l'ajut de les fletxes a sota de la capa Diversitat. Desplaceu-la una mica per a que faci l'efecte d'ombra. Heu d'obtenir un resultat similar a aquest:

  • Anem ara a reordenar la capa que teniu amb el nom de Nova capa. Desplaceu-la amb l'ajut de les fletxes fins a la part superior. Ara ja comencem a tenir un nombre de capes una mica alt i, en aquests casos és molt útil que cada capa tingui un nom. Si cliqueu dos cops amb el ratolí a sobre del nom de la capa a la Finestra de capes se us obrirà el quadre del nom i podreu canviar el nom. Feu-ho si ho creieu convenient.

Un consell pràctic és anomenar les capes que tinguin algun contingut. D'aquesta forma podem saber sempre quines capes estem reservant per afegir altres coses més endavant. El nom que els posem ens servirà en molts casos per recordar que hi tenim encara que a la finestra de capes tinguem una petita imatge que ens ho mostra. Un exemple d'això seria anomenar les capes de la següent forma: Fons de color crema, Ombra del text, Text Biodiversitat i Capa buida. En la situació actual, si no heu canviat el nom, teniu quatre capes: Nova capa, Biodiversitat, Biodiversitat#1 i la capa de Fons. Anem ara a incorporar una imatge. Aquesta imatge la podem incorporar al dibuix de formes molt diferents.

  • Una de les formes més freqüents d'incorporar les imatges és obrir-la en una finestra diferent, retallar-la i enganxar-la com una capa nova (opció Enganxa del menú Edita).
  • La forma clàssica és utilitzant l'opció Arxiu | Obre com a capa, de la finestra de la imatge.  
  • Localitzeu la imatge imatge7.jpg i obriu-la com us diu el punt anterior.
  • Us apareixerà una nova capa anomenada Imatge7.jpg. Podreu comprovar que com no té parts transparents ens tapa la visió de totes les altres capes.

Aquesta imatge estava creada a 800 x 600 píxels i per això ens ocupa tota la finestra d'imatge que recordeu havíem creat inicialment amb aquesta mida.


A la finestra de capes arrossegueu la capa d'aquesta imatge fins que quedi a sota de la capa Biodiversitat#1. Fins ara això ho havíeu fet amb les fletxes. Fixeu-vos que també podeu moure les capes amunt i avall amb el ratolí. La Finestra de capas  oferirà ara un aspecte similar a aquest:

Podeu practicar ordenant-les i reordenant-les i canviat l'opacitat. Al final però torneu a la situació que us mostra la figura superior. També podeu jugar amb l'opció Mode per a la barreja de capes o amb la icona per fer visible o no una capa.

  • Selecciona la capa Imatge7.jpg i a la finestra del Gimp clica sobre de l'eina Selecciona regions el·líptiques .
  • Selecciona una zona el·líptica que inclogui el text, més o menys com us mostra la següent figura:

  • Retalleu (CTRL+X) i us quedarà:

  • Feu clic amb el botó dret del ratolí i us desapareixerà el límit mòbil de l'àrea seleccionada. Seleccioneu ara la capa Fons i apliqueu el filtre Filtre | Soroll | Llança... amb una aleatorietat d'un 15%. Haureu modificat el fons afegint-li un puntejat.

  • Seleccioneu ara la capa Imatge7.jpg i intenteu (té la seva complicació) seleccionar una àrea el·líptica una mica més gran que l'el·lipse que heu escollit abans, és a dir:

  • Finalment escolliu l'opció Difuminació de moviment del submenú Difumina del menú Filtres. Veieu com només es modifica l'àrea seleccionada dins de la capa activa. Agafeu Tipus de difuminació: Lineal ; Longitud 22 i Angle 0º. Accepteu. Al final d'aquesta pràctica ens haurà quedat una imatge similar a aquesta:

  • Fixeu-vos que teniu una capa que no heu utilitzat per res i que està buida. Podeu eliminar-la o bé aprofitar-la per posar el vostre nom com una signatura de la pràctica.

Podeu ara modificar la transparència d'algunes capes canviant el % d'Opacidad en la Finestra de capes. La imatge que hem utilitzat de fons ha estat també creada a partir de capes i efectes. Malgrat això, quan l'hem obert no ens ha aparegut com un seguit de noves capes ja que prèviament havien estat fusionades (Aquesta opció ens ha aparegut prement el botó dret del ratolí sobre del botó d'una capa). Podeu fusionar capes amb diferents opcions del menú Capes que apareix quan cliquem una capa amb el botó dret del ratolí a la Finestra de capes (Fusiona al capdavall, Fusiona capes visibles, Aplana la imatge,...). Al realitzar aquesta pràctica autoguiada hem utillitzat alguns efectes i deformacions. Podeu practicar amb altres efectes i veure quin és el resultat. Deseu la imatge amb el nom practica4.jpg i pràctica4.xcf. Si torneu a obrir les dues imatges veureu (tal i com ja s'ha dit al principi de la pràctica), que el format jpg no manté les capes, mentre que el format xcf (el propi del Gimp) sí ho fa.

 

Tenim tres maneres diferents de codificar el color:

  • RGB (RVA) (Red, Green, Blue)
    Codificació del color primari amb 1 byte (rang 0-255)
    Cada píxel precisa 3 bytes (1 per color) = 24 bits/píxel
  • HSB (Hue, Saturation, Bright)
    Definició del color per la combinació de tres característiques: el to, la saturació i la lluminositat.
  • CYMK (Cyan, Yellow, Magenta, Black)
    Codificació dels pigments de quatricromia emprada en la impressió gràfica.
    Incorporada en els programes avançats de retoc fotogràfic: PhotoShop, PhotoPaint.

En les pàgines web, el color que poseu per definir les fonts, el fons... es posa en notació html, i a més és normalment en format hexadecimal. Com tenim tres components (R,G i B), cadascun pot tenir un valor entre 0 i 255, o el que és el mateix, entre 00 i FF. En la finestra de la definició de colors del Gimp veureu que us surten els tres components: en RGB, i per sota el valor corresponent en html, que és el que posareu en la pàgina web.

 
Amunt