Producció gràfica analògica i digital

  • Jordi Alberich

  • Albert Corral

  • David Gómez

  • Cristina Villegas

PID_00272741
Tercera edició: febrer 2020
© Jordi Alberich, Albert Corral, David Gómez, Cristina Villegas
Tots els drets reservats
© d’aquesta edició, FUOC, 2020
Av. Tibidabo, 39-43, 08035 Barcelona
Realització editorial: FUOC
Cap part d'aquesta publicació, incloent-hi el disseny general i la coberta, no pot ser copiada, reproduïda, emmagatzemada o transmesa de cap manera ni per cap mitjà, tant si és elèctric com químic, mecànic, òptic, de gravació, de fotocòpia o per altres mètodes, sense l'autorització prèvia per escrit dels titulars dels drets.

Índex

Introducció

"Producció gràfica analògica i digital" és el segon mòdul dels materials d'aquesta assignatura i la seva finalitat és analitzar i comparar els formats gràfics analògics i digitals.
Cada suport té unes característiques diferents, depenent de la seva difusió i forma de consum. La creació gràfica variarà, doncs, segons quin sigui el suport en què s'ha d'aplicar, i s'adaptarà a les seves necessitats i requeriments. En aquest apartat aprendreu com es produeix una mateixa campanya amb diversos suports i a treure el major partit de cadascun d'ells.
L'estudi i la comparació entre la imatge vectorial i el mapa de bits serà vital per a la consecució dels objectius del mòdul. Aprendreu a diferenciar les característiques i els requeriments dels dos tipus d'imatges, i també les resolucions amb les quals s'ha de treballar, els formats d'optimització i el programari ideal per a la producció.
La darrera part d'aquest mòdul, titulada "Producció del material gràfic", conté una explicació extensa dels diferents formats gràfics, diferenciant-los pels suports que els contenen. Aquesta és una reflexió sobre les característiques físiques, i per tant, els requeriments consegüents dels formats gràfics, que serà de gran ajuda abans de posar-se a dissenyar.
En definitiva, en aquest mòdul assolireu tots els coneixements tècnics necessaris per a treballar amb formats tradicionals i/o digitals i a produir gràfics mitjançant aquests.

Objectius

Els objectius principals que s'han d'assolir amb l'estudi d'aquest mòdul són els següents:

  1. Comprendre les diferències bàsiques entre imatge analògica i digital.

  2. Identificar els trets bàsics de les imatges de mapa de bits.

  3. Identificar els trets bàsics de les imatges vectorials.

  4. Valorar les diferències entre els formats gràfics tradicionals i els digitals.

  5. Possibilitar l'edició i optimització de gràfics en entorns digitals.

  6. Conèixer les peculiaritats i els requeriments dels diferents suports i formats comunicatius.

1.Imatge digital enfront d'imatge analògica

1.1.Introducció

Treballar amb imatges digitals comporta disposar d'una flexibilitat de treball que no permeten les imatges analògiques. La feina d'un dissenyador pot servir com a exemple. Abans, els dissenyadors feien les maquetes a mà: retallaven, maquetaven i manipulaven tota mena de material d'interès. El problema era quan s'equivocaven, ja que haver de rectificar tota la feina per un petit error implicava pràcticament haver de tornar a començar.
Per aquest motiu, quan va aparèixer l'ordinador, el dissenyador gràfic convencional el va adoptar ràpidament com a eina de treball. Tenir la possibilitat de retocar un document, seleccionar un color o modificar una mida tantes vegades com calgués i en un espai de temps mínim va ser un gran avantatge per a la seva feina.
Però, juntament amb l'ordinador, van aparèixer noves necessitats, nous productes per dissenyar. Ara no només es tracta de la utilitat dels ordinadors en la tasca diària del dissenyador, sinó de la necessitat de dissenyar per a nous suports virtuals. La nova era digital en què vivim aporta nous estris i màquines que necessiten interaccionar amb l'home. L'espai de comunicació es troba en reformulació constant i necessita dissenyar entorns en els quals l'home i la màquina pugin intercanviar informació. Web, WAP, 3G, iTV, etc. requereixen un disseny usable i accessible, el nou repte del dissenyador.
PID_00272737_153.jpg
En aquest mòdul estudiarem els diferents tipus d'imatges digitals i tradicionals, els factors que cal tenir en compte en elaborar-les i les eines que es fan servir per a crear-les o manipular-les.

1.2.Imatge digital enfront d'imatge analògica

Què és la imatge digital? I l'analògica? Quina diferència hi ha entre elles? Per a respondre aquestes preguntes, fem primer un cop d'ull al diccionari.

Analògic -a

adj 1 1 Relatiu o pertanyent a l'analogia. 2 Fundat en l'analogia. 2 INFORM 1 Dit del model on han estat substituïdes unes propietats reals per d'altres propietats equivalents del model. 2 Dit dels sistemes de transmissió o de tractament de la informació que utilitzen models analògics.

Digital

adj ELECTRÒN/INFORM 1 Relatiu o pertanyent als dígits o als aparells que operen amb nombres expressats amb dígits. Calculador digital. 2 Dit dels sistemes de transmissió o de tractament de la informació en què les variables són representades per caràcters (sovint dígits o xifres) d'un repertori finit.

Digitalitzar v tr ELECTRÒN/INFORM Codificar en sistema digital una informació analògica.

Gran diccionari de la llengua catalana (1997). Barcelona: Enciclopèdia Catalana.

Així doncs, podem concloure que quan parlem d'analògics o digitals parlem de mitjans de representació, o sovint del producte generat per aquests. La diferència entre els uns i els altres es basa en la manera en què s'enregistra, es processa i es produeix la informació: els uns generen pel rastre físic i els altres, per una abstracció matemàtica codificada en 0 i 1.
Fins fa mig segle, la nostra vida es basava en lleis físiques més o menys plausibles al nostre enteniment. Si obríem un rellotge vèiem el mecanisme de rodetes que feien moure les manilles, i en un sol cop d'ull podíem entendre el procés que calia per a fer avançar segon a segon, minut a minut, hora a hora, el rellotge. Amb una capsa de sabates, una agulla i paper sensible, podíem construir una càmera estenopeica i fotografiar una imatge. Enteníem el procés de la càmera obscura i reproduíem el fenomen físic.
Tota aquesta realitat era captada per màquines que enregistraven o produïen formats analògics (fotografies, discos, etc.) i hi havia una correspondència física entre l'objecte natural i allò que es representava.
Però la necessitat de processar més dades més ràpidament va portar l'ésser humà a necessitar màquines (ordinadors) i a crear llenguatges per a interactuar amb elles. Els ordinadors necessiten mecanismes complexos per a traduir la realitat a un llenguatge que puguin processar, el codi binari basat en 0 i 1.
Tot allò que es produeixi, es processi o es capti per mitjà d'ordinadors estarà digitalitzat, és a dir, traduït a dígits (0 i 1).
Una fotografia analògica serà aquella produïda pel sistema tradicional utilitzant pel·lícules sensibles, òptiques, papers i líquids de revelatge, etc. Una fotografia digital és produïda per un sistema informàtic complex que tradueix la realitat copsada en fitxers de 0 i 1.
El procés pel qual una imatge analògica passa a ser digital s'anomena digitalització.
La digitalització consisteix en la transcripció d'estructures analògiques a noves estructures basades en 0 i 1 o codi binari.

1.3.Digitalització

