Integració GECO BIG: Formes de presentació que es mostren en colleccions, galeries i elements multimèdia 02.10.2012 Versió 1.0
Informació del document Informació Nom del document OTGENCAT_GECO_IMMU_FPs_BIG.doc Grup de documentació GECO Manuals d ús Data de creació 02/10/2012 Històric de modificacions Versió Acció Realitzada per Data Modificacions 1.0 Creació Albert Navarro 02/10/2012 1.1 Modificació Albert Navarro 16/11/2012 1.2 Modificació Albert Navarro 23/04/2013 Formulari d enviament de dades S elimina del manual la forma de presentació fw_fp_galeria_big 2
Índex de contingut 1.1 Forma de presentació Multimèdies BIG (fw_fp_multimedies_big)... 5 1.1.1 Descripció general... 5 1.1.2 Tipus de continguts que es mostren... 5 1.1.3 Explicació gràfica de la forma de presentació... 6 1.1.3.1 Colleccions... 6 1.1.3.2 Galeries... 7 1.1.3.3 Element multimèdia (Detall)... 10 1.1.3.4 Formulari d enviament de dades (opcional)... 11 3
Introducció Aquest manual ha de servir d ajuda per poder mostrar elements multimèdia procedents de la plataforma BIG (vídeos, imatges i àudios) i també els contenidors de grups d elements (colleccions i galeries) als portals GECO. Actualment hi ha quatre formes de presentació disponibles per poder mostrar aquests elements: Forma de presentació Multimèdies BIG (fw_fp_multimedies_big) La configuració de cadascun d aquests components és diferent depenent del component de presentació configurat. A continuació es descriu com s ha de configurar i com es mostra gràficament cada un d aquests components. Per mostrar colleccions, galeries i multimèdies del Banc Iconogràfic de la Generalitat de Catalunya (BIG) es recomana utilitzar la forma de presentació genèrica Multimèdies BIG (fw_fp_multimedies_big). 4
Formes de presentació genèriques 1.1 Forma de presentació Multimèdies BIG (fw_fp_multimedies_big) 1.1.1 Descripció general Forma de presentació que mostra colleccions (conjunt de galeries), galeries (llista d elements multimèdia: imatges i vídeos) i el detall dels elements multimèdia, que provenen de BIG. A la llista de colleccions, es mostra la imatge principal de la galeria i el seu nom, enllaçable a la llista de multimèdies d aquella galeria. La presentació dels elements multimèdia d una galeria mostra la llista d imatges, ordenades cronològicament per data de publicació. Passant per sobre de la imatge amb el ratolí, aquesta s amplia i mostra el títol i l autor, enllaçable al detall del multimèdia, que es mostra en una finestra emergent. El detall del multimèdia mostra els camps següents del BIG: títol, descripció, autor, responsable, data de publicació i mida. 1.1.2 Tipus de continguts que es mostren Aquesta forma de presentació pot mostrar colleccions, galeries i elements multimèdia (vídeos i imatges) directament des de la plataforma BIG (Banc Iconogràfic de la Generalitat). Aquesta forma de presentació únicament es pot configurar amb un component de presentació de tipus Galeria Multimèdia. 5
1.1.3 Explicació gràfica de la forma de presentació 1.1.3.1 Colleccions La presentació de colleccions es mostra de la manera següent: Figura 1. Presentació d una collecció. 1. Les galeries es mostren distribuïdes horitzontalment, aprofitant tota l amplada de l àrea de presentació. Es mostren en una capa fixa d uns 620 px d amplada mínima amb un contorn d 1 px de color gris. 2. Es mostra el títol de la collecció amb la font Arial en negreta i una mida de 17 px, en color #660303. 3. Es mostra la imatge principal de cada galeria enllaçable al detall de la galeria. Amb una amplada màxima de 183 px i una alçada de 122 px. 6
4. Al peu de la imatge es mostra el nom de la galeria enllaçable també al detall de la galeria, amb la font Arial en negreta i una mida de 12 px, color: #AC2115. 5. A sota del nom de la galeria es mostra la descripció, no enllaçable, amb la font Arial amb una mida d 11 px i de color negre. 1.1.3.2 Galeries La presentació de galeries es mostra de la manera següent: Figura 2. Presentació d una galeria. 1. Els elements multimèdia es mostren distribuïts horitzontalment, aprofitant tota l amplada de l àrea de presentació. Es mostren en una capa fixa d uns 620 px d amplada mínima amb un contorn que simula el mateix estil que la capa colorbox. 2. Es mostra el títol de la galeria amb la font Arial en negreta i una mida de 17 px, en color #660303. 3. Es mostra la imatge de preview de cada element multimèdia amb una mida màxima de 120 px d amplada i 78 px d alçada. En seleccionar (hover) un 7
element de la galeria es mostra una caixa que mostra, a part de la imatge de preview, el títol de l element multimèdia i l autor. En cas que es tracti d un vídeo, es mostra la icona tracta d un vídeo i no d una imatge. per indicar que es 4. Es mostren els elements actuals del total d elements de la galeria. 5. Si s ha accedit a la galeria des d una collecció, es mostra l enllaç Torna que retorna a la collecció original. 6. Es mostra l enllaç Mostra els següents, que fa la paginació Ajax a la pàgina següent. Cada cop que es faci paginació es mostrarà el missatge: 7. Quan es carrega la pàgina següent es mostra el número de pàgina a la part superior del grup d imatges: 8
Figura 3. Presentació d una galeria. Paginació. 8. La forma de presentació permet paginar fins que s arriba al total d elements de la galeria. 9
1.1.3.3 Element multimèdia (Detall) Per mostrar un element multimèdia es mostra de la manera següent: Figura 4. Presentació d un element multimèdia (colorbox). 1. En clicar a sobre d un element multimèdia a la galeria, s obre una caixa colorbox amb la informació següent: - Títol de l element multimèdia (Arial 24 px i color #660303) 2. Es mostra el títol de la galeria amb la font Arial en negreta i una mida de 17 px, en color #660303. 3. Es mostra un filet gris de separació entre el títol i la imatge d un píxel amb puntets. 4. Es mostra el detall de la imatge o el vídeo amb una amplada màxima de 520 px i una alçada màxima de 293 px. 5. Es mostra la descripció de l element multimèdia amb font Verdana de 12 px, en color #4D4D4D. 6. Es mostra l autor de l element multimèdia (si s indica). 7. Es mostra la data de publicació de l element multimèdia (si s indica). 8. Es mostra la mida original de l element multimèdia (si s indica). 9. Es mostra un enllaç que mostra una capa emergent amb les condicions d ús: 10
Avís: Es poden utilitzar les imatges i vídeos que estiguin subjectes a una llicència que així ho permeti (per exemple llicències Creative Commons). En cas de dubte, cal consultar l organisme que apareix com a autor. 10. Finalment, sota un altre filet de separació com el del títol es mostren els enllaços: Anterior i Següent que serveixen per navegar entre imatges sense haver de tornar a la galeria. 11. Es mostren els enllaços de compartició amb xarxes socials juntament amb el botó Imprimeix a la part inferior dreta del component colorbox. NOTA: Aquesta forma de presentació també és funcional sense JavaScript actiu al navegador. 1.1.3.4 Formulari d enviament de dades (opcional) Si es vol mostrar el formulari d enviament de dades cal seguir els passos de l apartat Formulari d enviament de dades al document d ús del component de presentació Galeria Multimèdia : GENCATpèdia > Solucions corporatives > GECO > Usuaris > Manuals d ús del GECO > Integracions > Integració BIG > Ús Galeria Multimèdia A continuació es descriu com es presenta un detall de contingut multimèdia en cas que s inclogui un formulari d enviament de dades a la mateixa pàgina. 11
Es mostra un botó just a sota dels camps de descripció, data de publicació, autor i mida de l element multimèdia. Aquest botó mostra el text: Envieu-nos informació (tipologia de font). 12