El guió multimèdia

  • Caterina Ramon

  • Marta Serra

PID_00150897
Cap part d'aquesta publicació, incloent-hi el disseny general i la coberta, no pot ser copiada, reproduïda, emmagatzemada o transmesa de cap manera ni per cap mitjà, tant si és elèctric com químic, mecànic, òptic, de gravació, de fotocòpia o per altres mètodes, sense l'autorització prèvia per escrit dels titulars del copyright.

Índex

1.Etapa 1. Procés de creació d'un producte multimèdia

1.1.Fases de la producció

En el procés de creació d'un producte multimèdia es poden establir les grans etapes següents: disseny, producció i difusió. Cada una està estructurada en diferents fases, com es mostra en el gràfic adjunt.
En l'etapa de disseny es defineixen els objectius i l'estratègia tenint en compte el pressupost per a fer l'aplicació. Una vegada definits els objectius i desenvolupada l'estratègia, ja està encaminada la tasca de generar l'aplicació multimèdia. En la fase de concepció del producte s'emmarca el procés de creació del guió. Quan estigui elaborat el guió i determinat l'equip humà necessari, el pla de treball i el material, es programaran les aplicacions i es procedirà a la fase de proves (tests i proves pilot).
  • Equip humà: s'ha de planificar l'equip humà que es necessitarà per a la creació del producte multimèdia.

  • Pla de treball: es procedeix a la divisió del conjunt del treball en mòduls o parts detallades; s'assenyala el responsable i el termini de temps.

  • Equip material necessari: ordinadors, escàner, càmera, programari, etc.

Amb les proves ja fetes, es programa definitivament l'aplicació amb les modificacions pertinents. En la tercera etapa, la de difusió, s'estableix la distribució del producte i la seva promoció.

1.2.L'equip humà d'un projecte multimèdia

Es tracta d'un equip interdisciplinari. Les produccions multimèdia interactives de diversa tipologia poden resultar bastant complexes i, per això és imprescindible la participació coordinada de diferents professionals. Avui dia, rarament es pot concebre una aplicació desenvolupada per una sola persona que tingui la intenció de competir amb els productes multimèdia que es troben en el mercat.
Però, habitualment, ocorre que una mateixa persona pot desenvolupar més d'un d'aquests perfils.
José Luis Orihuela agrupa les funcions de l'equip en quatre grans àrees:
Àrea
Funció
Producció
Coordinació
Redacció
Documentalista i guionista
Artística
Direcció d'art i disseny gràfic
Tècnica
Programació i especialitats (àudio, vídeo, animacions)
En la taula adjunta es defineixen les funcions de cada perfil tenint en compte les àrees proposades anteriorment.
Nota. Aquests quadres estan basats en:
J. L. Orihuela; M. L. Santos (1999). Introducción al diseño digital. Concepción y desarrollo de proyectos de comunicación interactiva (pàg. 69-74). Madrid: Anaya Multimedia.
T. Vayhan (1994). Todo el poder de multimedia (pàg. 35-49). Osborne, Mèxic: McGraw-Hill.
Funcions de cada perfil segons l'àrea
Àrea de producció
Perfil
Funcions
Coordinador
Es responsabilitza del desenvolupament total i implementació del projecte. Així mateix, també assumeix la responsabilitat del contingut i l'estructura del projecte.
Entre les seves tasques hi ha:
  • l'administració, la gestió de l'equip humà que desenvoluparà el projecte i el lideratge de l'equip,

  • l'elaboració i administració del pressupost,

  • la realització dels plans de treball, horaris, sessions, etcètera, i el control del calendari,

  • la relació amb el client,

  • el màrqueting del projecte,

  • la gestió de recursos,

  • el control del resultat.

Productor executiu
Segons l'envergadura de l'empresa pot existir aquest perfil, les funcions del qual són:
  • la gestió administrativa,

  • el màrqueting de l'empresa,

  • la relació amb els clients,

  • l'elaboració de pressupostos,

  • la gestió de recursos.

Director del projecte
Segons l'envergadura de l'empresa pot existir aquest altre perfil, responsable de la producció d'un projecte en particular, les funcions del qual són:
  • el lideratge de l'equip,

  • l'establiment del pla de treball,

  • el control del calendari,

  • el control del resultat.

Àrea de redacció
Perfil
Funcions
Documentalista
La seva tasca consisteix a obtenir la informació necessària per a elaborar el contingut del projecte.
Les seves funcions són:
  • la recerca,

  • la identificació i selecció de fonts,

  • l'accés i la valoració d'informació,

  • la redacció d'esborranys,

  • la revisió i correcció de textos.

Guionista
S'encarrega del contingut global del projecte: estructura el contingut, determina els elements de disseny que es requereixen per a recolzar aquesta estructura i decideix els mitjans més apropiats de les diferents parts del contingut.
Les seves funcions són:
  • Donar estructura al contingut i elaborar la informació del projecte en forma d'hipertext:
    • Establir el sistema de navegació preveient tots els possibles trajectes, determinant les rutes de l'usuari i la seva retroalimentació.

    • Definir el sistema d'ajuda, les metàfores i els mapes de navegació.

    • Seleccionar els mitjans més idonis i considerar els punts forts de cada un dels mitjans que integren el multimèdia.

  • Revisar i corregir textos.

  • En projectes de ficció interactiva i jocs, el guionista:
    • crea la història i els personatges,

    • escriu els diàlegs, els textos narratius i expositius i

    • articula en escenes navegables els universos de ficció.

Àrea artística
Perfil
Funcions
Director d'art
Les seves funcions són:
  • la definició de l'estètica global,

  • la supervisió del disseny gràfic,

  • la coordinació amb especialistes,

  • el control de l'estil final.

Dissenyador gràfic
S'encarrega de l'aspecte visual del projecte, juntament amb il·lustradors, animadors i especialistes en processament d'imatges. Entre les seves funcions hi ha:
  • el disseny d'interfícies,

  • la creació d'elements visuals,

  • la composició de pantalles.

Dissenyador d'interfícies
En funció de l'envergadura del projecte, es pot necessitar aquest perfil específic.
S'encarrega de:
  • crear rutes de navegació i mapes de contingut,

  • organitzar el multimèdia contingut, de manera que permeti a l'usuari accedir fàcilment al contingut i moure's còmodament dins de la creació final,

  • que es mantingui la facilitat d'ús de navegació; l'ús efectiu de finestres, fons, icones, etc. (això és resultat del seu treball).

Pot ser a més guionista o dissenyador gràfic.
Àrea tècnica
Perfil
Funcions
Programador multimèdia
Usualment, és un enginyer de programari que integra tots els elements del projecte utilitzat, un sistema de desenvolupament o un llenguatge de programació. Entre les seves funcions tenim:
  • la compilació de la maqueta,

  • la integració multimèdia,

  • la funcionalitat de la navegació,

  • l'operativitat del suport,

  • la realització de proves beta.

Especialistes
  • Especialista en vídeo. A més de tenir experiència en direcció, edició de vídeo i saber agafar bones preses, ha de treballar amb eines per a l'edició digital. És important que adapti i aconsegueixi les preses de vídeo per a la programació interactiva.

    La seva funció és l'enregistrament, l'edició i la postproducció digital de vídeo.

  • Especialista en àudio. Dissenya i produeix música, narracions explicatives i efectes de so. Es poden responsabilitzar també de localitzar i seleccionar la música adequada, gravar, digitalitzar i editar material gravat. També han de fer els càlculs pertinents per a optimitzar els sons i obtenir una qualitat decent.

    La seva funció és la composició musical, l'edició i els efectes de so.

  • Altres especialistes. Tenen aquestes funcions:
    • la fotografia i el tractament digital d'imatges,

    • la creació d'objectes, entorns i animacions 2D i 3D,

    • la creació d'entorns de realitat virtual.

El disseny de la informació, disseny interactiu i disseny dels mitjans són àrees crítiques per a la creació de qualsevol interfície i hi ha d'haver una interrelació entre aquestes.
La col·laboració entre tots els membres de l'equip és la clau per a aconseguir un projecte multimèdia amb èxit.

1.3.Introducció al guió multimèdia

Com en un producte seqüencial, el guió per a una aplicació multimèdia interactiva és un document clau per a la producció. L'elaboració del guió multimèdia s'emmarca en la fase de disseny de l'aplicació, de creació i concepció d'un nou producte. La fase de disseny és prèvia a la fase de producció.
Actualment, una aplicació multimèdia interactiva no es pot pensar com una seqüència de pantalles estàtiques i sense connexió entre si, sinó que apareix com una aplicació viva, estructurada de manera convenient i amb interaccions. En una aplicació multimèdia, a diferència d'un curtmetratge per a televisió, per exemple, hi ha d'haver interacció entre l'usuari i la màquina. És important que en la creació d'un guió multimèdia es conjuguin els recursos del llenguatge audiovisual juntament amb els de la informàtica.

1.4.Consideracions prèvies