Partim del supòsit que volem digitalitzar un dibuix senzill per manipular-lo posteriorment en l'ordinador. L'esquema del procés seria el següent:
w16023_m2_03.gif
El primer que hem de fer és utilitzar un perifèric que s'encarregui de la codificació a codi binari, en aquest cas l'escàner.
El procés és senzill: les zones fosques les interpreta com a 0, i les clares, com a 1. Però perquè l'ordinador entengui la traducció cal disposar d'un intèrpret o driver. Aquest petit programa s'encarregarà d'enviar la informació que captura el perifèric a l'ordinador, de manera que la pugui entendre i reproduir.
El procés de reproducció consistirà a representar la informació que li enviï l'intèrpret mitjançant un perifèric de sortida. En el nostre exemple podríem fer servir com a perifèric de sortida tant el monitor com la impressora. En tots dos casos, la imatge resultant s'haurà de transformar en analògica.
1.3.1.L'escaneig
El procés d'obtenció de la imatge amb la qual treballarem pot variar –podem fer fotografies o baixar-les d'Internet–, però sovint haurem de treballar amb imatges que tinguem en paper o negatiu, les quals haurem de digitalitzar. Per a transferir una imatge en paper a un format digital necessitem un escàner, tant pla com de tambor (només per a treball professional d'alta qualitat).
L'escaneig és un procés molt senzill que qualsevol pot fer des de casa, però necessita una petita planificació per a aconseguir un resultat millor. Si abans d'escanejar una imatge pensem en la seva finalitat (impressió, web, etc.), ens evitarem molts problemes.
Quin tipus d'imatge volem escanejar?
L'escàner és un perifèric que ens pot donar una resolució d'imatge perfecta si li indiquem el tipus d'imatge que tenim i quines característiques ha de tenir la imatge resultant:

  • Línia o ploma: si necessitem escanejar una imatge composta de taques blanques i negres absolutes. Aquest sistema serà ideal per a escanejar còmics o dibuixos fets només amb línies.

  • Gamma de grisos: per a escanejar imatges en blanc i negre.

  • Transparència o negatiu: per a escanejar un negatiu o transparència. Molt recomanable perquè podem escanejar a una resolució més elevada i obtenir resultats d'impressió millors.

  • Color (8 bits): quan escanegem imatges a color que no necessitin una fidelitat cromàtica extrema. Les imatges que utilitzem en un web no necessiten més profunditat del color, ja que no pot ser percebuda.

  • Color (24 bits) o color vertader: per a imatges que seran impreses en una qualitat alta.

1.3.2.Quina serà l'aplicació?
Anomenem resolució el nombre de punts per polzada amb què l'escàner tradueix la imatge, la qual dependrà de l'ús que vulguem fer de la imatge i de l'escala d'aquesta.
A mida real escanejarem les imatges que s'hagin de publicar en un web a 75 punts per polzades, però escanejarem les que s'hagin d'imprimir per sobre de 300 punts per polzada. Per a imatges que s'hagin de publicar en alta qualitat utilitzarem 600, 1.200, 3.200 punts per polzada, i en alguns casos (tanques, etc.), per sobre d'aquesta qualitat.
Tot i que és aconsellable escanejar a més resolució de la que després necessitarem, s'haurà d'ajustar abans d'imprimir la imatge per a mantenir les proporcions de l'original.
Si una imatge escanejada a 1.200 punts per polzades la imprimim a 300 punts per polzada, la imatge resultant serà el quàdruple de gran que l'original. Com que la impressora només encaixarà 300 punts per polzada, necessitarà més espai –4 polzades– per a mostrar allò que en la imatge original només ocupava 1 polzada.
Per tant, abans d'escanejar cal saber a quina resolució imprimirem.
Quina mida?
Si necessitem que la imatge sigui més gran que l'original, haurem d'escanejar-la a més resolució. Però si, en canvi, ha de ser més petita, podem escanejar-la a menys resolució.
Es tracta d'una simple proporció aritmètica.
1.3.3.L'efecte moaré
L'efecte moaré és el que es produeix en escanejar una imatge ja impresa. Quan s'escaneja una imatge, l'escàner transfereix la imatge real a una quadrícula de punts o trama que simula la imatge real. En escanejar una imatge impresa, que ja està composta per una trama, les trames no coincideixen (la que hi ha en la impressió i la que l'escàner crea en la seva reproducció). En aquesta superposició de trames hi ha punts que trepitgen els altres i simulen línies sobre la imatge; aquest efecte és el que anomenem moaré.
w16023_m2_04b.jpg
Per a evitar l'efecte moaré, podem activar una opció que s'anomena desentramar. Si indiquem la qualitat de la impressió, l'escàner pot preveure aquesta superposició i evitar o minimitzar l'efecte moaré.
1.3.4.Reconeixement òptic de caràcters (ROC)
El fet que totes les famílies tipogràfiques comparteixin una estructura comuna ha permès crear sistemes informàtics que a partir de la imatge d'un text són capaços de reconèixer cada un dels seus caràcters com a tal i convertir-lo en text editable. Són els programes anomenats de reconeixement òptic de caràcters o ROC (en anglès, optical character recognition, OCR), que permeten convertir un text en paper escanejat en text apte per a qualsevol programa de tractament de textos.
Els primers programes ROC eren molt bàsics i es van crear alfabets expressament per a ells que eliminaven qualsevol ambigüitat entre una lletra i una altra. Actualment poden reconèixer un text de qualsevol tipografia, mentre que la imatge original no estigui malmesa. Per exemple, una n mal impresa de manera que la segona asta es perdi es podria reconèixer com una r.

1.4.Resolució de pantalla

La resolució de pantalla determina la qualitat de les imatges que es representen en el monitor.
Es mesura en píxels per polzada (pixels per inch), i en un monitor la qualitat màxima que podem obtenir és de 72 píxels per polzada, és a dir, una polzada pot representar un màxim de 72 píxels. Si volem representar una imatge que té una resolució de 144 píxels per polzada, en el monitor es veurà el doble de la mida real, perquè caldran dues polzades per a representar 144 píxels. Per això, els gràfics que sortiran pel monitor no han de tenir mai una resolució superior a 72 píxels per polzada. Normalment es treballa amb resolucions superiors per a aconseguir més qualitat d'imatge, però com que en el cas del monitor la qualitat màxima és de 72 píxels per polzada, és absurd treballar amb una imatge de més resolució, perquè la qualitat serà la mateixa però requerirà més volum d'emmagatzemament.
Un altre factor que hem de tenir en compte quan dissenyem o treballem amb una imatge que s'ha de visualitzar en un monitor és la mida. Les pantalles de 14 polzades van deixar lloc als monitors de 15, aquests als de 17, i ara fins i tot hi ha un nombre important d'internautes que treballen amb 19 i 21 polzades (tot i que aquests són per a usos professionals concrets). El fet que l'ordinador formi part intrínseca de la nostra vida i que cada cop més l'incorporem al nostre lleure (videojocs i pel·lícules) crea una necessitat de veure la imatge més gran i amb més qualitat.
En augmentar la mida del monitor també augmenta l'àrea que es pot observar, i per tant augmenta el nostre llenç de creació. Els nostres dissenys hauran de ser creats tenint en compte que poden ser observats a escales diferents. Alguns internatures veuran el disseny sencer, mentre que d'altres només en veuran una porció en la seva pantalla.
Els formats de la interfície gràfica clàssics (els utilitzats fins ara) són 640 x 480, 800 x 600, 1.024 x 768, 1.280 x 1240, etc., ja que deriven de la proporció 3 x 4 del monitor de televisió.
Avui dia, trobem en el mercat un altre tipus de pantalla que simula la de cinema i que té una proporció de gairebé 1 x 2: s'anomena pantalla panoràmica o widescreen. L'allargament de la pantalla comporta un allargament de la resolució de la interfície gràfica també: 1.024 x 640, 1.152 x 720, etc.
Imatge a una resolució de 1.024 x 640.
Imatge a una resolució de 1.024 x 640.
Imatge a una resolució de 1.152 x 720.
Imatge a una resolució de 1.152 x 720.
Imatge a una resolució de 1.280 x 800.
Imatge a una resolució de 1.280 x 800.
Com veiem en l'exemple anterior, un contingut estàtic, que no varia sigui quin sigui el monitor amb el qual es visiona, quedarà desproporcionat en certes condicions, mentre que en d'altres no mostrarà part del contingut.
PID_00272737_18.gif
Fer un disseny escalable ens ajudarà a aconseguir que el contingut sempre encaixi en la pantalla, sigui quina sigui la seva resolució. Però de vegades crearà altres problemes com dificultar-ne la lectura en crear-se columnes massa amples de text.

2.Els mapes de bits

2.1.El mapa de bits o bitmap

Una imatge de mapa de bits està condicionada a una retícula de punts sobre la qual es disposen una sèrie de bits d'informació que representen píxels. Aquesta informació determina el color i la posició de cada píxel, i el conjunt de tots formen les imatges del mapa de bits.
En aquesta imatge es veu la informació desada en bits.
En aquesta imatge es veu la informació desada en bits.
La qualitat del color d'una imatge de mapa de bits la determina la quantitat d'informació utilitzada per a representar cada píxel. Així, una imatge que disposi de més bits tindrà més possibilitats cromàtiques però ocuparà més memòria de l'ordinador. D'aquesta manera, podem determinar aquesta escala:

Profunditat de color

21 = 2 tons

1 bit

Imatges en blanc i negre.

28 = 256 tons

8 bits

Es poden crear imatges amb una escala tonal de qualitat.

224 = 16.777.216 tons

24 bits o color vertader

Es disposa de 8 bits per canal de llum primària (vermell, verd i blau). El resultat és una gamma cromàtica il·limitada per a l'ull humà. Les imatges de qualitat han de tenir, com a mínim, aquesta quantitat de tons.

232= 4.294.967.296 tons

32 bits o color vertader

Es diferencia de l'anterior perquè disposa d'un canal de 8 bits per a funcions gràfiques avançades, com seria les manipulacions especials o el processament d'imatges en quadricromia.

2.2.Resolució d'imatge

La resolució d'una imatge és el nombre de píxels per unitat de superfície.
La resolució s'expressa en punts per polzada (dots per inch) o píxels per polzada. Quan diem que una imatge té 300 píxels per polzada, indiquem que per cada polzada hi ha 300 x 300 píxels, és a dir, 90.000 píxels.
La qualitat d'una imatge digital està directament relacionada amb la resolució, perquè com més píxels tingui per polzada, més qualitat tindrà, però també requerirà més espai d'emmagatzemament (el fitxer serà més pesat), atès que presentarà una informació de més bits.
Anomenem informalment pes de la imatge el volum del fitxer que la conté: com més volum, més pes. Un fitxer que conté una imatge de només 15 kb és un fitxer molt més lleuger que un altre que té una imatge de 2 Mb.
Un fitxer que contingui megues o gigues d'informació sempre es considerarà pesat, ja que trigarà més en processos de gravació, còpia, duplicat, etc. És important que treballem en la resolució adequada per a evitar treballar amb arxius pesats i utilitzar espai d'emmagatzemament innecessari.
Més quantitat de píxels per polzada = més qualitat = més volum = més pes de fitxer.
En l'àmbit de producció, s'han de treballar aquestes resolucions:

