Linguaggi & Tecnologie Multimediali:

TV interattiva e mobile TV

Azienda ospitante: Rai CRIT

INTEFACCIA UTENTE DI UN SERVIZIO DI

ACQUISTO DI PROGRAMMI TELEVISIVI

Con la relativa realizzazione della Xlet

Tesi di fine corso di Stefano Filippone

Tutor del corso dott. Giuseppe Tomeno

Tutor aziendale ing. Michele Visintin

Torino 28/06/2006

2

CAPITOLO 1

INTRODUZIONE

L’obbiettivo principale del progetto è la realizzazione di un’interfaccia utente, con la

successiva realizzazione di una xlet, per un servizio di acquisto di programmi televisivi

protetti ad accesso condizionato.

Per servizio ad accesso condizionato si intende uno dei seguenti servizi se forniti a

pagamento e mediante un sistema di accesso protetto: trasmissioni televisive, cioè le

trasmissioni via cavo o via radio anche via satellite di programmi televisivi destinati al

pubblico; trasmissioni sonore, cioè le trasmissioni via cavo o via radio, anche via satellite,

di programmi sonori destinati al pubblico; servizi della società dell'informazione, ovvero

qualsiasi servizio fornito a distanza per via elettronica ed a richiesta individuale di un

destinatario di servizi.

Conseguentemente è un dispositivo per l'accesso condizionato, l’apparecchiatura o il

programma per elaboratori elettronici concepiti o adattati al fine di consentire l'accesso in

forma intelligibile ad un servizio protetto. Il progetto non prevede, nella realizzazione della xlet, l’implementazione di un

interfaccia di comunicazione con la smart card del decoder. Sono state dunque realiz-

zate delle classi che simulano la comunicazione con la smart card.

Delle difficoltà sono emerse fase di collaudo dell’applicazione. Durante il collaudo si

sono manifestati alcuni problemi di incompatibilità tra i diversi set-top-box, che hanno

portato più volte alla modifica del piano di lavoro. Infatti molte funzioni e metodi

scritti in MHP possono avere comportamenti diversi su differenti set-top-box. Di

conseguenza bisogna stare molto attenti a ciò che si scrive e fare molti test su diversi

dispositivi. Per diventare buoni programmatori MHP occorre molto tempo e studio,

per affinare la scelta dei metodi e funzioni da utilizzare, per ottenere il massimo

risultato.

3

CAPITOLO 2

PRESENTAZIONE AZIENDA

2.1 CRIT

Il Centro Ricerche e Innovazione Tecnologica (CRIT) nasce a Torino nel 1930

come "Laboratorio Ricerche" e dal 1960 ha sede in Corso Giambone 68.

Successivamente assume la denominazione "Centro Ricerche" e, dall'ottobre 1999,

quella attuale. L'attività del Centro è coordinata dalla Direzione Strategie Tecnologiche.

Alla nascita, tra i suoi obiettivi ha la progettazione e realizzazione di impianti ed

apparati di nuova concezione, non reperibili sul mercato. I profondi cambiamenti nello

scenario delle telecomunicazioni hanno stimolato la trasformazione del Centro. Nel

recente passato ha ricevuto riconoscimenti a livello internazionale per i contribuiti

forniti alle attività di studio e normalizzazione dei sistemi per la codifica dei segnali

audio e video in forma digitale, allo sviluppo delle tecniche di compressione dei segnali

attualmente alla base dei sistemi di trasmissione e registrazione dei segnali video, alla

definizione degli standard di diffusione e trasmissione DVB.

Attualmente il Centro contribuisce all'evoluzione delle tecnologie relative al sistema

radiotelevisivo e multimediale e supporta il Gruppo nelle scelte di indirizzo tecnologico

e nella fase di sperimentazione e introduzione in esercizio di nuovi prodotti e sistemi.

E' attivo in numerosi progetti finanziati in ambito europeo e nazionale e collabora con

Università e Industrie per l'attività di ricerca, per la definizione dei nuovi standard e lo

sviluppo dei nuovi servizi.

Il mio progetto è stato sviluppato nel reparto di TV Interattiva, nato a metà degli anni

novanta. Nell’anno 2000, con la produzione dei primi Set-Top-Box che implemen-

tavano MHP, sono iniziate le sperimentazioni, sia per quanto riguarda il sistema di

4

trasmissione dei dati, sia per quanto riguarda la realizzazione di applicazioni, EPG,

launcher etc.

CAPITOLO 3