L'elaboració d'un guió multimèdia, com a procés creatiu, no és a priori diferent de la d'un guió per a un producte audiovisual, però inclou elements de llenguatge inexistents en el guió seqüencial: la interactivitat i la navegació, d'una banda, i un canal de difusió diferent, de l'altra. Aquests són els elements que fan diferent el guió multimèdia.
En el guió per a una aplicació multimèdia s'inclou sovint alguna part més narrativa que comporta necessàriament una estructura lineal. Aquests fragments poden concebre's com una "porció" d'un guió seqüencial, amb moltes de les seves característiques, dins del conjunt total del guió de l'aplicació multimèdia.
Tota aplicació multimèdia s'ha de concebre sense perdre de vista la perspectiva del guió audiovisual. Els elements propis del guió han de ser presents en el disseny de tota l'aplicació i en cada pantalla en particular. S'ha de pensar i planificar amb detall cada pantalla (text, fotos, icones, etc.) i el seu conjunt.
En la conceptualització d'una aplicació multimèdia s'han de tenir en compte els aspectes bàsics següents:
Hipertext
L'organització de la informació i la seva estructura considerant les possibilitats i característiques que ofereix l'hipertext.
Interactivitat
El disseny de la interactivitat (quantitat d'interacció, qualitat, capacitat de control per part de l'usuari, etc.).
El guió multimèdia és un document que servirà per a recollir, desenvolupar i plasmar tots aquests aspectes. A més, és important recordar dues consideracions més:
Usuari
Les aplicacions multimèdia es conceben per a ser utilitzades per un tipus concret d'usuari i, per tant, s'han d'adaptar de manera convenient.
A partir d'aquí es dissenyarà l'estructura de navegació i la interactivitat.
Recursos tècnics
S'ha de preveure la incorporació de recursos tècnics, que serviran per a reforçar el missatge. És important seleccionar-los de manera encertada per a aconseguir que l'aplicació transmeti les sensacions previstes.

1.5.Fases en el procés d'elaboració del guió

Com ocorria en el guió d'un producte audiovisual no s'ha establert una sola forma de presentació per a un guió multimèdia. En el món professional cada guionista, cada equip de treball, cada editorial de títols interactius té el seu mètode propi. Però, com ocorre en el camp de l'audiovisual, se segueixen unes pautes per a l'elaboració d'un guió multimèdia més o menys sistematitzades i adaptades a cada un dels tipus de productes que hi ha en el mercat.
La conceptualització d'un web d'un producte comercial diferirà de la d'un joc d'estratègia en CD-ROM. El desenvolupament del guió s'haurà d'adaptar de manera convenient en cada cas.
Generalment, per a planificar el procés global de l'aplicació, les fases que s'han de tenir en compte són les següents:
50045_m6_03.gif

1.6.La concepció del producte multimèdia

1.6.1.Anàlisi, estudi i estratègia
Abans de començar una producció les empreses multimèdia fan un estudi exhaustiu a partir del qual es prenen les decisions pertinents de disseny i es decideix la conveniència d'editar o produir el nou producte.
Tant si el producte és encarregat per un client, com si és un títol propi d'una editorial, s'han de definir els conceptes següents:
  • quin és el missatge que es comunicarà,

  • a quin públic està dirigit,

  • quin és l'objectiu del producte.

1.6.2.Fitxa del producte
A tall de resum, en aquesta primera fase s'intenta donar resposta a aquestes preguntes que s'elaboren en forma d'un document que s'anomena fitxa del producte, que conté:
1) Descripció de la idea: de què tracta el nou producte?
2) Necessitat: a quin problema o necessitat volem respondre amb el producte? Per exemple, l'observació que en el mercat falta un producte per a nens sobre com es poden aprendre matemàtiques jugant (edutainment).
3) La meta: què volem aconseguir, quin és el benefici que pot aportar l'edició del títol? Podria ser iniciar en l'ús de l'ordinador els treballadors d'una empresa, apropiar-se d'un buit en el mercat, etc.
4) Públic objectiu: qui és l'usuari, qui és el comprador? Aquest és un dels apartats més importants pels quals s'ha de definir molt bé tant el comprador com l'usuari real del producte. Per exemple, en els productes infantils l'usuari real és un nen però el comprador és l'adult.
5) Objectius: en aquest apartat s'estableixen els objectius editorials: És un títol unitari? Pertany a una col·lecció, a una sèrie? Hi ha una data de llançament prevista? Etc.
Tractem de respondre les preguntes següents:
Quin és el contingut?
A qui va dirigit?
Quins són els objectius?

2.Etapa 2. Disseny de la interactivitat

2.1.Idea

Una vegada acabada la primera fase d'anàlisi i estudi i a partir de les decisions preses respecte al producte, com quin és el seu objectiu i quin és el seu públic, recollides a la fitxa del producte, passem a la fase de creació de guió pròpiament dita.
Tot producte comença amb una idea del seu creador. La idea és el motiu principal per a la realització de l'aplicació. És recomanable que es pugui escriure, descriure i concretar en un màxim de dues línies. Ha de ser senzilla i de comprensió ràpida, per a poder comunicar-la a una empresa per a la realització o finançament, a l'equip, al client, etc.
En algunes aplicacions interactives multimèdia, com en els jocs, trobem que en la idea es reflecteix una estructura narrativa pròpia d'un guió de ficció d'una producció audiovisual (o literària), amb l'esquema típic de la introducció o plantejament, part central o nus i final o desenllaç, juntament amb el desenvolupament del personatge, l'objectiu i el conflicte.
En un altre tipus d'aplicacions, com les d'índole didàctica, la idea pot estar constituïda per un objectiu d'aprenentatge.
En el cas d'una aplicació d'índole comercial, la idea pot estar constituïda per un objectiu de fidelització de clients, augment de vendes, etc.
Generalment, la feina del guionista d'una aplicació multimèdia consisteix a transmetre el contingut específic perquè es compleixi l'objectiu marcat.

2.2.Sinopsi

A partir de la idea que es té de l'aplicació en concret es fa la sinopsi.
La sinopsi és el desenvolupament més ampli de la idea inicial. Per a Guillem Bou, "la sinopsis es un texto que responde a la pregunta: ¿en qué consiste esta aplicación?".
En aquest document s'han d'establir els punts més destacables de l'aplicació, l'essencial, i oferir una idea clara del contingut de l'aplicació o programa.
En els productes multimèdia narratius, com els jocs d'aventures, contes interactius, etcètera, es crea una estructura dramàtica amb els seus personatges principals i secundaris, amb un objectiu i un conflicte. Encara que aquestes històries no són lineals, es bifurquen, l'usuari pot elegir entre diversos camins o veure la història des del punt de vista de diferents personatges; això s'ha d'explicar de manera narrativa en la sinopsi, de la mateixa manera que es fa en un guió cinematogràfic.
No solament les obres de ficció tenen una construcció dramàtica; molts productes (didàctics, informatius, promocionals) creen metàfores narratives que van des d'un tipus determinat d'interfície a la caracterització de personatges que ens guien pel producte multimèdia. Aquestes metàfores també s'expliquen en forma de sinopsi argumental.
La trampa papú
És un CD-ROM que forma part d'un conjunt de jocs que constitueixen una alternativa als videojocs. Està pensada perquè els nens i les nenes, a partir de set anys, posin a prova les seves habilitats d'observació, memòria, raonament lògic, orientació, etc. És una proposta lúdica perquè gaudeixin de tots els al·licients dels jocs d'ordinador: puntuacions, temps, superació d'etapes o "pantalles", possibilitat que juguin diversos jugadors alhora, nivells de dificultat, premi al final, etc.
50045_m6_04.gif
Sinopsi:
La "trampa papú" comença quan els protagonistes, en Boris i la Noemí, sobrevolen una de les illes papús, a Oceania; el motor de l'avió comença a fallar, i això els obliga a fer un aterratge d'emergència.
En Boris i la Noemí cauen en una illa molt perillosa, perquè està habitada per pirates que han expulsat els seus habitants, els papús. Per això, els indígenes han omplert els boscos de l'illa amb perilloses trampes: volen capturar els pirates.
En Boris i la Noemí descobreixen una de les trampes papú, en la qual hi ha algú atrapat a dins. La seva missió serà salvar aquest captiu per a evitar que caigui a les mans dels pirates o dels membres d'una escola de supervivència, encara més perillosos.

2.3.Disseny de la interactivitat

Una vegada feta la sinopsi, es procedeix al disseny de la interactivitat, que és una de les fases més importants en el guió multimèdia.
Pensar com es relaciona l'usuari amb l'aplicació és una de les tasques més difícils del guionista d'un producte interactiu.
Per a Bou en aquesta fase "se describen con más detalle las características del protagonista de la aplicación y el modo de interacción usuario-aplicación" i "la misión de estas páginas es presentar al lector la idea de la aplicación, con más detalle del que se proporcionó en la sinopsis, para que se entienda mejor el guión".
Segons Bou, la seva finalitat és:
  • Didàctica: explica amb detall en què consisteix l'aplicació.

  • Persuasiva: contribueix a "vendre" l'aplicació.