Resolució
(píxels per polzada)

Producte

Perifèric de sortida

72

Pàgines web, CD/DVD

Monitor

200

Publicació impresa de qualitat mínima

Impressora convencional

600

Publicació impresa de qualitat òptima

Impremta

1.200-2.400

Filmació de fotolits

Òfset, serigrafia

2.3.El programari

Actualment hi ha una gran quantitat de programes per a tractar i crear mapes de bits. Destaquen els programes de retoc d'imatges següents:
Cal dir que no són adequats per a crear dibuixos o imatges noves, sinó que bàsicament són programes per a manipular fotografies.
Hi ha altres programes que combinen el treball de mapa de bits amb vectors, i per tant donen més possibilitats creatives. En són alguns exemples:

3.Les imatges vectorials

3.1.Imatge vectorial

Una imatge vectorial es compon d'objectes gràfics independents, creats a partir d'operacions matemàtiques que fa l'ordinador.
Els objectes que componen una imatge vectorial són línies corbes o rectes, definides per vectors, i cada un d'aquests vectors es componen per un punt inicial i un punt final, que també s'anomenen punts de control. Cada un d'aquests punts actua com a tangent, de manera que defineixen la curvatura de la recta. Els objectes que componen una imatge vectorial també es denominen objectes de Bézier.

3.2.Objectes de Bézier

Els objectes de Bézier són segments de línia connectats per nodes que poden ser rectes o corbats, factor determinat pels programes de control, els quals parteixen dels nodes, són dos i s'utilitzen per a indicar el grau de curvatura i la direcció d'un segment.

Norma

Línia 1/3

Un programa de control no ha de mesurar més d'1/3 del segment que representa.

Línia empremta

S'han d'utilitzar el mínim de nodes possible. Així, en un arc no s'haurien de fer servir més de dos nodes.

Línia tangent

El programa de control ha de ser tangent al segment, però mai creuar-lo.
Vector. Podem afegir tants nodes com vulguem a un objecte, però hi ha tres normes bàsiques que convé respectar per a aconseguir un objecte de qualitat.
Vector. Podem afegir tants nodes com vulguem a un objecte, però hi ha tres normes bàsiques que convé respectar per a aconseguir un objecte de qualitat.

3.3.La resolució en les imatges vectorials

Els objectes que componen una imatge vectorial presenten les seves pròpies característiques. Així, doncs, podem tenir objectes amb colors, mides i formes determinades, i variant una d'aquestes característiques modificarem l'objecte, cosa que vol dir que en augmentar una imatge no distribuïm una sèrie de píxels ni n'incrementem el nombre per superfície, sinó que només variem la fórmula matemàtica que calcula l'objecte. Podem fer l'ampliació que vulguem i la qualitat no es veurà afectada, sempre serà màxima. El pes de l'arxiu tampoc no variarà gaire.
Partint d'aquesta premissa, arribem a la conclusió que l'objecte vectorial no depèn de la resolució i, com a conseqüència, té una capacitat d'emmagatzemament molt inferior a la que podria tenir una imatge de mapa de bits.

3.4.Estructura dels objectes vectorials

Les característiques principals que componen un objecte vectorial són les següents:

  • Color interior: determina el farciment de l'objecte. (1) Pot anar des d'un color pla fins a una textura determinada, passant per un degradat.

  • Filet: representa la línia externa del contorn de l'objecte. Se'n pot variar el color, el tipus (línies discontínues, punts, etc.) i el gruix.

  • Posició: determina la situació de l'objecte en el document de treball. Els objectes vectorials es distribueixen en un sistema de coordenades de dues dimensions (x, y), i això equival a un pla.

  • Volum: determina quina àrea ocupa l'objecte en el document de treball.

Objecte vectorial.
Objecte vectorial.

3.5.Composició de les imatges vectorials

Les imatges vectorials es componen de diferents objectes independents, fet que permet manipular-los per separat. Tanmateix, per a comprendre com es distribueixen aquests objectes en el pla ens hem de referir per força a les capes.
El sistema de capes ha estat adaptat pels programes de mapa de bits.
Si haguéssim d'explicar la funció de les capes en una imatge digital, ho faríem comparant-les amb fulls de paper ceba. Cada capa correspondria a un full, i en cada un hi hauria representat un objecte. Si superposem cada una de les capes obtindrem una sola composició formada per diversos objectes. És a dir, una imatge vectorial es compon de diferents objectes independents, que poden ser geomètrics o textos. El resultat és una imatge de línies clares i definides.
Composició de les imatges vectorials.
Composició de les imatges vectorials.

3.6.Utilitat de les imatges vectorials

Quan es treballa amb imatges vectorials és perquè es vol fer un tipus d'imatge que es pugui modificar o retocar fàcilment, i perquè interessa el fet que té un volum d'emmagatzemament reduït. La flexibilitat de treball que permeten deriva de la independència dels seus objectes i de la possibilitat de poder-les reproduir en qualsevol mida sense perdre qualitat.
S'utilitzen per a treballs que cal imprimir amb una qualitat professional, és a dir, per impremta. Aquesta mena de treballs poden ser publicacions de revistes, logotips, tríptics, etc., i gairebé sempre en l'àmbit professional del disseny gràfic.
Però on els vectors han trobat la seva màxima expressió és en la creació multimèdia, especialment a la Xarxa. La seva plasticitat, la seva interacció amb la programació i el pes reduït dels arxius converteixen aquest format en l'ideal per a crear i transmetre creativitats per la Xarxa.

3.7.El programari

Entre la gran quantitat de programes informàtics, hi ha un grup que es coneix amb el nom de programes vectorials. Aquests programes estan pensats per a treballar amb composicions vectorials, principalment pel gran nombre d'eines que ens presenten amb aquesta finalitat.

4.Els formats de fitxers gràfics

4.1.Introducció

Treballar amb diferents formats gràfics ens permet determinar la qualitat final de la imatge digital amb què treballem. Segons el format que triem, la imatge tindrà més o menys colors, resolució i quantitat de bits o pes.
Els formats gràfics, igual que les imatges digitals, es diferencien en dues grans famílies: els formats gràfics de mapa de bits i els formats gràfics vectorials. Però entre aquests també podem diferenciar els formats de treball, aquells que guarden les característiques principals del fitxer, dels de compressió, que n'ofereixen una versió acabada i alleugerida.

4.2.Formats gràfics de mapa de bits

Dins de la gran quantitat de formats de mapa de bits que hi ha, ens veiem obligats a destacar els següents: TIFF, BMP, PSD, PICT, JPEG (2) , GIF (3) i PNG.
(2) JPEG
JPEG és l'acrònim de joint photographic experts group.
Es considera el millor format de compressió per a les imatges fotogràfiques, perquè el seu algorisme de compressió fa que no funcioni bé amb imatges amb art de línia o petites.
Bàsicament, aquest algorisme desa la imatge separant la informació de brillantor dels matisos de color i elimina les diferències de color subtils que no podem apreciar. Per això és un format de compressió que genera un procés de pèrdues, perquè encara que vulguem comprimir molt poca cosa, sempre es perd informació.
Podem controlar el nivell de compressió, i com més elevada sigui la compressió, menys qualitat tindrà la imatge i de menys volum serà l'arxiu.
Disposa de la possibilitat de càrrega progressiva, i la seva funció és similar a l'entrellaçat dels GIF, perquè permetrà que una imatge es vegi cada vegada millor gràcies a les passades successives que fa; primer apareixerà una versió de molt poca qualitat, que anirà millorant en escombratges successius.
(3) GIF
GIF és l'acrònim de graphics interchange format (format d'intercanvi de gràfics). La fórmula de compressió és secreta i pertany a Unisys.
Se sol fer servir per a imatges de fins a 8 bits (256 colors), i utilitza un algorisme de compressió anomenat LZW. La característica principal d'aquest algorisme és que no perd informació, és a dir, que una vegada descomprimida la imatge, manté la mateixa informació que quan es va comprimir.
L'algorisme fa un procés de reconeixement de seqüències consecutives de color, recorre els píxels un a un. Si hi ha més d'un píxel consecutiu del mateix color, emmagatzemarà les dades d'aquest píxel i la quantitat que n'hi ha en la seqüència.
GIF.
GIF.

En descomprimir, es limitarà la seqüència comprimida i l'executarà; així no es perd informació.
Hi ha una varietat de GIF, el GIF89a, que té la peculiaritat que permet designar un color de la paleta com a color transparent. És ideal per a quan vulguem tenir una imatge que s'adapti perfectament a un fons aliè, i així s'evita la molesta vora de color diferent.
Una altra varietat de GIF és el GIF animat. Es compon d'una seqüència de diferents fotogrames en format GIF, successió que farà que veiem una seqüència animada. Per a dur a terme aquest tipus de GIF se sol recórrer a programes creats amb aquesta finalitat, o a d'altres que ja incorporen un mòdul d'animació de GIF, com ara Macromedia Fireworks.
Els GIF (tret de la varietat animada) tenen la possibilitat d'emmagatzemar els fotogrames com a entrellaçats. Aquesta opció és útil per al Web, perquè permet que una imatge es vagi veient a mesura que es baixa i així ens podem fer una idea de la imatge que apareixerà.
w16023_m2_11.gif
Els formats JPEG i GIF són formats de compressió i es fan servir més al Web, perquè poden emmagatzemar una imatge comprimida, cosa que redueix consideradament el pes de l'arxiu. En canvi, els TIFF són els més utilitzats per a imprimir per la seva alta qualitat.

