Introducció: una imatge val més que mil paraules?
Les relacions entre el llenguatge verbal i el llenguatge visual han caracteritzat l’estudi teòric de les imatges durant el segle XX. Les imatges són les unitats de representació del llenguatge visual com les paraules ho són del llenguatge escrit. En la cultura digital, el consum visual del ciutadà s’ha disparat a nivells abans inimaginables.
La publicitat i el disseny, la creació artística, la comunicació política i social, han trobat en el llenguatge visual una eina molt potent per a comunicar coneixements i emocions de manera directa, o per a donar suport visualment a una idea concreta.
Així, en un món on els mitjans de comunicació tenen altes cotes de poder, el control i la manipulació tècnica de la imatge han esdevingut un element central en la difusió de coneixement en tots els àmbits. Les imatges no són neutres i a més de mostrar les intencions artístiques i estètiques dels creatius assumeixen funcions polítiques, comercials o socials.
L’anàlisi de l’ús del llenguatge visual en el context actual ens porta a adonar-nos, ràpidament, de la fusió que s’esdevé entre el dibuix, la fotografia, el vídeo, el text i el símbol, etc., en la producció multimèdia, en què és de vital importància la mescla ordenada de llenguatges i recursos amb la intenció de comunicar i interactuar amb l’usuari.
Per a més informació sobre la teoria de la imatge i el llenguatge visual en general es pot consultar el curs que hi ha disponible al UOCopencourseware, en què es parla detalladament i d’una manera molt completa de les teories interpretatives de la imatge, de l’evolució històrica del grafisme i de la identitat gràfica. Allà es pot treballar des de la història de la topografia fins a les bases per a informar gràficament (infografia).
Multimèdia o la suma de llenguatges per a la creació d’experiències visuals interactives
S’anomena multimèdia la combinació de diversos mitjans tècnics de comunicació d’informació amb vocació interactiva en un únic espai visual, tant si és una pantalla com qualsevol dispositiu digital. L’augment de la capacitat dels processadors informàtics i l’abaratiment del cost que tenen ha propulsat una revolució en la implantació dels mitjans digitals, que, en si mateixos, requereixen el llenguatge multimèdia per a ser explotats d’una manera completa i garantir una experiència d’usuari pràctica, rica i efectiva.
La creació multimèdia, per tant, requereix l’estudi i el tractament dels diferents llenguatges de comunicació (visual, textual, sonor, etc.) per a aconseguir el producte final desitjat. Així, el disseny d’un entorn multimèdia implica, necessàriament, una fase de conceptualització i disseny, una fase de programació del funcionament i l’estructura de l’entorn i una fase de maquetació de l’aparença final.
Disseny multimèdia
El disseny de productes multimèdia s’orienta bàsicament a l’entorn del web i de la creació d’aplicacions interactives (programari). El disseny multimèdia és una eina molt efectiva per a transmetre un missatge basat, principalment, en el disseny gràfic, que és la disciplina que s’encarrega d’ordenar la informació de manera estètica i llegible per a l’usuari i mostrar-la d’una manera atractiva. Mitjançant el disseny combinem textos, imatges, colors, animacions, vídeos, espais, àudio i interacció en una aplicació informàtica.
Si bé és cert que hi ha uns principis bàsics del disseny que són perfectament vàlids en l’entorn digital (proporció, ritme, unitat, èmfasi, varietat, etc.), també ho és que els multimèdia –la suma de diferents llenguatges en un mateix entorn i de manera orgànica– requereixen un enfocament particular, a l’hora d’afrontar un projecte multimèdia.
En els recursos següents es poden llegir diferents articles en què es parla dels principis del disseny gràfic i s’expliquen visualment els conceptes principals:
- “Principios básicos del diseño gráfico”
- “Fundamentos del diseño gráfico”
- “Principios básicos del diseño gráfico editorial”
- “Lógica visual”
Per tant, és necessari tenir en compte les particularitats de l’entorn digital i entendre que, a diferència dels mitjans convencionals, en la multimèdia la tecnologia és alhora una font inesgotable de recursos i opcions i un límit pel qual no és tecnològicament possible.
Les decisions sobre el disseny d’un entorn multimèdia doncs, estaran condicionades en tot moment per les possibilitats tècniques de les plataformes en què desenvolupem l’aplicació i els llenguatges de programació necessaris per a fer-la funcionar.
Usabilitat
Les primeres etapes del disseny multimèdia es van fer en un entorn inestable en què no hi havia estàndards de referència. La falta d’experiència del sector va provocar autèntics despropòsits en forma de webs inintel·ligibles o impossibles d’entendre per a un usuari normal. L’aparició de tecnologies visuals molt potents i la poca feina feta en la reflexió de pensar a introduir-les en l’entorn web van provocar que Flash, per exemple, es convertís en un obstacle per a l’accés a la informació en forma de presentacions interminables o entorns de navegació molt difícils de fer anar.
A poc a poc, però, els dissenyadors es van adonar de la necessitat d’introduir l’anàlisi de l’experiència de l’usuari per a millorar-la i dissenyar molt més d’acord amb el llenguatge natural i amb la nostra manera intuïtiva de pensar. En aquest context neix la usabilitat, que és la branca del disseny que s’ocupa d’analitzar i dissenyar l’experiència de l’usuari en l’ús d’un entorn multimèdia interactiu.
Avui dia hi ha un ampli ventall d’empreses, professionals i investigadors treballant a l’entorn de la millora de l’experiència d’usuari (UX), i això fa que hagi esdevingut una de les branques més actives i dinàmiques del sector.
Hi ha, per tant, un llenguatge de la usabilitat: unes regles i uns codis que garanteixen que l’experiència de l’usuari és té en un marc còmode, funcional i interactiu. L’experiència de l’usuari és una cosa subjectiva, que no es pot definir des del disseny; tanmateix, si garantim un disseny sòlid, directe i senzill potenciarem l’experiència positiva de l’usuari.
En els recursos següents es poden consultar els principis bàsics que cal tenir en compte per al disseny d’una bona experiència d’usuari:
- http://52weeksofux.com/post/475093254/10-principles-of-ux
- http://www.usability.gov/basics/index.html
- http://uxmag.com/articles/guiding-principles-for-ux-designers
- Estàndards UX: http://www.usabilitynet.org/tools/r_international.htm#9241-11
Llenguatges de maquetació: fulls d’estil en cascada
Un cop plantejat el disseny visual d’un projecte multimèdia, tinguts en compte els principis bàsics del disseny gràfic i de la usabilitat, codificarem aquest disseny mitjançant codis informàtics.
Per a l’estructura bàsica d’una web, per exemple, usem HTML-XHTML per a marcar les diferents parts de la pàgina (l’encapçalament, els títols, el cos del text, el peu, etc.) i definir-ne l’estructura. Un cop tenim el document base (HTML) hem de comunicar al navegador o al dispositiu que reprodueixi el resultat final del projecte com el volem mostrar i quin és el format i l’aparença.
Per a fer-ho hem de formatar les diferents seccions del document assignant-hi un format determinat: un color, una mida, una posició determinada o relativa, els efectes visuals que vulguem aplicar, etc.
El CSS (fulls d’estil en cascada o cascading style sheets) és un llenguatge de fulls d’estil utilitzat per a descriure la semàntica de presentació (aspecte i format) d’una pàgina web o de qualsevol classe de document XML (webs, llibres electrònics o e-books, SVG, etc.). El CSS està dissenyat, principalment, per a permetre la separació del contingut del document de la presentació del document.
El CSS ens permet determinar aquest format amb un seguit d’avantatges enfront d’altres sistemes i llenguatges:
- Control centralitzat de la presentació d’un lloc web complet. Això permet modificar un sol full d’estil i aplicar els canvis a diferents webs que hi estiguin vinculades.
- Reaprofitament dels fulls d’estil: un full CSS es pot aplicar a diferents pàgines.
- Una pàgina pot disposar de diferents fulls d’estil segons el dispositiu que la mostri. Per exemple, per a ser impresa, per a ser mostrada en un dispositiu mòbil o per a ser “llegida” per un sintetitzador de veu. D’aquesta manera es garanteix l’adaptació del document als diferents dispositius (responsive design).
- Els documents HTML resultants són molt més clars i lleugers, ja que n’extraiem tota la informació sobre l’aparença visual de la pàgina que recolliran els CSS.
El CSS ha esdevingut el llenguatge amb què es defineix l’aparença i el format final de la majoria de projectes multimèdia. Tant si els projectes són orientats a l’entorn web i es basen en HTML/XHTML (o en qualsevol dels llenguatges de programació web), com si funcionen amb alguna de les altres variants d’XML, el CSS és el llenguatge correcte per a definir com volem mostrar la informació a l’usuari.
Si tenim en compte que l’XML és l’estàndard creat pel World Wide Web Consortium (W3C) per a l’intercanvi d’informació estructurada entre diferents plataformes, que pot ser usat tant en bases de dades com en editors de textos, fulls de càlcul i la majoria de projectes digitals o multimèdia, ràpidament ens adonarem de la importància de dominar el CSS per al disseny de qualsevol aplicació o entorn multimèdia.
A Internet hi podem trobar molts recursos per a aprendre a usar el CSS; alguns dels més interessants són aquests:
Tutorials i cursos
- Curs de CSS a Code Academy: http://www.codecademy.com/es/courses/web-beginner-en-tRcuF?curriculum_id=50afc73a4e9f856d7e007373
- Curs a Code School: http://www.codeschool.com/paths/html-css
- Curs de CSS a Mozilla Developer: https://developer.mozilla.org/en-US/docs/CSS/Getting_Started
- Web completa dedicada a l’aprenentatge de CSS: http://www.csstutorial.net/