Molts autors defineixen aquesta fase com la capacitat que ha de tenir el guionista per a convertir-se en usuari imaginari del producte una vegada finalitzat. No imaginem encara les pantalles i els enllaços que finalment tindrà el producte, sinó l'ús que en farà l'usuari. Per això, és molt important tenir en compte quin tipus de producte crearem i qui és l'usuari.
Abans de dur a terme aquesta fase és necessari conèixer les característiques principals de cada un dels productes existents. Toni Matas i Dalmau, editor de Barcelona Multimèdia, proposa un model d'anàlisi de productes multimèdia basat en quatre dimensions: la seqüencialitat enfront de l'aleatorietat, l'estructuració o desestructuració de la comunicació, la temporalitat enfront de l'atemporalitat, i la interactivitat enfront de la passivitat.

2.4.La seqüencialitat o narració lineal

Quan parlem de seqüencialitat ens referim a aquelles narracions en les quals els esdeveniments passen consecutivament en un ordre inalterable. Com en una novel·la o en una pel·lícula, els esdeveniments d'una història se succeeixen un darrere d'un altre segons l'ordre que ha disposat el seu autor.
Quan és l'usuari qui decideix en quin ordre accedirà a la informació i aparentment no hi ha un ordre establert per l'autor, parlem de narració no lineal o accés aleatori.
Quan creem un producte multimèdia una de les primeres decisions que hem de prendre és com presentarem la informació: de manera seqüencial o de manera aleatòria, i quines són les implicacions per a l'usuari d'un tipus de presentació o una altra.
En un multimèdia tenim totes dues opcions i fins i tot opcions mixtes:
Presentar els continguts de manera seqüencial
Podem presentar de manera ordenada els continguts. Toni Matas diu que l'estructura seqüencial de la informació s'usa quan l'assimilació d'una unitat de contingut és un requisit indispensable per a la presentació de la següent. En una pel·lícula hem de veure les escenes tal com les ha establert l'autor per a tenir tota la informació que necessitem per a entendre la història.
Presentar els continguts de manera aleatòria
L'usuari té l'opció d'accedir on vulgui; pot accedir des de qualsevol part del contingut a qualsevol altra quan ell mateix decideixi. L'exemple més característic d'aquest tipus de presentació és la navegació en l'hipertext, en el qual circulem mitjançant enllaços entre els diferents nodes de contingut.
En l'hipertext l'usuari ha de participar activament i es converteix en lector-autor. Ell és qui decideix crear la seqüència narrativa a la seva manera: per tant, l'avantatge que obté és la llibertat d'acció. Però cal ser conscients que aquest avantatge, segons el tipus de producte, es pot convertir en inconvenient i portar el lector al caos.
Presentar els continguts de manera mixta: seqüencial i aleatòria
Fins i tot en les obres aparentment aleatòries, és necessari que l'autor pensi el recorregut necessari que ha de fer el lector per a l'assimilació correcta de la informació.
Toni Matas aconsella que "la combinació de l'aleatorietat i la seqüencialitat ha de ser estudiada per a poder aconseguir els resultats de transmissió de continguts". Una forma de presentació o una altra té uns resultats diferents segons el gènere del producte.
2.4.1.Obres de ficció i jocs
Són en general seqüencials; un autor pensa com serà la successió de pantalles, les proves que el jugador haurà de superar, com es desenvoluparà la història que es pretén explicar.
Hi ha jocs d'aventures (com Myst, creat per Cyan i produït per Broderbund) que són seqüencials i aleatoris alhora. L'usuari pot accedir a diversos llocs, però, alhora, els camins són plantejats de manera seqüencial i, perquè l'usuari pugui avançar, és necessari resoldre diversos enigmes.
2.4.2.Enciclopèdies i obres de consulta
Les enciclopèdies són aleatòries; perquè funcionin correctament han de permetre a l'usuari accedir a qualsevol punt d'informació, com a una lletra determinada o una paraula determinada. Però també és freqüent trobar propostes seqüencials, com en alguns blocs temàtics.
2.4.3.Productes didàctics
Els productes didàctics són seqüencials per naturalesa perquè en aquest tipus de productes és necessari assumir uns continguts abans de passar a d'altres; així, per exemple, és necessari aprendre a sumar i restar abans d'aprendre a dividir. Però d'altra banda, han de permetre a l'usuari un accés aleatori, entre altres coses, per a repassar un concepte anterior que no hagi estat ben assimilat.

2.5.Estructuració de la comunicació

L'estructuració de la comunicació, segons Matas, no es refereix a la manera d'ordenar el contingut de la informació, sinó a la manera com s'estableix la comunicació entre l'usuari i la màquina; és a dir, fins a quin punt el nostre producte necessita que l'usuari estigui orientat?
Comunicació molt estructurada
En una comunicació molt estructurada l'usuari coneix a tota hora les accions que el producte li permet dur a terme mitjançant menús, estructures en arbre, una interfície gràfica similar al Windows... Les obres de consulta o productes didàctics són productes altament estructurats.
Comunicació poc estructurada
Una comunicació poc estructurada obliga l'usuari a explorar el producte. L'usuari no està del tot guiat, i part de l'atractiu del producte és precisament aquest. I per això els jocs d'aventures, en què la presa de decisions de l'usuari té conseqüències diferents, es caracteritzen per aquest tipus de comunicació poc estructurada.
De totes maneres, en les obres de consulta i en els productes didàctics també trobem formes de comunicació desestructurada. Per exemple, en els productes que contenen jocs, o una enciclopèdia o un producte didàctic que inclogui un apartat d'aprenentatge experimental. Un altre exemple són els simuladors, que inclouen una part molt estructurada perquè són educatius, però, com pretenen imitar la realitat, inclouen parts desestructurades.

2.6.La temporalitat

Entenem per temporalitat en un producte interactiu la presència d'un comptador de temps, explícit o implícit, que provoca que les accions de l'usuari i les seves conseqüències canviïn en el temps.
Per a analitzar aquesta dimensió és necessari distingir entre els conceptes de vida, història i intel·ligència.
Vida
El concepte de vida en un programa informàtic s'aplica quan aquest sembla que fa "un esforç per canviar", per reclamar l'atenció de l'usuari. És el cas de l'animació de l'ajuda del Word, un element que sembla que és viu perquè reacciona aparentment sol.
Història i intel·ligència
Els conceptes d'història i d'intel·ligència estan lligats entre si. Molts productes multimèdia guarden l'historial de les accions que fa l'usuari al llarg del temps. Aquest historial permet al programa adaptar-se a les característiques de cada usuari, per la qual cosa sembla que reacciona amb intel·ligència. L'historial s'utilitza sovint en productes educatius en què el programa guarda l'historial d'errors de l'estudiant i genera exercicis especials per a corregir-los.

2.7.Interactivitat i interacció

Els productes multimèdia són normalment productes interactius, però no tots tenen el mateix grau d'interactivitat.
Primer grau
El primer grau és el més simple: premem un botó i passa alguna cosa. Tots els programes interactius inclouen aquest grau d'interactivitat.
Segon grau
El segon grau d'interactivitat es refereix al fet que els efectes de les accions de l'usuari tenen conseqüències en el temps, com en l'exemple del programa de mecanografia. Aquest segon grau està lligat als conceptes d'història i d'intel·ligència.
Tercer grau
El tercer grau és el grau més sofisticat d'interactivitat. El trobem quan les accions de l'usuari transcendeixen a l'ús del producte. Així ocorre quan l'aplicació obliga l'usuari a fer accions que van més enllà de les comunes en un producte multimèdia: agafar un atles per a resoldre un enigma, connectar-se a Internet per a participar en un fòrum o per a recollir una informació, etc.
Cada grau d'interactivitat té unes repercussions diferents en l'usuari. Mentre que el primer grau implica una actitud passiva, el segon grau obliga l'usuari a pensar les seves accions abans d'actuar. El tercer grau requereix una actitud activa per part de l'usuari.
Laura Solanilles, en la seva anàlisi dels webs de museu, estableix diferents nivells d'interactivitat partint d'una distinció entre interactivitat i interacció. La interactivitat és entesa com una activitat de diàleg entre l'usuari i la màquina mitjançant el programa. En canvi, la interacció és l'acció recíproca que es pot establir entre l'emissor i el receptor.
Així, podem veure diferents nivells d'interactivitat segons la relació que s'instauri entre l'emissor i el receptor.
Nivell 1
L'usuari pot contactar amb els responsables del web mitjançant el correu electrònic, per exemple. La interacció no és controlada per l'emissor, excepte en la possibilitat de respondre o no a l'usuari.
Nivell 2
L'usuari té la possibilitat de participar en una activitat prèviament programada per l'emissor. L'emissor determina el que pot o no pot fer l'usuari (un joc en línia).
Nivell 3
L'usuari pot generar continguts de manera controlada pels responsables del web (fòrums d'opinió).
Nivell 4
L'usuari pot ser coautor de la web i modificar o ampliar la informació oferta prèviament per l'emissor.

2.8.Regles en el disseny de la interactivitat

