12
Grau en Multimèdia Curs 2011/12 – 2 n Semestre Narrativa interactiva Pràctica: "Centre de emergències mèdiques" Autor Jordi Zango Novell [email protected] Data de lliurament 23/05/2012

Centre de emergències mèdiques

Embed Size (px)

Citation preview

Page 1: Centre de emergències mèdiques

Grau en Multimèdia Curs 2011/12 – 2n Semestre

Narrativa interactivaPràctica: "Centre de emergències mèdiques"

Autor

Jordi Zango [email protected]

Data de lliurament

23/05/2012

Page 2: Centre de emergències mèdiques

Índex

1. Justificació.........................................................................................................3

2. Descripció del producte.................................................................................... 4

3. Disseny de la interactivitat................................................................................ 5

4. Disseny de la navegació...................................................................................7

5. Disseny lògic.....................................................................................................8

6. Fonts de consulta............................................................................................12

7. Llicència.......................................................................................................... 12

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 2

Page 3: Centre de emergències mèdiques

1. Justificació

1. JustificacióDesprés de considerar diferents opcions, com que l'enunciat demana que el producte es basi en alguna cosa que tingui a veure amb la PAC2, he agafat la idea principal que sostenia la història: un servei d'emergències mèdiques.

En aquest cas però, l'argument no té res a veure. El motiu d'aquest nou plantejament ha estat una reflexió personal provocada per algunes notícies que vaig poder escoltar fa uns dies respecte a la desconeixença de la majoria dels nensd'alguns aspectes que tenen a veure amb la salut, els primers auxilis i la prevenció d'accidents o situacions de risc. Hi ha una gran quantitat de productes multimèdia (pel·lícules, vídeos, anuncis, jocs,...) que semblen empènyer a la gent jove a prendre una actitud irresponsable davant d'algunes situacions en la vida, com si això fos el més divertit.

En la meva opinió, s'haurien d'aprofitar més les noves tecnologies i les eines que aquestes ens proporcionen per a generar productes lúdics que ajudin a formar als nens i nenes, entre d'altres moltes coses, en aspectes útils com els primers auxilis i la prevenció de riscos.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 3

Page 4: Centre de emergències mèdiques

2. Descripció del producte

2. Descripció del producteEl producte consisteix en una aplicació web educativa en forma de joc programat amb Flash, pensada per a nens i nenes de 1r d'ESO (aproximadament de 12 o 13 anys d'edat). L'objectiu és que aprenguin alguns conceptes bàsics de primers auxilis. Per a fer-ho, es simula un centre d'emergències on es reben trucades de casos concrets i l'usuari, com si fos la persona encarregada del centre, ha de solucionar uns tests que se li presentaran en cada cas amb una sèrie de preguntes verdader/fals que representen actuacions a fer per a poder solucionar la situació plantejada. Un cop finalitzat el test, es comprovaran les respostes i es donarà una puntuació en funció de l'encert que el nen o la nena hagi tingut.

Per ajudar a resoldre els tests, es disposarà d'un manual de primers auxilis i d'una sèrie de vídeos educatius on es mostraran alguns aspectes bàsics d'actuació en casd'emergència mèdica com poden ser la reanimació cardiopulmonar, la maniobra de Heimlich, com fer una immobilització en cas de fractura, etc.

A més, s'oferirà informació complementària en forma de petits manuals que tenena veure amb nocions bàsiques d'anatomia, les vacunes, hàbits alimentaris saludables, què ha de contenir una farmaciola o quin és l'equipament d'una ambulància medicalitzada.

L'estructura de la pàgina ha de ser senzilla per assegurar-nos que la seva complexitat és assumible per la majoria dels nens i nenes a qui està destinada1.

També s'ha de procurar oferir un alt grau d'interactivitat per a fomentar la participació dels usuaris2, i aquesta interactivitat ha d'oferir el màxim grau de llibertat3 possible.

Un aspecte a tenir també en compte és que l'aplicació resulti atractiva, afegint elements que cridin l'atenció de l'usuari i el convidin a participar4.

1 Segons Guillem Bou,tal i com explica als “Principis de la múltiple entrada” en la seva obra “El guion multimedia”, l'estructura de la informació ha de tenir la complexitat adequada per a que pugui ser assumida per l'usuari en funció de la seva capacitat cognitiva.

