CURSWEBS

Desitjo que us sigui útil aquest blog. Aquest blog no sustitueix al professor, el complementa. El seu ús és voluntari i no implica cap obligació per part del professor a escriure en ell. Els continguts d'aquest blog s'han de considerar material i apunts. Com a membres teniu dret a escriure en ell preguntes i suggeriments sota la meva supervisió i també penjar en el blog alguns dels vostres treballs a fí que en poguem fer un anàlisi o "feedback". Bona sort.

dilluns, de novembre 20, 2006


Manquen cartells

Encara no s'han entregat tots els cartells. Ja he començat a fer els feedbacks.

dilluns, de novembre 13, 2006


Cartell Ludovic

divendres, de novembre 10, 2006


Anidament de símbols

Anidar vól dir ficar. Anidar símbols vól dir ficar uns a dintre dels altres.
MÈTODE A _ Des de lo global fins a lo local.

  1. Crear un nou símbol. Diguem-li GLOBAL.
  2. A dins del símbol GLOBAL, editant(o sigui ficant-nos a dins de GLOBAL), crear un altre símbol, diguem-li LOCAL. (o sigui que dintre de GLOBAL fabriqueu el LOCAL).

[NOTA: Aquest mètode seria l'equivalent a crear una carpeta A i dintre de la carpeta A crear una altra carpeta B]


MÈTODE B _ Des de lo local fins a lo global _ embolcallant


  1. Crear un nou símbol.
  2. [Opcional] Dibuixar i/o afegir altres símbols.
  3. Ho sel·leccionem tot i ho convertim en símbol.
[NOTA: A Windows no tenim equivalent. Seria com crear una carpeta i embolcallar-la amb una altra].
MÈTODE C _ Crear per separat i ficar un a dintre de l'altre.

  1. Crear dos símbols per separat.
  2. Extreure(cortar) un dels dos símbols i enganxar(pegar) a l'interior de l'altre.

[NOTA: A Windows seria com crear dos carpetes per separat i després ficar arrossegant la carpeta B dins de la A].


UTILITAT DE L'ANIDAMENT DE SÍMBOLS
  • Empaquetar símbols junts de tal manera que quedin lligats i que poguem otorgar-li un moviment al paquet sencer(com per exemple traslacions d'un cotxe).
  • Anidar instàncies per programar amb Action Script.
  • Composar moviments.


Anidament de símbols

Els símbols tenen la seva pròpia línia de temps. Gràcies a això podem composar moviments. Fins i tot d'aquesta manera és possible combinar interpol·lació de forma i de moviment cosa que abans no podiem.

Però per a això cal que domineu l'anidament de símbols uns a dintre dels altres. Amb els diferents exemples que veieu aquests dies amb els exercicis de composició de moviment esteu començant a entendre a on animar les coses. Recordeu que anidar és sinònim de ficar(= en castellano meter). Veieu l'article que explica com anidar per tant.

Per composar moviment cal anidar símbols uns a dintre dels altres. D'aquesta manera estem ficant línies de temps unes a dintre de les altres.


Anidament de símbols

Anidar vól dir ficar. Anidar símbols vól dir ficar uns a dintre dels altres.
MÈTODE A _ Des de lo global fins a lo local.

  1. Crear un nou símbol. Diguem-li GLOBAL.
  2. A dins del símbol GLOBAL, editant(o sigui ficant-nos a dins de GLOBAL), crear un altre símbol, diguem-li LOCAL. (o sigui que dintre de GLOBAL fabriqueu el LOCAL).

[NOTA: Aquest mètode seria l'equivalent a crear una carpeta A i dintre de la carpeta A crear una altra carpeta B]


MÈTODE B _ Des de lo local fins a lo global _ embolcallant


  1. Crear un nou símbol.
  2. [Opcional] Dibuixar i/o afegir altres símbols.
  3. Ho sel·leccionem tot i ho convertim en símbol.
[NOTA: A Windows no tenim equivalent. Seria com crear una carpeta i embolcallar-la amb una altra].
MÈTODE C _ Crear per separat i ficar un a dintre de l'altre.

  1. Crear dos símbols per separat.
  2. Extreure(cortar) un dels dos símbols i enganxar(pegar) a l'interior de l'altre.

[NOTA: A Windows seria com crear dos carpetes per separat i després ficar arrossegant la carpeta B dins de la A].


UTILITAT DE L'ANIDAMENT DE SÍMBOLS
  • Empaquetar símbols junts de tal manera que quedin lligats i que poguem otorgar-li un moviment al paquet sencer(com per exemple traslacions d'un cotxe).
  • Anidar instàncies per programar amb Action Script.
  • Composar moviments.


Editar Símbols

Podem accedir a la línia de temps de cada símbol i editar-lo per dins i us en indico 5 formes possibles per accedir-hi a l'interior:


  • Doble click sobre el símbol a l'àrea de treball(que podria ser l'escenari si estigués allà mateix).
  • Botó dret sobre el símbol a l'àrea de treball > Edició a l'àrea de treball.
  • Botó dret > sobre el símbol a l'àrea de treball Edició en context a l'àrea de treball.
  • Botó dret sobre el símbol a la biblioteca > Edició a la biblioteca.
  • Doble click sobre el símbol a la biblioteca.

Per què cal accedir-hi a l'interior dels símbols per editar-lo?
Doncs per que, entre d'altres coses, els símbols estàn agrupats i no ens permeten deformar-los.


Observacions i consideracions:

Si estem a dins de la línia de temps d'un símbol i volem tornar a l'escenari o a un símbol més global cliquem a on posa el nom de l'escena o al símbol que englobava a aquest. En el cas de l'exemple si volguèssim sortir del clip "quadres" cap al clip "CAP DE PLOMA" hauria de clickar a "CAP DE PLOMA".


Creació de símbols

MÈTODE A (A partir d'un objecte dibuixat)
  1. Dibuixem l'objecte i el sel·leccionem.
  2. INSERTAR > CONVERTIR EN SÍMBOLO.
  3. Escollim el tipus de símbol i el nomeneu.
  4. Col·loquem l'objecte respecte de la creu en cas que volguem que pivoti respecte a on està la creu.
  5. Si s'ha d'animar la línia del símbol l'editem i l'animem per dins.


MÈTODE B (Des de zero)
  1. INSERTAR > Nuevo Símbolo
  2. Escollim el tipus de símbol
  3. Dibuixem per dins del símbol
  4. Col·loquem l'objecte respecte de la creu per que faci de pivot més tard.

dijous, de novembre 09, 2006


Interpol·lació de forma

Per fer interpol·lacions de forma es pot fer, de forma similar al que passava amb les interpol·lacions de moviment, mitjançant dos mètodes.




MÈTODE A:


  1. Dibuixar un objecte a un fotograma.
  2. Sel·leccionar el fotograma clau on està el dibuix
  3. Anar a la finestra Propietats, desplegar la persiana Animar i escollir la opció "forma".
  4. Més a la dreta insertar un fotograma clau.


MÈTODE B:


  1. Dibuixar un objecte a un fotograma clau.
  2. Insertar un fotograma clau més a la dreta.
  3. Sel·leccionar tots els fotogrames des del primer fotograma clau fins el darrer.
  4. Anar a la finestra propietats, desplegar la persiana Animar i escollir la opció "forma".

Què es pot fer amb interpol·lacions de forma:

  1. Canviar de forma
  2. Canviar de posició
  3. Redimensionar
  4. Girar
  5. Canviar de color
  6. Animar degradats

Què no es pot fer amb interpol·lacions de forma:

  1. No es pot agrupar el farcit. Quan es fa això es trenca la interpol·lació de forma i no funciona correctament.


Màscares

Les màscares en Flash serveixen per deixar veure a través d'elles. Fan la funció de "forats".



Quan hi ha màscares al Flash han d'haver-hi també coses enmascarades, és a dir: coses que es vegin a través d'elles. Dit d'una altra manera, hi haurà capes màscares i capes enmascarades.




Per fer una màscara:

  1. Es dibuixa a una capa un farcit amb la forma del forat desitjat. Aquesta forma serà la que farà de màscara. Li posarem com a nom "MASQUI"
  2. Creem una capa buida i la posem a sota d'aquesta capa. L'anomenarem "enmascarada".
  3. La capa de la màscara, "MASQUI" la convertirem en màscara fent: botó dret i a continuació sel·leccionant la opció "màscara".
  4. [Observar que la capa "enmascarada s'ha subordinat a la capa MASQUI i les dues s'han bloquejat amb candaus."]

[ADVERTÈNCIES]

  • Les màscares s'han de fer de "farcits". Si hi ha traçats a les capes màscara no s'enmascararà res.
  • Les màscares, a diferència de les guies, sí es poden agrupar. Fins i tot es poden animar.


GUIES DE MOVIMENT: INTERPOL·LACIÓ DE MOVIMENT SEGUINT UNA TRAJECTÒRIA DEFINIDA


  1. A una capa dibuixar un objecte.
  2. Afegir una capa guia i dibuixar un traçat en aquesta capa
  3. A la capa de l'objecte "Crear interpol·lació de moviment", crear fotogrames clau i col·locar l'objecte allà on volguem per a cada fotograma clau.
  4. Si voleu que l'objecte s'orienti segons traçat sel·leccioneu els fotogrames clau i a PROPIETATS sel·leccioneu la casella ORIENTAR SEGONS TRAÇAT

[ADVERTÈNCIES]

  • A la capa guia que només hi hagi traçat. Que no hi hagi cap farcit.
  • No agrupeu el traçat a la capa guia.
  • No feu cap interpol·lació de moviment a la capa guia(que no deixa de ser una forma d'agrupar).
Exemple:




Canvis que es poden fer amb interpol·lació de moviment

Haviem dit el que no podiem fer en l'article anterior. Ara diguem el podem fer.

CANVIS QUE ES PODEN FER A INTERPOL·LACIONS DE MOVIMENT. (Recordeu que heu d'estar a fotogrames clau per a poder efectuar aquests tipus de canvis)

Tocant l'objecte [Modificant paràmetres de la finestra propietats]

  1. Canvis de posició
  2. Redimensions [Eina transformació lliure]
  3. Canvis d'orientació [Eina transformació lliure]
  4. Canvis d'opacitat(alpha)
  5. Canvis de brillantor.
  6. Canvi de "tint"

Tocant el fotograma [Modificant paràmetres de la finestra propietats]

  1. Acceleracions
  2. Rotacions
  3. Orientar segons traçat[Sempre i quan hagueu fet una capa guia amb un traçat que fes de trajectòria]


ADVERTÈNCIES SOBRE INTERPOL·LACIÓ DE MOVIMENT

  1. Quan fem una interpol·lació de moviment els objectes, si és que no ho estaven, s'AGRUPEN. Per tant:
    • No es poden colorejar
    • No podem editar els nodes, "usea" no podem deformar els objectes.
    • Un cop fet un objecte, en principi, ja no el podem canviar. L'heu de dibuixar bé abans de crear la interpol·lació.
  2. Si intentem fer canvis a un objecte en un "fotograma no clau" accidentalment se'ns pot crear un fotograma clau. Per tant. NOMÉS FEU CANVIS ALS FOTOGRAMES CLAU.
  3. Si desagrupem un objecte que estigui a una interpol·lació de moviment LA INTERPOL·LACIÓ ES TRENCA.
  4. Si afegim un objecte a un fotograma clau d'una interpol·lació de moviment LA INTERPOL·LACIÓ ES TRENCA.


Els fotogrames clau serveixen per

INDICAR(ESPECIFICAR) CANVIS


HABILITATS i PROCEDIMENTS D'ANIMACIÓ EN FLASH FETS FINS ARA

Repaseu lo que hem fet i xequejeu:

  1. Introducció sobre l'animació en Flash. Hem explicat que, a l'igual que Flash redueix pes dels gràfics vectorials gràcies a que defineix matemàticament les corves, també pot reduir pes a la pel·lícula al definir matemàticament les animacions.
  2. Heu vist un exemple d'interpol·lació de moviment on amb dos fotogrames clau l'objecte es deslplaça d'un punt a un altre. Aquí lo que esteu fent vosaltres és indicar la posició on han d'estar els objectes en diferents fotogrames clau i el reproductor de l'usuari interpol·larà les possicions intermitjes entre diferents posicions. És a dir que només amb la informació dels fotogrames clau ja definim el moviment. Ho farem amb més detall més endavantj, només ha sigut una introducció per veure què és una interpol·lació en Flash.
  3. Manipulació de fotogrames:
    • Insertar fotogrames generant així intervals de fotogrames o "blocs de fotogrames".
    • Allargar i/o escurçar intervals de fotogrames.
    • Insertar fotogrames clau. I fotogrames clau buits.
    • Sel·lecció de fotogrames
      • Doble click sobre un interval de fotogrames
      • 1 click en el primer fotograma que desitjem sel·leccionar i (1 Click + MAYS) en el darrer fotograma que volguem sel·leccionar. Això es pot fer inclús amb fotogrames que estiguin en diferents capes
      • Arrossegant el cursor.
      • ...
    • Desplaçament de fotogrames
      • Fent doble click i arrossegant cap a la dreta o l'esquerra en la mateixa capa.
      • Fent doble click i arrossegant cap amunt i cap avall canviant de capa.
      • Copiant fotogrames i enganxant-los en una altre lloc.
    • Copiar fotogrames
    • Extreure fotogrames
    • Tallar fotogrames
    • Eliminar fotogrames
    • Esborrar fotogrames(una mala traducció, hauria de dir: esborrar continguts de fotogrames)
    • EXERCICI D'ANIMACIÓ FOTOGRAMA A FOTOGRAMA. Un bitxo caminant. Us recomenava fer servir referències per que les potetes seguissin un moviment més natural fixant-se als punts on trepitjéssin.

dimarts, de novembre 07, 2006


REGLA NEMOTÈCNICA

MOVIMENTS INDEPENDENTS EN CAPES DIFERENTS.


Interpol·lació de moviment

Si el grafisme vectorial en flash ha suposat una revolució en els gràfics vectorials a internet, per la seva estandarització per una banda i la reducció de pes per l'altre, l'animació streaming que permet flash ha permés afegir al web la component de moviment i de temps; o sigui: ha permés desenvolupar animacions per les pàgines web.

Abans els banners publicitaris de les pàgines web es feien en format de gifs animats que eren seqüències de mapes de bits. Us ensenyaré a fer-ne gifs animats. Ara els banners publicitaris gràcies a les possibilitats multimèdia i a la reducció de pes que permet flash es fan sobretot en flash.

Ara, amb les animacions en Flash, es pot arribar a complicar una mica més. En tot cas és un recurs més per poder realitzar la funció principal del Disseny de pàgines web que és la de comunicar.

Comunicar amb imatges estàtiques ja té la seva dificultat i el seu "intringulis". No és pas banal i el disseny gràfic tradicional ha tractat de desenvolupar la comunicació visual durants segles mitjançant tot el que se sabia de psicologia de la percepció per una banda i de les expressions culturals i artístiques per l'altra.

Amb l'aportació de les animacions de Flash podem arrissar encara més el rínxol. Podem aportar-li moviment al missatge visual. Per fer això convindrà aquí desenvolupar quasi quasi, habilitats "cinematogràfiques". Si heu fet alguna cosa d'edició de vídeo i teniu coneixements de cinema, animació, etc... les podeu integrar aquí.

En aquest capítol desenvoluparem aquestes i més habilitats. Convé que tingueu
present que sovint a la gent li costa una mica animar. Així que estigueu amb els
ulls, les orelles i la ment ben oberts quan expliqui. Lo que farem no s'hi
sembla gaire a res que hagueu fet abans. Torna a ser començar de zero. Les
primeres operacions que veurem fan referència al
control dels
fotogrames
.


[continuaré aquest article...]


Interpol·lació de moviment

PROCEDIMENTS PER FER INTERPOL·LACIÓ DE MOVIMENT

MÈTODE A:
  1. Dibuixar l'objecte que volguem animar amb interpol·lació de moviment.
  2. Sobre l'únic fotograma clau(el primer) fer botó dret -> Crear Interpol·lació de moviment.
  3. En un fotograma més a la dreta de la mateixa capa fer botó dret ->Insertar Fotograma Clau.
  4. Amb el dial (aquella agulla de color vermell) col·locat en aquest fotograma clau que acabem de crear desplaçarem l'objecte per l'escenari.

MÈTODE B:

  1. Dibuixar l'objecte que volguem animar amb interpol·lació de moviment.
  2. En un fotograma més a la dreta de la mateixa capa fer botó dret ->Insertar Fotograma Clau.
  3. Sel·leccionar tots els fotogrames inclosos els fotogrames clau i fer botó dret -> Crear Interpol·lació de moviment.
  4. Amb el dial (aquella agulla de color vermell) col·locat en aquest fotograma clau que acabem de crear desplaçarem l'objecte per l'escenari.

diumenge, de novembre 05, 2006


NOTA: Hi ha hagut alguns errors d'estils de cascada en el blog

Hola

Us informo que el tutorial de RollOvers directes i indirectes fallava degut a que uns estils de cascada generat pel propi motor del Blogger feien que algunes parts del text no es veiessin. En el tutorial de Rollovers l'he corretgit. Aniré mirant si la resta està bé.

Dispenseu les molèsties.