Per a fer el disseny de la interactivitat d'un producte multimèdia es poden tenir en compte una sèrie de regles genèriques. En aquest apartat tractarem les que proposen dos autors: Bou i Mok.
2.8.1.Regles segons Bou
Bou recomana que "siempre que pueda haber interacción debe de haber". Però cada interacció de l'usuari amb l'aplicació ha d'estar acuradament planificada.
1) La interacció té la funció de reforçar el missatge. Hi ha d'haver un motiu per a cada intervenció.
2) S'han d'evitar períodes excessivament prolongats en què l'usuari no intervingui (així, la lectura de textos extensos en pantalla).
3) La interacció implica participació activa, no una repetició de gestos. Tota interacció implica una decisió entre alternatives. Polsar la tecla d'entrada per a passar d'una pantalla a una altra no es pot considerar interactivitat.
4) No recordar l'usuari que no pot interactuar. És frustrant per a l'usuari polsar sobre un lloc en el qual creu que passarà alguna cosa i que no passi res (bé perquè aquell botó estigui desactivat per manteniment, bé perquè aparegui a la pantalla com una zona aparentment sensible i en realitat no ho sigui).
5) La interacció no es limita a l'esquema usuari-màquina. També forma part de la interacció d'una aplicació la previsió que diverses persones hi puguin participar simultàniament.
6) La interacció permet obtenir un registre de dades descriptives de la conducta de l'usuari.
Bou recomana el següent:

"Adopte la costumbre de imaginarse a sí mismo dialogando con el usuario cuando diseñe un hipertexto. Si se esfuerza en respetar el enunciado anterior evitará los largos monólogos textuales disfrazados de texto interactivo."

2.8.2.Regles segons Mok
Segons Mok, hi ha nou regles que mesuren la utilitat i l'èxit d'un producte multimèdia interactiu:
1) Consistència. Els elements han de tenir una aparença uniforme.
2) Predicibilitat. El disseny ha de ser intuïtiu i predicible.
3) Progressió. Tot ha de progressar de simple a complex.
La complexitat gratuïta provoca disminució de l'interès i de la participació per part de l'usuari.
4) Visibilitat. Els elements funcionals han de ser visibles i la seva funció s'ha de fer veure.
5) Transparència. L'usuari s'hauria d'oblidar que està treballant amb un ordinador i concentrar-se en la tasca del moment.
6) Retroalimentació. Cada acció de l'usuari hauria de tenir un efecte obvi i immediat.
7) Modes d'operació. Hi ha tres modes d'operació principals:
  • Mode d'instruccions: dir al sistema que faci alguna cosa, que busqui una paraula, que vagi a una secció.

  • Mode de manipulació: manipular objectes, simular.

  • Mode d'enregistrament: introduir dades, anotacions, etc.

8) Velocitat. L'usuari hauria de ser capaç de poder controlar la velocitat amb què es mou.
9) Adequació. El disseny de la interfície s'hauria d'acomodar als usuaris.

2.9.La forma del disseny interactiu

Quan hem de plantejar el disseny interactiu d'un producte multimèdia hem de descriure la manera en què l'usuari es relacionarà amb el programa, és a dir, quins elements inclourem en el nostre programa perquè l'usuari es pugui relacionar amb aquest. En aquesta fase es recomana valorar les diverses opcions que tenim a partir del gènere del producte.
En el disseny interactiu pensem com presentem els continguts, com s'estableix la comunicació amb l'usuari, quins elements de l'ús del temps tindrem en compte, i com es materialitza tot això.
El disseny interactiu s'escriu de manera narrativa, inclou tots aquests elements i defineix quines són les coses que trobarà l'usuari quan entri en el nostre CD-ROM o web.
Redacció d'un disseny interactiu
Com a exemple de redacció d'un disseny interactiu d'un joc tenim el fragment següent:
L'aplicació consisteix en un joc en el qual s'estableixen diversos graus de dificultat. Es guardarà l'historial de cada un dels participants. En cada grau de dificultat hi ha cinc etapes, compostes per tres proves, que l'usuari ha de superar. Si les supera, se sumaran punts en un comptador. Si no les supera, es restaran. Els jocs es divideixen en diverses proves de preguntes i respostes sobre diversos camps de coneixement. L'usuari quan entri en l'aplicació trobarà a un personatge animat que l'ajudarà amb pistes sobre cada una de les proves, etc.

3.Etapa 3: Disseny de la navegació

3.1.Organització de la informació

Una vegada tenim el disseny de la interactivitat, procedim al disseny de la navegació:
Pensar i dissenyar com es mourà l'usuari per l'aplicació, com accedirà a la informació.
L'accés a la informació i les diferents opcions possibles que té l'usuari (mirar, escoltar, fer clic, moure el ratolí, teclejar un missatge, etc.) s'han d'estructurar de manera adequada.
Si una aplicació està ben estructurada, es facilitarà que l'usuari aviat hi sàpiga navegar i s'hi senti còmode. Per tant, és important pensar com s'organitzarà la informació quan es dissenya una aplicació multimèdia.
En el gràfic adjunt es mostren una sèrie de fases coherents per a organitzar i estructurar la informació.
50045_m6_05.gif
Classificació de la informació per categories
L'objectiu d'aquesta fase és generar una llista àmplia de les possibles categories del contingut de l'aplicació.
Exemple de categories
Aquestes categories es poden establir per tema o assumpte, ubicació, seqüència narrativa...
Agrupació temàtica i redefinició dels grups temàtics
A continuació, una vegada generada la llista principal de categories, es procedeix a agrupar-les temàticament. Aquestes metacategories es convertiran en els temes de nivell superior que els usuaris veuran en accedir a l'aplicació.
Exemple de metacategoria
En una pàgina web personal, dins de la metacategoria de temps lliure, es podrien situar aquestes categories: vacances, entreteniments, etc.
Consisteix bàsicament a col·locar tots els temes o categories de la llista principal en diferents grups temàtics. Probablement, hi haurà temes que podran pertànyer a dues categories o més, mentre que d'altres no es podran col·locar fàcilment.
És important assegurar-se que aquestes categories temàtiques estan ben definides i es diferencien unes d'altres.
Fragmentació de la informació en "trossos", blocs o unitats petites
En aquesta fase s'han de concretar els continguts d'informació en blocs d'informació relativament petits dins de cada tema.
Jerarquització i adjudicació de prioritats
Establir la jerarquia d'importància de cada tema determinarà en certa manera l'estructura de navegació de l'aplicació. En primer lloc, s'han de definir les prioritats, quins conceptes són més importants i més generals, i quins són més específics o opcionals.
Establiment de relacions
A continuació, s'establirà quines relacions es poden fixar entre els diferents temes.
Organització dins d'una estructura
Probablement, l'organització de la informació no serà seqüencial. Per aquesta raó cal dissenyar un o més camins específics. L'estructura de l'organització ha de resultar coherent perquè l'usuari es trobi còmode i navegui fàcilment per l'aplicació.
La manera d'organitzar el contingut determinarà la facilitat més o menys gran per a arribar a tots els continguts.
Realització del diagrama de flux
L'estructura de la fase anterior és el principi del diagrama de flux de l'aplicació.

3.2.Models d'organització de la informació

Hi ha diferents models per a organitzar la informació en l'aplicació interactiva. A continuació es tractaran els següents:
  • lineal,

  • circular,

  • indexada,

  • jeràrquica,

  • lineal jeràrquica,

  • ramificada,

  • lineal ramificada,

  • matricial,

  • paral·lela,

  • concèntrica,

  • reticular,

  • contributòria,

  • mixta.

3.2.1.Lineal
És la més simple i és pròpia del suport del paper tradicional. Representa una seqüència única. L'usuari no té més opció que avançar o retrocedir. És útil quan es necessita que el navegant segueixi un itinerari fix. Si bé aquest model no proporciona gaire interactivitat a l'usuari, garanteix l'accés a la informació que es considera important.
Se sol utilitzar en programes d'aprenentatge o en visites guiades en aplicacions informàtiques. També en les seqüències inicials dels jocs interactius en què es fa una exposició i plantejament d'objectius a l'usuari, o bé en una presentació inicial d'un producte.
50045_m6_06.gif
3.2.2.Circular
A diferència de l'estructura lineal, que té un principi i un final, en l'estructura lineal el camí és fix i únic, però sense inici ni final.
50045_m6_07.gif
3.2.3.Indexada
Aquesta estructura ofereix un menú d'opcions que porten a una resposta i, després, de nou torna una altra vegada al menú.
50045_m6_08.gif
3.2.4.Jeràrquica
Consisteix a organitzar el flux de l'aplicació amb l'estructura típica d'arbre, en què l'arrel sol actuar com a benvinguda i menú per a accedir a les diferents seccions. És un model clàssic d'organització temàtica de la informació en què es reflecteix l'ordre que va del que és general al que és particular i de la dependència d'uns conceptes respecte als altres.
Aquesta estructura és típica de les aplicacions educatives i dels cercadors temàtics del Web (per exemple, Yahoo).
50045_m6_09.gif
3.2.5.Lineal jeràrquica
Aquesta estructura és una solució mixta a partir de les estructures lineal i jeràrquica. Permet navegar per un contingut organitzat de manera jeràrquica, però també permet una navegació lineal. També s'utilitza en certs programes d'aprenentatge, sobretot en format web.
50045_m6_10.gif
3.2.6.Ramificada
Aquest tipus d'estructura consisteix en un menú d'opcions que porten a l'esdeveniment següent, i aquest porta de nou al menú fins a acabar o tornar al menú original. Representa una trajectòria de navegació en la qual s'han inclòs nodes subordinats per a oferir més interactivitat a l'usuari.
L'estructura ramificada es pot donar en els contes infantils interactius en els quals la història s'organitza de manera lineal i obliga l'usuari a una lectura seqüencial, alhora que s'amplia la interactivitat incorporant, com explica Orihuela, "las dimensiones lúdicas en los nodos subordinados".
50045_m6_11.gif
3.2.7.Lineal ramificada
Aquesta estructura consta d'una seqüència principal que no varia amb branques ocasionals que retornen a la seqüència principal.
50045_m6_12.gif
3.2.8.Matricial
Aquesta estructura forma una espècie de matriu. En aquest cas, en seleccionar un element s'activen una sèrie d'opcions que estan relacionades. Aquesta estructura pot ser difícil de comprendre si l'usuari no coneix les relacions entre els diferents elements, entre les diferents categories d'informació.
50045_m6_13.gif
3.2.9.Paral·lela
En aquesta estructura es representen una sèrie de seqüències lineals en les quals és possible:
  • la navegació entre aquestes,

  • el desplaçament entre els nodes d'un mateix nivell.

