La diada de Sant Jordi. Memòria tècnica

La Diada de Sant Jordi

Índex El nostre equip..……………………………………………………….3 La idea………………………………………………………………..…4 Seqüenciació…………………………………………..……………….4 Guió tècnic …………..……….….…………………………….………5 Àudios…….………….………….……………………………………..17 Fonts consultades……………………………………………….……18

El nostre equip El nostre l’equip de GTV (GarbíTV) de l’escola Garbí Pere Verges d’Esplugues del Llobregat col.labora amb la Vida Social de la nostra escola. El duen a terme un grup de 25 alumnes d’ ESO, BTX, setmanalment s’encarrega de recollir i editar: noticiaris, entrevistes, espectacles, conferències, concerts, esports, activitats i emissions on line d’algunes festes i tradicionals de l’escola.

Tot aquest material és editat i posteriorment penjat en format de vídeo o podcast a la web de l’Escola: www.escolagarbi.cat.

GTV inclou els vídeos i animacions de les activitats editades i posteriorment penjades a un servidor Vimeo.

Com altres anys organitzem el lliurament de premis Sant Jordi i realitzem un videoclip per presentar l’acte, una mostra d’anys anteriors: • 2017: https://vimeo.com/204784230 • 2016: https://vimeo.com/157566490 • 2015: https://vimeo.com/126224102 • 2014: https://vimeo.com/90000174 • 2013: https://vimeo.com/42063743

L a i d e a Vam iniciar aquest vídeo amb la idea de desenvolupar una animació de Sant Jordi per introduir el Lliurament dels premis Sant Jordi de la nostra escola.

En un principi,, vam fer una pluja de idees, partint dels videos que havíem fet els Posteriorment, vam decidir que Sant Jordi apareixeria en la seva Diada a Barcelona, situant-lo en el context revolucionari actual.

La història comença al Passeig de Gràcia, centre neuràlgic de la Diada. En una de les paradetes, una parella compra un llibre que al visulatizar-ho es veu com Sant Jordi apareix a la porta de la Casa Batlló, en la seva diada passeja per les paradetes de llibres i roses. En mig d’una manifestació, observa uns turistes que miren i fotografien la teulada de l’edifici. E n m i g d ’ a q u e s t a l d e r u l l , creu sentir els crits d’una noia i un drac que el fan imaginar-se, com si es tractés d’en Quixot, una lluita amb el drac per rescatar-la. Quan torna al món real intenta rescatar-la entrant per la porta de la Casa Batlló, un guàrdia li barra el pas i se’l emporta detingut amb altres manifestants.

A comissaria passa una nit i coneix a una noia que s’assemblava moltíssim a la noia que fa una estona estava en perill.

Finalment la parella viuen la Diada passejant pel Passeig de Gràcia.

En diverses seqüències del vídeo van apareixent alguns dels creadors d’aquest curt, passejant, en bici, en monopatí o fent-se fotos.

Esperem que us agradi Bona Diada de Sant Jordi!!!!

Guió t è c n i c El procés de treball després de la primer esborrany ha estat el següent.

En un principi, vam dibuixar els personatges I escenaris amb Illustrator, Paint I photoshop.

Posteriorment, vam cercar, descarregar i modificar els objectes de farciment. Vam editar amb iMovie I After effects I finalment vam inserir els àudios corresponents.

El vídeo resultant pot visualitzar-se en aquest enllaç: https://vimeo.com/246586312 Disposem també d’un curt del maquing off que recull tot el procés desenvolupat: https://vimeo.com/254573111 Seguidament podeu consultar els aspectes tècnics aplicats distribuïts en 10 seqüències .

Guió t è c n i c 1 La Diada del Passeig de Gràcia Hem agrupat aquest apartat en quatre seqüències tenint en compte els enregistraments fets en croma: Portada: inclou una de les components enregistrat en croma a classe introduïda en el dibuix del Passeig de Gràcia avall. amb vectors en copyleft descarregats de Freepick (font, arbres, banc i paperera).

Editada amb iMovie.

Parades de libres i roses: En aquesta seqüència apareixen una parella que es regalen un llibre, un ciclista i un skater enregistrats amb croma a classe i introduïts en el dibuix paradetes de sant jordi amb vectors en copyleft descarregats de Freepick (venedors, llibres, roses, arbres i farola). Editada amb iMovie i After effects Entrada a la Casa Batlló: Croma de la parella inserir en el dibuix Casa Batlló. Editada amb iMovie i After effects Passeig per la Casa Batlló, croma del noi amb una foto de l’interior de la casa. Editada amb iMovie.

Lectura del llibre i inici de la història: Croma del noi i del llibre amb la història animada. Editada amb iMovie i After effects

