ebooks

CREIX AMB INTERNET

Creació d’e-books interactius

2

Sessió 1 1.Funcions del disseny d’e-books Funció comunicativa: Ordena la informació per fer-la més clara i llegible a la vista del receptor.

Funció publicitària: Intenta persuadir el receptor amb escenes visualment atractives.

Funció estètica: Forma i funcionalitat són dos elements propis del disseny gràfic, el producte del qual ha de servir per a millorar algun aspecte de la nostra vida i per fer-nos més agradable el seu ús.

El principi de funcionalitat La funcionalitat és la qualitat que tenen algunes formes, objectes o elements de cobrir o satisfer una necessitat. Els principis de funcionalitat, gairebé sempre han estat presents en el disseny industrial i l’enginyeria. En el disseny gràfic i la publicitat la funcionalitat compte si el producte creat té els efectes desitjats.

Importància de la funcionalitat Una funció ve al mateix temps que una necessitat. Hi ha necessitats primàries i capritxos, el normal és quan una empresa llança una campanya publicitària ho fa per cobrir aquestes necessitats. Es fa per arribar a uns objectius, i aquí és on entra el disseny audiovisual per fer possible aquests objectius. Així s’hauria d’evaluar un bon disseny: el que hagi cobert els seus objectius.

2. Segmentar i jerarquitzar Les diferències de mida jerarquitzen amb claredat En la decisió de la mida influeixen moltes més coses de les que es veuen: - Tipus de producte.

- Públic al que es dirigeix.

- Suport.

- Mida del dispositiu.

Si cap d’aquets factors ha estat resolt harmònicament respecte el conjunt, poden sorgir problemes en qualsevol fase del procés. I resultarà més costós, més lent, s’haurà de retocar....

La funcionalitat més elemental comença per una dimensió adequada.

3

Microlectura i macrolectura Per Microlectura s’ha d’entendre la necessitat experimentada per el lector de dirigir-se a parts molt concretes i relativament petites del contingut per arribar a la informació que busca. Un diccionari, un catàleg una guia de telèfons, són alguns exemples.

Per contra, en altres ocasions, la lectura que assumeix l’espectador és d’un caràcter tan genèric que és l’impacte general el que predomina. El conjunt és el que crea l’atracció i després ens fixem en els detalls, materials, colors...

Segmentar i jerarquitzar Succeeix amb molta freqüència en les microlectures, per a oferir una bona informació és necessari segmentar, classificar i jerarquitzar. I en ocasions en blocs molt petits, com en un diccionari. Les diferències de grandària jerarquitzen amb claredat, negretes i cursives es refereixen a conceptes específics, i els signes extraalfabètics es fan servir de manera constant, com les barres de separació /\ o els parèntesis (). La numeració permet distingir unitats i el seu ordre respectiu.

Aquest treball de segmentació i valoració és detallista i coherent, per això és efectiu i funcional, encara que sigui costós de realitzar.

Referenciar El lector pot localitzar ràpidament la informació que l’interessa, això suposa un gran triomf publicitari, ja que és funcional per a la marca i funcional per al lector. Ús del color El color té un camp de funcionament molt ampli, el color és capaç de donar informació pels quatre costats. La majoria de marques s’associen a un color i encara que sembli el mateix no l’és. Per exemple el vermell de Vodafone, no és el mateix que el de Coca-Cola.

Punts de vista Saber veure les coses no és fàcil. Estem tan acostumats al nostre punt de vista, que obrir-lo a altres pot variar les perspectives del coneixement de tot tipus de persones.

L’ús més freqüent d’un punt de vista alterat són les imatges en picat (cap avall) i contrapicat (cap amunt). En un cas tendeix a encogir al personatge i un altre a engrandir-lo.

Narrar Hi ha poques coses com una història ben narrada.

4

3. Retícula Ajuda a compondre documents amb un ordre, que siguin clars i llegibles.

El dilema del dissenyador és com trobar l’equilibri entre l’ordre que imposa l’estructura reticular i la necessitat d’evitar la monotonia i injectar creativitat a l’estil de maquetació.

Formats La sel lecció del per articles, anuncis i banners depèn de la funció, missatge, cost, i distribució.

Formes bàsiques Les formes més comuns son les simetriques (axials) i assimètriques (dinàmiques).

Psicologia Gestalt Les lleis Gestalt son tres eines útil per a un bon disseny: La llei de la proximitat: diu que els textos i imatges situats junts es perceben conjuntament. Els textos i imatges tancats junts en un marc, es perceben conjuntament.

La llei de la similitud: similitud diu que les disposicions visuals que mostren similitud es perceben conjuntament. els textos i imatges tancats junts en un marc, es perceben conjuntament.

4. Formats d’e-books S’ha d’estudiar quin és el dispositiu on va dirigida la publicació.

Sempre s’ha de fer un “treball de camp” previ a la creació de qualsevol producte gràfic.

S’ha de pensar en una estructura de navegació clara i sense barreres. Que també permeti jugar amb els elements per construir documents mulipàgina cohesionats.

Una bona idea es la inclusió de menús laterals, ja que la informació en els ebooks acostuma a fer-se mitjançant scrolling. També s’ha de pensar que els lectors també admeten lectura en format espaiat.

5

Els menús de ser clars.

Ben entre ells per hagi a l’hora de

5. Implementació I Tipografia La tipografia tracta de les formes de les lletres, el seu us, i els escenaris en que apareixen.

Les lletres estan contínuament al nostre voltant: ens permeten comunicar però també saturen.

Les lletres poden ser pomposes, indecises, alegres, dures, barates o vulgars. Però també poden ser

laterals han lleugers i separats a que no hi equivocacions prémer.

6

lúcides, clares, elegants, senzilles, o distingides.

Cada lletra te una personalitat pròpia.

Tipus o Font?

Una tipografia és un alfabet complet (lletres, números i altres caràcters) en un disseny únic.

Tècnicament una Font és una tipografia d’un estil i mida determinats, però avui en dia s’utilitza el terme per a referir-se a la pròpia tipografia en un context digital.

Verdana És la tipografia que es llegeix millor a les pantalles, molt semblant a la Helvètica.

Es veu bé en mida petita.

Helvètica És l’opció preferida pels dissenyadors.

Es considera la obra culminant de l’escola suïssa.

S’utilitza molt en organismes oficials i senyalització.

Organització tipogràfica.

Gestionar tipografies No és estrany que un professional de la infografia disposi d’un catàleg de més de 2.000 fonts. Per trobar allò que cal de forma ràpida i senzilla sense carregar el sistema la organització. Per gestionar aquesta quantitat d’informació es fan servir programes de gestió tipogràfica o d’organització de fonts.

Hi ha molts programes d’aquest tipus, tots molt semblants. Parteixen de que la font no s’instal la ni es desinstal la, sinó que s’activa o no depenent de si s’ha de fe servir o no.

Això permet no haver de tenir instal lades en el sistema multitud de fonts, sinó únicament les que venen amb el sistema operatiu. Amb el gestor activem o desactivem les fonts que ens calen per a un projecte. Al tancar el gestor les fonts es desactiven; per això cal obrir el gestor abans d’obrir el programa de disseny.

Gestionar tipus en PC Si treballem amb un PC amb Windows cal instal lar les fonts en la carpeta de fonts del sistema ja que aquest sistema operatiu no té gestor tipogràfic instal lat de sèrie. Hi ha disponibles un bion nombre de programes per gestionar fonts en PC: ATM, FontExplorer, ...

Fonts per a la web Si utilitzem una font poc habitual hi ha molt poques possibilitats que la persona que visita la web la tingui instal lada en el seu ordinador. En el pitjor del casos el resultat serà desagradable; el millor, avorrit.

7

Existeixen famílies de fonts que podem utilitzar amb tranquil litat: Serif i Sans serif. El millor que es pot fer per assegurar-se el resultat es traçar la font (convertirla en imatge).

Mida de la font La mida de la font importa. La mida del cos general va del 8 al 10. El dels subtítols del 12 a 18. Els titulars del 20 en amunt i el dels peus de foto i foliació de 8 en avall.

Formats i organització de fonts Hi ha una gran varietat de formats de font però son incompatibles entre ells.

Encara que els sistemes operatius i els nous formats de fonts fan el treball més fàcil, és útil saber el que hi ha disponible.

PostScript: PS Desenvolupat per Adobe als anys 80 va ser molt important per l’autoedició. Consisteix en una font per a impressora (vector) i una altre per al monitor (bitmap), ambdues necessàries perquè la font funcioni bè. Si falta cap d’aquets components poden aparèixer caràcters irregulars o mostrar-se malament.

Hi ha versions per a Mac i PC però no son multiplataforma.

TueType: TTF A principis de la dècada dels 90 Apple i Microsoft van llençar aquest format.

Les fonts de pantalla i les d’impressora es combinen en un únic arxiu, així és menys probable que es corrompi. Funcionen tant en Windows com en Mac, inclouen informació d’espai i reajustament i suporten fins a 65.000 glifs. No son compatibles amb PDF/X.

Opentype: OTF Creades al 1996 entre Microsoft i Apple, les fonts Opentype son el format més modern que hi ha disponible. Són multiplataforma, hi pot haver variacions d’idioma, signes, lligadures...

Son la millor opció, però no sempre es troba la font que volem en el format desitjat.