Aquest model pot ser d'utilitat en ficcions interactives. Permet organitzar diferents accions o punts de vista d'una història que es desenvolupen alhora. Així, l'usuari podria seleccionar en cada seqüència els punts de vista de diferents personatges que intervenen en la història.
50045_m6_14.gif
3.2.10.Concèntrica
Aquest model parteix d'un node d'entrada a partir del qual s'organitzen una sèrie de seqüències lineals. A diferència de l'estructura paral·lela, el model d'estructura concèntrica no permet la navegació entre els nodes d'un mateix nivell.
Un exemple d'estructura concèntrica podria ser un joc o ficció interactiva en el qual es proposen a l'usuari diferents tasques o objectius com a condició necessària per a passar al nivell superior.
50045_m6_15.gif
3.2.11.Reticular
Aquesta estructura és una organització en la qual en aparença no hi ha un itinerari de navegació predefinit i, per tant, permet el màxim grau de flexibilitat per a l'usuari en la navegació.
És una de les estructures més laborioses, ja que el guionista ha de preveure tots els fluxos possibles.
50045_m6_16.gif
3.2.12.Contributòria
En aquest model d'estructura l'usuari pot afegir esdeveniments que després constituiran opcions per als usuaris següents.
50045_m6_17.gif
3.2.13.Mixta
L'estructura mixta és aquella que combina dos o més models d'estructura. Aquestes estructures han d'aprofitar els avantatges de cada una. L'estructura mixta es dóna en la majoria d'aplicacions interactives.
50045_m6_18.gif

3.3.Sistemes de navegació

Tal com comenta Orihuela,

"La navegación que permite los interactivos se diseña mediante las diversas estructuras hipertextuales y el variado sentido de los enlaces, y se orienta mediante el recurso a las metáforas, en particular a los mapas de orientación y navegación y a los sistemas de ayuda."

Per tant, en el disseny de la navegació s'han de tenir en compte:
  • el model d'estructura de la informació en hipertext o hipermèdia,

  • les metàfores,

  • els sistemes d'ajuda,

  • els mapes (d'orientació i de navegació).

3.3.1.Tipus de navegació
Bàsicament, els sistemes de navegació es poden classificar en tres tipus:
1) Navegació tancada
S'entén com a navegació tancada aquella en la qual l'usuari només pot ascendir o descendir en l'estructura de nivells que s'ha creat. Aquest tipus de navegació necessita una estructura jeràrquica.
L'avantatge evident és la facilitat de navegació que té l'usuari; al contrari, la sensació de falta de llibertat de moviment també pot ser més patent.
2) Navegació oberta
En aquest tipus de navegació l'usuari marca el seu itinerari propi sense un ordre prefixat. És l'usuari que salta d'un punt de l'aplicació a un altre. En aquest cas l'estructura pot quedar establerta en forma de xarxa.
3) Navegació mixta
En aquest tipus de navegació hi ha una estructura de menús que condiciona la navegació lineal, però al seu torn hi ha la possibilitat de variar relativament la navegació i generar una estructura lineal però amb jerarquies determinades, amb la qual cosa es permet a l'usuari sortir de la línia de navegació establerta en els menús per a passar d'un bloc o secció a un altre.
Una altra classificació, molt simple, de navegació, és la següent:
1) Navegació interna
La navegació interna es refereix a la navegació dins de la nostra aplicació mateixa (per exemple, pel nostre web).
2) Navegació externa
En la navegació externa, en canvi, l'usuari surt de l'aplicació, mitjançant enllaços, i pot visitar webs externes. Es recomana que les relacions amb altres pàgines externes siguin complementàries de la informació proporcionada en la nostra aplicació.

3.4.El diagrama de fluxos

"Process improvement starts with an understanding of the process, and flowcharting is the first step towards process understanding."

Phil Cohen, HCI Consulting

3.4.1.Definició
El diagrama de fluxos d'una aplicació interactiva és un esquema visual en el qual es plasma el contingut, l'estructura, organització i l'accés de l'aplicació. Ha de reflectir el disseny de tots els possibles fluxos, camins o itineraris que es puguin generar en l'aplicació.
Kristof defineix així un diagrama de flux:

"Es sencillamente un esbozo presentado como diagrama, con líneas que muestran las rutas de acceso entre sus partes."

En el diagrama de fluxos s'ha de veure com es relacionen les diferents parts del projecte unes amb altres i serveix per a veure les diferents possibilitats de navegació dels usuaris amb la interfície del projecte.

"El diagrama de flujo ideal es una especificación clara y fácil de seguir de las categorías temáticas, los niveles y los vínculos del proyecto."

Exemple de diagrama de flux
50045_m6_19.gif
Aquest és un exemple d'un web fictici molt senzill. En la primera pàgina s'accediria a un menú amb quatre opcions (gimnàs, aeròbic, musculació i salut). Aquestes serien les principals categories temàtiques.
Dins de cada una, hi hauria una sèrie de categories secundàries. Per exemple, en el gimnàs: la localització, les instal·lacions, les activitats, etc. Des d'aquí es podria accedir a les dues activitats d'aquest gimnàs: aeròbic i musculació. I des de cada activitat es podria accedir a l'apartat de beneficis mèdics (dins de salut).
Una versió més ampliada d'aquest diagrama podria mostrar totes aquestes categories secundàries en lloc de presentar-les només de manera apilada.
Avantatges
El diagrama de fluxos plasma el contingut: l'estructura, l'organització i l'accés de l'aplicació. A més, permet condensar la informació i representar-la de manera visual.
Bàsicament, els principals avantatges són:
1) Permet veure les diferents rutes d'accés que tindrà el públic.
Generalment, en una aplicació interactiva es pretén que els continguts siguin accessibles de manera fàcil i comprensible per a l'usuari. El diagrama de flux ajuda a planejar-los de manera convenient.
2) Permet tenir una visió clara del conjunt de l'aplicació, i això és molt útil per a tot l'equip que participa en el projecte. Per aquesta raó, el diagrama de flux facilita el procés de disseny de l'aplicació i, moltes vegades, permet reduir temps i cost de producció. A més, permet detectar errors possibles (enllaços que no funcionen, etc.).
3.4.2.Elaboració de diagrames de fluxos
Hi ha diverses maneres de representar els fluxos d'una aplicació interactiva; se solen utilitzar sistemes adoptats i compartits amb altres disciplines, com la informàtica de gestió o el control d'esdeveniments, que poden necessitar una campanya electoral o relacions públiques.
El resultat final dels fluxos de l'aplicació pot diferir de l'ideat inicialment. Això és completament lògic, ja que durant el procés de producció o fins i tot en les proves poden sorgir alternatives millors a les previstes inicialment.
Com a eina o programari per a dibuixar fluxos de dades, n'hi ha diversos d'específics, com l'Inspiration, l'SmartDraw, el Flowcharter o l'Igrafx.
Processadors de text molt coneguts, com Microsoft Word, també incorporen a la seva barra d'eines de dibuix, una llibreria d'"autoformes" que inclou les específiques del diagrama de fluxos.
Recomanacions per a elaborar diagrames de fluxos
Triar noms significatius.
Numerar els processos.
Incloure verbs actius i l'objecte.
Evitar verbs com fer, manejar, processar.
Evitar diagrames de flux complexos.
Han d'arribar a ser comprensibles, digeribles i agradables a la vista.
Els fluxos de dades es poden descompondre en l'"explosió" del procés en un DFD fill.
Evitar sempre que es pugui les abreviatures.
És important precisar que, sempre que fem un diagrama de fluxos, s'hauria d'acompanyar la diagramació esmentada de la llegenda corresponent i especificar el sentit de totes les icones utilitzades.
3.4.3.Simbologia en els diagrames de fluxos
Com a regla general, la simbologia que s'utilitza en els diagrames de fluxos ha de ser simple i de comprensió ràpida.
En funció del tipus de diagrama de flux (d'un procés comercial, d'un flux de dades, d'una assignació de processos, etc.) es poden utilitzar específicament uns símbols o d'altres. Fins i tot algunes empreses utilitzen la seva simbologia pròpia.
A continuació es detallen els símbols més generalitzats dels diagrames de flux, que poden ser d'utilitat per a crear-ne en les aplicacions multimèdia.
Inici i final
El símbol que s'utilitza per a indicar l'inici o el final d'una aplicació sol ser un dels dos següents:
50045_m6_20.gif
Contingut textual o gràfic
Per a indicar el contingut principal (ja sigui textual o gràfic) de les pantalles es pot utilitzar el rectangle (normalment simbolitza un procés).
Per a complementar el contingut, per a una explicació, etcètera, es pot utilitzar el rectangle (inacabat a la part inferior), que simbolitza un document.
50045_m6_21.gif
Decisió
Per a simbolitzar una decisió que ha de prendre l'usuari de l'aplicació s'utilitza el símbol següent, amb les línies connectores pertinents, en funció de les respostes.
50045_m6_22.gif
Connector
Per a marcar que des d'un punt concret s'accedeix a una altra pàgina s'utilitza aquest símbol, el connector, i s'hi especifica un nombre. Aquest nombre serà el que s'usarà després per a seguir el camí marcat.
50045_m6_23.gif
Exemple 1
Exemple 2
El diagrama de flux representa aquest text:

"Dial 0 then your friend's number. You will hear a tone. If you have a calling card number, dial your home phone number and the PIN number. If you don't have a calling card number, first dial that 800 number (the one they always advertize on TV). When the computer voice asks you to say your name, say your name. Then wait for your friend to answer. If you have a calling card number, you can talk to your friend's answering machine. If you don't have a calling card number, you can't, so just hang up."

50045_m6_25.gif

4.Etapa 4. El disseny lògic

4.1.El disseny lògic

En el procés d'elaboració d'un guió multimèdia, després de fer el disseny de la navegació amb el seu corresponent diagrama de flux, es procedeix a la realització del disseny lògic.
El disseny lògic és el guió detallat clic a clic. En aquest s'ha d'explicar tot el que ocorre en l'aplicació pas a pas. S'escriu mitjançant una descripció textual de la idea argumental de cada una de les escenes i a continuació es descriu com ha de ser cada una de les pantalles, quins elements d'interactivitat té i com són (si hi ha text, imatge, so, com apareixen en pantalla, què pot fer o no fer l'usuari, etc.). És a dir, es detallen tots i cada un dels elements que intervenen en cada una de les pantalles de l'aplicació.
Aquest document se sol redactar igual que un guió literari. I s'utilitza per a dur a terme el disseny gràfic i, posteriorment, l'aplicació informàtica.
Aquest apartat de disseny lògic conté també el guió tècnic de l'aplicació.

