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