6. Drets d’autor Vivim en la cultura de la imatge. L’embolcall és el primer que veiem d’un producte, per aquest motiu les professions vinculades al disseny gràfic estan en auge. Però no és una moda passatgera, si no una professió amb clara vocació de

8

permanència en el temps i en constant evolució, igual que les eines (equips informàtics) amb les quals es treballa.

Obtenció i selecció d’imatges En el procés de creació gràfica, és sovint necessari treballar amb imatges, il lustracions o fotografies que nosaltres no podem produir, per la qual cosa hem d’encarregar aquest treball a altres professionals, il lustradors o fotògrafs. També podem acudir a bancs d’imatges i arxius especialitzats on, de forma ràpida i senzilla podrem seleccionar les imatges més “adients” per al producte gràfic. És important saber aplicar criteris de coherència temàtica i estètica en la selecció de les imatges. Quan treballem amb imatges d’altres persones hem de tenir present que existeixen els drets d’autor, que emparen legalment a l’autor i la seva obra.

Propietat intel lectual i drets d’autor Les lleis de propietat intel lectual protegeixen les obres artístiques que compleixin els requisits d’originalitat i creativitat.

Dintre del terme “Propietat Intel lectual” s’engloben dos tipus de drets: els “drets d’autor” i els “drets connexos”. Els drets d’autor estableixen la protecció a les persones creadores d’obres de l’intel lecte, mentre que els drets connexos protegeixen als quals d’alguna manera, realitzen treballs i aportacions que el legislador també ha entès que han de ser protegides.

En general, des d’un punt de vista jurídic, poden distingir-se dues classes de drets inherents al dret d’autor: - Drets morals. morals Són drets inalienables i intransmissibles que engloben principalment el dret a la paternitat de l’obra (ser reconegut autor d’una obra), el dret a la integritat de la mateixa (impedir qualsevol deformació, modificació, alteració o atemptat contra ella) i el dret a decidir en quina forma es difondrà l’obra.

- Drets patrimonials. patrimonials Són els drets d’explotació sobre l’obra, generalment amb contingut econòmic. S’inclouen entre ells els drets de reproducció, distribució, comunicació pública, posada a disposició i transformació. A diferència d’altres formes de propietat, que es mantenen eternament en el temps, passant al llarg de diferents persones, els drets de propietat intel lectual tenen un límit temporal que dependrà del tipus de dret (moral o patrimonial, d’autor o connex), encara que, per regla general, els drets morals són perpetus i els patrimonials expiren als 70 anys de la mort de l’autor. Una vegada transcorregut aquest termini, l’obra es considerarà en el domini públic, sent possible la lliure utilització de la mateixa, sempre que es respectin els drets morals de l’autor.

7. Formats d’arxiu i les seves aplicacions

9

Hi ha molts formats d’arxiu. Cada un d’ells serveix per emmagatzemar coses concretes. Una mala elecció del format a l’hora de guardar les nostres feines pot ser fatal.

Les característiques principals dels arxius son: - L’ordre d’emmagatzemar informació.

- Les dades que poden guardar.

- La relació entre el volum que ocupa i la informació útil que conté.

- La compatibilitat.

Els formats d’arxiu s’identifiquen fàcilment per l’extensió i per la icona que els representa.

Es poden classificar en 4 grups: a) Compatibiliat Formats propis: L’arxiu guarda totes les propietats del programa creador. En aquest format s’ha de tenir molt en compte les versions del programa, ja que una versió superior pot obrir una d’inferior o d’antiga, però no al revés.

(FH11, PSD, QXP, INDD, FLA,) Formats compatibles: Es poden obrir, guardar i en ocasions modificar per varies aplicacions i plataformes.

(JPEG, TIFF, EPS, PICT) b) Descripció de la imatge.

Vectorial: Els objectes o elements es formen a partir de formules matemàtiques. Un arxiu vectorial no pot definir imatges fotogràfiques, però resulta ideal en la creació de treballs en línia o dibuix. (FH, ILL) Bitmap: Aquets formats defineixen la imatge indicant el to de cadascun dels píxels que la formen.

(PSD) c) La compressió Sense pèrdua: Utilitzen tècniques que reorganitzen la informació o eliminen allò prescindible.

Tenen una relació de compressió de 3:1. Les màximes compressions s’obtenen a partir d’arxius vectorials.

1 0

(ZIP,LZW,RAR) Amb pèrdua: La informació que es perd és poc apreciable a la vista: en la majoria de casos s’elimina la informació addicional.

(JPEG, GIF, ) d) Descripció de pàgina PostScript: Format de descripció de pàgina (EPS) PDF: Estàndard multiplataforma, amb tècniques de compressió, multimèdia i hipertext.

8. Implementació II Multimèdia Multimèdia El concepte de resolució La resolució d’una imatge és el número de píxels que té per una unitat de mesura lineal (normalment polzades). S’indica amb PPP (Punts Per Polsada) o DPI (Dots Per Inch). Els DPI s’utilitzen més habitualment als dispositius de sortida: impressores, etc...

Resolució segons segons la necessitat.

Web Són les resolucions més baixes. Tenen menys quantitat de píxels per polsada; per tant tenen menys qualitat i ocupen menys espai. (50, 72, 96 ppp).

Digital, editorial Són les resolucions mitges. Tenen més píxels en el mateix espai (polzada); per tant tenen més qualitat i la mida de l’arxiu augmenta. (150, 200 ppp).

Prestigi, atles, tanques publicitàries Són les resolucions més altes. Tenen moltíssims píxels per polzada. Són imatges de gran qualitat i el volum que ocupen és considerable. (300, 500, 1200, 2400 ppp).

1 1

1 2

Maquetar amb Indesign Exemple pràctic a l’arxiu “Ebook_ revi_alumnes.indd”

Maqueta prèvia de la maqueta

Implementació

1

Obrir Ind

7

Col·locar imatges

2

Pensar i crear pàgina maqueta

8

Col·locar textos

3

Triar imatges

9

Controlar linies de text

4

Triar text (tipus)

10 Resseguiments

5

Utilitzar la retícula

11 Foliació

6

Crear caixes de text i imatges

12 Transicions 13 Exportar

Conceptes Mida 1024x728

de pàgina

XFL-PDF

Compte amb...

Tipografies

Pàgina Maqueta (una o vàries)

Imatges vinculades

Retícula (molts camps o pocs) Caixes (text i imatge)

Organització

1 3

Sessió 2 Interactivitat amb Acrobat El contingut d’aquest dossier s’ampliarà amb material i pràctiques a classe.

9. Portable Document Format (PDF) Desenvolupat per Adobe als anys 80 és un estàndard multiplataforma, amb tècniques de compressió, multimèdia i hipertext.

Virtuts

Inconvenients

1

Senzill

7

Animacions

2

Compatible

8

Codi

3

Vídeo

4

Àudio

5

Links

Conceptes

Com fer-ho?

Format vídeo Codecs

Indesign Archivo

Media Encoder

Valores de PDF Triar l’opció més adient Incloure web i hipervíncles S’ha d’implementar amb Acrobat a posteriori.

Les Eines Clau Dins del menú “Herramientas”

Herramientas Multimedia Herramientas Edición Avanzada

1 4

Acrobat Exemple pràctic a l’arxiu “Ebook_ revi.pdf”

Maqueta prèvia

Implementació

1 Obrir

7 Col·locar

“Ebook_revi_Alumnes.pdf”

2 Organitzar

la pantalla segons mostra

Animacions

8

Col·locar textos si cal

3

Visualitzar eines “Clave”

9

Colocar Videos

4

Utilitzarem l’eina “Vínculo”

10 Controlar

per enllaçar pàgines 5

el pes

11 Exportació

a formats

Utilitzarem l’eina "Flash y Vídeo"

per portar animacions 1

Conceptes

Compte amb…

Mida

Imatges vinculades

Visualitzar pàgines

Color

Els vícles es poden copiar

Tipografies Organització

1 5

La GUI d’Acrobat Anotarem els elements més importants de l’eina.

1 6

Sessió 3 Interactivitat amb Flash 1. Animació Teoria de l’animació Adobe Flash és programa amb el que es pot crear des d’una simple animació fins a un lloc web complet interactuant amb una base de dades.

Les pel lícules de Flash són imatges i animacions per al llocs web. Encara que estan compostes principalment per imatges vectorials, també poden incloure imatges de mapa de bits i sons importats. Les pel lícules Flash poden incorporar interacció per permetre la introducció de dades dels espectadors, creant pel lícules no lineals que poden interactuar amb altres aplicacions.

Els dissenyadors web utilitzen Flash per crear controls de navegació, logotips animats, animacions de gran format amb so sincronitzat i fins i tot llocs web amb capacitat sensorial. Les pel lícules Flash són gràfics vectorials compactes que es descarreguen i s’adapten immediatament a la mida de la pantalla de l’usuari. És més que probable que hagi vist i fins i tot utilitzat pel lícules Flash en molts llocs web, com per exemple Disney ®, Els Simpson ® o Coca-Cola ®. Milions d’usuaris de la web han rebut el programa Flash Player instal lat de sèrie en els seus PC, navegadors o programari del sistema; d’altres l’han descarregat des del lloc web d’Adobe. Flash Player resideix en el PC local, on pot reproduir pel lícules en navegadors o com aplicacions independents.