INTERFACCIA UTENTE

3.1 Introduzione interfaccia utente

Per aiutare la comprensione di quanto segue occorre dare la definizione di interfaccia

utente e usabilità.

Con interfaccia utente si intende ciò che si frappone tra la macchina e l'utente, ciò

che fa dialogare l'uomo con la macchina.

L'interfaccia utente non è necessariamente legata ad un sistema informatico (ad un

Pc), ma è qualsiasi cosa che permette ad un utente di poter gestire (più o meno) sempli-

cemente le funzionalità di un sistema.

L'interfaccia è un linguaggio operazionale, un insieme strutturato e logicamente

composto da metafore per interagire con un sistema.

1. L'interfaccia presenta i dati

2. L'utente ne prende coscienza tramite visualizzazione grafica

3. Immette dati tramite dispositivi di input

4. L'interfaccia calcola l'algoritmo relativo all'operazione

5. Restituisce un output che è l'esito del percorso cognitivo fatto dall'utente.

L'interfaccia utente spesso non si preoccupa di conoscere tutte le parti del sistema al

quale comunica i dati inseriti dall'utente (tramite bottoni ad esempio), ma si preoccupa

di comunicare con un determinato ente (o un componente) che poi si prenderà carico

di effettuare l'operazione richiesta.

5

Mentre il termine usabilità è definito dall’ISO come l'efficacia, l'efficienza e la sod-

disfazione con le quali determinati utenti raggiungono gli obiettivi prefissati in deter-

minati contesti.

Il termine non si riferisce ad una caratteristica intrinseca dello strumento, quanto al

processo di interazione tra utente, prodotto e finalità.

Il problema dell'usabilità si pone quando il modello del progettista (ovvero le idee di

questi riguardo al funzionamento del prodotto, che trasferisce al design del prodotto

stesso) non coincide con il modello dell'utente finale (ovvero l'idea che l'utente conce-

pisce del prodotto e del suo funzionamento).

Il grado di usabilità si innalza proporzionalmente all'avvicinamento dei due modelli