4.3.Formats gràfics vectorials

Igual que els formats de mapa de bits, entre els vectorials podem trobar una infinitat de tipus, però destacarem els següents: WMF, EMF, EPS, PDF i SVG.

Formats de gràfics vectorials

WMF

Windows metafile

És un dels formats vectorials que s'adapten millor als diferents programes del mercat. Per aquest motiu, és un dels més utilitzats a l'hora d'importar/exportar entre diferents programes vectorials.

Extensió: *.wmf

EMF

enhanced Windows metafile

És la versió millorada del WMF. El format original WMF és simple i no pot reproduir completament imatges creades per programes de gràfics sofisticats. El format EMF millora l'estructura i resol la majoria de deficiències del format WMF.

Extensió: *.emf

EPS

encapsuleted PostScript

Format creat per Adobe Systems Inc. Es crea utilitzant el sistema PostScript, que es basa en una descripció de les pàgines que s'han d'imprimir, que poden contenir text i gràfics. Posteriorment, l'intèrpret de la impressora converteix aquestes instruccions en una imatge de bits. Una de les característiques més destacables del sistema és que es fonamenta en una descripció d'objectes gràfics basats en vectors que es localitzen en un pla bidimensional. Aquest sistema permet que es pugui reproduir a la màxima resolució disponible en el dispositiu.

El PostScript és el sistema estàndard de la tipografia professional.

També és un format molt utilitzat per a exportar imatges de mapa de bits juntament amb un traçat. La utilitat pràctica d'això és poder disposar d'una imatge de mapa de bits amb fons transparent, de manera que es respecta la silueta de la figura.

Extensió: *.eps

PDF

portable document file

Format creat per Adobe Systems Inc.

Es caracteritza per la capacitat de compressió i compatibilitat entre diferents plataformes (MAC/PC). Els seus grans avantatges són els següents:

  • Permet que la maquetació es mantingui exacta entre diferents plataformes.

  • Es poden crear marques d'aigua, és a dir, permetre que el document tingui copyright.

  • Es poden crear documents amb hipervincles, que permeten d'enllaçar diferents parts del document amb una simple acció del ratolí. Per aquesta característica és l'estàndard dels llibres electrònics.

Cal diferenciar entre el lector Adobe, Acrobat Reader, que permet de llegir aquests documents però no editar-los. Per a editar-los cal el programari Adobe Exchange, que permet de crear hipervincles. Mentre que l'Acrobat Reader es distribueix gratuïtament, l'editor és de pagament.

Actualment s'utilitza per a elaborar ajudes de programes manuals, descàrrega de grans documents del web, etc. En general, és un format molt adequat per a publicacions o documents que s'han d'imprimir.

Extensió: *.pdf

SVG

scalable vector graphics

És un llenguatge que permet d'incloure gràfics vectorials en pàgines XML, cosa que li en possibilitarà la representació per la majoria de navegadors sense necessitat de mòduls addicionals.

Creat per les empreses més importants del sector, entre les quals Macromedia i Adobe, la seva principal característica és la utilització d'imatges vectorials i textos diversos en les pàgines web, mantenint les característiques originals. El format SVG permet de traballar amb text, però, a l'hora d'exportar-lo al web, el transforma en mapa de bits.

L'SVG permet de fer cerques i indexació de textos, fet que obre una gran porta a la creació de llocs web per al comerç electrònic.

És el format vectorial estàndard per al web.

Extensió: *.svg

5.Producció de material gràfic

5.1.Material gràfic imprès

5.1.1.Editorial
Anomenarem material editorial el que presenta un gran volum d'informació escrita o visual disposat en diverses pàgines. El seu contingut pot ser publicitari, divulgatiu o lúdic, però sempre és de gran valor per al lector, que ha seleccionat la publicació.
El format i la mida d'aquesta peça, juntament amb la qualitat del paper triat, atorgarà valors de qualitat i estil a la peça que poden influenciar l'apreciació del contingut.
Exemple
Per exemple, un llibre de fotografia serà valorat millor pel lector com millor sigui el seu disseny i la qualitat del paper.
Llibre
El llibre és triat pel contingut i no per l'aparença, tot i que aquesta pot ajudar a presentar el tema de què tracta al possible comprador a la llibreria. El disseny haurà de ser simple i discret, per a no interferir en el valor literari o artístic. En distingirem dues parts diferenciades: l'interior i la coberta.
L'interior és on es presenta la informació que és important per al lector i on haurem de tenir cura de disposar el text i les imatges de la manera més "llegible" possible. Caldrà tenir en compte l'amplada de la columna, el cos de la tipografia, l'interlineat, etc.
Diferents maneres de presentar l'interior.
Diferents maneres de presentar l'interior.
La coberta és la part més gràfica del llibre i la que ha de presentar un gran atractiu per a distingir el llibre entre els altres en una prestatgeria. Els elements representatius (fotografia o il·lustració) que s'hi utilitzen han de mostrar l'esperit del contingut, han de dir de què tracta el nostre llibre, i s'hauran de seleccionar tenint en compte quin és el perfil del lector i quin missatge li arribarà més directament.
Cobertes de llibres diferents.
Cobertes de llibres diferents.
El format (o forma) i la mida seran també determinants per a l'adquisició del llibre. Formats grans, quadrats, o amb formes estranyes, ajudaran a distingir el nostre llibre a la prestatgeria de la botiga, però en dificultaran la manejabilitat. Llibres amb contingut molt visual, com els llibres de disseny, fotografia o art, i llibres amb contingut especial intentaran distingir-se per l'aspecte. Sovint, tenen un preu elevat i són triats per a regalar; és, doncs, quan l'aspecte atorga valors d'objecte estètic al contingut.
Llibres amb mides i formes diferents.
Llibres amb mides i formes diferents.
Revista
La revista és triada pel comprador entre una oferta àmplia en un quiosc. Cal, doncs, que a més de continguts interessants, sigui atractiva, especialment la coberta. A la part interna de la revista, als fulls interiors, combina contingut interessant (motiu pel qual es tria la revista) amb una imatge molt atractiva. Cal que el disseny d'aquesta part interna estigui en consonància amb el tema de la revista, i sovint es creen jocs visuals entre forma (aparença) i contingut (l'article) per a distreure el lector.
Cobertes de revistes diferents.
Cobertes de revistes diferents.
El tipus de paper i acabat de la revista seran determinants per a situar la revista en una franja concreta del mercat.
Catàleg
Creats per a mostrar productes, són els representants i venedors de la marca. La fotografia pren una importància especial en haver de mostrar el producte detalladament, com també les descripcions tècniques i el detall dels elements.
Catàlegs.
Catàlegs.
La qualitat del paper i l'acabat d'aquests catàlegs dependran del tipus de productes que incloguin. En moda el catàleg tendirà a ser com una revista de moda d'alta qualitat, mentre que en un catàleg de productes de bricolatge la descripció tècnica serà decisiva.
5.1.2.Exterior
La comunicació exterior ens permet arribar a un gran nombre de persones, atès que el missatge s'exposa durant un llarg període de temps i el veu la gent que passa pels voltants a qualsevol hora. Les grans marques acostumen a incloure aquest format en les seves campanyes per la notorietat que proporciona i per les possibilitats de segmentació geogràfica, per exemple, als voltants de cinemes, o escoles, a l'entrada d'un estadi de futbol, a la platja, etc.
En la comunicació exterior la imatge té un paper determinant, ja que amb aquesta aconseguirem cridar l'atenció del vianant.
Cartell
El cartell probablement és un dels formats publicitaris i de comunicació més antics. Alguns dels artistes més reconeguts (Toulouse-Lautrec, Renau, Casas, etc.) s'hi han dedicat i sovint l'han elevat a la categoria de peça artística.
És utilitzat tant en publicitat com en comunicació interna en una empresa, missatges de recerca, etc. La indústria discogràfica el fa servir molt en la promoció de concerts ateses les possibilitats artístiques que ofereix, que són de gran atractiu per als seus consumidors.
Cartells al carrer.
Cartells al carrer.
El cartell és utilitzat, generalment, per a promocionar esdeveniments (festes, concerts, conferències, etc.). L'objectiu serà dirigir trànsit (consumidors) i, per tant, la informació relativa a l'esdeveniment serà crucial: destaquen per sobre de la resta informació sobre els llocs, participants, etc.
Tanca
La tanca és possiblement el format més gran i el que és observat des de més distància. El més important serà la imatge, que ha de captar la nostra atenció, i també l'eslògan o missatge. Aquest no podrà ser gaire llarg, ja que ha de ser llegit ràpidament i ningú no es para per acabar de llegir-lo. Haurem d'obviar tota la informació que no sigui indispensable, atès que el missatge ha de ser imminentment visual, ha de ser copsat de seguida.
Tanca.
Tanca.
Banderola
Format a mig camí entre la tanca i el cartell, la banderola presenta una gamma molt diversa de mides i formes (rectangular, quadrat, etc.). La ubicació condicionarà l'exposició del missatge (i, en conseqüència, el temps per a ser visionat): en el cas de recobrir part d'una façana, serà vist a llarga distància; en canvi, si se situen banderoles als fanals d'una avinguda, l'impacte visual creat és molt gran per la repetició del missatge (sovint es juga amb aquest efecte exposant el vianant a un joc visual de diferents colors i imatges).
Com que estan col·locades a gran altura per a ser vistes durant uns quants segons, no poden contenir gaires dades ni text gaire llarg.
Banderola.
Banderola.
Opis cabina
Els opis cabina són similars als cartells, però poden contenir molta més informació (dades, dates, etc.). Visualment han de ser impactants, ja que competeixen amb la resta d'estímuls que hi ha a peu de carrer. El vianant passa un quant temps al seu costat, en parades d'autobús i cabines (de 2 a 10 minuts), i es troba receptiu als missatges i a la interacció.
Opi.
Opi.
Tot i ser una peça impresa, darrerament s'està experimentant amb la possibilitat d'aportar-hi creativitat i interacció buscant més notorietat i impacte.
5.1.3.Màrqueting directe (MD)
El màrqueting directe (MD) comprèn activitats de publicitat i promoció anomenades below the line que es caracteritzen per intentar comunicar amb el públic objectiu o target directament. Aquesta publicitat s'envia a casa o a l'oficina en sobres personalitzats que inclouen informació del producte.
Les publitrameses o mailings acostumen a incloure els elements següents:

  • Sobre

  • Fullet

  • Carta

  • Gadgets