Veure una pel lícula de Flash a Flash Player és similar a veure un vídeo en un reproductor. Flash Player és el dispositiu per veure les pel lícules creades amb la aplicació de creació de Flash.

2. Flux de treball de Flash Animació i molt més El treball amb Flash per a la creació d’una pel lícula inclou el dibuix o la importació d’una il lustració, la seva organització en l’Escenari i la seva animació amb la Línia de temps. La pel lícula pot fer interactiva utilitzant accions que facin que la pel lícula respongui a determinats esdeveniments de certa manera.

1 7

Un cop acabada la pel lícula és possible exportar-la per veure-la amb Flash Player o bé com un projector de Flash independent, amb un reproductor que s’inclou en la pel lícula mateixa.

Les pel lícules de Flash poden reproduir-se de diverses formes: En navegadors Internet, com ara Mozilla Firefox, Google Chrome, Safari i Microsoft Internet Explorer, que estiguin equipats amb Flash Player.

Amb el control ActiveX de Flash a Microsoft Office, Microsoft Internet Explorer per a Windows i altres entorns amfitrió de ActiveX. Amb Flash Player, una aplicació independent de maneig similar al complement 0 + Flash Player.

Flash permet animar objectes per donar la impressió que es mouen per l’Escenari, canviar la seva forma, mida, color, opacitat, rotació i altres propietats. També permet crear animació fotograma a fotograma.

Una altra possibilitat és crear animació interpolada, és a dir, crear els fotogrames primer i últim d’una animació i deixar que Flash creï els fotogrames intermedis.

Gràfics vectorials vectorials i de mapa de bits Els PC mostren imatges en format vectorial o de mapa de bits. És molt important comprendre la diferència existent entre tots dos formats per utilitzar-los de la forma més eficaç. Flash permet crear i animar gràfics vectorials compactes.

També permet importar i manipular gràfics vectorials i de mapa de bits creats en altres aplicacions Animació en Flash En aquest punt, abans de crear o obrir un document, la barra de menús té una pestanya a la part superior dreta que permet configurar la interfície del programa segons les nostres necessitats.

Si obrim aquesta pestanya trobem diverses possibilitats, incloent-ne una a la nostra mida que podem configurar i desar com a àrea per defecte de treball.

En aquest cas optarem per la poció Animador que és la que ens interessa particularment. En obrir un document Nou (Ctrl + N) veurem: Barra de Menú La Barra de Menú facilita l’accés a les utilitats del programa. És similar a la de qualsevol altre programa de disseny web o gràfic, tot i que amb algunes particularitats. Els principals submenús a què té són:

1 8

Archivo Permet crear nous fitxers, obrir, guardar ... Destaca la potència de la utilitat Importar que insereix en la pel lícula actual gairebé tot tipus d’arxius (sons, vídeo, imatges i fins i tot altres pel lícules Flash), o la de Configuración de Publicación des d’on es poden modificar les característiques de la publicació. També permet configurar la impressió de les pàgines, imprimir...

Edición És el clàssic menú amb opcions com Cortar, Cortar Copiar, Copiar Pegar...

Pegar tant objectes o dibuixos com fotogrames. També conté les preferències del programa i permet personalitzar-ne algunes de les opcions més comuns.

Ver A més dels típics Zooms permet moure’s pels fotogrames i per les escenes.

També inclou la possibilitat de crear una quadrícula i unes guies, amb els submenús Cuadrícula i Guías, Guías des d’on també es poden configurar les seves opcions.

Insertar Permet inserir objectes a la pel lícula, nous fotogrames, capes, accions, escenes ...

Modificar L’opció Transformar permet modificar els gràfics de la pel lícula, i la opció Trazar Mapa de Bits converteix els gràfics en mapes vectorials (aquest tema es tractarà més endavant). La resta d’opcions permet modificar característiques dels elements de la animació (Suavizar Suavizar, Capa, Suavizar Optimizar) o de la pròpia pel lícula (Capa Capa Escena...).

Escena Texto Els seus continguts afecten l’edició de text. Més endavant es tractarà en profunditat. Comandos: Comandos Mostra totes les opcions de creació i gestió de comandaments per automatitzar tasques.

Control Des d’aquí es modifiquen les propietats de reproducció de la pel lícula. Reproducir, Reproducir Rebobinar, Rebobinar Probar Película ....

Depurar

1 9

Mostra el control de les diferents accions de depuració d’una pel lícula.

Ventana Aquest menú, a més de les opcions clàssiques sobre com distribuir les finestres, inclou accessos directes a tots els Panells.

Ayuda Des d’aquí podem accedir als continguts d’ajuda que d’Adobe: manual existent, diccionari d’Action Script, tutorials, lliçons guiades etc.

Barra d’eines Puntero Permet moure un objecte dins de l’àrea de treball (Stage).

Subselección Permet distorsionar un objecte movent els seus nodes.

Transformación libre Permet transformar els objectes lliurement, que prement la tecla May. Ho fa a proporció. Té també un submenú que permet modificar els degradats.

Per ajustar un farciment amb degradat o de mapa de bits: Quan se selecciona un farciment amb degradat o de mapa de bits per editar-lo, apareix el punt central i el seu requadre de delimitació amb els selectors d’edició.

En col locar el punter sobre un dels selectors, canvia per indicar la seva funció.

Prement Maj. la direcció d’un degradat lineal només pot col locar-se en angles múltiples de 45 °.  Per moure el centre del farciment degradat o de mapa de bits, arrossegar el punt central.

2 0

 Per canviar l’amplada del farciment amb degradat o de mapa de bits, arrossegar el selector quadrat situat en un costat del requadre de delimitació.

(Aquesta opció només canvia la mida del farciment, no el de l’objecte que conté el farciment).  Per girar el farciment amb degradat o de mapa de bits, arrossegar el selector de rotació circular situat a la cantonada. També es pot arrossegar el selector més baix del cercle de delimitació d’un farciment o degradat circular.  Per canviar la mida d’un degradat lineal o un farciment, arrossegar el selector quadrat situat al centre del requadre de delimitació.  Per canviar el radi d’un degradat circular, arrossegar el selector rodó amb una fletxa interior del cercle de delimitació.  Per canviar el centre d’un degradat circular, desplaçar el triangle central.

Rotación 3D Permet efectuar rotacions en 3D als objectes, i el seu submenú translacions de 3D partint de els eixos.

Lazo Permet la selecció d’àrees determinades per aplicar una altra eina.

Pluma Per dibuixar traçats precisos com línies rectes o bé com suaus corbes fluides. Es poden crear segments de línies rectes o corbes, i ajustar l’angle i la longitud dels segments rectes, així com la pendent dels segments corbs.

Al dibuixar amb l’eina Pluma es pot fer clic per crear punts en els segments de les línies rectes o bé fer clic i arrossegar per crear punts en els segments de les línies corbes.

Es poden ajustar els segments de les línies corbes i rectes ajustant els punts de les línies. Podeu crear línies corbes en línies rectes i viceversa. També es poden mostrar els punts de les línies creades amb altres eines de dibuix de Flash, com les eines Lápiz, Lápiz Pincel, Pincel Línea, Línea Óvalo o Rectángulo, Rectángulo per ajustar aquestes línies.

Dibuix de línies rectes amb l’eina Pluma: Per dibuixar segments de línies rectes amb l’eina Pluma, cal crear punts de ancoratge, punts de la línia que determinen la llargada de cadascun dels segments de línia.

2 1

Texto Permet situar blocs de text en l’Escenari. Els tipus poden situar-se en una línia que s’expandeix en escriure o en un bloc d’amplada fixa que ajusta les línies de forma automàtica. Flash mostra un selector rodó a la part superior dreta dels blocs de text que s’expandeixen i un quadrat en els blocs de text amb amplada definida.

Flash mostra un selector quadrat a la cantonada inferior dreta dels quadres de text que poden editar que indica la possibilitat de modificar la mida del quadre en vertical i en horitzontal segons la quantitat de text que hagi d’introduir.

Per canviar les dimensions d’un bloc de text: Arrossegar el selector de canvi de mida.

Per canviar un bloc de text d’amplada fixa a extensible, i viceversa: Doble clic en el selector de canvi de mida.

Selecció de font, mida de tipus, estil i color. Es pot establir la font, la mida, l’estil i el color del tipus seleccionat mitjançant el panell Paràgraf.

En establir el color del tipus, només poden utilitzar colors sòlids i no es poden utilitzar els degradats.

Per aplicar un degradat a un tipus cal convertir-lo en les línies i els farciments que el componen.

Quan escrivim podem fixar-nos en la barra de propietats les opcions que tenim per els canvis necessaris com ser: tipus de font, mida, color, estil, alineació, si va anar vinculat, llista, tabulació, etc.  Els camps de text estàtics mostren text els caràcters no es modifiquen de forma dinàmica  Els quadres de text dinàmics mostren text que es actualitza de forma dinàmica, com a resultats esportius, cotitzacions de valors o informació meteorològica  Els camps de text d’entrada permeten als usuaris introduir text en formularis o enquestes.

Fonts incorporades i fonts de dispositiu: Si s’utilitza una font instal lada en el sistema en una pel lícula Flash, Flash incorpora la informació de la font en el fitxer SWF de Flash, el que garanteix la correcta visualització de la font en Flash Player.

No totes les fonts visualitzades en Flash poden exportar amb una pel lícula.

2 2

