Enrera
Mòdul 1
Elements de disseny
  Pràctica
1
2
3
4
   
Exercicis
Exercicis
 
 

Introducció: Elements de disseny en les aplicacions multimèdia

 

Les aplicacions multimèdia varien molt en llur organització, desenvolupament, contingut i complexitat, tant com les produccions audiovisuals: no és el mateix un curtmetratge d'afeccionat que una superproducció cinematogràfica.

 Els elements que defineixen una aplicació multimèdia interactiva són:

  • Contingut integrat per un mínim de tres mitjans (text, imatge, so, vídeo)
  • Disseny que té en compte la visualització per ordinador
  • Alt nivell d'interacció entre l'usuari i l'entorn multimèdia

Les aplicacions multimèdia interactives comparteixen amb la resta de documents electrònics una problemàtica comuna (adaptació als requeriments de la pantalla d'ordinador, estructuració de l'aplicació...) però la seva complexitat, basada en la diversitat de mitjans que integren, comporta especificitats de disseny pròpies.

Un dels aspectes que marca la qualitat d'una aplicació multimèdia és la presentació gràfica, que cobreix des del disseny de la interfície d'usuari fins tots i cadascun dels elements visuals (imatges, animacions i estructures 3D).

 En el disseny de les aplicacions multimèdia es presenten dos tipus de problemàtiques:

  1. Informar i guiar a l'usuari a través d'un entorn complex d'informacions. 
  2. Crear una retòrica visual adaptada a la pantalla de l'ordinador. 
Ambdós problemes estan estretament relacionats amb el disseny d'interfícies gràfiques d'usuari per als sistemes informàtics.
   
La interfície d'usuari
 

Per interfície d'usuari s'entén el conjunt d'elements que permeten a l'usuari dialogar amb una aplicació interactiva, aquests elements inclouen tant el maquinari (teclat, ratolí, pantalla tàctil) com el disseny de les pantalles i la navegació pel contingut.

El cas més general de les interfícies d'usuari són les interfícies gràfiques dels entorns operatius (el Linux o el Windows són potser els exemples més coneguts). En aquests entorns gràfics s'inclouen les anomenades metàfores d'interacció: imatges d'objectes coneguts pels usuaris, emprades per donar sentit i funcionalitat a les accions que podem fer amb l'ordinador. Les icones de les carpetes per organitzar el contingut del disc dur són un exemple de metàfora gràfica. Quines altres metàfores podeu identificar en un entorn Linux o Windows?

A més de la interfície general de l'ordinador, cada aplicació multimèdia interactiva té una interfície pròpia. En alguns casos la interfície pot venir determinada pel programa, és el cas de les presentacions Impress, on el mecanisme de passar de pantalla ja està establert, o en el JClic, on disposem d'un mecanisme de navegació per passar a l'activitat següent (si bé en aquests dos programes també tenim la possibilitat de dissenyar una interacció personalitzada). En altres entorns no hi ha cap mecanisme de navegació predefinit i cal definir-lo específicament, és el cas de les pàgines web, on si bé hi ha unes convencions generals que vénen donades pel que ja és considerat com un nou canal de comunicació, el desenvolupador té la llibertat de dissenyar fórmules originals d'interacció.

El disseny de la interfície i l'organització de la informació d'una aplicació multimèdia (també anomenada arquitectura de la informació) són processos indissociables. El més freqüent és adaptar la interfície a l'estructura del contingut, però també es pot donar el cas que una interfície creativa exigeixi canvis en l'organització de la informació inicialment prevista.

Com a disciplina, el disseny d'interfícies es fonamenta en camps tan diversos com la informàtica, els mitjans audiovisuals, el disseny industrial, la psicologia cognitiva, l'ergonomia i les arts gràfiques. El propòsit d'aquesta breu introducció és únicament el de presentar una panoràmica d'aquest àmbit i de sensibilitzar-nos en la seva importància.

   
  El disseny en el programari
 

Al llarg de més de 10 segles s'ha anat perfeccionant el disseny dels documents en suport paper: des dels llibres manuscrits fins a les publicacions impreses. Les aplicacions informàtiques actuals encara imiten, en molts aspectes, l'estil i les convencions dels documents en suport paper. No obstant, l'especificitat de la visualització de la informació en una pantalla d'ordinador ha esperonat els dissenyadors gràfics a buscar solucions innovadores als documents electrònics.

El disseny gràfic d'un programa d'ordinador o d'una aplicació multimèdia s'elabora a partir dels elements estandarditzats de la interfície d'usuari com són les icones, els menús i altres elements interactius com les finestres i els botons. Com en les publicacions impreses, el primer objectiu del disseny gràfic de les pantalles d'ordinador és el d'establir una estructura visual que organitzi els elements interactius de forma coherent, de forma que la informació important sigui identificada immediatament i la resta de components de la pantalla tingui una posició subordinada.

Els usuaris d'aplicacions multimèdia no es limiten a consultar la informació, l'exploren i interactuen amb ella de noves formes, sense precedents en els documents en suport paper. L'optimització del disseny de la interfície, pensant en com l'usuari hi accedirà, és bàsica per a produir documents digitals eficients.

   
  Característiques de les pantalles d'ordinador
 

Els monitors d'ordinador imposen requeriments específics en el disseny de les aplicacions informàtiques, veiem algunes de les seves característiques: 

  • Nivell de resolució espacial inferior a la d'un full imprès. La major part dels monitors tenen una resolució de 800x600 píxels (72 píxels per polsada), o sigui, 5184 píxels per polsada quadrada. Les publicacions impreses tenen una resolució de 1.440.000 punts per polsada quadrada (1200 dpi -dots per inch), o sigui, 278 vegades més que un monitor ordinari. Aquesta característica afecta tant als tipus de lletra (que han d'evitar detalls massa fins, difícils de llegir a la pantalla) com als gràfics que han d'estar adaptats al nivell de resolució i a la paleta de colors de la pantalla. 
  • Format apaïsat (la majoria de publicacions impreses són de format plantat).
  • Visualització amb il·luminació transmesa (els documents paper es veuen amb llum reflectida). 
   
  Desenvolupament de la pràctica
Atenció !

Comprovació de la configuració de la pantalla de l'ordinador.

  • Engegueu l'ordinador.
  • Feu clic amb el botó dret damunt una zona buida de l'escriptori del Windows.
    Seleccioneu al menú de context l'opció Propietats.
  • Activeu la pestanya Configuració. Comproveu o configureu els següents aspectes: al camp Colors, seleccioneu "Color d'alta densitat (16 bits)" o "Color real (de 32 bits)".
  • Al camp Àrea de la pantalla, configureu la mida a 800 per 600 píxels, desplaçant l'indicador amb el ratolí.


  • Accepteu. El Windows us preguntarà si voleu conservar aquesta configuració. Respongueu que sí, per veure'n el resultat.
  • Si no us interessen els canvis, podeu tornar a la resolució original repetint el procés anterior fins obtenir la configuració desitjada.

Exemple de com canviar la configuració de pantalla amb la Linkat:

Accediu al menú Sistema | Configuració de l'escriptori i feu clic a Ressolució de la pantalla.

A les Preferències de resolució de la pantalla trieu la opció 800 per 600 i acceptem fent clic al botó Aplica.

Si no us interessen els canvis, podeu tornar a la resolució original repetint el procés anterior fins obtenir la configuració desitjada.

 
Amunt