Totes aquestes peces formaran part d'una mateixa campanya i, per tant, totes elles presentaran imatges, colors i composicions similars.
w16023_m2_26.jpg
En el seu disseny haurem de tenir en compte que el destinatari, o target, rep aquesta publicitat en forma d'informació a casa. Cal que sigui prou atractiva per a captar l'atenció i aconseguir que s'obri i es llegeixi. Pot incloure informació bastant detallada sobre el producte i la promoció, i de vegades haurà d'incloure el fullet i un sobre per a la resposta. La qualitat del paper serà un dels aspectes tècnics que s'haurà de tenir en compte a l'hora de dissenyar-lo.
5.1.4.Material corporatiu
El material corporatiu és el que representa una empresa fora de la seva ubicació física. El seu objectiu és precisament aquest, representar l'empresa i transmetre'n els valors. Sovint, són un punt d'informació per a un contacte futur: per exemple, als sobres i cartes trobem l'adreça i telèfon de l'empresa, en un vehicle podem trobar el web, etc.
Objectes susceptibles de representar una empresa:

  • Papereria (sobres, papers i targetes personals)

  • Vehicles

  • Uniformes

  • Gadgets i d'altres

Atès que són els ambaixadors dels valors de la marca, cal parar atenció tant en el disseny com en la qualitat (paper, bolígraf, etc.), ja que el producte transfereix els valors de la seva actuació (funcionament, qualitat, etc.) a la marca.
5.1.5.D'altres (cartes de restaurants, fulls de mà o flyers, postals, etc.)
Hi ha molts altres formats de comunicació impresa al nostre voltant; de fet, n'hi pot haver tants com necessitats de comunicació. La descripció anterior és genèrica i global, i qualsevol altra peça podria estar inclosa en un o altre grup, prenent les seves característiques i peculiaritats. En qualsevol cas, el que hem de tenir en compte és el següent:

  • L'exposició: com serà vist pel nostre públic objectiu –exposició ràpida (uns quants segons), exposició continuada (durant més temps, cosa que dóna lloc a una certa reflexió).

  • La visibilitat: en quines circumstàncies es produirà la comunicació –al carrer (canvis climàtics), des del sofà de casa, etc.

  • El conjunt: el que envoltarà el nostre missatge –si estarà sol (un fullet enviat a casa) o bé competint amb altres productes (revista al quiosc).

  • La predisposició del públic objectiu: es valorarà si l'individu es troba davant del missatge per elecció pròpia (tria comprar o sol·licitar una informació), o si aquesta atenció s'ha "robat".

5.2.Material gràfic virtual

Des de l'aparició d'Internet i posteriorment, l'entorn de la comunicació i la publicitat ha evolucionat molt ràpidament. S'han creat nous formats, serveis i negocis capaços d'oferir el que en la comunicació tradicional no es podia ni somiar. El creixement continua i el desenvolupament de noves eines, formats i possibilitats de comunicació sembla il·limitat. Internet ha representat una revolució en la comunicació més gran de la que va significar en el seu moment l'invent de la impremta de Gutenberg.
Com en l'apartat anterior, es fa difícil crear una categorització de formats que agrupi tots els que es poden trobar avui dia a la Xarxa i en el mercat. Aquesta és una classificació que intenta recollir els principals formats gràfics digitals.
5.2.1.Formats digitals de publicació
La virtualitat que aporten els mitjans digitals proporcionen la possibilitat de moure gran volum d'informació i fer-ho d'una manera ben diferent de la que utilitzàvem fins a l'aparició de la informàtica. El desenvolupament de l'hipertext i els enllaços van permetre trencar la seqüència lineal de la informació i van donar a l'usuari la possibilitat de decidir en cada moment on anar, què veure i què fer.
El que anomenem formats digitals no són formats com a tals, ja que no existeixen, sinó que són interfícies, enllaços de comunicació entre una informació digitalitzada (0 i 1) i l'usuari. Podríem dir que és només un traductor que permet la interacció entre aquests dos mons, el real i el virtual. Les següents són les interfícies que utilitzem més sovint.
Lloc web o website
El lloc web és la interfície que permet comunicar una empresa o entitat amb un grup d'usuaris (el seu públic objectiu). Aquesta interfície pot tenir diferents aparences però dependrà en gran manera de l'objectiu de comunicació que tingui designat: explicar sobre l'empresa, vendre productes, crear comunicació en una comunitat, etc.
La imatge (o look and feel) i la seva organització dels continguts (estructura) estaran en consonància amb l'objectiu del web. La informació haurà de ser presentada netament i clarament seguint les pautes d'usabilitat i accessibilitat marcades.
Podem classificar els webs en els tipus següents segons l'objectiu de comunicació:

  • Web corporatiu

  • Web divulgatiu

  • Web lúdic

  • Web comercial (e-commerce), B2C, B2B, etc.

  • Web portal

  • Web comunitat

  • Web publicitari

Al web publicitari les estructures de navegació i contingut són més flexibles, ja que l'objectiu que es busca és més impactar que no pas comunicar. Busquen transmetre valors emotius de la marca i que l'usuari s'hi identifiqui. Són webs perfectes per a experimentar amb la creativitat i la tecnologia.
Web publicitari.
Web publicitari.
Tot i que la tecnologia avança i ens ofereix cada cop més possibilitats, el lloc web continua tenint un gran handicap, el volum de la informació amb el qual es pot treballar.
La informació que veiem en un lloc web ha estat transmesa per la Xarxa abans d'aparèixer en la nostra pantalla. Els arxius han de ser lleugers perquè la comunicació es produeixi sense interrupcions, la qual cosa comporta una limitació de l'ús de vídeos, imatges de gran qualitat, etc.
El gran avantatge que ofereixen els llocs web és que els canvis i les actualitzacions són visibles immediatament després de ser publicats.
CD-ROM
El CD-ROM, com el lloc web, pot tenir objectius de comunicació molt diversos, i per tant, aparences molt diverses. La gran diferència que presenta amb el lloc web és que el CD-ROM conté tota la informació en el disc i no es necessita baixa-la. Això vol dir que podrem disposar d'arxius més pesats, animacions en vídeo, etc. i, per tant, crear imatges molt atractives. L'inconvenient és que no poden ser actualitzats.
Segons el contingut i l'objectiu de comunicació, podem classificar els CD-ROMS en els tipus següents:

  • CD-ROM promocional

  • CD-ROM catàleg

  • CD-ROM d'utilitats

CD-ROM promocional.
CD-ROM promocional.
DVD
Els DVD es diferencien tecnològicament dels CD-ROM només en la capacitat d'emmagatzemament. Per tant, tindran el mateix procés de creació i producció que aquests.
En el mercat trobem un gran volum de DVD de pel·lícules que tenen una part introductòria interactiva. El disseny d'aquesta serà com la de qualsevol altre producte interactiu, però sense restriccions de pesos i formats.
5.2.2.Formats digitals publicitaris
Banners o cibertires
El banner (cibertira) és el recurs més utilitzat per l'anunciant per a col·locar la seva publicitat a Internet. El banner estàndard té una mida de 468 x 60 píxels, tot i que avui dia tenim un ventall molt ampli de mides. Abans el banner era una animació GIF, però avui dia, gràcies a l'evolució de la tècnica, podem dotar-los de moviments més sofisticats, incloure-hi so i interacció, cosa que els converteix en un veritable diàleg amb l'usuari. L'objectiu sempre serà el mateix, aconseguir que l'usuari hi cliqui per transportar-lo a una pàgina concreta.

  • Banner GIF