(modello del progettista, e modello dell'utente).

3.2 Interfaccia utente dell’applicazione RaiView

L’interfaccia utente è così pensata da poter essere suddivisa in diversi livelli :

- layer con un background

- layer con i testi

- layer con elementi grafici

Il layer di background, corrisponde ad un’immagine codificata in formato PNG di

dimensioni 611 x 178, tanto da non occupare l’intero schermo, ed è disposta in overlay

sul video, nella regione inferiore dello schermo. Questo espediente permette all’utente

da casa di acquistare altri eventi, pur continuando a vedere ciò che è in onda.

L’immagine comprende poche variazioni di colore ed alcune zone con una trasparenza

al 70%. Nell’immagine (figura 3.2.1) si possono individuare quattro aree dove posizio-

nare le diverse informazioni contenute nel layer dei testi e le diverse immagini del layer

grafico.

In fase di analisi sono state individuate tutte le informazioni necessarie da visualiz-

zare, tenendo anche conto dello spazio disponibile. Le informazioni ritenute necessarie

sono: nome del programma televisivo, data e ora di messa in onda, canale di messa

6

onda, costo, credito residuo del cliente, stato della navigazione, stato del programma

televisivo (acquistato, non acquistato, già acquistato). Inoltre sono essenziali i testi che

descrivono la funzione dei comandi generati dal telecomando (ok, exit, ecc).

Figura 3.2.1 background applicazione.

Come mostra la figura 3.2.1, il nome e il logo dell’applicazione sono posti in alto a

sinistra; sulla prima riga sono presenti il nome del programma e le informazioni relative

allo stato della navigazione, all’interno dell’applicazione.

Sulla seconda riga ci sono la data, l’ora e il canale di messa in onda; mentre sulla terza

compaiono il credito residuo del cliente e il costo del programma selezionato. Infine

nell’ultima riga appaiono le informazioni che chiariscono alcuni comandi eseguibili tra-

mite il telecomando.

Una volta individuate tutte le informazioni da visualizzare e dove disporle, è stato

analizzato e determinato l’iter che deve compiere l’utente per effettuare l’acquisto del

programma televisivo.

7

I passaggi che deve compiere l’utente per procedere con l’acquisto, devono essere

minimi, semplici e molto chiari. Tutto ciò perché l’applicazione è diretta ad un ampia

fascia d’utenza, bisogna tenere conto che l’acquisto del programma può essere effet-

tuato sia da un ragazzo che da un anziano. Di conseguenza sono stati determinati tre

stadi: selezione, acquisto e conferma o segnalazioni di errori durante la fase di acquisto.

Una volta individuati gli stadi sono state definite tutte le schermate che si avranno a

video. In totale sono state realizzate cinque schermate:

- schermata di selezione del programma;

- schermata di acquisto del programma;

- nel caso il programma sia stato già acquistato, una schermata che avvisi l’utente

dell’acquisto già fatto;

- nel caso il credito sia insufficiente per effettuare l’acquisto, una schermata che

segnali il mancato acquisto;

- una schermata di conferma dell’acquisto.

Di seguito sono riportate tutte le schermate dell’applicazione.

8

Figura 3.2.2 schermata seleziona.

La figura 3.2.2 mostra la schermata di selezione, grazie alla quale è possibile

selezionare il programma da acquistare. Si può navigare in questa schermata attraverso

le frecce “RIGHT” e “LEFT” del telecomando, le quali permettono di scorrere tutti i

programmi disponibili, presenti nel palinsesto televisivo. La freccia “UP” consente di

visualizzare i dettagli di ogni singolo programma, i quali vengono resi visibili al centro

dello schermo (figura 3.2.3). Le informazioni di maggior rilievo disponibili in questa

schermata sono: titolo del programma, data, ora e canale di messa in onda, costo del

programma, credito residuo del cliente.

9

Figura 3.2.3 schermata seleziona con dettagli del programma visibili.

Premendo “OK” si passa alla schermata d’acquisto (figura 3.2.4). Qui c’è un riepilogo

delle informazioni del programma precedentemente selezionato, e non è più possibile

navigare attraverso il palinsesto dei programmi. Le uniche azioni possibili sono

acquistare il programma selezionato, premendo di nuovo “OK” sul telecomando,

oppure tornare indietro, alla schermata di selezione attraverso il tasto “BACK”.

10

Figura 3.2.4 schermata d’acquisto.

Se l’acquisto è andato a buon fine si ha una schermata di conferma dell’acquisto

(figura 3.2.5); altrimenti ci sono schermate che segnalano il mancato acquisto ed il

motivo (credito insufficiente oppure il programma è già stato acquistato), come si può

vedere nelle figure 3.2.6 e 3.2.7.

11

Figura 3.2.5 schermata di conferma dell’acquisto.

12

Figura 3.2.6 schermata che avvisa l’utente che il suo credito è insufficiente per l’acquisto.

Figura 3.2.7 schermata che avvisa l’utente che ha già acquistato il programma selezionato.

13

Per comprendere meglio la navigazione all’interno dell’applicazione, la figura 3.2.8

mostra l’albero di navigazione.

Figura 3.2.8 albero di navigazione.

14

3.3 Interfaccia utente dell’applicazione La tua Smart Card

La tua Smart Card è un’applicazione molto semplice, che fornisce un aiuto all’utente a

casa. Essa infatti permette di controllare tutti i programmi acquistati ed il credito

residuo. Inoltre dà delle informazioni su come effettuare la ricarica del credito della

smart card e come fare per accedere alle offerte speciali.

Al lancio dell’applicazione, che avviene con la pressione del tasto blu del

telecomando, si ha un resize del video, il quale viene spostato in alto a destra .

Figura 3.3.1 La tua Smart Card

Sotto il video è presente il menù principale composto da quattro voci: programmi

acquistati, come ricaricare, credito residuo e offerte speciali.

15

Nella zona sinistra dello schermo c’è un’area dedicata al testo, il cui contenuto cambia

a seconda della voce selezionata (figura 3.3.1). Nella parte inferiore del video sono

presenti tutti i comandi che possono essere generati dal telecomando.

16

CAPITOLO 4

SVILUPPO DELLA XLET

4.1 Introduzione MHP

L’intera applicazione è stata realizzata secondo la specifica MHP.

L' MHP (Multimedia Home Platform) è uno standard della famiglia DVB che definisce

l’interfaccia (middleware) tra le applicazioni interattive digitali e gli apparati dove queste

sono attivate (Set-Top-Box o STB). Le specifiche di questo Linguaggio sono state definite

appunto dal Digital Video Broadcast Project un consorzio formato da più di 300 operatori

del settore, costruttori, sviluppatori di software di circa 35 paesi diversi. La conformità del

progetto è sotto la responsabilità dell'European Telecommunications Standards Institute.

L'MHP fin dal principio viene sviluppato in due modi differenti: DVB-HTML, poco

fortunato perché molto complesso, e DVB-J.

DVB-J che rappresenta lo standard più diffuso si basa su un subset di linguaggio di

programmazione Java. Esso costituisce un software intermedio e aperto per la messa a

punto di molti tipi di applicazioni e servizi anche con modalità interattive.

Figura 4.1.1 architettura mhp.

17

L'architettura è definita in 3 layers:

1)Resources: MPEG processing, I/O devices, CPU, memoria e sistema grafico.

