O documento fornece uma introdução sobre o desenvolvimento de aplicações para TV digital interativa, abordando tópicos como: as tecnologias envolvidas na DTVi, como montar o ambiente de desenvolvimento, e exemplos de aplicações simples usando NCL puro.
2. Sobre o instrutor
● Tecnólogo em Sistemas para Internet.
● Pós-graduando MBA em Gestão de Projetos.
● Trabalho com T.I. desde 1998.
● Palestrante em diversos eventos regionais.
● Ex-estagiário no TRE-MS e Dataprev-MS.
● 2 anos na Sefaz/MS como Analista/Programador.
● Analista de Sistemas Pleno na InnfoMaster.
3. Tópicos Abordados
● Nivelamento sobre DTVi.
● Entender as tecnologias envolvidas.
● Conhecer os desafios do mercado.
● Montar o ambiente de desenvolvimento e teste.
● Criar e testar algumas aplicações de exemplo.
9. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
10. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
–Baixa qualidade de imagem.
11. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
–Baixa qualidade de imagem.
Chata,
12. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
–Baixa qualidade de imagem.
Chata, Sem novidades,
13. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
–Baixa qualidade de imagem.
Chata, Sem novidades, Repetitiva,
14. Nivelamento sobre DTVi
● TV Analógica
–Telespectador passivo.
–Mono-canal.
–Baixa qualidade de som.
–Baixa qualidade de imagem.
Chata, Sem novidades, Repetitiva, Muitas vezes apelativa.
18. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
19. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
–Imagem de alta definição.
20. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
–Imagem de alta definição.
Diversidade de dispositivos,
21. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
–Imagem de alta definição.
Diversidade de dispositivos, Visualizar informações sobre os
canais e programas,
22. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
–Imagem de alta definição.
Diversidade de dispositivos, Visualizar informações sobre os
canais e programas, Equipamento caro,
23. Nivelamento sobre DTVi
● TV Digital
–Telespectador passivo.
–Múltiplos canais.
–Qualidade de som de CD.
–Imagem de alta definição.
Diversidade de dispositivos, Visualizar informações sobre os
canais e programas, Equipamento caro, Poucas emissoras.
45. Entendendo as tecnologias envolvidas
● Interatividade.
“Trata da possibilidade do telespectador receber
uma mensagem e tratá-la da forma que desejar.”
49. Entendendo as tecnologias envolvidas
● Possibilidades.
–Votação eletrônica.
–Serviços bancários.
–Serviços de saúde.
50. Entendendo as tecnologias envolvidas
● Possibilidades.
–Votação eletrônica.
–Serviços bancários.
–Serviços de saúde.
–Serviços de educação a distância.
51. Entendendo as tecnologias envolvidas
● Possibilidades.
–Votação eletrônica.
–Serviços bancários.
–Serviços de saúde.
–Serviços de educação a distância.
–Compras.
53. Entendendo as tecnologias envolvidas
● Graus de Interatividade.
–Nível 1
“A interatividade é apenas com o aparelho de TV,
limitando-se a fazer escolhas. O usuário não interfere na
programação.”
54. Entendendo as tecnologias envolvidas
● Graus de Interatividade.
–Nível 2
“O usuário interage com a programação, que pode ser
alterada com o simples uso do controle remoto. Neste
nível seria possível escolher, por exemplo, o final de uma
novela.”
56. Entendendo as tecnologias envolvidas
● O Middleware.
“Camada de software capaz de prover o suporte
necessário para o desenvolvimento de aplicações para
TV Digital e também tornar uma aplicação de TV capaz
de ser executada em qualquer plataforma, independente
de Hardware e Sistema Operacional.”
58. Entendendo as tecnologias envolvidas
● Requisitos para um Middleware completo.
–Sincronismo de mídias.
59. Entendendo as tecnologias envolvidas
● Requisitos para um Middleware completo.
–Sincronismo de mídias.
–Definição de relacionamentos de sincronismo espacial e
temporal separada da definição do conteúdo dos objetos
de mídia relacionais.
60. Entendendo as tecnologias envolvidas
● Requisitos para um Middleware completo.
–Sincronismo de mídias.
–Definição de relacionamentos de sincronismo espacial e
temporal separada da definição do conteúdo dos objetos
de mídia relacionais.
–Adaptação de conteúdo e da forma que o conteúdo é
exibido.
61. Entendendo as tecnologias envolvidas
● Requisitos para um Middleware completo.
–Sincronismo de mídias.
–Definição de relacionamentos de sincronismo espacial e
temporal separada da definição do conteúdo dos objetos
de mídia relacionais.
–Adaptação de conteúdo e da forma que o conteúdo é
exibido.
–Múltiplos dispositivos de exibição.
62. Entendendo as tecnologias envolvidas
● Requisitos para um Middleware completo.
–Sincronismo de mídias.
–Definição de relacionamentos de sincronismo espacial e
temporal separada da definição do conteúdo dos objetos
de mídia relacionais.
–Adaptação de conteúdo e da forma que o conteúdo é
exibido.
–Múltiplos dispositivos de exibição.
–Permitir edição ao vivo.
67. Conhecendo os desafios do mercado
● Cenário atual da Interatividade no Brasil.
–Conservadora.
68. Conhecendo os desafios do mercado
● Cenário atual da Interatividade no Brasil.
–Conservadora.
–Tecnologia recente.
69. Conhecendo os desafios do mercado
● Cenário atual da Interatividade no Brasil.
–Conservadora.
–Tecnologia recente.
–Sem um modelo de negócios definido.
70. Conhecendo os desafios do mercado
● Cenário atual da Interatividade no Brasil.
–Conservadora.
–Tecnologia recente.
–Sem um modelo de negócios definido.
–Sem uma maturidade ideal.
74. Montando o ambiente de desenvolvimento e teste
1. Ginga-NCL Player.
2. Eclipse + jdk + JavaTV + XletView.
75. Montando o ambiente de desenvolvimento e teste
1. Ginga-NCL Player.
2. Eclipse + jdk + JavaTV + XletView.
3. Vmware Player.
76. Montando o ambiente de desenvolvimento e teste
1. Ginga-NCL Player.
2. Eclipse + jdk + JavaTV + XletView.
3. Vmware Player.
4. Imagem do S.O. do Set Top Box Ginga.
77. Montando o ambiente de desenvolvimento e teste
1. Ginga-NCL Player.
2. Eclipse + jdk + JavaTV + XletView.
3. Vmware Player.
4. Imagem do S.O. do Set Top Box Ginga.
5. WinSCP + Putty
80. Criando e testando algumas aplicações de exemplo
2 - Crie um novo projeto do tipo ‘General/Project’ e dê o
nome de NCL-Pura.
81. Criando e testando algumas aplicações de exemplo
3 - Clique com o botão direito no projeto e crie um novo
diretório chamado ‘media’.
82. Criando e testando algumas aplicações de exemplo
4 - Clique com o botão direito no diretório ‘media’ e
selecione a opção ‘import->File System’ e selecione o
arquivo ‘video.mp4’.
83. Criando e testando algumas aplicações de exemplo
5 - Clique com o botão direito no projeto e crie um novo
arquivo do tipo ‘NCL Document’ e digite ‘main’ para o
id do arquivo.
84. Criando e testando algumas aplicações de exemplo
6 - Dentro do cabeçalho ‘<head>’, defina uma
regionBase.
<regionBase>
<region id=“rgFundo” width=“100%” height=“100%”/>
</regionBase>
85. Criando e testando algumas aplicações de exemplo
7 - Logo abaico da ‘<regionBase>’, defina um
descriptorBase.
<descriptorBase>
<descriptor id=“descVideo” region=“rgFundo”/>
</descriptorBase>
86. Criando e testando algumas aplicações de exemplo
8 - Dentro do corpo do programa ‘<body>’, indique a
mídia que aparecerá na tela.
<media id=“video” src=“media/video.mp4” descriptor=“descVideo”/>
87. Criando e testando algumas aplicações de exemplo
9 - Logo abaixo de ‘<media>’, crie um ‘<port>’
indicando a mídia iniciará no programa.
<port id=“pEntrada” component=“video” />
88. Criando e testando algumas aplicações de exemplo
Abra o Ginga-NCL Player e teste o programa.
90. Criando e testando algumas aplicações de exemplo
1 - Abra o Eclipse e crie um novo projeto Java com o nome
de ‘Ginga-J’.
91. Criando e testando algumas aplicações de exemplo
2 - Clique com o botão direito no projeto e selecione
‘Propriedades’.
92. Criando e testando algumas aplicações de exemplo
3 - Clique em ‘Java Build Path’ e na aba ‘library’ clique no
botão ‘Add External Jars’.
93. Criando e testando algumas aplicações de exemplo
4 - Adicione o jar do Xletview.
94. Criando e testando algumas aplicações de exemplo
5 - Adicione o jar do JavaTV.
95. Criando e testando algumas aplicações de exemplo
6 - Clique no botão ‘Add External Class Folder’ e adicione o
diretório ‘lib’ do JavaTV.
96. Criando e testando algumas aplicações de exemplo
7 - Clique no botão ‘Ok’.
97. Criando e testando algumas aplicações de exemplo
8 - Clique com o botão direito no projeto e crie um novo
pacote com o nome ‘br.com.flisolcg’.
98. Criando e testando algumas aplicações de exemplo
9 - No pacote criado clique com o botão direito e crie uma
nova classe com o nome ‘FlisolCGXlet’.
99. Criando e testando algumas aplicações de exemplo
10 - Implemente a classe Xlet na nossa classe criada.
public class FlisolCGXlet implements Xlet {
}
100. Criando e testando algumas aplicações de exemplo
11 - Clique no ‘problema’ para tratar a dependência.
import javax.tv.xlet
101. Criando e testando algumas aplicações de exemplo
12 - Clique no ‘problema’ para implementar os métodos do
Xlet.
destroyXlet()
initXlet()
pauseXlet()
startXlet()
102. Criando e testando algumas aplicações de exemplo
13 - Dentro da classe, declarar os objetos que serão
utilizados.
private XletContext contexto;
private HStaticText labelAcima;
private HStaticText labelMeio;
private HStaticText labelAbaixo;
private HScene scene;
103. Criando e testando algumas aplicações de exemplo
14 - Clique no ‘problema’ para tratar as dependências.
import org.havi.ui.HScene;
import org.havi.ui.HStaticText;
104. Criando e testando algumas aplicações de exemplo
15 - Crie o método construtor da classe.
public FlisolCGXlet() {
//vazio
}
105. Criando e testando algumas aplicações de exemplo
16 - Configure o método destroyXlet.
public void destroyXlet(boolean arg0) throws XletStateChangeException {
this.contexto.notifyDestroyed();
}
106. Criando e testando algumas aplicações de exemplo
17 - Adicione o objeto ‘contexto’ no método initXlet.
public void initXlet(XletContext contexto) throws XletStateChangeException {
}
107. Criando e testando algumas aplicações de exemplo
18 - Ainda dentro do método initXlet adicione:
public void initXlet(XletContext contexto) throws XletStateChangeException {
this.contexto = contexto;
}
108. Criando e testando algumas aplicações de exemplo
19 - Ainda dentro do método initXlet adicione:
public void initXlet(XletContext contexto) throws XletStateChangeException {
this.contexto = contexto;
this.scene = HSceneFactory.getInstance()
.getFullScreenScene(HScreen.getDefaultHScreen()
.getDefaultHGraphicsDevice());
}
109. Criando e testando algumas aplicações de exemplo
20 - Clique no ‘problema’ para tratar as dependências.
import org.havi.ui.HScreen;
import org.havi.ui.HSceneFactory;
110. Criando e testando algumas aplicações de exemplo
21 - Ainda dentro do método ‘initXlet’ adicione:
this.labelAcima = new HStaticText(“FlisolCG 2011");
this.labelAcima.setFont(new Font("Arial", Font.BOLD, 90));
this.labelAcima.setBounds(10, 10, 700, 200);
this.labelAcima.setForeground(Color.white);
this.labelAcima.setBackground(new Color(0,100,0));
111. Criando e testando algumas aplicações de exemplo
22 - Clique no ‘problema’ para tratar as dependências.
import java.awt.Color;
import java.awt.Font;
112. Criando e testando algumas aplicações de exemplo
23 - Ainda dentro do método ‘initXlet’ adicione:
this.labelMeio = new HStaticText("TV Digital se faz com Ginga!");
this.labelMeio.setFont(new Font("Arial", Font.BOLD, 40));
this.labelMeio.setBounds(10, 200, 700, 200);
this.labelMeio.setForeground(new Color(0,0,139));
this.labelMeio.setBackground(Color.white);
113. Criando e testando algumas aplicações de exemplo
24 - Ainda dentro do método ‘initXlet’ adicione:
this.labelAbaixo = new HStaticText("www.gingams.com.br");
this.labelAbaixo.setFont(new Font("Arial", Font.BOLD, 60));
this.labelAbaixo.setBounds(10, 370, 700, 200);
this.labelAbaixo.setForeground(Color.yellow);
this.labelAbaixo.setBackground(new Color(50,153,204));
114. Criando e testando algumas aplicações de exemplo
25 - Ainda dentro do método ‘initXlet’ adicione:
this.scene.add(this.labelAcima);
this.scene.add(this.labelMeio);
this.scene.add(this.labelAbaixo);
115. Criando e testando algumas aplicações de exemplo
26 - No método ‘startXlet’ adicione:
public startXlet() throws XletStateChangeException {
this.scene.setVisible(true);
}
116. Criando e testando algumas aplicações de exemplo
27 - Clique no menu ‘Project->Clean’ para compilar nossa
aplicação.
117. Criando e testando algumas aplicações de exemplo
28 - Abra o prompt de comando e inicie o XletView.
java -jar xletview.jar
118. Criando e testando algumas aplicações de exemplo
29 - Clique no menu ‘Applications->Manage Applications’.
119. Criando e testando algumas aplicações de exemplo
30 - Clique em ‘Default Group’ e no menu lateral clique em
‘New Application’.
120. Criando e testando algumas aplicações de exemplo
31 - Clique em ‘new app 01’ e no formulário especifique os
seguintes dados.
Name: FlisolCG
Path: Pasta ‘bin’ do nosso projeto
Xlet: br.com.flisolcg.FlisolCGXlet
121. Criando e testando algumas aplicações de exemplo
32 - Clique em ‘Save & Close’.
122. Criando e testando algumas aplicações de exemplo
33 - Volte no menu ‘Applications’ e clique na aplicação
‘FlisolCG’ criada.
123. Criando e testando algumas aplicações de exemplo
34 - Se estiver tudo ok a aplicação comecará a rodar, se
algo estiver errado verifique o console da aplicação.
125. Conclusão
● Mercado altamente promissor.
● Diversos nichos a serem explorados.
● Hora de se capacitar.
● Levar a ideia para as universidades.
● Promover eventos.
● Se divertir.