Per verificar que una font es pot exportar utilitzeu el comandament Ver> Suavizar texto per previsualitzar el text; si el tipus apareix dentat és per que Flash no reconeix el contorn d’aquesta font i per tant no exportarà el text.

En Flash es poden utilitzar fonts especials denominades “fonts de dispositiu” alternatives a la incorporació d’informació de font (només per text horitzontal). Les fonts de dispositiu no s’incorporen als arxius SWF de Flash. En comptes d’això, Flash Player utilitza la font més semblant a la font de dispositiu que estigui instal lada en l’equip local.

Com que la informació de la font de dispositiu no està incorporada la utilització d’aquest tipus de fonts redueix en certa forma la mida del fitxer de la pel lícula Flash. A més, aquestes fonts poden ser més nítides i més llegibles que les incorporades amb mides en punts petits (per sota dels 10 punts).

Tanmateix, en no estar incorporades, si l’usuari no té la font corresponent instal lada en el sistema, l’aspecte del text pot ser diferent a l’esperat.

Flash inclou tres fonts de dispositiu: _sans (similar a la Helvètica o Arial), _serif (similar a la Times Roman) _typewriter (similar a la Courier).

Per especificar una font com a font de dispositiu seleccioneu una de les fonts de dispositiu de Flash a l’inspector de propietats. Durant la reproducció de la pel lícula, Flash seleccioneu la primera font de dispositiu ubicada al sistema de l’usuari. Es pot especificar que el text escrit en una font de dispositiu sigui sel leccionable, de manera que els usuaris puguin copiar el text que apareix a la pel lícula ....

Línea Aquesta eina permet traçar línies rectes Rectángulo Les eines Línea, Óvalo i Rectángulo permeten crear fàcilment les formes geomètriques habituals. Les eines Óvalo i Rectángulo creen tant formes farcides com a formes només definides per el traç. Podem utilitzar l’eina Rectángulo per crear rectangles amb cantonades rectes o arrodonides.  Amb les eines Óvalo i Rectángulo, Rectángulo arrossegar amb Maj. pressionada per crear només cercles i quadrats.  Amb les eines Rectángulo i Ovalado Simple, Simple creem les figures i les podem modificar des dels punts d’àncora

2 3

Amb l’eina PolyStar, PolyStar podem crear formes poligonals de múltiples costats Lápiz Per dibuixar línies i formes, s’utilitza l’eina Lápiz, Lápiz de manera molt similar a com es fa servir un llapis real per fer un dibuix.

Per aplicar un suavitzat o un redreçament a les línies i les formes segons es va dibuixant només cal seleccionar un mode de dibuix per a l’eina Lápiz.

Lápiz Opcions de dibuix de la caixa d’eines:  Objecte per crear directament objectes dibuixats  Redreça per dibuixar línies rectes i convertir figures similars a triangles, ovals, cercles, rectangles i quadrats en aquestes formes geomètriques.  Suavitzar per dibuixar corbes suaus.  Tinta per dibuixar línies a mà alçada sense aplicar cap modificació.

Pincel Dibuixa traços similars als d’un pinzell. Permet crear efectes especials, inclosos efectes cal ligràfics. En moltes tauletes sensibles a la pressió pot canviar el gruix del traç de pinzell augmentant o disminuint la pressió sobre la ploma.

També es pot utilitzar un mapa de bits importat com a farciment al pintar amb l’eina Pincel.

Pincel Amb el pinzell ruixador podem simular l’efecte ruixat i també ruixar amb formes pròpies.

Permet nombroses formes de repetició i ajustaments.  Pintar normal pinta sobre les línies i farciments de la mateixa capa.  Pintar detrás pinta en les àrees buides de l’Escenari de la mateixa capa, sense afectar ni les línies ni els farciments.  Pintar selección selección aplica un nou farciment a la selecció al seleccionar en el modificador Relleno o en el panell Relleno (aquesta opció és com seleccionar una àrea omple i aplicar un nou farciment).  Rellenos de pintura pinta farciments i àrees buides i no afectarà a les línies.  Pintar dentro pinta el farciment en el que s’inicia un traç de pinzell i mai pinta sobre les línies. Funciona com un llibre d’acolorir en què la pintura no pot sortir

2 4

mai de les línies. Si el traç comença en una àrea buida, el farciment no afecta a cap àrea plena.

Deco És similar al pinzell ruixador, però amb opcions de simetria: Relleno de trepadoras, trepadoras Relleno de cuadrícula y Pincel de simetría. simetría Totes aquestes funcions tenen unes formes predeterminades i la possibilitat de crear formes pròpies de farciment.

Hueso Permet afegir ossos IK als clips de pel lícula, gràfics i botons, per crear cadenes de animació de cinemàtica inversa.

Bote de pintura Omple amb color àrees tancades. Pot omplir àrees buides com canviar el color d’àrees ja pintades. Podeu utilitzar colors sòlids, farciments de degradats o de mapa de bits.

Podem utilitzar Bote de pintura per omplir àrees que no estan tancades per complet, així com especificar que Flash tanqui els forats dels contorns de les formes al utilitzar aquesta eina.

També s’utilitza per redimensionar la direcció i el centre dels farciments de degradats i de mapes de bits.

Nota: En modificar un farciment de mapa de bits amb l’eina Bote de pintura es modificaran totes les instàncies del farciment de mapa de bits, no només el farciment de la selecció actual.

Bote de tinta Permet especificar el color, l’amplada de línia i l’estil dels traços de les línies o contorns de formes. Podeu aplicar únicament colors sòlids, però no degradats ni mapes de bits, a les línies i contorns de formes.

Utilitzar l’eina Bote de tinta en lloc de seleccionar cada una de les línies facilita modificar els atributs de traç de diversos objectes d’una sola vegada.

Cuentagotas Permet copiar els atributs de traç i farciment d’un objecte i aplicar-los immediatament a un altre objecte. També permet copiar la imatge d’un mapa de bits per utilitzar-la com a farciment.

Per utilitzar l’eina Cuentagotas per copiar i aplicar atributs de traç o de farciment:

2 5

Selecciona l’eina i fes clic en el traç o àrea omple els atributs que vols aplicar a un altre traç o àrea plena. En fer clic en un traç l’eina canviarà automàticament a Bote de tinta. tinta En fer clic en una àrea plena l’eina canviarà automàticament a Bote de pintura i s’activarà el modificador Bloquear relleno. relleno Fes clic en un altre traç o àrea plena per aplicar els nous atributs.

Borradores Permet eliminar traços i farciments. Podeu esborrar tot el Escenari amb rapidesa, esborrar els diferents segments de traços o àrees farcides, o esborrar per arrossegament. Es pot personalizar l’eina Borradores per esborrar només traços, només àrees farcides o només una única àrea plena. L’esborrany pot ser rodó o quadrat i hi ha cinc mides disponibles.

Modes d’esborrat:  Borrar normal esborra traços i farciments de la mateixa capa.  Borrar rellenos només esborra farciments, sense afectar els traços.  Borrar líneas només esborra els traços, sense afectar els farciments.  Borrar rellenos seleccionados només esborra els farciments actualment seleccionats i no afecta els traços, estiguin seleccionats o no. (Seleccioneu els farciments que voleu esborrar abans d’utilitzar l’eina Borradores en aquest mode).  Borrar dentro només esborra el farciment en el qual s’ha iniciat el traç d’esborrany. Si el punt d’inici de esborrat està buit, no s’esborra res. Aquest mode no afecta els traços.

Mano En augmentar la mida de visualització de l’Escenari, és possible que no es vegi tot el seu contingut. L’eina Mano permet desplaçar l’Escenari per canviar la visualització sense haver de canviar el grau d’augment.

Zoom Podeu canviar el grau d’augment / reducció per veure tot l’Escenari a la pantalla o una zona determinada del dibuix augmentada. El grau màxim d’augment / reducció depèn de la resolució del monitor i de la grandària de la pel lícula.  Per mostrar el contingut del fotograma actual seleccionar Ver> Magnificación> Muestra todo o bé Muestra todo en el control de Zoom situat a la cantonada inferior esquerra de la finestra de l’aplicació. Si l’escena està buida, es mostra tot l’Escenari.

2 6

 Per mostrar tot l’Escenari seleccioneu Ver> Magnificación> Muestra fotograma o Muestra fotograma en el control de Zoom situat a la cantonada inferior esquerra de la finestra de l’aplicació.  Per mostrar l’àrea de treball que envolta l’Escenari, seleccioneu Ver> Àrea de Trabajo.

Trabajo L’àrea de treball es mostra en gris clar. Utilitzeu el comandament Àrea de Trabajo per veure els elements d’una escena que estan, parcial o completament, fora de l’Escenari. Per exemple, per fer que un ocell entri volant en un fotograma, pots col locar inicialment l’ocell fora l’Escenari en l’àrea de treball.

Rellenos degradados Per seleccionar un farciment transparent, de color sòlid, amb degradat o de mapa de bits, es pot utilitzar el panell Relleno.

Relleno Aquest panell també permet crear i editar farciments amb degradats. Podeu aplicar farciments de mapa de bits utilitzant els mapes de bits importats al fitxer actual.

Per aplicar un farciment transparent mitjançant el panell Relleno: Relleno Ventana> Color.

Cap al mesclador de color.

Nota: Es pot aplicar un farciment transparent a un nou objecte, però no a un ja existent.