El banner GIF es considera bàsic, ja que en totes les campanyes s'han de desenvolupar banners d'aquest tipus, encara que se'n creïn altres de més sofisticats. El GIF té l'avantatge que es pot veure en totes les versions de navegadors i sistemes operatius i és per això que és bàsic.
Els portals on hi ha molta publicitat acostumen a limitar-ne el pes entre 12 kb i 15 kb, motiu pel qual no podrem incloure moltes fotografies i efectes.
Banner del Servicaixa.
Banner del Servicaixa.

  • Banner Flash

El Flash dóna grans possibilitats a les cibertires, ja que pot incloure interacció (només si el cursor es troba dintre de l'àrea establerta), so i vídeo, i atès que treballa amb gràfics vectorials es poden aconseguir animacions molt interessants amb un pes reduït (o raonable).
Banner d'Endesa.
Banner d'Endesa.

  • Banner richmedia

Avui dia els portals, i les agències que en gestionen la publicitat, disposen d'eines que faciliten la creació de banners molt més plàstics i que doten el missatge de més impacte. So, vídeo i morphins (transformacions) són alguns dels recursos utilitzats per a captar la nostra atenció.
Botons
Els botons són banners més petits i generalment de format més quadrat, que tenen les mateixes característiques i aconsegueixen resultats similars.
Botó d'Endesa.
Botó d'Endesa.
Skyscraper
Els skyscrapers, creats per a aprofitar el marge esquerre que quedava desert en navegar a una resolució superior a la prevista (800 x 600), són cada cop més comuns a causa del creixement continu de monitors i, consegüentment, de les resolucions de visionament.
Tenen característiques similars als banners, amb la diferència que aquest format és vertical i més gran.
Skycraper d'Eurobet.
Skycraper d'Eurobet.
Skyscraper d'Endesa.
Skyscraper d'Endesa.
Tant els banners, com els botons i els skyscrapers poden tenir dimensions molt diverses, però sovint són de mida molt petita o requereixen proporcions (extremadament verticals/horitzontals) que en dificulten el disseny.
5.2.3.Formats digitals de distribució electrònica
La popularització del correu electrònic ha permès que la comunicació entre usuaris i empreses s'agiliti, i en alguns casos, fins i tot es consolidi.
Newsletters o butlletins d'informació
El newsletter o butlletí d'informació és una mena de diari electrònic que permet a l'usuari mantenir-se al dia sobre nous productes o serveis. Aquest full d'informació electrònica s'envia periòdicament a tots els usuaris inscrits i l'objectiu és informar de les darreres notícies i/o serveis i/o productes apareguts.
La seva estructura ha de ser clara, organitzada i prou atractiva per a induir l'usuari a clicar-hi o sol·licitar més informació.
Newsletter de Miró.
Ampliació
Newsletter de Miró.
Correu electrònic promocional (permition marketing)
El correu electrònic de promoció té com a objectiu comunicar sobre novetats o ofertes. Generalment se centra en un únic producte o servei, no en tota una gamma, com el butlletí d'informació. Creativament, busca ser molt atractiu per a dur l'usuari cap a l'oferta del producte.
Correu electrònic de promoció de Caprabo.
Ampliació
Correu electrònic de promoció de Caprabo.
D'altres (màrqueting viral o viral marketing)
De vegades, com a variant de l'anterior, s'envien correus electrònics que contenen jocs, animacions o vídeos amb l'objectiu de causar més impacte i que formen part de campanyes de màrqueting viral.
Cyberpostal o e-card de Serviticket.
Cyberpostal o e-card de Serviticket.
El permition marketing es basa en activitats de publicitat i promoció per a les quals la marca ha obtingut el permís del receptor, el qual, de manera implícita, ha sol·licitat obtenir més informació o rebre correus electrònics promocionals.
El concepte principal del màrqueting viral és la d'estendre, contaminar ràpidament. L'objectiu és que qui rep un missatge el transmeti a un grup de contactes, i aquests a la vegada el reenviïn a més gent, multiplicant l'efecte.

5.3.Un altre material gràfic

Al nostre voltant trobem molt més material gràfic del que es mostra en aquesta classificació: trobem anuncis en autobusos i taxis, aparadors, estands a fires, avions amb pancartes, etc. Per això seria quasi impossible anomenar-los tots, hi ha tantes representacions gràfiques i publicitàries com la nostra ment pugui imaginar-se. La seva creació i producció serà, en definitiva, com la descrita per a la resta de formats, només caldrà ajustar-se a les seves peculiaritats, on serà vist, l'entorn, el temps que el públic objectiu hi estarà exposat, la ubicació, etc.
Anuncis al metro de Londres.
Anuncis al metro de Londres.
Senyalètica
Als carrers i espais públics necesitem indicacions que ens previnguin d'un perill o ens mostrin el camí. El conjunt de cartells i senyals que trobem en escoles, universitats, aeroports, etc. és el que coneixem com a senyalètica. La funcionalitat és vital en aquests elements ja que en la seva representació es trobarà la funció.
Exemple
Un cartell creat per a indicar l'emplaçament dels lavabos, si indica una altra direcció, no és útil i no té cap sentit.
Gràficament es caracteritzen per mostrar imatges molt simples i esquemàtiques, icones. No apareix text, excepte quan és un nom propi, i es mostra d'una manera ben visible i contrastada.
w16023_m2_40.gif
Senyals.
Senyals.

5.4.Producció de material gràfic per a imprimir-lo

En la creació de material gràfic per a imprimir-lo s'utilitzen dos tipus de programari: el programari de disseny i creació i el programari d'autoedició o DTP (desktop publishing).
Segons quin sigui el producte que hem de crear n'utilitzarem un o altre, o combinarem tots dos.
5.4.1.Programari per a la creació i disseny
El programari que hi ha per a la creació i disseny permet dibuixar i crear il·lustracions que després seran inserides en els documents creats amb programes d'autoedició per a imprimir-los, encara que també ens permetran crear un disseny acabat.
Els principals programes que es fan servir per a crear i dissenyar el material gràfic són els següents:

  • Adobe Illustrator

  • Corel Draw

5.4.2.Programari d'autoedició o DTP
Aquests programes permeten crear els layouts o diagramacions, i dissenyar el material a partir d'aquestes estructures. Són programes utilitzats principalment per a productes editorials (revistes, llibres, etc.) i estan creats per a manipular grans fitxers de text i un elevat nombre d'imatges.
Els programes principals que s'utilitzen per a editar aquest tipus de materials són els següents:

  • Quark Xpress

  • Indesign

  • Pagemaker

5.4.3.Treballant amb fitxers per a imprimir-los
Quan hàgim de treballar amb fitxers per a imprimir-los, caldrà que tinguem en compte alguns dels requeriments tècnics.
Quan dissenyem el nostre projecte, caldrà que creem una estructura o layout en la qual inclourem tots els elements. Les imatges, atès que seran molt pesades, les inclourem en baixa resolució per a fer el document de treball més lleuger i manejable. Aquestes imatges, però, s'adjuntaran al document perquè siguin escanejades (si no les tenim escanejades ja) a la resolució adequada.
La impressió editorial treballa amb el que s'anomena quadricromia, que es basa en la suma substractiva del color: és el procediment que reprodueix el color real amb la impressió de quatre tintes (magenta, groc, cian i negre).
Un cop acabat el disseny, haurem de fer-ne els originals o documents preparats per a ser enviats a la impremta, on produiran els fotolits (negatiu de la imatge que s'ha d'imprimir) corresponents a cada color, i amb aquestes "pel·lícules" s'impressionaran les plaques d'impressió. Quan comenci la impressió el paper passarà per cadascuna d'aquestes quatre plaques, sumant els colors i aconseguint una imatge final a tot color.
Amb la quadricromia es pot aconseguir imprimir qualsevol color de l'espectre de llum; tot i així, pot variar, ja que és difícil aconseguir un color molt concret. Si necessitem utilitzar un color exacte i que romangui immutable, podríem triar-lo amb una carta de color (per exemple, un Pantone) i imprimir una tinta extra. En aquest cas, el paper experimentaria cinc impressions: magenta, cian, groc, negre i el color Pantone.
Però no sempre caldrà que imprimim amb quadricromia, ho podem fer amb una sola tinta, o dos o tres. Dependrà del disseny i del pressupost, ja que cada impressió és un cost: com menys tintes fem servir, serà més barat.
Un cop tinguem el nostre disseny a la impremta, haurem de controlar que els colors siguin els que esperàvem i per això sempre demanarem proves d'impressió abans de fer una llarga tirada del nostre material. Cal tenir en compte que la qualitat del paper afectarà la impressió i l'efecte dels colors variarà segons cada paper.
També és important veure com serà l'acabat definitiu, l'encuny, el plegat, etc. per tal de prevenir problemes posteriors.

5.5.Producció de material gràfic digital i/o interactiu

Per a crear un sistema multimèdia, hi ha dos tipus de programari que ens poden ajudar, el programari d'autor i els editors de pàgines web.
Segons quina sigui la finalitat del producte, en el mercat hi ha diversos programes que faciliten la tasca de producció.
5.5.1.Editors de pàgines web
Els editors de pàgines web tenen la funció de facilitar-ne la creació, sense conèixer el llenguatge HTML (llenguatge d'etiquetatge d'hipertext o hypertext markup language).
Abans, per a crear pàgines web es necessitava un editor de text qualsevol (Notepad) i s'havia de conèixer el llenguatge HTML. Per exemple, si es volia introduir un hipervincle, s'havia d'introduir el següent:
<a href="pagina.htm">HIPERVÍNCULO</a>
Lògicament, a la gent de perfil menys tècnic li resultava molt més difícil crear pàgines web.
Amb l'aparició dels editors de pàgines web WYSIWYG (what you see is what you get), el problema va anar desapareixent a mesura que se'n creaven noves versions, perquè de simples generadors d'HTML han evolucionat fins a aconseguir treballar amb capes o incorporar dinamisme. Amb un simple clic en el botó adequat, el programa s'encarregava de crear la programació requerida.
Dels anteriors, n'hi ha dos que són els més comuns: Dreamweaver i Frontpage.
Si Frontpage va ser un dels primers a aparèixer, Dreamweaver va conquerir part del mercat gràcies als mòduls de programació que duia incorporats. Programar funcions complexes de Javascript, com ara un botó il·luminat en passar-hi per sobre, requeria un simple clic sobre la imatge i un altre sobre l'acció que es volia dur a terme.
Avui dia, Dreamweaver continua essent el programa més utilitzat pels professionals en la maquetació de pàgines web. Fins i tot, en casos més complexos en els quals hi ha integració de PHP o ASP, etc., el maquetador o developer crea un HTML mare on després aplica el codi que enllaça amb una base dades o desencadena altres processos.
5.5.2.Creació i integració de gràfics per a un web
Quan l'objectiu és crear una aplicació que s'ha de veure en un web, el factor que preval en la producció és el volum o pes dels arxius, perquè les velocitats de transferència d'aquest mitjà encara són massa baixes. És per això que és tan important comprimir les imatges al màxim per a transmetre el mínim pes possible.
Resolució
La resolució amb què s'ha de treballar un mitjà web no ha de superar els 72 píxels per polzada, ja que per sobre d'aquesta xifra no és perceptible.
Optimització
L'optimització és el procés pel qual qualsevol procés o element és explotat al màxim utilitzant els recursos mínims. És a dir, és el procés pel qual amb un esforç mínim aconseguim el màxim resultat.
En la creació de productes multimèdia l'optimització és clau. Necessitem que les imatges i animacions es produeixin i es transmetin ràpidament (com més, millor) i amb una bona qualitat.
Les imatges i els vídeos dels nostres productes (webs, CD, etc.) han de ser atractius amb una certa definició en la qualitat, però alhora, han de ser lleugers per a ser transmesos amb rapidesa. És a dir, per una banda voldrem el màxim de qualitat d'imatge (gran definició) i, per l'altra, el pes mínim (velocitat de transmissió).
El pes i la qualitat de la imatge són directament proporcionals: com més resolució, més pes; com pitjor qualitat d'imatge, menys pesa l'arxiu. Així doncs, haurem de trobar l'equilibri entre aquests dos factors, el qual dependrà de la finalitat de la imatge. Per exemple, en un web tots els elements hauran de ser extremadament lleugers i per això una cibertira ha de pesar entre 12 kb i 14 kb, mentre que en un CD-ROM podem utilitzar vídeos que pesin fins i tot megabytes.
L'optimització és el procés pel qual ajustem la qualitat d'una imatge fins a arribar a un pes d'arxiu raonable que mantingui una qualitat acceptable. En aquest procés, una imatge que es trobi en mapa de bits l'optimitzarem en un fitxer de compressió GIF o JPG.
En vídeo també serà important optimitzar les imatges i en els casos adequats utilitzar compressió streaming.
Compressió
La compressió és inevitable quan el producte es visualitzarà en un web. S'han de comprimir les imatges per a aconseguir-ne un bon rendiment interactiu: s'han de visualitzar prou ràpidament per a poder interactuar-hi, però mantenint una certa qualitat. Hi ha molts logarismes de compressió i cada format té el seu. En el cas del web, el format GIF i JPEG són els estàndards.
Hi ha dos tipus de compressió: amb pèrdua i sense. Els sistemes de compressió analitzen les dades redundants o repetides i les substitueixen amb caràcters de mostra o representatius, fet que redueix el volum de l'arxiu. Aquesta operació matemàtica la duu a terme un algorisme de compressió o codec (compressor/descompressor), que s'encarrega de comprimir i expandir l'arxiu. Cada mitjà té els seus formats de compressió.
La compressió amb pèrdua és un sistema en què se sacrifiquen petites quantitats d'informació per a aconseguir que l'arxiu tingui menys volum o pes. Els sistemes de compressió amb pèrdua s'utilitzen en molts dels formats de vídeo i d'imatge, com el JPEG. Normalment aquests sistemes permeten triar el nivell de compressió.
La compressió sense pèrdua es pot fer servir per a arxius d'imatge que tinguin com a destinació la impressió o qualsevol altra situació en què la pèrdua de dades no seria assumible. Com que no hi ha pèrdua de dades, els algorismes de compressió no redueixen significativament la mida de l'arxiu. És el cas de formats com el TIFF o el BMP, i també el GIF.
GIF.
GIF.
Cal dir que els fitxers TIFF o BMP s'acostumen a utilitzar sense compressió, ja que es trien per a mantenir la màxima qualitat de la imatge. En canvi, quan s'escull emmagatzemar un arxiu en format GIF és perquè es vol comprimir al màxim mantenint una certa qualitat. És per això que el GIF s'utilitza en la transmissió per Internet i el TIFF en la impressió en paper.
Al Web hi ha un triumvirat de formats gràfics que són els que suporten tots els navegadors o browsers –GIF, JPEG i PNG–, tot i que aquest darrer no és tan universal com els dos primers.
El GIF pesa poc perquè per a la seva presentació només disposa d'una paleta màxima de 256 colors.
Quan s'ha de fer servir GIF o JPEG?
Ús de GIF o JPEG

  • El format d'arxiu per a les fotografies o els gràfics degradats és el JPEG. Aquest format disposa d'una profunditat de color de 24 bits, és a dir, milions de colors. Per això és capaç de representar matisos. El còdec que utilitza aquest format permet comprimir al màxim imatges amb milions de colors.

  • Les il·lustracions i els gràfics que utilitzen colors plans i no tenen degradats funcionen millor amb el format GIF (8 bits de profunditat de color = 256 colors). La paleta Adaptative és la més adequada per a aquest format quan la seva destinació és el Web.

Aquesta és la regla general, però tant el nivell de compressió idoni en el format JPEG com la quantitat de colors adequada per a un arxiu GIF depenen de cada imatge, de manera que sempre s'han de provar diverses possibilitats per a triar finalment l'opció en què la pèrdua de qualitat sigui assumible davant d'un pes mínim de l'arxiu. Provarem de reduir al màxim el nombre de colors en la paleta en el cas dels fitxers GIF, o provarem de treballar amb menys qualitat de compressió amb els JPEG. (Recordem que una pàgina web no hauria de pesar més de 30 kb en total, és a dir, incloent-hi totes les imatges, textos i animacions.)
A més de renunciar a qualitats altes en els diversos mitjans que es visualitzaran mitjançant un navegador, també cal fer-se la idea que els volums o pesos de les imatges i els vídeos no poden ser grans perquè tindrien un pes excessiu. És més convenient utilitzar volums petits en què la qualitat no es vegi gaire compromesa, que no pas fer-ho a la inversa.
Característiques dels formats GIF i JPEG

  • L'entrellaçat (GIF) o progressiu (JPEG). Aquesta característica permet començar a visualitzar en el navegador algunes línies de la imatge. La imatge es va definint a poc a poc i l'usuari pot començar a intuir la imatge des del començament. L'entrellaçat afegeix memòria i s'aconsella fer-ne ús quan les dimensions de la imatge superin els 130 x 130 píxels.

  • La transparència. Només el GIF permet triar un color de la paleta de colors i fer-lo transparent. Així, mitjançant aquesta transparència, es veu el color del fons de la pàgina web. Se sol fer servir per als fons de les imatges.

  • L'animació. El format GIF permet desar diverses imatges GIF en un sol arxiu. Cadascuna s'emmagatzema en un marc o frame diferent, que després el navegador de l'usuari executarà en ordre seqüencial. La velocitat d'execució de l'animació es pot controlar, i aquest format guarda la primera imatge i les variacions que hi ha entre la resta d'imatges. La velocitat de reproducció és controlable.

El format PNG combina algunes de les millors característiques del GIF i del JPEG: suporta milions de colors, comprimeix millor les imatges fotogràfiques que el GIF, accepta diversos nivells de transparència i l'entrellaçat. L'inconvenient d'aquest format és que va aparèixer molt més tard que els anteriors i els navegadors antics no l'acceptaven. Avui dia, continua en desús malgrat que s'ha superat aquest problema.
Tots aquests formats són mapes de bits, i per tant no necessiten cap plug-in per a la seva visualització, al contrari que els formats vectorials, com el Flash, que sí que en necessiten. Això pot ser un problema, ja que si produïm una animació amb la darrera versió del programa serà totalment invisible per a tots aquells usuaris que no "estiguin al dia", és a dir, que no tinguin actualitzat l'ordinador. Però el gran avantatge que ens aporten els formats vectorials és que són arxius molt lleugers, que incorporen animació i fins i tot interacció.
Les animacions s'optimitzen amb la utilització dels formats més adequats per al suport final: comprimeixin millor l'arxiu, redueixen al màxim els colors utilitzats durant l'animació i el volum o pes és baix.
5.5.3.Creació i integració de gràfics en un CD
No hi ha dubte que no és el mateix crear una aplicació per a un CD/DVD que fer-ho per a Internet, perquè la diferència principal és la velocitat de transferència.
Les quotes de transferència d'un CD/DVD o un disc dur són molt més elevades que les que ofereixen les connexions actuals d'Internet, per la qual cosa el temps de càrrega de l'aplicació és inferior.
Més velocitat de transferència = Menys temps de càrrega
Quan s'ha de crear una aplicació per a una plataforma que permeti velocitats de transferència altes, els arxius que hi intervenen poden ser de volums o pesos elevats, perquè aquesta plataforma disposa de la velocitat adequada per a presentar la informació en un temps mínim, a més d'una capacitat d'emmagatzemament àmplia amb aquesta finalitat.
Tipus d'arxius que es poden fer servir
Hi ha diversos tipus d'arxius, i de cada un, diversos formats (segons el programari que es fa servir), de manera que la llista podria ser extensa.
La llista següent destaca els més coneguts o utilitzats en el món multimèdia:

  • Animació i multimèdia: GIF animats, presentacions PowerPoint i animacions Flash.

  • Imatge: BMP, GIF, JPEG, LRG, PSD (Photoshop), MacPaint, PNG, PICT, PhotoCD, PostScript.

  • So: AIFF, WAV, MPEG3, MP3, System 7 (MAC).

  • Vídeo: Quicktime (Windows i MAC) i AVI (Windows).

  • Text: RTF, HTML i ASCII.

  • Paletes: PAL, Photoshop, CLUT.

Escollir un format o un altre depèn, sobretot, de la plataforma en què s'ha de reproduir l'aplicació. Per exemple, si es tracta d'un vídeo i el format que es tria és l'AVI, aquesta aplicació només es podrà reproduir en un PC, perquè els MAC no accepten aquest format. Si es vol adaptar als dos formats caldria treballar amb QuickTime.
5.5.4.Optimitzar l'aplicació
Sovint es comet l'error de pensar que en disposar de molt d'espai d'emmagatzemament, en un CD/DVD o en el disc dur, no cal preocupar-se de la velocitat de reproducció, conclusió del tot errònia.
Com s'ha comentat abans, la velocitat de transferència és el més important, i per més espai de què disposem, no s'assegurarà mai una reproducció òptima si no s'ha depurat el volum de l'aplicació, més ben dit, s'ha optimitzat al màxim.
Per a optimitzar l'aplicació s'hauran de tenir en compte diversos factors:

  • Resolució dels gràfics: com que les aplicacions interactives es mostren en el monitor, que té una resolució màxima de 72 punts per polzada, els gràfics no han de ser més grans, perquè es veurien exactament igual que un de 72 punts per polzada, però tindrien un volum superior.

  • Paleta de colors: quan s'abusa d'imatges amb milions de colors, la conseqüència és una reducció de reproducció, perquè la quantitat de dades que s'han de reproduir és superior. En aquests casos, el més lògic és optimitzar les paletes, més ben dit, indexar-les.

Una pràctica molt habitual a l'hora d'utilitzar el nombre mínim de paletes possible és fer servir la mateixa per a diverses imatges. Així, si es treballa amb imatges en color sèpia, es crearà una paleta en què apareguin les diferents tonalitats en sèpia i s'aplicarà en totes les imatges d'aquesta mena.

  • Animacions: segons el nombre de fotogrames per segon, les animacions poden ocupar més o menys espai i, per tant, requerir més o menys recursos de l'ordinador.

Velocitat fps (fotogrames per segon)

Mitjà de reproducció

15

Internet

25

Mitjà televisiu

  • Vídeo: el vídeo és el mitjà que pot ocasionar més problemes de reproducció, principalment pel volum.

Tot i disposar de diferents compressors de vídeo, aconseguir el volum ideal depèn de l'experiència i de la qualitat que es vulgui aconseguir.
Treballar amb vídeo
Aquest mitjà requereix una gran quantitat de memòria per a l'emmagatzemament, el tractament i la reproducció. Es tracta del problema principal que cal abordar durant el tractament de la informació audiovisual, i la solució passa per la compressió.
La rapidesa de càrrega i resposta d'una aplicació interactiva és essencial: el vídeo és el mitjà que consumeix més memòria, de manera que s'ha de fer servir amb mesura. Si el suport final és un CD, es poden incloure força seqüències de vídeo, però si la destinació final del producte és el Web, el marge és escàs.
La tecnologia streaming és la que possibilita que el vídeo estigui cada vegada més present al Web. Aquesta tecnologia permet la distribució per Internet d'àudio i vídeo en temps real. Els arxius no s'han de baixar completament en l'ordinador per a poder-los executar després, sinó que l'usuari pot començar a visualitzar i escoltar l'arxiu al mateix temps que el baixa, amb la qual cosa s'evita un temps d'espera descoratjador.
Tot i que els navegadorsdisposen de plug-ins i controls ActiveX capaços de reproduir els formats més populars (AVI, MPEG, QuickTime), els formats streaming com RealVideo i les últimes versions de QuickTime i NetShows'estan imposant a Internet pels avantatges que ofereix aquesta nova tecnologia.
Indexació de paletes
Les paletes indexades són les que presenten un nombre definit de colors: no poden superar els 256 colors.
A diferència de les imatges de milions de colors, les de 256 ocupen menys espai d'emmagatzemament, però la fidelitat dels colors és inferior.
Paleta d'una imatge indexada.
Paleta d'una imatge indexada.
Com es pot veure en els exemples anteriors, la diferència entre les dues imatges està, fonamentalment, en la transició entre tonalitats. En la imatge de 256 colors (indexada), la transició és més evident, perquè es disposa de menys gammes intermèdies.
La paleta d'una imatge indexada és totalment configurable. Així, si es volgués tenir una paleta de menys de 256 colors, només convindria seleccionar el color en qüestió i suprimir-lo. En fer-ho, el color desapareixeria de la imatge.
La reducció de colors d'una paleta és una pràctica habitual a l'hora d'optimitzar una imatge. La finalitat és aconseguir utilitzar el nombre de colors absolutament necessaris i suprimir les gammes intermèdies.

6.Mapes conceptuals

Imatge digital enfront d'imatge analògica.
Imatge digital enfront d'imatge analògica.
Mapa de bits enfront de vectors.
Mapa de bits enfront de vectors.
En producció de material gràfic cal tenir present:

  • Suport

  • Transmissió o publicació

  • Condicions d'exposició - visibilitat

  • Moment d'exposició - visibilitat

Aquests factors determinaran:

  • Format

  • Estructura

  • Missatge (més o menys complex)

Els formats digitals estan determinats pel pes, mentre que la publicitat exterior ho està pel context i pels factors ambientals.

Activitats

Activitat 1
Proveu d'escanejar una mateixa imatge amb les característiques següents:

  • Escala de negre

  • Línia

  • Color (diverses resolucions)

Comproveu com varia el pes del fitxer.
Activitat 2
Escanegeu la mateixa foto amb resolució 75 punts per polzada i 1.500 punts per polzada i feu una prova d'impressió. Canvia el format? Podeu calcular quant heu de reduir la resolució per obtenir la imatge en una mida de 10 x 10 x 8 cm?
Activitat 3
1. Creeu una imatge simple, que per exemple consti d'un triangle i dos cercles, deseu-la com a BMP, amplieu-la (canvieu-ne la mida) un 1.000% i torneu-la a desar. En quant ha incrementat la mida del fitxer?
2. Creeu la mateixa imatge en vectorial (per exemple, Flash) i deseu-la. Torneu a obrir-la i amplieu-la un 1.000% i deseu-la. En quant ha augmentat la mida del fitxer? Quina qualitat visual manté?
Activitat 4
Deseu una mateixa imatge en formats GIF i JPG i torneu a obrir els fitxers. Quin té més qualitat? Quin pesa més? Feu proves en diferents resolucions.

Bibliografia

Bibliografia bàsica
Goto, K.; Cotler, E. (2002). Rediseño de sitios web. Madrid: Prentice Hall.
Götz, V. (2002). Retículas para Internet y otros soportes digitales. Barcelona: Index Book.
Meeker, M. (2001). La publicidad en Internet. Barcelona: Granica.
Bibliografia complementària
Baños González, M. (2001). Creatividad y Publicidad. Madrid: Laberinto ("Comunicación").
Bruisma, M. (2003). Deep Sites. Londres: Thames & Hudson.
Drug, S. (2001). No me hagas pensar. Madrid: Prentice Hall.
Burns, M. (2002). Top 100 Internet mistakes you can't afford to make. McGraw-Hill.
Fleming, P. (1999). Hablemos de Marketing Interactivo. Madrid: ESIC Escuela superior de Gestión Comercial y Marketing.
Götz, V. (2002). Retículas para Internet y otros soportes digitales. Barcelona: Index Book.
Veen, J. (2001). Arte y Ciencia del Diseño Web. Madrid: Prentice Hall.
Wong, W. (1989). Fundamentos del diseño bi y tri-dimensional. Barcelona: Gustavo Gili.