2 Una de les idees principals de la citada obra de Bou és que “sempre que pugui haver-hi interacció s'ha de poder interactuar”, i que aquesta no s'ha de limitar a una simple repetició gestual. L'autor també explica que el fet que la interacció estigui ben dissenyada és fonamental per a que aquesta aconsegueixiel seu principal objectiu: reforçar el missatge.

3 Seguint amb el que exposa Bou a la seva obra, és important que l'usuari tingui la sensació de que disposa de molta llibertat en la utilització del producte, encara que aquesta sensació no es corresponguidel tot amb la realitat ja que, per tal que la obra sigui consistent, en realitat l'usuari està fortament guiat i condicionat en les seves eleccions.

4 Això compliria un dels aspectes descrits per Guillem Bou quan parla del “Principi de vitalitat”, en què proposa la utilització de diferents elements que ajudin a crear la il·lusió que el producte té vida pròpia, fent que s'augmenti la immersió de l'usuari en l'ambient proposat.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 4

Page 5: Centre de emergències mèdiques

3. Disseny de la interactivitat

3. Disseny de la interactivitatLa interfície d'usuari representa un hipotètic lloc d'atenció de trucades en un centre d'emergències mèdiques (veure esbós). La idea és facilitar la immersió en la història i que el disseny estimuli la participació de l'usuari.

El nucli de la interfície és l'escriptori, des d'on es té accés a totes les opcions de l'aplicació.

El monitor, en el centre de la pantalla, és l'element principal. En ell, l'usuari pot accedir a la relació de casos que ja ha atès i veure el percentatge completat del testque correspon a cada cas, així com el nivell d'encert de les respostes donades. Fentclic als casos que hi apareixen, es pot accedir de nou a la trucada que origina el casi completar el test o canviar les respostes.

El telèfon sona quan es rep una trucada d'emergència i, a més, també s'hi encén una petita llum. Al clicar damunt, apareix una finestra amb una llista dels títols de tots els casos d'emergència disponibles. Cada cas té una petita marca que indica si ha estat activat o no (si ja s'ha vist). L'usuari pot clicar damunt de cada cas de la llista per a activar-lo. Quan s'activa el cas es pot veure el text corresponent a la trucada que, com si fos una trucada real, es pot escoltar al respondre al telèfon.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 5

Iŀlustració 1: Esbós dels elements principals de la interfície d'usuari, amb una proposta de la seva possible distribució en la pantalla.

Page 6: Centre de emergències mèdiques

3. Disseny de la interactivitat

Quan es respon a una trucada, l'estat del cas queda registrat com en procés i ja apareix en la llista de casos visibles al monitor. Les trucades poden ser activades per l'usuari i també es produeixen aleatòriament cada cert temps, per a estimular la interactivitat.

Des de la pantalla que descriu una emergència es pot accedir als vídeos i apartats dels manuals que estiguin relacionats amb l'emergència plantejada.

En la part superior de la pantalla es pot veure el marcador amb la puntuació acumulada per l'usuari en xifres grans, envoltat per un fonendoscopi.

Cada cert temps, també de forma aleatòria, es poden veure diferents clips de vídeo al petit televisor. En cas de clicar al televisor, s'obre una nova finestra en la que es pot veure el vídeo actiu (cas que n'hi hagi algun en el moment de clicar) i una llista dels vídeos disponibles, per a que puguin ser triats.

Hi han diferents ítems que donen accés a diferents manuals divulgatius:• El llibre de “Manual de primers auxilis”.• El cartell de l'ambulància que activa un manual que mostra l'equipament

d'una ambulància medicalitzada i la tasca que s'hi desenvolupa.• El cartell amb un esquelet humà que dóna accés a un petit manual

d'anatomia.• El llibre “Les vacunes” que explica les principals malalties que poden

provocar epidèmies i com es fa la seva prevenció.• El llibre “Una dieta saludable”, amb les característiques d'alguns aliments i

consells per a menjar de forma saludable.• La farmaciola, que mostra un llistat del que ha de contenir una farmaciola

domèstica ben equipada.

A la part inferior pot trobar-se un control que permet augmentar o disminuir el volum del so.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 6

Page 7: Centre de emergències mèdiques

4. Disseny de la navegació

4. Disseny de la navegacióS'ha procurat que la navegació sigui el més senzilla possible5.