4.2.El guió tècnic

El guió tècnic d'un producte multimèdia, de la mateixa manera que el guió tècnic d'un producte audiovisual, escapa de la responsabilitat del guionista i entra en la del programador de l'aplicació. Perquè tots dos professionals es puguin entendre i no hi hagi dubtes sobre la pretensió del guionista s'elabora un document amb un llenguatge a cavall del vocabulari del guionista i el de l'informàtic.
En el cas d'un producte multimèdia no hi ha una metodologia única per a fer un guió tècnic. En moltes empreses multimèdia, per exemple, no treballen amb guions gaire extensos, sinó que només plasmen l'estructura amb un diagrama de fluxos. Però a mesura que l'equip de treball creix (i també a mesura que el projecte és més complex) és imprescindible que hi hagi un guió ben establert, manejable i fàcilment intel·ligible.
A continuació s'explica un exemple de realització de guió recollit per Guillem Bou en el llibre El guión multimedia. Aquest és un mètode que pot servir d'exemple per a l'escriptura d'un guió multimèdia, encara que no és l'únic.
Guillem Bou proposa un mètode d'escriptura de guions basat en una sèrie de paraules clau; té com a propòsit que tots els membres d'un equip de producció multimèdia puguin entendre's entre si.
Aquest mètode és molt útil per a escriure el guió tècnic de l'aplicació.
En el disseny lògic el guionista ha de tenir clar el que ocorre en l'aplicació, i ha d'intentar plasmar-lo de manera senzilla; també han de quedar clares les idees del que ocorrerà en l'aplicació.
Els conceptes més importants que recull el mètode de Bou són els següents:
  • títol,

  • fons,

  • zones sensibles,

  • comportament de les zones sensibles.

4.2.1.Títol
Hem de definir cada una de les escenes amb un títol, el qual està compost per un número d'escena i un nom.
4.2.2.Fons
Cada escena es defineix per un fons. Quan parla de fons, Bou es refereix a una fotografia o pantalla dibuixada que serveix d'imatge de base per a una escena. Aquest fons s'escriu en el guió després del títol de l'escena i s'assenyala amb el nom de BMP (bitmaps) que és l'extensió habitual dels fitxers d'imatge de Windows. A continuació, posem el nom del fons. Si aquest fons ja està dissenyat, s'assenyala en el guió amb el nom amb què hem desat l'arxiu, seguit de l'extensió del format gràfic: PCX, TIF, CIF o BMP, entre d'altres.
4.2.3.Zones sensibles
Les zones sensibles són les regions de la pantalla que reaccionen en fer clic o al pas del ratolí a sobre seu.
En el guió es fa un inventari de quines són les zones sensibles. S'utilitzen les paraules clau següents:
  • RAT(abreviatura de ratolí): indica una zona sensible que reacciona a les ordres del ratolí.

  • ROL (abreviatura de l'anglès roller): indica una àrea o zona que reacciona quan el ratolí passa per sobre.

  • CLIC: indica que la zona reacciona quan es fa clic a sobre seu.

  • DCLIC: indica que una zona reacciona quan es fa doble clic a sobre seu.

4.2.4.Comportament de les zones sensibles
La resposta de cada una de les zones sensibles es diu comportament. La resposta que dóna una zona sensible a l'usuari potser no és sempre la mateixa.
Bou assenyala cinc tipus de comportament de les zones sensibles:
1) Comportament regular: succeeix quan una zona sensible repeteix sempre la mateixa resposta. No s'assenyala de cap manera especial en el guió.
2) Comportament d'una resposta: es refereix a les zones que es comporten d'una manera concreta la primera vegada que es fa clic a sobre seu, però després deixen de ser de comportament regular. Se senyalitzen en el guió amb el símbol "!". S'escriu a continuació o en un annex com són els altres comportaments.
3) Comportament i desconnexió: són zones que, després de la primera resposta, deixen de donar resposta; la zona es desconnecta. Aquest tipus de comportament s'assenyala en el guió amb el següent símbol: "!-". Aquest símbol també s'utilitza en el guió per a indicar que alguna cosa deixa d'actuar. Per exemple, en la rutina d'entrada a una escena (vegeu les rutines d'entrada), si apareix aquest símbol, indicarà que la segona vegada que l'usuari entra en l'escena no s'executarà la rutina.
4) Comportament per a diferents execucions: és el cas d'una zona sensible que es comporta de manera diferent segons el nombre de vegades que l'usuari actuï a sobre seu. Així ocorre en una zona que reacciona al tercer intent de l'usuari. Per a indicar en el guió el nombre d'accions que són necessàries per part de l'usuari a fi que aquesta zona reaccioni, s'utilitza el símbol N; a continuació s'especifica el tipus de comportament.
5) Comportament per condicions: succeeix a les zones que es comporten d'una determinada manera quan s'han complert certs objectius. S'anoten amb la lletra C normalment seguida de la condició.

4.3.Altres elements del guió

A continuació de cada un dels epígrafs que s'utilitzen per a anomenar les zones sensibles s'assenyala l'element concret que apareix amb la reacció a cada un dels moviments del ratolí. Per a això, Bou proposa més termes que ens ajuden a sistematitzar el vocabulari del guió.
4.3.1.Textos
Són les informacions escrites que apareixen en l'escena; estan en general emmarcades en un requadre. Serveixen per a indicar en el guió que apareix un text; s'usa la paraula TXT.
Hi ha més opcions per a indicar textos especials:
  • Etiquetes: són els textos que apareixen quan el ratolí passa per sobre d'una zona sensible i desapareixen quan l'usuari mou el ratolí a una altra zona de la pantalla. La funció d'una etiqueta és identificar un objecte i avisar l'usuari que hi ha una zona sensible. S'indiquen amb la paraula ETI.

  • Globus: globus és un terme que procedeix del còmic. Són textos que apareixen dins d'un requadre de puntes rodones o una el·lipsi amb una fletxa que indica el personatge que està parlant. S'assenyalen amb la paraula BOC; entre parèntesis s'indica el personatge que està parlant.