2)System Software: JVM, APIs, transport protocols e l'application manager, chiamato

anche navigatore, che permette di gestire il running delle applicazioni Java.

3)Applications: sono le applicazioni interattive: TV commerce, TV banking, Electronic

Program Guide, servizi informativi (meteo, traffico, news, etc...), giochi, sport, e via

dicendo.

Lo standard prevede anche 3 profili:

1)Enhanced Broadcast Profile: questo profilo permette l'arricchimento del contenuto

audio/video con informazioni e immagini visualizzabili e che creano un'ambiente di

navigazione sullo schermo della televisione. Questo profilo è definito dalle specifiche MHP

1.0.

2)Interactive TV Profile: è il profilo intermedio che permette di utilizzare il canale di

ritorno (PSTN, ADSL, GPRS, ethernet, etc) fornendo servizi con interattività avanzata.

Anche questo profilo è definito dalle specifiche MHP 1.0.

3)Internet Access Profile: necessita di Set-Top-Box molto più sofisticati rispetto a quelli

richiesti per i primi 2 liveli. Questo profilo permette tramite il canale di ritorno di accedere

ai contenuti di Internet sfruttando una particolare versione dell'HTML chiamata DVB-

HTML. Questo profilo è definito dalle specifiche MHP 1.1.

18

4.2 Introduzione Xlet

Il progetto non prevede la realizzazione di un interfaccia che permetta di leggere dati

dalle smart card, pertanto è stata creata una classe che simula la lettura di una smart

card, che in realtà legge i dati da un file xml.

Per la realizzazione di tutta l’applicazione è stato utilizzato l’ambiente di sviluppo

Eclipse 3.1. Per comodità di test, “RaiView” e “La tua Smart Card”, sono state svilup-

pate all’interno della stessa xlet. L’intero progetto e suddiviso in tre package: beans,

it.rai.crit, laTuaSmartCard. Il package it.rai.crit contiene l’applicazione RaiView, mentre

il package laTuaSmartCard, da cm si può intuire dal titolo contiene il tool La tua Smart

Card.

4.3 RaiView

Il package rai.it.crit dentro il quale è contenuta l’applicazione RaiView, è composto da

dodici classi. Tre di queste classi, BackgraundManager, VideoManager, e

ImageManager, sono classi standard che si occupano di gestire i tre livelli dell’ MHP

(livello di background, livello video, livello grafico). Due classi, XMLElement e

XMLParseException , sono classi dell’xml parser NANOXML PARSER, utilizzato per

leggere i programmi del palinsesto da un file xml.

La classe Xlet è la classe principale che fa partire l’applicazione. Mentre il “corpo”

vero e proprio dell’applicazione è composto dalle classi: DrawnBG, Palinsesto e

StaticCont. Queste classi, estendono tutti la classe HContainer e implementano le

interfacce FocusListener, UserEventListener, ResourceClient.

Tutto quello che comprende il “corpo” dell’applicazione è stato distribuito in tre

container, e ad ognuno di loro sono associati diversi eventi.

La classe DrawnBG, si preoccupa di disegnare a video lo sfondo dell’applicazione.

Per lo sfondo è stata realizzata un’immagine in formato PNG, utilizzando i colori della

palette mhp. Lo sfondo non è un’immagine particolarmente complessa, quindi

potrebbe essere disegnata anche utilizzando le primitive java AWT, ma in fase di

19

testing, si è optato per l’immagine codificata in PNG, perché il comportamento delle

primitive AWT non è identico su tutti i modelli di Set-Top-Box.

Palinsesto ha il compito di visualizzare le informazioni relative ad un programma e

permettere la navigazione all’interno del palinsesto televisivo.

Palinsesto riceve un Vector di Programmi, ogni elemento del Vector contiene tutte le

informazioni relative ad un determinato programma. Ad ogni pressione dei tasti

“RIGHT” e “LEFT” del telecomando, viene estratto l’elemento successivo o