Guió t è c n i c 2 Casa Batlló Aquesta seqüència disposa de quatre dibuixos: • casbatlló.ai, • santjordi_frontal • santjordi_mira_esquerra • santjordi_mira_dreta.ai.

Els tres Sant Jordi s’han modificat a partir d’un vector gratuït de freepick En aquesta seqüència de 7”08, el vector casabatllo.ai fa un moviment descendent de la seva façana des del sostre fins de la calçada, fent una transformació amb canvi de posició. La façana és acompanyada en part del trajecte pel vector santjordi_frontal.ai.

P o s t e r i o r m e n t , t r a n s f o r m a l ’ o p a c i t a t p e r m e t e n t l ’ a p a r i c i ó d e santjordi_mira_esquerra.ai i santjordi_mira_dreta.ai.

Guió t è c n i c 3 Paradetes de Sant Jordi Aqu es t

seqüència

disposa

de

qua tre

dibuixos:

enfront_casabatllo.ai,

santjordi_esquena.ai,

santjordi.ai_2 esquena dreta i santjordi_esquena esquerra.ai., santjordi_camina1.ai i santjordi_camina2.ai.

Aquesta seqüència va des de 7”, inclou els següents vectors: santjordi_esquena.ai fa dos passes amb una transformació de rotació esquerra dreta • santjordi_esquenadret.ai • santjordi_mira_esquerr.ai • santjordi_camina1.ai • santjordi_ecamina2.ai Aquests vectors s’intercalen mitjançant transformació/opacitat incloent moviments de gir i posició per simular el moviment.

• enfront_casabatllo.ai, Escenari que inclou elements de farciment: roses, llibres bancs i tres arbres i personatges duplicats I modificats a partir de tres vectors de Freepick

Guió t è c n i c 4 Manifestació Aquest seqüència inclou tres vídeos en croma inserits en el dibuixos: passeig amunt, casa ametller bateo i passeig avall: • Turistes fent fotos • Turistes fent-se un selfie la Casa Batlló • Turistes fotografiant i assenyalant l’edifici Tres composicions • manifestants_ braç.ai, • gent_manifestants.ai, • santjordi_camina1-2.ai.

Vectors: • esquena dret.ai • faroles+manifestants.ai.

L’escenari, dibuixat amb Illustrator, inclou elements de farciment: arbres i font (modificats a partir del fitxer descarregat de Freepick:19398-NS5MNP.ai) i personatges (modificats a partir del fitxer descarregat 2928.eps).

Aquesta animació va de 4” inclou aquests aspectes tècnics en les composicions i vectors: • santjordi_camina1-2.ai Fa quatre passes animades gràcies a 4 capes que donen vida a les 2 cames, cos i espasa que van fent transformacions amb canvis de gir i posició.

• santjordi_esquena_dreta.ai inclou un petit gir que mira cap a l’escena del crit del dragó i la princesa.

• manifestants_braç.ai Inclou 3 capes que permeten girar 8 senyeres en la manifestació.

• faroles+manifestants.ai Vector escenari del Passeig de Gràcia, que inclou vectors dibuixats i d’altres modificats a partir de descàrregues de freepeck (manifestants, arbres i font)

Guió t è c n i c 5 Lluita amb el drac Aquesta animació va des del 10”, inclou aquests aspectes tècnics en les composicions i vectors: · princesa_balco.ai, inclou tres capes animades que permeten ascendir amb el vector casabatllo.ai i moure els dos braços gràcies a les transformacions de gir i posició. · sanjordi_lluitant.ai, inclou tres capes que li permeten volar fins els sostre i moure els dos braços. · cap_drac2.ai, inclou 5 capes que permeten animar cap, llengua i tres focs, utilitzant transformacions de posició, gir i opacitat. · cap_boca_mans_drac.ai, inclou 5 capes que permeten girar cap, potes, boca, cua i cos, mitjançant transformacions de posició, opacitat i gir. · fum.ai, aporta farciment de boira simulant un somni, mitjançant transformacions de posició i opacitat . · casabatllo.ai, vector escenari de l’edifici de Gaudí, té una animació de desplaçament del 1r pis al sostre mitjançant transformacions de posició.

Guió t è c n i c 5 Problemes amb la policia Aquest

seqüència

inclou

una

composició

utilitzada

en

la

seqüència

3

(santjordicamina1.ai) i 5 vectors

(princesa_senyera1.ai, princesa_senyera2.ai, policia escoltant.ai, policia stop.ai i policia apuntant.ai, ).