Per aplicar un farciment de color sòlid mitjançant el panell Relleno: Relleno Ventana> Color.

Sòlid al menú mesclador de color.

Per aplicar, crear o editar un farciment amb degradat mitjançant el panell Relleno: Relleno Ventana> Color.

Selecciona una de les opcions següents del menú Relleno: Relleno  Degradado lineal per crear un degradat que canviï de tonalitat des del punt inicial al final segons una línia recta.  Degradat radial per crear un degradat que canviï de tonalitat des del punt inicial al final seguint una forma circular.

Per aplicar un farciment de mapa de bits mitjançant el panell Relleno: Relleno Ventana > Color.

Selecciona Mapa de bits al menú mesclador de color.

Podem modificar un farciment de mapa de bits utilitzant l’eina Bote de pintura. pintura

2 7

Contornos El panell Trazo permet canviar el color, estil i alçada de línia del traç d’un determinat objecte. Per l’estil de traç, pot triar entre els estils predefinits que inclou Flash o bé crear un estil personalitzat.

Nota: Podeu aplicar un traç transparent a un nou objecte, però no a un ja existent.

En la seva lloc, seleccioneu el traç existent i esborrar.

Nota: Si seleccioneu un estil de traç diferent del sòlid pot augmentar la mida del arxius.

Panell de Propiedades Al marge superior esquerre veiem que és un document sense desar (Sense Títol), Podem configurar-ne, la mida, el color de fons, la velocitat de fotogrames o frames per segons (FPS) i per l’exportació l’opció Publicar.

Publicar Si fem clic a Editar tamaño: tamaño Aquesta finestra ens demana les dades de mida de la nostra pel lícula, color de fons, la velocitat de fotogrames per segon, quin tipus de regles desitgem utilitzar. Per a la web utilitzarem Píxels.  Coincidencia con impresora: significa que ens adapta el document per a una bona impressió (en cas d’esbossos per exemple).  Coincidencia con contenido: ens adapta el llenç o el fons amb els objectes que tenim i si sobra espai ho elimina.  Predeterminada: ens situa el predeterminat, per si canviem i no és el que volem.

Transformar en predeterminado: Un cop que ho tenim tot ajustat deixem aquesta per defecte i cada vegada que obrim un arxiu nou tindrà aquestes característiques predeterminades.

Si fem clic a Editar Perfil: Perfil Aquí tenim les propietats de l’arxiu swf, que serà l’arxiu que podrem incorporar en un HTML per al seu us en la web.

2 8

Li diem quin tipus de connector volem per a l’exportació; és a dir quin plugin ha de tenir l’usuari que veu la nostra pel lícula des de la web.

Tinguem en compte que si utilitzem coses pròpies de la versió CS4 que no existien en la versió 5 i col loquem el Player per al 5, no es podrà veure correctament.

També tenim l’opció de protegir el fitxer per a la importació, per evitar que un arxiu .swf descarregat d’Internet es pugui obrir amb Flash o, en el cas que es pugui, només mostra una gran capa plena de fotogrames però no cap acció ni clip de pel lícules.

3. ActionScript Flash No cal fer servir ActionScript per utilitzar Flash però si es vol obtenir una interactivitat d’usuari completa o bàsica, treballar amb objectes diferents dels creats en Flash (per exemple, botons i clips de pel lícula), o bé, fer que un fitxer SWF es converteixi en una experiència d’usuari més completa, probablement haurem d’utilitzar ActionScript.

Flash CS5 Professional inclou ActionScript 3.0. Flash Player 9 i ActionScript 3.0 que són la configuració de publicació defecte de Flash. S’ha de canviar la configuració de publicació per als fitxers Flash a Flash Player 9 i ActionScript 2.0.

Si no es canvia la configuració predeterminada, és possible que les explicacions i els exemples de codi que es donen no siguin vàlids.

Si es desenvolupen aplicacions per versions anteriors de Flash Player les accions per a un botó, un clip de pel lícula o un fotograma es configuren en el panell Acciones.

Acciones La utilització dels controls del panell Acciones en mode Normal permet inserir accions sense haver d’utilitzar ActionScript.

Un usuari expert en ActionScript pot construir els seus propis scripts. Les instruccions poden estar formades per una sola acció, com sol licitar la detenció de la reproducció d’una pel lícula, o bé per una sèrie d’accions( per exemple: primer avaluar una condició i, a continuació, fer una acció). La configuració de moltes de les accions requereix poca experiència en programació. Però per d’altres accions cal tenir certa familiaritat amb els llenguatges de programació ja que estan dissenyades per a un desenvolupament avançat.

Ventana de Acciones

2 9

Si volem que una pel lícula faci una acció concreta quan arribi a un fotograma clau n’hi ha prou amb assignar una acció de fotograma al fotograma clau. Per exemple, per crear un cicle en una pel lícula, podem afegir una acció de fotograma a fotograma 20 que especifiqui “gotoAndPlay Escena Violeta i al fotograma 1”.

Una bona idea és col locar totes les accions de fotograma en una capa per fer més fàcil el seu seguiment. Els fotogrames que tenen accions associades mostren una petita “a” en la Línia de temps. Un cop assignada l’acció, és recomanable provar l’acció per verificar si funciona, amb el comandament Control> Probar película. película La majoria de les accions no funcionen en mode d’edició.

Les instruccions següents descriuen la manera de definir accions en ActionScript 2 per fotogrames mitjançant el panell Acciones utilitzat en mode normal. Si es vol obtenir informació sobre la utilització del panell Acciones en mode Expert, consultar Ayuda de ActionScript.

ActionScript Per assignar una acció a un fotograma clau: Se selecciona un fotograma clau en la Línia de temps i es tria Ventana > Acciones.

Acciones Si el fotograma seleccionat no és un fotograma clau l’acció s’assignarà al fotograma clau anterior. Si no s’ha seleccionat cap fotograma o si la selecció inclou diversos fotogrames el panell Acciones estarà atenuat.

Per mostrar les accions bàsiques cliqueu en la categoria Acciones básicas en la llista de la Caja de Herramientas situada a la part esquerra del panell.

Per assignar una acció es pot utilitzar un dels procediments següents: Doble clic en una acció en la categoria Acciones básicas en la llista de la Caja de Herramientas rramientas.

He rramientas Arrossegar una acció des de la llista de la Caja de Herramientas, Herramientas situada a l’esquerra, fins a la llista Acciones, Acciones situada a la part dreta del panell.

Fer clic al botó Añadir (+) i escollir una sentència al menú emergent.

Utilitzant el mètode abreujat de teclat.

Per provar una acció de fotograma en una escena: Control> Provar pel.lícula

3 0