5 Tal i com s'ha explicat anteriorment, s'ha de procurar que la complexitat del producte sigui adequada per a la majoria dels usuaris a qui està destinada l'aplicació (en aquests cas nens o nenes de 10 a 12 anys).

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 7

Page 8: Centre de emergències mèdiques

5. Disseny lògic

5. Disseny lògicPantalla d'inici: “La centraleta”

Es mostra una taula, a mode d'escriptori, amb una pantalla d'ordinador, un telèfon, un petit televisor i d'altres elements que conformen un hipotètic lloc de treball d'un operador o operadora en un centre d'emergències.

BMP: centraleta.pngSCO: punts acumulats per l'usuari .IDLE1: FLI-P: llum_telèfon.fli, WAV: timbre.mp3 (el telèfon sona i s'encén la llum).IDLE2: AVI-P: vídeo_XX.avi (es mostra un vídeo al televisor, de forma aleatòria).IDLE3: FLI-P: sirena.fli, WAV: sirena.mp3 (s'activa la sirena de l'ambulància en el cartell).IDLE4: FLI-P: boca.fli, WAV: clac-clac.mp3 (la boca de l'esquelet del cartell s'obre i tanca).

Zones sensibles:

1) RAT: Monitor de l'ordinadorROL: ETI: “Obrir cas d'emergència”CLIC: Monitor de l'ordinador->Pantalla 2 - “Emergència”[emergència_seleccionada] (C) (Hi ha emergència seleccionada).

2) RAT: TelèfonROL: ETI: “Activar cas d'emergència”, WAV: beep.mp3CLIC: Telèfon->Pantalla 3 - “Llista d'emergències”

3) RAT: Manual de primers auxilis.ROL: ETI: “Consultar manual de primers auxilis”CLIC: Manual de primers auxilis->Pantalla 4 - “Manuals”[nocions_bàsiques_primers_auxilis].

4) RAT: Control de volum.ROL: ETI: “Puja o baixa el volum”.CLIC: Controlar volum.

5) RAT: Televisor.ROL: AVI-P: neu_televisor.avi (En la pantalla del televisor es mostra i s'escolta la neu característica quan es sintonitza un televisor).CLIC: Televisor->Pantalla 5 - “Vídeos” [video_actiu].

6) RAT: Cartell ambulància.ROL: ETI: “Veure interior d'una ambulància”.CLIC: Cartell ambulància->Pantalla 4 - “Manuals“[interior_ambulància].

7) RAT: Cartell esquelet.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 8

Page 9: Centre de emergències mèdiques

5. Disseny lògic

ROL: ETI: “Veure manual d'anatomia”.CLIC: Cartell esquelet->Pantalla 4 - “Manuals”[anatomia].

8) RAT: Farmaciola.ROL: ETI: “Què ha de contenir una farmaciola”.CLIC: Farmaciola->Pantalla 4- “Manuals“[contingut_farmaciola].

9) RAT: Llibre “Una dieta saludable”.ROL: ETI: “Què i com hem de menjar”.CLIC: Llibre “Una dieta saludable”->Pantalla 4 - “Manuals“[dieta_saludable].

10) RAT: Llibre “Les vacunes”.ROL: ETI: “Què són les vacunes?”.CLIC: Llibre “Les vacunes”->Pantalla 4 - “Manuals“[vacunes].

Pantalla 2: “Emergència”

(Aquesta és una descripció genèrica de l'aspecte de la finestra utilitzada per a mostrar els casos d'emergència. Existeixen 10 casos d'emergència a resoldre.)En una finestra emergent, apareix el títol del cas de l'emergència, acompanyatd'una foto que ajuda a descriure la situació. Es mostra el text de la trucada, i també una sèrie de 10 preguntes tipus verdader/fals que l'usuari ha de completar i que li donaran una o altra puntuació en funció de l'encert de les respostes.BMP-P: (imatge descriptiva de l'emergència)TXT0: (reproducció del que diu la persona que truca al servei d'emergència).TXT1: (enunciat de la pregunta 1, a determinar per l'especialista en primers auxilis)...TXT10: (enunciat de la pregunta 10, a determinar per l'especialista en primers auxilis).

Zones sensibles:

1) RAT: Control verdader/fals (per a pregunta 1).CLIC: Canvia estat del control.

... ... (definició de zona sensible similar per a la resta dels controls, per a les preguntes 2 a 9)

10) RAT: Control verdader/fals (per a pregunta 10).CLIC: Canviar estat del control.