Aquesta animació va des de 7”, inclou aquests aspectes tècnics en les composicions i vectors: · santjordicamina1.ai, fa quatre passes utilitzant transformacions amb canvis de gir i posició.. · princesa_senyera1.ai, utilitzant transformacions de posició, gir i passeig d’anada. · princesa_senyera2.ai, utilitzant transformacions de posició, gir i passeig de tornada · policia escoltant.ai. · policia stop.ai, · policia apuntant.ai

Guió t è c n i c 6 Cotxe de policia Aquest seqüència inclou un croma de dos skaters i una composició (policia cotxe.ai) i un sprite (passeig gracia amunt.ai) Aquesta animació de 7” inclou aquests aspectes tècnics en la composicions i vector: · policia cotxe.ai, la composició que gràcies a 5 capes mou, mitjançant el lligam amb la trajectòria de 2 cotxes/ policia cotxe.ai, els moviments de la carcassa amb les rodes dels dos cotxes afegint les transformacions amb canvis de gir i posició. · passeig gracia amunt.ai, escenari del Passeig de Gràcia. Editat amb imovie i After effects.

Guió t è c n i c 7 Comissaria Aquest animació està formada per una seqüència d’arribada a la comissaria que inclou una composició (7 via laietana_entrada.ai) i un vector (10 passeig gracia amunt.ai) Aquesta animació de 1’’, inclou aquests aspectes tècnics en la composició i vector: · via laiietana_entrada.ai, El cotxe de policia es mou mitjançant les transformacions amb canvis de gir i posició. La capa 3, mou Sant Jordi i la princesa un pas utilitzant les transformacions amb canvis de gir i posició.

La capa 4 correspon al policia que fa un pas enrere simulant l’obertura de la porta (transformació/posició) · 7 via laietana. I, vector de l’escenari de la Via Laietana. Edició amb imovie i After effects.

Guió t è c n i c 8 Presó Aquesta animació està formada per una composició (8 presó_lateral2.ai) i dos vectors (8 fitxa_policial.ai, i 8 preso_frontal.ai) distribuïdes en tres seqüències: · Fitxa policial, inclou un vector 8 fitxa policia.ai · Presó vista frontal, inclou el vector 8 presó frontal.ai · Presó vista lateral, en aquesta composició 8 presó_lateral2.ai, les 6 capes permeten a Sant Jordi i la noia moure’s un pas i oferir-se una rosa i un llibre.

Aquesta animació de 6’’, inclou aquests aspectes tècnics en la composicions i vector: · fitxa policia.jpg · presó_lateral2.ai, la composició inclou les 6 capes, aprofitant les transformacions amb canvis de gir i posició. Sant Jordi i la noia fan un pas apropant-se per oferir-se una rosa i un llibre. utilitzant les transformacions de canvi de posició. La capa 4 correspon al policia que fa un pas enrere simulant l’obertura de la porta (transformació/posició) · presó frontal.ai Editat amb imovie i After effects.

Guió t è c n i c 9 Sortida de la presó Aquest animació està formada per una seqüència de sortida a la comissaria que inclou dos vídeos en croma: Noies passejant i skater, una composició (via laietana_sortida.ai) i un vector (via laietana.ai) Aquesta animació del 3’’, inclou aquests aspectes tècnics en la composició i vector: · via laietana_sortida.ai,la · via laietana.ai, vector de l’escenari de la Via Laietana.

Guió t è c n i c

10 Passeig Aquesta animació inclou dos cromes: parella creuant el passeig i noi tancant el llibre i seqüències formades per dues composicions(santjordi_f1.ai i santjordi_f2.ai) i tres vectors (passeig gràcia amunt.ai , casabatllo.ai i f3.ai) Aquesta animació de 25’’, inclou aquests aspectes tècnics en les composicions i vectors: · santjordi_f1.ai, la composició inclou 2 capes (sant Jordi i la noia amb el braç de S. Jordi) que li permeten fer un moviment oscil·latori als personatges simulant que caminen, mitjançant transformacions de posició i gir. · santjordi_f2.ai, la composició inclou 2 capes (sant Jordi i la noia amb el braç de S. Jordi) que li permeten fer un moviment dels personatges simulant que es petonegen, mitjançant transformacions de gir. · passeig gràcia amunt.ai, l’escenari inclou transformacions de posició i escala que donen mobilitat a les dues seqüències. Inclou un efecte d’il·luminació CC Spotlight; · casabatllo.ai, inclou un efecte d’il·luminació CC Spotlight · Una capa de forma1 rectangular de color blau amb una opacitat per simular l’efecte nit en el cel. · f3.ai, vector de la seqüència final.

Àudios Hem descarregat gran part dels efectes de só del Banco de imagenes y sonidos del Ministeri d’Educación i la banda sonora de Jamendo. Incloent un parell d’efectes de só descarregats de youtube.