precedente dal Vector e aggiornata la schermata secondo i nuovi dati. In questa classe

viene gestita anche la visualizzazione dei dettagli. Essi infatti vengono formattati

attraverso la classe FormattaString, la quale restituisce una stringa formattata da

assegnare ad un HStaticText. I dettagli sono posizionati al centro dello schermo e la

loro visibilità è impostata a “false”. Alla pressione del tasto “UP” vengono resi visibili.

Una volta premuto il tasto “OK” vengono disabilitati i tasti “RIGHT” e “LEFT”, e

quindi non è più possibile cambiare programma, per poterlo fare bisogna premere il

tasto ”BACK”.

StaticCont contiene e gestisce tutti i testi e dati che non fanno riferimento al

palinsesto. Il suo compito è anche quello di generare le diverse schermate: seleziona,

acquista e conferma. Le informazioni contenute in StaticCont, che fanno riferimento a

dati contenuti nella smart card, vengono gestite da una classe, CardState, la quale

attraverso dei controlli, permette l’acquisto o meno del programma selezionato.

La classe ReadXml legge l’xml del palinsesto e restituisce un vettore di Programmi.

Programma è una classe del package beans; essa è formata da soli metodi set e get, i

quali servono per settare o stampare le informazioni dei singoli programmi.

Infine, la classe principale Xlet, è composta da tre container, DrawnBG, Palinsesto e

StaticCont. Inoltre è presente l’oggetto ReadXml, che attraverso il metodo

readPalinsesto(String filexml) restituisce il Vector con tutto il palinsesto, da passare alla

classe Palinsesto.

20

Figura 4.4.1 UML Applicazione

21

4.4 La Tua Smart Card

Il package laTuaSmartCard è composto da quattro classi: Home, GeneralC,

ProgrammaA, ProgrammiAcquistati. Si accede al tool semplicemente premendo il tasto

blu del telecomando. Alla pressione del tasto avviene un resize del video, e posto

nell’area in alto a sinistra dello schermo. Viene anche impostato l’I-FRAME,

contenente lo sfondo dell’applicazione (figura 4.5.1).

Figura 4.5.1

Home è il container principale, all’interno del quale è presente il menu di selezione. Il

contenuto della prima voce del menù (Programmi acquistati), è gestito dal container

ProgrammiAcquistati che a sua volta e composto da tanti ProgrammaA, quanti sono i

22

programmi acquistati. Anche qui la lettura dei dati dovrebbe essere effettuata da smart

card, ma come spiegato prima, viene emulata attraverso la lettura da un file xml.

Gli altri contenuti delle altre voci del menu (Credito residuo, Come ricaricare, Offerte

speciali), sono gestiti da un unico container, GeneralC, al quale viene ogni volta passata

una stringa diversa, impostata la dimensione del font e stampato a video.

23

CAPITOLO 5

CONCLUSIONI

La parte più impegnativa di tutto il progetto è stata la definizione di un interfaccia

utente chiara e semplice. E’ stato fatto di tutto per evitare eventuali incomprensioni e

rendere il più facile possibile il processo di acquisto dei programmi televisivi, tenendo

conto di tutte le fasce d’età.

Per quanto riguarda la realizzazione della xlet, gli unici problemi emersi, sono legati al

diverso funzionamento dei set-top-box. Infatti durante il progetto sono emerse alcune

diversità di comportamento tra decoder realizzati da differenti costruttori. Di

conseguenza, per qualsiasi applicazione che si sviluppa occorre fare molti test su

decoder diversi. Questo perché una stessa istruzione presente in un’applicazione, può

dare diversi risultati su diversi dispositivi. Per concludere si può dire che per

programmare in MHP occorre una buona dose di esperienza, per poter scegliere in

modo appropriato le istruzioni da utilizzare, affinché producano lo stesso risultato su

diversi decoder interattivi.

INDICE

24

1 Introduzione 2

2 Presentazione azienda 3

2.1 CRIT…………………………………………………………. 3

3 Interfaccia utente 4

3.1 Introduzione interfaccia utente……………………………….. 4

3.2 Interfaccia utente dell’applicazione RaiView…………………... 5

3.3 Interfaccia utente dell’applicazione La Tua Smart Card………... 13

4 Sviluppo della Xlet 15

4.1 Introduzione MHP……………………………………………. 15

4.2 Introduzione Xlet……………………………………………… 17

4.3 RaiView………………………………………………………... 17

4.4 La Tua Smart Card……………………………………………... 20

5 Conclusione 22