Si no s'indica el contrari, els textos desapareixen quan l'usuari fa clic per indicar que ja ho ha llegit. En algunes ocasions els textos desapareixen al cap d'un temps; si és així, s'ha d'especificar en el guió.
4.3.2.Icones
Són figures o imatges que se superposen sobre un fons. Aquestes imatges solen ser temporals: apareixen i després desapareixen. S'assenyalen en el guió amb la paraula ICN.
4.3.3.Seqüències
L'autor entén per seqüències el conjunt d'icones mòbils, és a dir, una família d'icones animades. Aquestes s'assenyalen en el guió amb la paraula SEC.
4.3.4.Animacions
Les animacions són les trames de vídeo tant si provenen de la digitalització d'un senyal extern, com si han estat generades amb un programa d'animació per ordinador. La principal diferència entre la seqüència i l'animació és que en el cas de l'objecte animat aquest s'integra en el fons, és a dir, el seu fons propi és transparent; per aquest motiu es veu el fons de l'escena. En canvi, les animacions ocupen una zona rectangular de la pantalla. Les animacions s'assenyalen en el guió amb la paraula FLI (el format clàssic d'animació per ordinador).
Un FLI o bé ocupa tota la pantalla, o bé n'ocupa una part. Si ocupa una part de la pantalla s'indica en el guió amb una P (parcial); si ocupa tota la pantalla, s'assenyala amb una T (total).
Si l'animació porta un so incorporat, llavors s'escriu la paraula AVI en lloc de FLI (és el format comú en aquest tipus de dades).
4.3.5.So
El so s'indica en el guió amb la paraula WAV (format típic de so) i s'especifica en el guió si els sons acaben quan l'usuari du a terme una acció; per exemple, canviar d'escena, si l'aplicació deixa que acabin o si han de tornar a començar una vegada acabats.
4.3.6.Marcadors
Són els indicadors dels punts (si és que l'aplicació n'utilitza) que té l'usuari (així, en un joc). En el guió s'escriuen amb la paraula SCO (de l'anglès score). Si hi ha diversos jugadors amb diversos marcadors, s'especifiquen amb una etiqueta o amb un nom per a diferenciar-los.
4.3.7.Objectius
Els objectius per a Bou són elements concrets que l'usuari ha de descobrir o assolir. S'escriuen en el guió amb el símbol $ seguit d'un nombre o un nom.
4.3.8.Distractors
Els distractors són zones sensibles que serveixen per a distreure l'usuari; en els jocs, per exemple, no són zones que continguin cap objectiu que hagi d'aconseguir l'usuari.
4.3.9.Execucions o rutines
Són fragments del codi informàtic, fets a mesura, que insereixen els programadors entre el flux de l'aplicació, és a dir, trossos de programa que el guionista descriu i que l'equip informàtic inclou al lloc indicat de l'aplicació.
A tall d'exemple, Bou manifesta que si en un lloc de l'aplicació l'usuari ha de resoldre uns mots encreuats, l'equip informàtic ho programa seguint les indicacions del guió; per la qual cosa s'ha d'incloure un document annex que descriu el funcionament d'aquest joc, mentre que en el guió tan sols apareix la paraula EXE, seguida del nom del joc i de la indicació de l'annex en el qual es troba la descripció textual.
És freqüent incloure EXE en la descripció del comportament d'una zona sensible que es bifurca a una altra escena. Així ocorre quan ens interessa per exemple que l'usuari faci unes proves per a poder canviar d'escena. En aquest cas en el guió se sol assenyalar amb la paraula EXE i una descripció de la rutina que s'ha de programar.
4.3.10.Grups de tasques
Quan l'autor parla de grups de tasques es refereix a coses que passen en les escenes i que no estan determinades per cap acció de l'usuari. Els casos més importants són les tasques d'entrada a una escena i les tasques de fons.
4.3.11.Entrada a una escena
En el guió, després de puntualitzar quin és el fons (BMP), s'inclou la paraula ENTRADA per a especificar una llista de coses que succeeixen abans que l'usuari interactuï. Aquestes coses solen ser: presentacions, música, animacions i altres elements, que serveixen per a presentar o ambientar la part interactiva, que vindrà a continuació.
En l'article "Introducción al diseño interactivo de elementos dinámicos", de Guillem Bou, s'indiquen alguns exemples de tasques d'entrada:
De la mateixa manera que hi ha tasques d'entrada, també hi ha tasques de sortida; aquestes les marcarem també en el guió amb la paraula SORTIDA.
4.3.12.Tasques de fons
En el guió també es descriu el que passa quan l'usuari no fa cap acció. És el cas de les pantalles vives: elements que es mouen sense que l'usuari faci res.
Aquest grup de tasques se suma al guió, descrites i precedides de la paraula IDLE, la qual també apareix en algunes eines de generació d'aplicacions (en alguns generadors s'anomena timeline).

4.4.Regles per a l'escriptura del guió

Bou estableix una sèrie de regles per a escriure el guió definitiu a fi que sigui útil i pràctic per a tot l'equip. Aquestes regles són les següents:
  • Cada escena comença en una pàgina diferent.

  • Una escena pot constar dels elements següents, que apareixen en aquest ordre: número de l'escena, títol, fons, rutina d'entrada, grup de tasques, grups de tasques IDLE, zones sensibles (amb els seus comportaments).

  • El fons d'una escena pot canviar, però normalment el fons inicial serveix de decorat per a identificar l'escena. Si el fons canvia, tornarem a escriure la paraula BMP amb el seu nom pertinent.

  • Les zones sensibles no canvien durant una escena; a tot estirar, es desconnecten. Si canvien, és convenient fer una altra escena encara que el fons sigui el mateix que l'anterior.

4.5.Exemple de disseny lògic

Escena núm. 12
Títol: Hacienda.
Descripció textual:
En entrar en l'escena apareix un text que diu: "Bienvenidos a la paz campestre" mentre es veu un ocell que s'escapa perquè estan intentant caçar-lo. El soroll de dos trets sona de fons.
L'usuari tindrà un marcador a la pantalla. Sumarà punts quan la decisió presa sigui correcta i els perdrà quan s'equivoqui.
Quan polsi sobre la porta de l'esquerra sortirà un text que dirà "¡Hala! ¡Cómo se nota que sois urbanos! Habéis abierto la puerta del gallinero y se han escapado los animales". Llavors es canviarà el fons i es veurà una animació que ocuparà tota la pantalla en la qual s'escapen gallines, conills i tota classe d'animals domèstics. Se li restarà un punt. Si es torna a polsar sobre la mateixa porta, les vegades posteriors sortirà un text que dirà "No quedan ya animales en esta granja".
Hi ha un pal telefònic i cada vegada que polsin a sobre apareixerà un text que digui: "No hay teléfono en la casa".
En intentar pujar a la finestra superior apareixerà una senyora cridant: ¡Ladrones! ¡Ladrones!, i l'usuari perdrà un punt.
Mentre l'usuari no faci res, apareixeran diversos motius rurals, com carros que passen pel camí, ocells que volen, alguna serp que s'arrossega, etc.
BMP: casacamp.pcx
ENTRADA (!)
TXT: "Bienvenidos a la paz campestre"
SEC: Se ve un pajarraco que se escapa porque están intentando cazarlo.
(pájaro 01 a pájaro 06)
WAV: disparos.wav (dos disparos)
Zonas sensibles:
1) RAT: puerta del almacén
ROL: ETI: "puerta del almacén"
CLIC: TXT: "En el almacén hay una puerta."

ICN "escalera" (sale el dibujo correspondiente)

$ 1
2) RAT: puerta central (d)
ROL: ETI: "puerta de entrada"
CLIC TXT: "La casa está cerrada. Deberéis entrar por una ventana."
3) RAT: ventana superior izquierda (d) (C $1)
ROL: ETI: "ventana"
(sin $1) TXT: "No puedes subir a esa ventana. Está muy arriba."
(con $1)

ICN. "señora. ICN"

BOC (señora) "¡Ladrones! ¡Ladrones!"

SCO-1

4) RAT: ventana superior derecha (C$1)
ROL: ETI: "ventana"
CLIC:

(sin $1) TXT: "No puedes subir a esa ventana. Está muy arriba."

(con $1):

     TXT: "Esta ventana es de la habitación de Rosa. A través de ella se puede ver la cámara que estás buscando."

5) RAT: puerta izquierda (d) (!)
ROL: ETI: "puerta izquierda"
CLIC:

TXT: "¡Hala! ¡Cómo se nota que sois urbanos! Habéis abierto la puerta del gallinero y se han escapado los animales."

AVI: "granja Avi" (animales de granja que se escapan). (T)

SCO-1

OTRAS:

     TXT: "No quedan animales en esta granja."

6) RAT: poste de teléfonos (d)
ROL: ETI: "poste de teléfonos"
CLIC: TXT: "No hay teléfono en la casa."
IDLE: Aparecen diversos motivos rurales (SEC) por este orden:
carro, pájaro, caballo, serpiente.
Exemple pres del llibre El guión multimedia de Guillem Bou.

5.Etapa 5. El guió il·lustrat

5.1.El guió il·lustrat multimèdia

L'última etapa del guió multimèdia és el guió il·lustrat i els esquemes gràfics de tots els elements que apareixen en cada una de les escenes.
El guió il·lustrat és una eina visual prestada del món de la comunicació audiovisual que constitueix una presentació en forma esquemàtica d'una seqüència de dibuixos, que són les pantalles de la interacció. S'hi representa la idea que es pretén plasmar en l'aplicació. Un guió il·lustrat és l'expressió de tot el que contindrà l'aplicació, de les interaccions, dels estats i elements dinàmics.
Bou afirma que:

"En el mundo multimedia la acción no es lineal. El story-board es un diagrama de escenas con indicaciones de las posibles rutas que se pueden seguir en la navegación por la aplicación."

El guió il·lustrat expressa tot el que pot ser vist o sentit o experimentat per part de l'usuari final de l'aplicació multimèdia. Ha de contenir totes les especificacions necessàries.
Els guions il·lustrats poden prendre moltes formes i dimensions diferents en funció del projecte. El guió il·lustrat és una guia que variarà al llarg del procés de producció de la interacció. Així, una il·lustració inicialment prevista pot variar, ja que es dedueix que hi ha una opció millor.
El guió il·lustrat és una eina dinàmica que sofrirà variacions al llarg del procés de producció.

5.2.Funcions i avantatges del guió il·lustrat

El guió il·lustrat compleix bàsicament aquestes dues funcions:
1) Plasmar de manera gràfica l'estructura dels continguts i les seves interaccions.
2) Servir de guia, punt de referència per a tot l'equip, incloent-hi el client.
Els avantatges del guió il·lustrat es poden resumir d'aquesta manera:
  • Ajuda a catalitzar la idea de com serà l'aplicació, ajuda a visualitzar-la.

  • Força l'autor a pensar de manera visual i a desenvolupar un document clar en el qual s'especifiquin els detalls amb imatges i text.

  • Permet transcriure accions, estructures, interaccions complicades d'explicar verbalment i que es podrien interpretar de manera equívoca.

  • Constitueix un document que tots poden utilitzar com a punt de referència. Permet acordar diferents punts ("sí, és el que volia dir" o "no, això és un problema"). Permet comprendre i retenir millor la informació visual.

  • És un document flexible que permet a l'autor i al seu equip moure imatges, seqüències.

  • Permet veure els enllaços entre les diferents parts i discutir les interaccions. El guió il·lustrat ha de plasmar tots els enllaços que hi ha entre les diferents pantalles del document.

  • Pot servir per a ensenyar-lo al client i que aquest aprovi la línia abans de seguir amb el desenvolupament del procés.

  • La correcció dels problemes és menys costosa que en estadis més avançats.

  • Un guió il·lustrat detallat pot significar un estalvi de temps en el procés d'escriptura.

  • Ajuda a veure l'estructura general del contingut de l'aplicació i a veure'n la magnitud.

Per a produir productes multimèdia complexos i amb equips relativament grans és essencial elaborar un guió il·lustrat.

5.3.Graf general i graf exhaustiu

L'objectiu principal del guió il·lustrat és concretar de manera gràfica, i al més aproximada possible, l'estructura de l'aplicació i el que ocorre en concret dins de cada pantalla.
Per aquesta raó, cal treballar en dos nivells: el de l'aplicació en la seva totalitat i el del detall de les relacions entre les escenes.
En una aplicació multimèdia interactiva el guió il·lustrat està format pel graf general i el graf exhaustiu.
Graf general i graf exhaustiu
Graf general
Una estructura general en un diagrama de fluxos de l'aplicació en què s'esquematitza la totalitat de l'estructura de l'aplicació interactiva. Ofereix una visió global (de l'estructura del contingut i del sistema de navegació).
Graf exhaustiu
Un comentari descriptiu i detallat que acompanya cada escena o pantalla en concret. Per exemple, una descripció detallada de com seran els menús, quines il·lustracions es veuran i durant quant temps, quin àudio i quin text acompanyaran les imatges, quins enllaços hi haurà, etc. S'empra per a visualitzar el comportament detallat de cada escena i dels elements que la integren.
5.3.1.El graf general
És el diagrama de fluxos. S'hi representen les imatges i/o continguts simplificats de les diferents pantalles de l'aplicació.
S'ha d'estructurar la informació de manera coherent i tenint en compte les possibilitats de l'hipertext i de les diferents estructures possibles que es generaran.
A continuació, es recorden les fases coherents per a organitzar i estructurar la informació fins a plasmar-la en un diagrama de fluxos:
50045_m6_05.gif
5.3.2.El graf exhaustiu
En el graf exhaustiu es detalla com es distribueixen a la pantalla els diversos elements, a més de les formes d'interacció que s'ofereixen a l'usuari.
Registres que ha de preveure el graf exhaustiu
Il·lustració
Text
So
Vídeo
Interaccions (zones sensibles)
Efectes-transicions
Descripció general
En el graf exhaustiu es proporciona una descripció detallada del que ocorre a cada pantalla, els elements multimèdia que hi ha (pot incloure's una relació dels arxius utilitzats, el seu nom i ubicació) i les interaccions que s'ofereixen a l'usuari.
En canvi, en el graf general, en un diagrama de fluxos es mostra l'estructura de l'aplicació i les connexions entre les pantalles. Té la funció d'orientació global.
En el graf exhaustiu es marquen les zones sensibles (que, com ja hem explicat anteriorment, són aquelles zones de la pantalla en les quals succeeix alguna cosa en polsar o passar el ratolí per sobre, o bé en fer una altra acció). En aquest graf s'ha de detallar on es localitzen aquestes zones sensibles i una descripció del seu comportament. A partir d'aquestes zones sensibles es planificaran les interaccions.
En l'apartat de guió tècnic es van assenyalar alguns dels comportaments de les zones sensibles i també una manera d'anomenar-los; però no és l'única nomenclatura que hi ha. A la taula adjunta es mostra una descripció dels esdeveniments de Javascript més comuns:
J. Bobadilla; A. Alcocer; S. Alonso; A. Gutiérrez (1999). HTML Dinámico, ASP y Javascript a través de ejemplos. Madrid: Ra-Ma.
Descripció dels esdeveniments de Javascript més comuns
Esdeveniments de ratolí
onmousedown
En pressionar un botó del ratolí.
onmousemove
En moure el punter del ratolí.
onmouseup
En aixecar un botó del ratolí.
onclick
En fer clic (una pulsació completa –pujada i baixada– del botó esquerre del ratolí).
ondblclick
En fer doble clic.
onmouseover
En passar el ratolí per sobre d'un element o una zona.
onmouseout
En abandonar l'element o zona.
ondragstart
En iniciar una operació d'arrossegament.
onselect
En fer una selecció.
Esdeveniments de teclat
onkeydown
En pressionar (baixar) una tecla.
onkeypress
En prémer una tecla ANSI.
Esdeveniments d'"enfocament"
onblur
En abandonar l'àmbit d'un element.
onfocus
En entrar en l'àmbit d'un element.
Esdeveniments de formulari
onreset
En inicialitzar el formulari.
onsubmit
En enviar el formulari.
Esdeveniments de càrrega de pàgina
onload
En carregar la pàgina.
onunload
En descarregar la pàgina.
Finalment, s'ofereixen plantilles per a fer el graf exhaustiu d'un guió il·lustrat.
Plantilles de guió il·lustrat (graf exhaustiu)

5.4.El guió il·lustrat amb wireframes

Les webs i els productes interactius són com més va més dinàmics, canviants i amb elements que apareixen dia a dia en el mercat; això fa que sigui difícil plasmar el que volem aconseguir amb el nostre producte amb els guions il·lustrats tradicionals. Llavors, els dissenyadors de web usen noves tècniques a fi de plasmar les seves idees sobre els productes (com són l'ús de wireframes per a fer guions il·lustrats), sobretot en els que usin tecnologies que redundin en la interacció immediata amb els usuaris (rich Internet applications), en les aplicacions riques en AJAX o Flash.
Definició de wireframe

"Son una representación esquemática de una página web sin elementos gráficos que muestran contenido y comportamiento de las páginas. Sirven como herramienta de comunicación y discusión entre arquitectos de información, programadores, diseñadores y clientes. También se pueden utilizar en las pruebas de usuarios."

http://isopixel.net/archivo/2008/07/wireframes/

5.4.1.Narrativa de wireframes guiats
En l'escenari actual (en el qual s'estan plantejant aplicacions amb una alta interactivitat en temps real d'execució) és fàcil que es dispari el cost de l'elaboració del producte. I l'ideal és proporcionar un prototip del producte al client abans de fer l'aplicació, encara que això representaria un cost molt elevat.
Andrés Zapata, a The Guided Wireframe Narrative for Rich Internet Applications, proposa una solució: com que no es pot fer un prototip de l'aplicació per l'elevat cost, es plasma l'argument que no és lineal per mitjà dels wireframes guiats. La proposta de Zapata és la presentació de pantalles en les quals s'insereixen globus amb anotacions sobre el comportament de l'aplicació en funció de la interacció amb l'usuari.
Els elements que es reflecteixen en els wireframes guiats són els següents:
  • jerarquia,

  • estat de la pantalla,

  • convencions de disseny,

  • patrons d'interacció.

5.5.Annexos del guió

5.5.1.Els guions audiovisuals
Al final del guió s'inclouen una sèrie d'annexos en els quals es pot trobar:
  • els guions dels audiovisuals que s'han de crear,

  • els textos que apareixen escrits o que una veu emetrà,

  • els guions d'altres documents, com els textos que acompanyen els audiovisuals, vídeos, cinema, animacions o fotografies,

  • els guions il·lustrats dels audiovisuals, animacions, etc.