Els fitxers utilitzats en l’animació han estat: • pases.mp3 • drac.mp3 • alto.mp3 • sirena policia.mp3 • presó.mp3 • petó.mp3 • bicicleta_migala.mp3

Fonts consultades Fonts consultades amb llicència Janoon128. Freepeck . “Libro antiguo” (2016) Imatge [https://www.freepik.es/foto-gratis/libro-antiguo-abierto-en-una-mesa-demadera-visto-desde-arriba_988011.htm#term=libro%20abierto&page=1&position=32#term=libro%20abierto&page=1&position=32] Kevenodes. Vecteezy . “El sospechoso” (2017) Imatge [https://es.vecteezy.com/arte-vectorial/114650-fondo-de-la-pared-para-elsospechoso] Freepeck . “Decorative flame” (2017) Imatge [https://www.freepik.com/free-vector/decorative-flamecollection_1085963.htm#term=fire&page=1&position=0#term=fire&page=1&position=0#term=fire&page=1&position=0#term=fire&page=1&position =0]

Freepeck . “Policeman cartoon” (2014) Imatge [https://www.freepik.com/free-vector/cartoon-policeman-vector-characters_712122.htm#term=policias%20vector&page=1&position=8] Freepeck . “Cars set” (2014) Imatge. [https://www.freepik.com/free-vector/cars-set_717956.htm#term=car&page=1&position=13] Freepeck . “Set of transparent white clouds” (2017) Imatge. [https://www.freepik.com/free-vector/set-of-transparent-white-clouds_1442335.htm#term=nubes%20vector&page=1&position=9] Freepeck . “Abstract rose logos” (2014) Imatge.[ https://www.freepik.com/free-vector/abstract-rose-logos_716626.htm#term=roses%20vector&page=1&position=22] Freepeck . “Nature.” (2015) Imatge. “Out door park elements”[https://www.freepik.com/index.php? goto=74&idfoto=801036&term=fountain] Freepeck . “Nature.” (2015) Imatge. https://www.freepik.com/free-vector/tree-with-green-leaves_794019.htm -term=tree&page=1&position=9 Freepeck. “Colorful books illustration”. (2014) Imatge. [https://www.freepik.com/free-vector/colorful-booksillustration_760069.htm#term=books&page=1&position=19#term=books&page=1&position=19] Freepeck.“Fairytale set” (2016) Imatge. [ https://www.freepik.es/vector-gratis/set-de-dibujos-de-cuentos_849821.htm - term=caballero&page=1&position=44] Freepeck. Makyz. “Fairytale set” “Concepto de protesta, revoliución, conflicto”.(2016) Imatge.[https://www.freepik.es/index.php? goto=74&idfoto=1355367] Freepeck.. macrovector. “Fairytale set”.“Amigos y amistoso relación equipo social” . (2016) Imatge https://www.freepik.es/index.php?goto=74&idfoto=1159237] Freepeck “Personajes Casual”. (2016) Imatge [https://www.freepik.es/vector-gratis/personajes-casual_774641.htm] Freepeck .Vexels. “Free ciyt vector”. . (2016) Imatge https://www.vexels.com/vectors/preview/3133/free-city-vector Freepeck. “Cloud sky background” Imatge: https://www.freepik.com/free-vector/cloud-sky-background_979616.htm -term=cloudy&page=1&position=4 Bernard Gagnon.“Casa Batllo01”. (2009) Imatge: https://commons.wikimedia.org/wiki/File:Casa_Batlló_01.jp Freepeck “Vector corp”. (2016) Imatge https://www.freepik.es/vector-gratis/fondo-decorativo-dorado_1275937.htm#term=&page=8&position=18 Freepeck . Imatge (2016) https://www.freepik.es/vector-gratis/fondo-decorativo-dorado_1275937.htm#term=&page=8&position=18 Freepeck. “Chica hipster”. https://www.freepik.es/vector-gratis/elementos-de-moda-de-chica-hipster_715463.htm#term=glasses girl&page=2&position=22 Freepeck. “Cloud sky background” Imatge: https://www.freepik.com/free-vector/cloud-sky-background_979616.htm -term=cloudy&page=1&position=4 Freepeck. (2016) Imatge https://www.freepik.es/vector-gratis/fondo-decorativo-dorado_1275937.htm#term=&page=8&position=18 Banco de imagenes y sonidos”. Àudios. Ministerio de Educación. [http://recursostic.educacion.es/bancoimagenes/web/] Migala“Bicicleta” jamendo.com Àudio.http://jamen.do/t/1337398

La Diada de Sant Jordi