4. Funcions ActionScript Tipus d’scripts. Exemple bàsic de navegació: (on (release), on (press), stop(), play(), gotoAndPlay y gotoAndStop Control de pel lícula Goto: on (release){ gotoAndPlay("nom"); } Per saltar a un fotograma o a una escena específics de la pel lícula s’utilitza l’acció Ir a. a Quan la pel lícula salta a un fotograma es pot optar entre reproduir a partir del nou fotograma (predeterminat) o aturar en el mateix. La pel lícula també pot saltar a una escena i reproduir un fotograma especificat o el primer fotograma de l’escena següent o d’ l’anterior.

Stop: stop(); A menys que s’indiqui una altra cosa una vegada que s’inicia una pel lícula es reprodueix per tots els fotogrames de la Línia de temps. Podeu aturar i iniciar una pel lícula a intervals específics mitjançant les accions Reproducir i Detener.

Detener Per exemple, es pot aturar una pel lícula al final d’una escena abans de continuar amb la següent escena. Un cop detinguda una pel lícula s’ha d’iniciar de nou de manera explícita, mitjançant l’acció Reproducir.

Reproducir Reproducir i Detener s’utilitzen en general per controlar els clips de pel lícules amb botons o per controlar la Línia de temps principal. El clip de pel lícula que voleu controlar ha de tenir un nom d’instància, una destinació assignada i ha d’estar present en la Línia de temps. Flash insereix un ActionScript com el següent a la finestra Script: Script onClipEvent (load) (stop ();) On onClipEvent (load) indica que quan es carrega la pel lícula, executa la instrucció stop per aturar la pel lícula.

Nota: Els parèntesis buits que apareixen darrere d’una acció indiquen que és un mètode (capacitat) que no té paràmetres ni arguments.

Play: Syntax: play (); Arguments: Cap.

3 1

Descripció: Acció; Desplaça el capçal lector cap endavant en la Línia de temps.

Exemple: El codi següent utilitza la sentència if per comprovar el valor d’un nom que introdueix l’usuari. Si l’usuari introdueix Steve, s’anomena a l’acció play i el capçal lector avança en la Línia de temps. Si l’usuari introdueix qualsevol cosa diferent de Steve, la pel lícula no es reprodueix i apareix un camp de text amb el nom de variable alert. stop (); if (name = “Steve”) (play ();) else (alert = “You are not Steve!”;) Noms d’instància, navegació entre clips de pel lícula (_root, _parent, this) y utilizació de variables.

Navegador getURL: on (release) { getURL ("http://www.futura-tc.es"); Arguments: URL La URL de la qual obtenir el document. L’URL ha d’estar en el mateix subdomini que l’URL on resideix actualment la pel lícula.

Finestra Un argument opcional que especifica la finestra o el fotograma HTML en el qual hauria de carregar el document. Introduïu el nom d’una finestra específica o seleccioneu un dels noms de destinació reservats següents: _self especifica el fotograma actual de la finestra activa. _blank especifica una nova finestra. _parent especifica l’element principal del fotograma actual. _top especifica el fotograma de nivell superior de la finestra actual.

Variables Un argument opcional que especifica un mètode per enviar variables. Si no hi ha variables,ometeu aquest argument; en cas contrari, especifiqueu si es carreguen les variables utilitzant un mètode GET o POST. POST GET annexa les variables al final de la URL i s’utilitza per a un nombre petit de variables. POST envia les variables en un encapçalament HTTP a part i es utilitza per cadenes llargues de variables.

Descripció: Acció; carrega un document d’una adreça explícita en una finestra o passa variables a una altra aplicació en un URL definida. Per provar aquesta acció, assegureu-vos que l’arxiu que es va a carregar es troba en la ubicació especificada.

Per utilitzar una URL absoluta (per exemple, http://www.myserver.com) necessita una connexió a la xarxa. fscommand Aquesta acció és capaç d’executar certs comandaments molt potents al inserir, ens apareixerà una pestanya amb els possibles comandes que admet:

3 2

● fullscreen: Si s’activa posa la nostra pel lícula a pantalla completa. Molt útil per presentacions en CD-ROM, per exemple. ● allowscale: Controla el redimensionament dels objectes inserits en la pel lícula quan l’usuari n’estira les vores (o de la pàgina web en la qual es trobi). Volem mantenir les proporcions? Aquest comandament ens permet controlar-ho. ● showmenu: Si heu vist el menú que apareix al prémer el botó dret del ratolí sobre una pel lícula Flash segur que heu pensat a fer-lo desaparèixer ... pot ser que no interessi que els usuaris puguin moure’s a gust per la nostra pel lícula.

Executant aquesta sentència del mode adequat (false) el podrem ocultar. ● trepallkeys: Serveix per detectar les pulsacions de totes les tecles durant la reproducció de les pel lícules.

5. Escenes Per organitzar una pel lícula per temes, es poden utilitzar escenes.

Per exemple, podem utilitzar escenes diferents per a una introducció, un missatge de càrrega i els crèdits.

En enviar una pel lícula de Flash que conté més d’una escena les escenes de l’arxiu SWF es reprodueixen en una sola seqüència en l’ordre que apareixen en el panell Escena de l’arxiu FLA. Els fotogrames de l’arxiu SWF estan numerats consecutivament entre les diferents escenes. Per exemple, si una pel lícula conté dues escenes, cadascuna d’elles amb 10 fotogrames, els fotogrames de l’escena 2 estaran numerats del 11 al 20.

Es poden afegir, eliminar, duplicar, canviar el nom i canviar l’ordre de les escenes.

Per aturar la pel lícula o fer una pausa després de cada escena, o bé per permetre que els usuaris contemplin la pel lícula de manera no lineal s’utilitzen les accions.

Per mostrar el panell Escena: Escena Ventana> Escena.

Per veure una escena determinada: Ver> Goto i, a continuació, escolliu el nom de l’escena del submenú.

3 3

6. Sons Utilitza el comandament Archivo>Importar per portar sons d’arxius WAV (només Windows), AIFF (només Macintosh) o MP3 (qualsevol plataforma) de la mateixa manera que ho faries amb qualsevol altre tipus de fitxer.

Si tenim QuickTime instal lat al sistema podrem importar els següents formats d’ arxiu de so: • • • • •

Sound Designer II (només Macintosh) Pel.lícules QuickTime només so (Windows o Macintosh) Sun AU (Windows o Macintosh) Sons System 7 (només Macintosh) WAV (Windows o Macintosh)

Flash emmagatzema els sons a la biblioteca juntament amb els mapes de bits i els símbols. Igual que amb els símbols gràfics només cal una còpia de l’arxiu de so per utilitzar-lo de diverses formes en la pel lícula. Es poden compartir sons entre les pel lícules Flash i incloure sons a les biblioteques compartides.

Els sons poden requerir una quantitat considerable d’espai a la unitat de disc i en la memòria RAM. No obstant les dades de so MP3 estan comprimides i són més petites que les dades dels sons WAV o AIFF. En general, quan utilitzem fitxers WAV o AIFF, és preferible utilitzar sons mono de 22 Khz. i 16 bits (els estèreo utilitzen el doble d’informació), però Flash pot importar sons de 8 o de 16 bits a velocitats de mostra de 11, 22 o 44 Khz. També permet convertir els sons a velocitats més baixes en exportar.

Nota: Els sons gravats en formats que no siguin múltiples de 11 Khz. (com 8, 32, o 96 Khz.) es tornen a mostrejar quan s’importen en Flash.

Si voleu afegir efectes als sons de Flash és preferible importar sons de 16 bits. Si la memòria RAM del sistema és limitada, treballeu amb clips de so curts o amb sons de 8 bits en lloc de 16-bits.

Conclusió: Conclusió La pel lícula amb un so WAV ocupa gairebé 5 vegades menys que la que té el mateix so en. mp3, per tant sembla recomanable inserir sons. wav (la compressió d’àudio que aconsegueix Flash és molt gran). Com a contrapartida es podria apreciar pèrdua de qualitat en el so que s’escolta a la pel lícula.

Aquesta pèrdua serà important segons depenent del tipus de so. Si és una veu, per exemple, hauríem d’inserir. mp3 ja que necessàriament s’haurà d’escoltar bé; si és música de fons és probable que, encara que es perdi qualitat, el resultat final sigui acceptable i convingui quedar-se amb una pel lícula menys pesant. El millor és provar les dues versions i avaluar el resultat.

3 4

Inserir sons Suposem que volem inserir un so en un fotograma determinat de manera que quan la pel lícula Flash hi arribi comenci a reproduir-lo. Seleccionar el fotograma en el que volem que comenci a reproduir el so. Obrir el Panell Propidades i importar el so del mode vist en el punt anterior. Una altra manera més ràpida encara és en seleccionar el so a la Biblioteca i arrossegar-lo al fotograma elegit (al fotograma, no a la línia de temps).

D’aquesta manera inserim un so. Per defecte Flash entén que volem reproduir el so en la seva totalitat, de manera que Flash reproduirà el so totes les vegades que li haguem indicat a Repetir, Repetir i sonarà encara que el fotograma en el que estigui no sigui el que s’està executant en aquell instant. Si volem que el so pari quan entrem en un altre fotograma hi ha 2 maneres diferents de fer-ho, les dues combinant les opcions que ens del Panell Sonido.

Sonido Quan la pel lícula està llesta s’ha de publicar o exportar el fitxer Flash FLA a un altre format per a la seva reproducció.

La funció Publicar de Flash està dissenyada per presentar l’animació a la Web. Aquest comandament crea el fitxer (SWF) del Flash Player i un document HTML que insereix l’arxiu en una finestra del navegador.

El comandament Exportar película permet crear el contingut de Flash que es pot editar en altres aplicacions i exportar una pel lícula directament en un format únic.

Per exemple, es pot exportar una pel lícula sencera com un arxiu de Flash Player, com una sèrie d’imatges de mapes de bits, com un fotograma únic o un arxiu d’imatge, i com imatges estàtiques i de moviment en diversos formats entre els quals s’inclouen GIF, JPEG, PNG, BMP, PICT, QuickTime o AVI. Comunicació entre diferents movies (swf) o amb un html i intercanvi de variables (loadMovie, loadMovieNum, _level).

LoadMovie: on(release){ loadMovie("nompeli.swf",_root.nomdelclipbuit); } Syntax: LoadMovie (url [, ubicació / destinació, variables]]); Arguments: URL. Una URL absoluta o relativa per al fitxer SWF que anem a carregar. Una ruta relativa ha de ser relativa respecte al SWF. La URL ha d’estar en el mateix subdomini que la URL on resideix actualment la pel lícula. Per utilitzarles en Flash Player o per realitzar proves en el mode de prova de pel lícula en

3 5

l’entorn de creació de Flash tots els arxius SWF han de guardar-se en la mateixa carpeta i els noms d’arxiu no poden incloure especificacions de carpeta ni d’unitat de disc.

Destinació: Un argument opcional que especifica un clip de pel lícula de destinació que es substituirà amb la pel lícula carregada. La pel lícula carregada hereta les propietats de posició, rotació i escala del clip de pel lícula de destinació.

Especificar destinació és el mateix que especificar el nivell d’ubicació d’una pel lícula de destinació, no s’haurien d’especificar tots dos.

Ubicació: Un argument opcional que especifica el nivell en el que la pel lícula està carregada. La pel lícula carregada hereta les propietats de posició, rotació i escala del clip de pel lícula de destinació. Per carregar una nova pel lícula més de les pel lícules existents especifiqueu un nivell que no estigui ocupat per una altra pel lícula. Per substituir una pel lícula existent amb la pel lícula carregada, especifiqueu un nivell que estigui actualment ocupat per una altra pel lícula. Per substituir la pel lícula original i descarregar tots els nivells, carregueu la nova pel lícula en el nivell 0. La pel lícula del nivell 0 estableix la velocitat dels fotogrames, el color de fons i la mida dels fotogrames de totes les altres pel lícules carregades. on(release){ loadmovieNum ("nompeli.swf", 1) } Variables: Un argument opcional que especifica un mètode per enviar variables associades amb la pel lícula que es va a carregar. L’argument ha de ser la cadena GET o POST. POST Si no hi ha variables ometeu aquest argument; en cas contrari, especifiqueu si es carreguen les variables utilitzant un mètode GET o POST. GET annexa les variables al final de la URL i s’utilitza per a un nombre petit de variables. POST envia les variables en un encapçalament HTTP apart i s’utilitza per cadenes llargues de variables.

Descripció: Acció; reprodueix pel lícules addicionals sense tancar Flash Player. En general, Flash Player mostra una sola pel lícula (SWF) i després es tanca. L’acció LoadMovie permet veure diverses pel lícules al mateix temps o canviar de pel lícules sense carregar un altre document HTML. Es poden carregar pel lícules en els nivells que ja tenen arxius SWF carregats. En fer-ho la nova pel lícula substitueix el SWF existent. Si es carrega una nova pel lícula en el nivell 0 tots els nivells es descarregaran i el nivell 0 se substituirà pel nou arxiu. Utilitzeu l’acció loadVariables per mantenir la pel lícula activa i actualitzar les variables amb nous valors.

Utilitzeu l’acció unloadMovie per eliminar pel lícules carregades amb l’acció LoadMovie.

3 6

Exemple: Aquesta sentència LoadMovie està annexada a un botó de navegació amb l’etiqueta Productes. Hi ha un clip de pel lícula invisible a l’Escenari amb el nom d’instància dropZone. dropZone L’acció LoadMovie utilitza aquest clip de pel lícula com a paràmetre de destinació per carregar els productes del SWF, en la posició correcta de l’Escenari. on (release) (LoadMovie ( “products.swf”, _root.dropZone);)

2. Publicar Escollir els formats en els que voleu lliurar l’arxiu de creació i ajustar les configuracions per al format de fitxer en particular. Flash publica automàticament el fitxer de creació en els formats seleccionats, crea arxius addicionals basats en les configuracions seleccionades i desa les configuracions amb l’arxiu de pel lícula per tornar-les a utilitzar.

Les opcions de Exportar película coincideixen en general amb les de publicació però no guarden les configuracions per tornar-les a utilitzar.

Crear formats de fitxer alternatius “GIF, JPEG, PNG i QuickTime” i l’HTML necessari per visualitzar a la finestra del navegador. Els formats alternatius activen un navegador per veure l’animació de la seva pel lícula i la interactivitat per als usuaris que no tinguin instal lat Flash Player.

Abans de publicar la pel lícula és important provar si funciona, amb els comandaments Probar película i Probar escena. escena La reproducció d’una pel lícula de Flash en un navegador web requereix un document HTML que activi la pel lícula i especificar la configuració del navegador. Aquest document es genera automàticament amb el comandament Publicar des dels paràmetres HTML en un document de plantilla.

Els paràmetres HTML determinen on apareixerà la pel lícula de Flash a la finestra, el color de fons, la mida de la pel lícula, etc. i definirà els atributs per a les etiquetes OBJECT i EMBED. EMBED Podeu canviar aquests i altres valors en la fitxa HTML del quadre de diàleg Configuración guración de publicación.

Confi publicación El canvi d’aquestes configuracions modifica les opcions que hi hagi establertes en la pel lícula.

Les configuracions s’inseriran en un document de plantilla.

El document de plantilla pot ser qualsevol arxiu de text que contingui les variables de plantilla correctes, inclòs un fitxer HTML normal, que inclogui codi per intèrprets especials com ColdFusion o Active Server Pages (ASP) o una plantilla inclosa amb Flash.

3 7

Publicar un HTML per visualitzar el fitxer Flash: Seleccionar Archivo> Configuración de publicación. publicación El tipus de fitxer HTML es selecciona per defecte. Introduir un nom únic per a Archivo o seleccionar Utiliza nombre predeterminado per crear un arxiu amb el nom d’arxiu Flash més l’extensió. html.

Fer clic al panell HTML per que apareguin les configuracions.

Escollir una plantilla instal lada per utilitzar des del menú emergent Plantilla; Plantilla clic al botó d’informació de la dreta per que aparegui una descripció de la plantilla seleccionada.

El menú enumera tots els arxius de plantilla a la carpeta Flash HTML. Les plantilles bàsiques només mostren la pel lícula en un navegador mentre que les plantilles més avançades contenen codi per a la detecció del navegador i altres funcions. Si no se selecciona una plantilla, Flash utilitza la plantilla per defecte Default.html, Default.html i si aquesta no hi fos utilitzarà la primera plantilla de la llista.

Flash desa la plantilla modificada amb el nom d’arxiu de la pel lícula de Flash més l’extensió de l’arxiu de plantilla. Per exemple, si seleccioneu una plantilla anomenada Estándar.asp per utilitzar-la amb una pel lícula de Flash anomenada MiPelícula.swf, MiPelícula.swf el nom del fitxer resultant és MiPelícula.asp.

MiPelícula.asp Dimensiones: configura els valors dels atributs WIDTH i HEIGHT en les etiquetes OBJECT OBJECT i Embed: Embed ● Coincidencia con película (predeterminat), utilitza la mida de la pel lícula. ● Píxels, Píxels permet introduir el número de píxels en els camps WIDTH i HEIGHT. HEIGHT ● Porcentaje, Porcentaje per utilitzar un percentatge relatiu a la finestra del navegador.

Opciones de Reproducción: Reproducción: controla les funcions i reproducció de la pel lícula de la manera següent: ● Pausa, Pausa al començament atura la pel lícula fins que l’usuari faci clic en un botó de la pel lícula o faci clic a Reproducir del menú emergent. Per defecte, l’opció es desselecciona i la pel lícula comença a reproduir-se en quant es carrega (el paràmetre PLAY està establert a true). true ● Reproducir indefinidamente repeteix la pel lícula en cicle quan arriba l’últim fotograma. Anul leu la selecció d’aquesta opció si voleu aturar la pel lícula quan arribi al últim fotograma. (El paràmetre LOOP està activat per defecte.)

3 8

● Visualiza menú mostra un menú de mètode abreviat quan l’usuari fa clic amb el botó dret del ratolí (Windows) o Control-clic (Macintosh) a la pel lícula. Anul leu selecció d’aquesta opció per a que només aparegui Sobre Flash al menú drecera.

Per defecte aquesta opció està activada (el paràmetre MENÚ està definit en true). true ● Fuente de dispositivo (per a Windows únicament): seleccionar-lo per substituir les fonts suavitzades del sistema per fonts no instal lades en el sistema de l’usuari. L’ús de les fonts de dispositiu augmenta la llegibilitat del tipus en mides petites i pot disminuir la mida de l’arxiu de pel lícula. Aquesta opció només afecta a les pel lícula que contenen text estàtic (text que es va crear en fer una pel lícula i que no canvia quan aquesta es mostra) definit per mostrar amb les fonts de dispositiu.

Calidad: Calidad: determina l’equilibri entre temps de processament i el suavitzat de cada fotograma abans que aparegui a la pantalla de l’usuari, de la manera següent: ● Baja: Baja afavoreix la velocitat de reproducció davant l’aparença i no utilitza la visualització suavitzada. ● Baja automática: automática dóna més importància a la velocitat, però millora l’aspecte sempre que és possible. L’opció Reproducción comença amb la visualització suavitzada desactivada. Si Flash Player detecta que el processador pot gestionar, la visualització suavitzada s’activa. ● Alta automática: automática en un principi dóna la mateixa importància a la velocitat i a l’aspecte, però sacrifica l’aspecte per la velocitat si és necessari. L’opció Reproducción comença amb la visualització suavitzada activada. Si la velocitat real dels fotogrames és inferior a la velocitat especificada la visualització suavitzada es desactiva amb l’objecte de millorar la velocitat de reproducció.

Utilitzar aquest valor per emular el valor de Ver> suavizado en Flash.

Flash ● Media: Media aplica una mica de visualització suavitzada, però no suavitza els mapes de bits. Produeix millor qualitat que el valor Baja, Baja però menor qualitat que el valor Alta.

Alta ● Alta (valor predeterminat): afavoreix l’aparença davant la velocitat de reproducció i sempre utilitza la visualització suavitzada. Si la pel lícula no conté animació, els mapes de bits se suavitzen, en cas contrari no se suavitzen. ● Òptima: Òptima proporciona la millor qualitat de visualització i no té en compte la velocitat de reproducció. Les imatges resultants i els mapes de bits sempre se suavitzen. Aquesta opció configura el valor del paràmetre QUALITY en les etiquetes OBJECT i EMBED. EMBED Modo ventana: ventana: Per a la versió Windows de l’Internet Explorer amb el control Flash ActiveX, seleccioneu una opció de Mode de finestra per transparència, posició i capes:

3 9

● Ventana reprodueix una pel lícula de Flash Player en la seva pròpia finestra rectangular d’una pàgina Web per que l’animació sigui el més ràpida possible.

L’opció configura el paràmetre WMODE de l’etiqueta OBJECT a WINDOW. WINDOW ● Opaco sin ventanas mou els elements darrere de les pel lícules de Flash (per exemple, amb HTML dinàmic) per evitar que aquests es mostrin, configurant el paràmetre WMODE a Opaque.

Opaque ● Transparente sin ventanas mostra el fons de la pàgina HTML en la qual la pel lícula s’incrusta a través de totes les àrees transparents de la pel lícula, però pot fer l’animació més lenta. L’opció estableix WMODE a TRANSPARENT. TRANSPARENT Alineació HTML: per col locar la finestra de la pel lícula de Flash dins la finestra del navegador. ● Predeterminado centra la pel lícula en la finestra del navegador i retalla les vores si la finestra del navegador és més petita que la pel lícula. ● Izquierda, Derecha, Superior o Inferior alinea les pel lícules per la vora corresponent de la finestra del navegador i retalla els altres tres costats si és necessari. Aquesta opció especifica l’atribut Align per les etiquetes OBJECT, EMBED i IMG. Escala: Col loca la pel lícula dins dels límits especificats si va canviar l’amplada i l’alçada original de la pel.lícula: ● Predeterminada Predeterminada (mostra tot) permet veure tota la pel lícula en l’àrea especificada sense distorsió, al mateix temps que manté la proporció original de la pel lícula. És possible que apareguin vores a ambdós costats de la pel lícula. ● Sin borde dimensiona la pel lícula per omplir l’àrea especificada i manté la proporció de l’aspecte original de la pel lícula sense distorsions i retallant si fos necessari. ● Ajuste exacto mostra la pel lícula completa en l’àrea especificada sense mantenir la proporció de l’aspecte original que podria causar distorsió.

Sin Escala impedeix que el document canviï d’escala quan la finestra del navegador canvia de mida. Escala configura el paràmetre SCALE en les etiquetes OBJECT i EMBED. EMBED Alineación Flash: per configurar la forma en què es col loca la pel lícula dins de la finestra i com es retalla si fos necessari. ● Per l’alineació horitzontal, escolliu Izquierda, Centro o Derecha.

Derecha

4 0

● Per l’alineació vertical, seleccioneu Superior, Centro o Inferior.

Inferior Aquesta opció configura el paràmetre Align de les etiquetes OBJECT i EMBED. EMBED Missatges d’advertiment: Per que apareguin els missatges d’error si es produeix algun conflicte en la configuració, per exemple, si una plantilla té codi referit a una imatge alternativa que no s’ha especificat.

Per guardar les configuracions amb l’arxiu actiu, Acceptar.

Acceptar Publicar un arxiu Flash: Seleccionar Archivo> Configuración de publicación. publicación El menú enumera tots els arxius de plantilla a la carpeta Flash HTML. Les plantilles bàsiques només mostren la pel lícula en un navegador mentre que les plantilles més avançades contenen codi per a la detecció del navegador i altres funcions. Si no se selecciona una plantilla Flash utilitza la plantilla per defecte, Default.html, Default.html i si aquesta no hi fos utilitzarà la primera plantilla de la llista.

Seleccionem el format swf. i obrim la pestanya de Flash. Flash desa la plantilla modificada amb el nom d’arxiu de la pel lícula de Flash més l’extensió de l’arxiu de plantilla. Per exemple, si seleccionem una plantilla anomenada Estándar.asp per utilitzar-la amb una pel lícula de Flash anomenada MiPelícula.swf, MiPelícula.swf el nom del fitxer resultant és MiPelícula.asp.

MiPelícula.asp Versión: Versión Per escollir una versió del Flash Player. No totes les característiques de Flash funcionen en pel lícules publicades en versions anteriors de Flash.

Versión de ActionScript: selecciona la versió d’ActionScript que s’ha utilitzat.

Calidad JPG: Per controlar la compressió de mapa de bits cal ajustar el lliscament de qualitat JPEG o introduir un valor. Una imatge de baixa qualitat produeix arxius de menor mida, una d’alta qualitat produeix arxius de mida més gran.

Habilitación desbloqueo de JPEG: JPEG per a que les imatges JPEG molt comprimides tinguin una aparença més suau. Aquesta opció redueix les irregularitats típiques que es deriven de la compressió JPEG. Algunes imatges JPEG poden perdre alguns detalls quan aquesta opció està seleccionada.

Establecer Flujo de audio o Evento de audio: audio Per establir la freqüència de mostreig i la compressió de tots els fluxos de so o sons d’esdeveniment de l’arxiu SWF. Un flux d’àudio es sincronitza amb la línia de temps i es començarà a reproduir quan s’ha descarregat informació suficient per als primers fotogrames. Un so d’esdeveniment no es reprodueix fins que s’ha descarregat per complet i es continua reproduint fins que es s’atura de manera explícita.

Suplantar configuración de sonido: sonido Per crear un fitxer SWF més petit de baixa fidelitat.

4 1

Exportar sonidos de dispositivo: dispositivo Per exportar sons adequats als dispositius, inclosos els dispositius mòbils en lloc del so de la biblioteca original.

Per establir la configuració de SWF, tenim diverses opcions: Comprimir pel lícula (Predeterminada): Comprimeix l’arxiu SWF per reduir la mida de arxiu i el temps de descàrrega. Especialment útil per arxius de text o amb gran quantitat de codi ActionScript.

Els arxius comprimits només es reprodueixen en Flash Player 6 i versions posteriors.

Incluir capas ocultas (Predeterminada): Exporta totes les capes ocultes del document de Flash. Si s’anul la selecció de Exportar capas ocultas s’evita que totes les capes (incloses les incrustades dins de clips de pel lícula) marcades com ocultes s’exporten a l’arxiu SWF resultant. D’aquesta manera podem provar diferents versions de documents de Flash amb capes invisibles.

Incluir metadatos XMP (Predeterminada): Exporta totes les metadades introduïdes en el quadre de diàleg.

Información de archivo. Les metadades es poden veure quan el fitxer SWF està seleccionat en Adobe ® Bridge.

Exportar SWC: SWC Exporta un fitxer .swc, que s’utilitza per distribuir components.

L’arxiu .swc conté un clip compilat, l’arxiu de classe de ActionScript del component i altres arxius que descriuen el component.

Avanzado: Avanzado Crear un informe de mida: produeix un arxiu de text que es pot utilitzar com a guia per reduir al màxim la mida del fitxer de la pel lícula. Aquest informe de mida mostra el nombre de bytes que utilitzen diferents parts de la pel lícula en l’arxiu final del reproductor Flash. L’informe té el mateix nom que la pel lícula exportada, però amb l’extensió. txt.

Proteger ante importación: importación evita que altres importin el fitxer SWF de Flash i el converteixin de nou en una pel lícula de Flash.

Para evitar acciones de trazado: trazado fa que Flash passi per alt l’acció de traçat en la pel lícula activa per evitar que s’obri la finestra Salida i la visualització de comentaris.

Para evitar accions de trace: Determina que Flash ignori les declaracions de traçat (trace) d’ActionScript al’arxiu SWF actual. Si seleccionem aquesta opció, la informació de les declaracions trace no apareixerà en el panell Sortida.

4 2

Permitir depuración: depuración permet depurar una pel lícula de Flash de forma remota. Si seleccionem aquesta opció, podem triar la protecció amb contrasenya de l’arxiu de pel lícula.

Si seleccionem l’opció i introduïm la contrasenya, apareixerà un camp Contraseña en importar el fitxer SWF. Per importar el fitxer cal introduir la mateixa contrasenya que es va introduir en l’opció. Si s’afegeix una contrasenya altres usuaris l’hauran de conèixer i introduir per poder depurar l’arxiu. Per eliminar la contrasenya esborreu el camp Contraseña.

Contraseña Per a l’ús de l’acceleració de maquinari seleccionar una de les següents opcions al menú Aceleración de hardware: hardware ● Nivel 1 - Directo: Directo El mode Directe millora el rendiment de la reproducció al permetre que Flash Player dibuixi directament a la pantalla en comptes que sigui el navegador el que realitzi el dibuix. ● Nivel 2 - GPU: GPU En el mode GPU Flash Player utilitza la potència disponible de la targeta gràfica de l’equip per reproduir vídeo i crear capes compostes de gràfics.

D’aquesta manera es pot millorar el nivell de rendiment en funció del maquinari de gràfics de l’usuari. S’utilitza aquesta opció si el públic usuari disposa de targetes gràfiques de qualitat alta.

Si el sistema de reproducció no disposa de maquinari suficient per permetre l’acceleració Flash Player torna al mode de dibuix normal de forma automàtica.

Per obtenir el millor rendiment en les pàgines web que contenen diversos arxius SWF cal habilitar l’acceleració de maquinari només per un dels arxius.

L’acceleració de maquinari no s’utilitza en el mode Probar película. película Límite de tiempo del script: Para determinar el temps màxim per l’execució dels scripts en el fitxer SWF. Flash Player cancel larà l’execució dels scripts que superin el límit fixat.

Per guardar les configuracions amb l’arxiu actiu, Aceptar.

Aceptar

4 3

Guia de Recursos Flash RECURSOS Nom Recursos Flash

URL

Observacions

de http://www.recursos-flash.es/ http://www.creatupropiaweb.com/Recursos_Flash/re cursos_flash_gratuitos_creatupropiaweb.html http://www.ffiles.com/flash/photo_galleries/profgaller y_3257.html

Manuals http://www.x-flash.org/as/docs/index_as.htm d'Actionscript Fòrums de Flash http://www.forosdeflash.com/ per a consultes http://www.flashvillage.com/

Anglès

http://www.flashkit.com/ http://www.scriptocean.com/

Manuals oficials http://www.adobe.com/support/documentation/es/fla Adobe sh/#actionScript

Anglès