11) RAT: Llibre.ROL: ETI: “Consultar manual”.CLIC: Llibre->Pantalla 4 - “Manuals”(veure manual relacionat amb l'emergència).

12) RAT: Càmera de vídeo.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 9

Page 10: Centre de emergències mèdiques

5. Disseny lògic

ROL: ETI: “Veure vídeo”.CLIC: Càmera de vídeo->Pantalla 5 - “Vídeos”(veure vídeo relacionat amb l'emergència) (C) (hi ha vídeo relacionat).

13) RAT: Botó tancar.CLIC: EXE: Valorar respostes i actualitzar marcador de punts aconseguits i percentatge completat, Botó tancar->Pantalla d'inici “La centraleta”

Pantalla 3: “Llista d'emergències”

En una finestra semitransparent que emergeix, apareixen els títols de tots els casos de emergències, com si fos una mena d'índex. A cada títol l'acompanya una senyal que indica si ja ha estat activat.

TXT: “Casos d'emergència” (títol)

Zones sensibles:

1) RAT: TXT: “Ofegament piscina” ICN: emergència_activada.png (C) (ja ha estat activada)CLIC: TXT: “Ofegament piscina”->Pantalla “Emergències”[Ofegament].

... ... (títols d'emergències del 2 al 9)

10) RAT: TXT: “Accident de trànsit en moto”CLIC: TXT: “Accident de trànsit en moto”->Pantalla “Emergències”[Accident_moto].

11) RAT: Botó tancar.CLIC: Tanca finestra.

Pantalla 4: “Manuals”

En una finestra emergent, apareix el text global d'ajuda, encapçalat pels títols dels diferents apartats, com si fos una mena d'índex. Clicant damunt de cadascun dels títols, el text es desplaça a l'apartat corresponent. Els manuals contenen text i imatges.També es pot accedir als manuals indicant a quin apartat ha de desplaçar-se el focus quan s'obre la finestra.

TXT: “Manuals” (títol)

Zones sensibles:

1) RAT: TXT: “Nocions bàsiques de primers auxilis”CLIC: TXT: “Nocions bàsiques de primers auxilis”->Apartat “Nocions bàsiques de primers auxilis”.

... ... (títols de manuals del 2 al 5)

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 10

Page 11: Centre de emergències mèdiques

5. Disseny lògic

6) RAT: TXT: “Contingut d'una farmaciola”CLIC: TXT: “Contingut d'una farmaciola”->Apartat “Contingut d'una farmaciola“.

7) RAT: Botó índex.CLIC: Botó índex->Apartat “Índex”.

8) RAT: Botó tancar.CLIC: Tancar finestra.

Pantalla 5: “Vídeos”

Apareix una finestra emergent dividida bàsicament en dues parts. Una part més gran, de proporcions 4:3, destinada a mostrar els vídeos. A la dreta, en una divisió més estreta, es mostren tots els títols dels vídeos disponibles, per a poder seleccionar-los.

Si s'accedeix a sense especificar cap vídeo, no n'hi haurà cap d'actiu. Si s'ha accedit des del televisor quan aquest n'està reproduint un, llavors es veurà el vídeo que estava en reproducció.

TXT: “Vídeos” (títol).AVI-P: (vídeo seleccionat).

Zones sensibles:

1) RAT: (els controls de reproducció del vídeo).CLIC: (les funcions habituals).

2) RAT: TXT: “La recuperació cardiopulmonar”.CLIC: TXT: “La recuperació cardiopulmonar”->Vídeo “La recuperació cardiopulmonar”.

... ... (títols d'altres vídeos disponibles)

6) RAT: TXT: “La maniobra de Heimlich”.CLIC: TXT: “La maniobra de Heimlich”->Vídeo “La maniobra de Heimlich“.

7) RAT: Botó tancar.CLIC: Tanca finestra.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 11

Page 12: Centre de emergències mèdiques

6. Fonts de consulta

6. Fonts de consulta• Bou Bauzá, Guillem. El guion multimedia (1997). Ed.Anaya Multimedia.

7. LlicènciaAquest treball és obra de Jordi Zango Novell, amb llicència Creative Commons Atribució-NoComercial-CompartirIgual BY-NC-SA 3.0 Unported.

Narrativa interactiva - Pràcticaper Jordi Zango Novell ([email protected]) 12