UNIVERSIDADE ESTADUAL PAULISTA PROGRAMA DE PÓS-GRADUAÇÃO EM COMUNICAÇÃO Lauro Teixeira Gerente de Programação - TV Apareci...
“ As idéias que defendo aqui, não são tanto idéias que possuo, mas idéias que me possuem."  Edgar Morin
Do que vamos falar hoje? <ul><li>O design de interação e a produção de conteúdo interativo para TV Digital </li></ul><ul><...
TV Digital – Panorama Mundial Ofcom, Reino Unido - Mar. 2007
DECRETO Nº. 5.820, DE 29 DE JUNHO DE 2006 <ul><li>Art. 6º O SBTVD-T possibilitará: </li></ul><ul><li>I - transmissão digit...
Porquê TV Interativa no Brasil? Infra-estrutura do Brasil de 1955 a 2005 em setores motivam a televisão interativa
O que é Interatividade? <ul><li>“ Capacidade (de um equipamento, sistema de comunicação ou computação, etc.) de interagir ...
O que é Interatividade? <ul><li>“ Participação ativa do beneficiário de uma transação de informação” (Pierre Lévy) </li></...
Interatividade <ul><li>Interatividade  é a  interação mediada por interfaces eletrônicas. </li></ul><ul><li>Níveis: </li><...
Interatividade na TV Digital <ul><li>Interatividade Local:  A emissora transmite os programas e serviços com opções adicio...
Interação e Interatividade <ul><li>Interatividade </li></ul><ul><ul><li>Ênfase na mediação técnica </li></ul></ul><ul><ul>...
Relação entre os modos de interação <ul><li>Interações Mútuas condicionadas por Interações Reativas </li></ul><ul><li>Usab...
0 que é TV Interativa? <ul><li>Televisão interativa pode ser definida como qualquer coisa que torne possível aos telespect...
Aspectos Históricos <ul><li>A TV Interativa é anterior à TV Digital. </li></ul><ul><ul><li>Experiência apenas local  </li>...
Aspectos históricos <ul><li>O primeiro controle remoto (1957) </li></ul>
Aspectos históricos <ul><li>Teletexto ( Ceefax , 1973) e Videotexto ( Prestel , 1979) </li></ul>
Aspectos históricos <ul><li>Videocassete: Betamax (1975) e VHS (1976)  </li></ul>Fita de Betamax Fita de VHS
Aspectos históricos <ul><li>Programação e tecnologia </li></ul><ul><ul><li>Chamadas:  Dialing for Dollars  (1930 a 1970), ...
Exemplo
Categorias de TV Interativa <ul><li>TV Expandida (eTV):  a interatividade como extensão do conteúdo da programação. Enquet...
Diagrama de Interação
Diagrama de Interação Exemplo:  Local  >  Sincronizados  >  Overlay Quiz Show  – Reino Unido
Diagrama de Interação Exemplo:  Local  >  Sincronizados  >  Redimensionado Quiz Show  – Brasil
Diagrama de Interação Exemplo:  Local  >  Sincronizados  >  Apenas Interface Quiz Show  – Reino Unido Vídeo que ilustra po...
Diagrama de Interação Exemplo:  Local  >  Sem sincronia  >  Overlay Reality Show  – Reino Unido
Diagrama de Interação Exemplo:  Local  >  Sem sincronia  >  Redimensionado Reality Show -  Grécia
Diagrama de Interação Exemplo:  Local  >  Sem sincronia  >  Apenas Interface Game  – Reino Unido Também desvinculado, por ...
Diagrama de Interação Exemplo:  Local  >  Desvinculados  >  Overlay Guia de Programação –  Reino Unido
Diagrama de Interação Exemplo:  Local  >  Desvinculados  >  Redimensionado Guia de programação -  Reino Unido
Diagrama de Interação Exemplo:  Local  >  Desvinculados  >  Apenas Interface Serviço Prev. Tempo  - Espanha
Diagrama de Interação Exemplo:  Intermitente  >  Sincronizados  >  Overlay
Diagrama de Interação Exemplo:  Intermitente  >  Sincronizados  >  Redimensionado
Diagrama de Interação Exemplo:  Intermitente  >  Sincronizados  >  Apenas Interface
Diagrama de Interação Exemplo:  Intermitente  >  Sem sincronia  >  Overlay Entrevista  – França
Diagrama de Interação Exemplo:  Intermitente  >  Sem sincronia  >  Redimensionado TV Shop  – Reino Unido
Diagrama de Interação Exemplo:  Intermitente  >  Sem sincronia  >  Apenas Interface Propaganda  – Reino Unido
Diagrama de Interação Exemplo:  Intermitente  >  Desvinculados  >  Overlay Propaganda  – Reino Unido Vinculado ao canal
Diagrama de Interação Exemplo:  Intermitente  >  Desvinculados  >  Redimensionado Desenho  – Estados Unidos
Diagrama de Interação Exemplo:  Intermitente  >  Desvinculados  >  Apenas Interface Serviço  SMS TV  - França
Diagrama de Interação Exemplo:  Permanente  >  Sincronizados  >  Overlay Seriado  – Reino Unido Também sem sincronia em al...
Diagrama de Interação Exemplo:  Permanente  >  Sincronizados  >  Redimensionado Jockey TV  – Reino Unido
Diagrama de Interação Exemplo:  Permanente  >  Sincronizados  >  Apenas Interface Jornalismo –  Reino Unido
Diagrama de Interação Exemplo:  Permanente  >  Sem sincronia  >  Overlay TV Chat  – Reino Unido
Diagrama de Interação Exemplo:  Permanente  >  Sem sincronia  >  Redimensionado Reality Show  – Reino Unido Também intermi...
Diagrama de Interação Exemplo:  Permanente  >  Sem sincronia  >  Apenas Interface TV Chat  – Reino Unido
Diagrama de Interação Exemplo:  Permanente  >  Desvinculados  >  Overlay Game  – Estados Unidos Também local
Diagrama de Interação Exemplo:  Permanente  >  Desvinculados  >  Redimensionado TV Chat  – Reino Unido
Diagrama de Interação Exemplo:  Permanente  >  Desvinculados  >  Apenas Interface Serviço TV Banking  - Itália
Novos Paradigmas Televisão Convencional Televisão Interativa Expectador passivo Participante ativo (usuário) O conteúdo é ...
Tendências no consumo de mídia <ul><li>Maior controle do usuário </li></ul><ul><li>Maior participação </li></ul><ul><li>Co...
Demanda - Internet Fonte: CETIC.br 2008
Demanda - Internet Fonte: CETIC.br 2008
Demanda - Internet Fonte: CETIC.br 2008
Web 2.0 A bolha que fez brotar a Web 2.0
A Cauda Longa <ul><li>No mercado de massa, há escassez de espaço, o que nos faz “otimizar” o conteúdo para obter maior aud...
Demanda - Celular Fonte: CETIC.br 2008
Demanda Fonte: CETIC.br 2008 A principal barreira de posse dos equipamentos TIC nos domicílios continua sendo econômica: o...
Demanda Gêneros de programas que o brasileiro mais assiste CPqD, 2005
Demanda CPqD, 2005 Atributos considerados importantes
Demanda <ul><li>Aspectos populacionais </li></ul><ul><li>Concentração populacional em determinadas regiões </li></ul><ul><...
Demanda Analfabetismo no Brasil 8% - Analfabetos absolutos 30% - Lêem enunciados de uma só frase 37% - Lêem textos curtos ...
Produção <ul><li>Observar elementos que possam estimular a interatividade </li></ul><ul><li>Em programas ao vivo (jogos, s...
Produção <ul><li>Considerar aspectos tradicionais de postura e uso </li></ul><ul><li>Expectativa de baixo esforço físico e...
Produção E também novas maneiras de consumo do audiovisual
Grade de Programação <ul><li>Fluxo Televisual Planejado  (Raymond Williams, 1974) </li></ul><ul><li>Transmissão seqüencial...
Programação de Televisão <ul><li>Composição temporal  (Grade) </li></ul><ul><li>Otimização do espectro  (limite de transmi...
Fragmento de programação nível de atenção linha do tempo <ul><li>O  break  tem a função de: </li></ul><ul><li>Garantir a “...
Fragmento de programação i i i i <ul><li>A interatividade ao longo da programação: </li></ul><ul><li>Explora momentos de a...
Fragmento de programação i i i merchandising interativo Qual interatividade e em que momento ela é mais conveniente?
Fragmento de programação i i i <ul><li>TV Shop </li></ul><ul><li>Marketing </li></ul>i Até onde vale a pena quebrar o fluxo?
Fragmento de programação i i i i i Interação no programa ( etv ) Qual experiência trará o programa?
Fragmento de programação i i i i i durante o intervalo Qual elo nos manterá no canal?
Fragmento de programação O que a programação tem a ganhar? i i i i independente do programa (EPG) i
Programação - Formatos Programas Quentes Os que não têm sentido fora da programação (telejornal, esporte, auditório, ao vi...
Programação - Formatos linha do tempo horário que o usuário dispõe Programação de televisão DVD Auto-programação Canal A C...
Programação - Formatos linha do tempo horário que o usuário dispõe Programação de televisão DVD Auto-programação Canal A C...
Programação - Formatos controle do emissor controle do indivíduo programação de massa auto-programação
Programação - Formatos auto-programação programação de massa controle do emissor gravação compartilhamento adaptação linea...
Auto-Programação auto-programação programação de massa O conteúdo é empurrado  até a audiência O conteúdo é puxado pela  a...
Usabilidade <ul><li>Usabilidade está ligada diretamente ao diálogo na interface. É a capacidade do aplicativo em permitir ...
Usabilidade <ul><li>A usabilidade está associada a cinco atributos: </li></ul><ul><li>ser fácil de aprender (“Learnabilty”...
Usabilidade <ul><li>Aspectos de usabilidade </li></ul><ul><li>A boa navegação se apóia nas metas e desejos do espectador e...
Usabilidade <ul><li>Espaço: </li></ul><ul><li>Em geral os espectadores de TV prestam menos atenção no que estão vendo do q...
Design para Usabilidade <ul><li>Princípios de design com foco em usabilidade: </li></ul><ul><li>Visibilidade  (visibility)...
Design - Visibilidade Trata-se da medida em que os objetos da interação reativa são perceptíveis ao interagente
Design - FeedBack Trata-se do modo como a reação do sistema se torna perceptível ao interagente
Design - Restrições Refere-se a delimitar o tipo de interação que pode ocorrer em um determinado momento.
Design - Restrições Na interface acima, foram ocultadas as cores vermelha, amarela e azul e os números 5, 6, 7, 8, 9, e 0
Design - Restrições As opções “vermelho” e “amarelo” não estão claras na tela. Deveriam estar restritas visualmente para e...
Design - Mapeamento Trata-se da relação lógica entres os controles de acordo com seus efeitos no sistema
Design - Consistência É transferência de conhecimento entre aplicações de uso semelhante
Design - Affordances Affordance significa “dar uma pista”. É o modo de projetar objetos que se apresentem óbvios quanto à ...
Relação de Aspectos 4:3 Standard  16:9 Widescreen
Relação de Aspectos 4:3 Esticada para 16:9 (Stretched) Centralizada em 16:9 (Pillars) <ul><li>Na exibição, a TV 16:9 tem c...
Relação de Aspectos <ul><li>Porém, quando um programa em widescreen é exibido numa tela 4:3, a imagem é cortada nas extrem...
Relação de Aspectos <ul><li>Considerar as extremidades como áreas não seguras e manter apenas informações de fundo para o ...
CRT - O tamanho do Pixel Desenhando no tamanho final, terá distorções Desenhar mais largo e reduzir para que ele seja exib...
CRT - Possíveis Distorções A TV CRT foi projetada para imagens fotográficas em movimento. As interfaces gráficas costumam ...
CRT - Possíveis Distorções As cores devem ser tratadas com cuidado, pois a tela de TV monitora gamas de cores mais limitad...
Fontes para TV <ul><li>Tamanho mínimo de  18 pontos , preferível 24. </li></ul><ul><li>Texto claro em fundo escuro </li></...
Fontes para TV - Exemplos
Fontes para TV
Interface X Controle Remoto Na Europa, as teclas coloridas tiveram origem como atalhos para páginas de teletexto. Na TV In...
Interface X Controle Remoto <ul><li>Se possível, a interface deve manter sempre a mesma ordem de cores, mesmo que uma apli...
Interface X Controle Remoto <ul><li>A interface deve ensinar o espectador a usar instintivamente o controle apertando os b...
Interface X Controle Remoto <ul><li>Embora as teclas numéricas tenham o propósito de mudar de canal, elas também podem aux...
Interface X Controle Remoto <ul><li>As setas são as principais ferramentas de navegação por sua flexibilidade. Elas difici...
Concluindo “ Liberdade: essa palavra que o sonho humano alimenta,   que não há ninguém que explique   e ninguém que não en...
Referências Obrigado! <ul><ul><li>Livros </li></ul></ul><ul><ul><li>ANDERSON, Chris (2007).  A Cauda Longa </li></ul></ul>...
Próximos SlideShares
Carregando em…5
×

Design para TV Interativa - IETV 2008

3.300 visualizações

Publicada em

Em anexo, o curso proferido por Lauro Teixeira no IETV sobre Design para TV Interativa. Lauro Teixeira é mestre em Comunicação pela Unesp com a pesquisa TV Digital: Interação e Usabilidade

Publicada em: Diversão e humor, Tecnologia
0 comentários
8 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
3.300
No SlideShare
0
A partir de incorporações
0
Número de incorporações
310
Ações
Compartilhamentos
0
Downloads
206
Comentários
0
Gostaram
8
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Design para TV Interativa - IETV 2008

  1. 1. UNIVERSIDADE ESTADUAL PAULISTA PROGRAMA DE PÓS-GRADUAÇÃO EM COMUNICAÇÃO Lauro Teixeira Gerente de Programação - TV Aparecida Designer e Mestre em Comunicação - FAAC/Unesp Televisão Digital: Interação e Usabilidade lauropt@gmail.com
  2. 2. “ As idéias que defendo aqui, não são tanto idéias que possuo, mas idéias que me possuem.&quot; Edgar Morin
  3. 3. Do que vamos falar hoje? <ul><li>O design de interação e a produção de conteúdo interativo para TV Digital </li></ul><ul><ul><li>Interação e Interatividade </li></ul></ul><ul><ul><li>Televisão Digital Interativa </li></ul></ul><ul><ul><li>Demanda </li></ul></ul><ul><ul><li>Programação do conteúdo interativo </li></ul></ul><ul><ul><li>Usabilidade e Design </li></ul></ul>
  4. 4. TV Digital – Panorama Mundial Ofcom, Reino Unido - Mar. 2007
  5. 5. DECRETO Nº. 5.820, DE 29 DE JUNHO DE 2006 <ul><li>Art. 6º O SBTVD-T possibilitará: </li></ul><ul><li>I - transmissão digital em alta definição (HDTV) e em definição padrão (SDTV); </li></ul><ul><li>II - transmissão digital simultânea para recepção fixa, móvel e portátil; e </li></ul><ul><li>III - interatividade. </li></ul>
  6. 6. Porquê TV Interativa no Brasil? Infra-estrutura do Brasil de 1955 a 2005 em setores motivam a televisão interativa
  7. 7. O que é Interatividade? <ul><li>“ Capacidade (de um equipamento, sistema de comunicação ou computação, etc.) de interagir ou permitir interação” (Aurélio) </li></ul><ul><li>A Interação pode ocorrer diretamente entre dois ou mais entes atuantes, ao contrário da interatividade que é necessariamente intermediada por um meio eletrônico (Valdecir Becker / Carlos Montez) </li></ul><ul><li>Na década de 1960 o termo “ interactivity ” aparece para qualificar a computação com a incorporação de dispositivos de entrada e saída. (Sueli Fragoso) </li></ul>
  8. 8. O que é Interatividade? <ul><li>“ Participação ativa do beneficiário de uma transação de informação” (Pierre Lévy) </li></ul><ul><li>Em vez de trabalhar com a idéia de relacionamento entre homens e máquinas, considere pessoas com pessoas (Andrew Lippman – MIT) </li></ul>
  9. 9. Interatividade <ul><li>Interatividade é a interação mediada por interfaces eletrônicas. </li></ul><ul><li>Níveis: </li></ul><ul><li>Reativo – nesse nível, as opções e realimentações (feedbacks) são dirigidas pelo programa, havendo pouco controle do usuário sobre a estrutura do conteúdo; </li></ul><ul><li>Coativo – apresentam-se aqui possibilidades de o usuário controlar a seqüência, o ritmo e o estilo; </li></ul><ul><li>Pró-ativo – o usuário pode controlar tanto a estrutura quanto o conteúdo </li></ul><ul><li>(Richard Reisman – MIT) </li></ul><ul><li>Mídia Quente e Fria (Marshall McLuhan) </li></ul>
  10. 10. Interatividade na TV Digital <ul><li>Interatividade Local: A emissora transmite os programas e serviços com opções adicionais e o usuário pode escolher entre uma programação e outra ou habilitar/desabilitar opções. </li></ul><ul><li>Interatividade com canal de Retorno: o usuário pode &quot;responder&quot; aos aplicativos enviados pela emissora, simultaneamente ou não a um programa. </li></ul><ul><li>Interatividade Plena: Acesso à internet para publicação de conteúdo pessoal. </li></ul><ul><li>(Marcelo Zuffo, USP) </li></ul>
  11. 11. Interação e Interatividade <ul><li>Interatividade </li></ul><ul><ul><li>Ênfase na mediação técnica </li></ul></ul><ul><ul><li>Diálogo / Bidirecionalidade </li></ul></ul><ul><ul><li>Marketing </li></ul></ul><ul><ul><li>Níveis / Usabilidade </li></ul></ul><ul><li>Interação </li></ul><ul><ul><li>Agir reciprocamente </li></ul></ul><ul><ul><li>Relação entre eventos comunicativos </li></ul></ul><ul><ul><li>Interação Mútua X Interação Reativa (Alex Primo, UFRGS) </li></ul></ul><ul><ul><li>Usabilidade e Interação Reativa </li></ul></ul>
  12. 12. Relação entre os modos de interação <ul><li>Interações Mútuas condicionadas por Interações Reativas </li></ul><ul><li>Usabilidade como Interação Reativa </li></ul>Interação Mediada por Computador Interações Mútuas Cooperação, afecção mútua e criativa entre os interagentes. Interações Reativas Relações pré-determinadas de estímulo e resposta.
  13. 13. 0 que é TV Interativa? <ul><li>Televisão interativa pode ser definida como qualquer coisa que torne possível aos telespectadores dialogarem com as pessoas que fazem um canal de televisão, programa ou serviço. Um diálogo que leva os telespectadores para além da experiência passiva de assistir e os permita fazer escolhas ou tomar ações - mesmo que as ações sejam tão simples como preencher um cartão postal e enviá-lo pelo correio, ou desenhar uma imagem na tela da televisão. (Mark Gawlinski, BBC) </li></ul>
  14. 14. Aspectos Históricos <ul><li>A TV Interativa é anterior à TV Digital. </li></ul><ul><ul><li>Experiência apenas local </li></ul></ul><ul><ul><li>Interação por vias indiretas: telefone, correio, internet, SMS </li></ul></ul>Winky Dink and You - CBS, 1953 Winky Dink KIT
  15. 15. Aspectos históricos <ul><li>O primeiro controle remoto (1957) </li></ul>
  16. 16. Aspectos históricos <ul><li>Teletexto ( Ceefax , 1973) e Videotexto ( Prestel , 1979) </li></ul>
  17. 17. Aspectos históricos <ul><li>Videocassete: Betamax (1975) e VHS (1976) </li></ul>Fita de Betamax Fita de VHS
  18. 18. Aspectos históricos <ul><li>Programação e tecnologia </li></ul><ul><ul><li>Chamadas: Dialing for Dollars (1930 a 1970), W hat’s Your Stories (1988), Você Decide (1992) </li></ul></ul><ul><ul><li>Realitys: An American Family (1973), Survivor, No Limite(2000), COPS, The Real World, Na Real, Casa dos Artistas (2001), Big Brother (2002) </li></ul></ul><ul><ul><li>Década de 1990 - Stargazer, ACTV, telecomputador, WWW, Full Service Network, Satélite Digital e Cabo Digital, EPGs, TV interativa de duas telas, WebTV, PVRs (TiVo e Replay TV), VOD, TV Digital (ATSC, DVB, ISBD, SBTVD) </li></ul></ul>
  19. 19. Exemplo
  20. 20. Categorias de TV Interativa <ul><li>TV Expandida (eTV): a interatividade como extensão do conteúdo da programação. Enquetes, Reallity Shows, Propaganda, Games, Esportes, etc. </li></ul><ul><li>Serviços Interativos : A TV como um terminal de acesso. Previsão do tempo, horóscopo, sistema de e-mail, SMS, TV Banking, etc. (Walled Gardens); Internet TV; Teletexto Digital, </li></ul><ul><li>Infra-estrutura de navegação : Objetos da interatividade, Menus, guias de programação... </li></ul>
  21. 21. Diagrama de Interação
  22. 22. Diagrama de Interação Exemplo: Local > Sincronizados > Overlay Quiz Show – Reino Unido
  23. 23. Diagrama de Interação Exemplo: Local > Sincronizados > Redimensionado Quiz Show – Brasil
  24. 24. Diagrama de Interação Exemplo: Local > Sincronizados > Apenas Interface Quiz Show – Reino Unido Vídeo que ilustra possibilidade, este exemplo está em overlay.
  25. 25. Diagrama de Interação Exemplo: Local > Sem sincronia > Overlay Reality Show – Reino Unido
  26. 26. Diagrama de Interação Exemplo: Local > Sem sincronia > Redimensionado Reality Show - Grécia
  27. 27. Diagrama de Interação Exemplo: Local > Sem sincronia > Apenas Interface Game – Reino Unido Também desvinculado, por operadores de plataforma
  28. 28. Diagrama de Interação Exemplo: Local > Desvinculados > Overlay Guia de Programação – Reino Unido
  29. 29. Diagrama de Interação Exemplo: Local > Desvinculados > Redimensionado Guia de programação - Reino Unido
  30. 30. Diagrama de Interação Exemplo: Local > Desvinculados > Apenas Interface Serviço Prev. Tempo - Espanha
  31. 31. Diagrama de Interação Exemplo: Intermitente > Sincronizados > Overlay
  32. 32. Diagrama de Interação Exemplo: Intermitente > Sincronizados > Redimensionado
  33. 33. Diagrama de Interação Exemplo: Intermitente > Sincronizados > Apenas Interface
  34. 34. Diagrama de Interação Exemplo: Intermitente > Sem sincronia > Overlay Entrevista – França
  35. 35. Diagrama de Interação Exemplo: Intermitente > Sem sincronia > Redimensionado TV Shop – Reino Unido
  36. 36. Diagrama de Interação Exemplo: Intermitente > Sem sincronia > Apenas Interface Propaganda – Reino Unido
  37. 37. Diagrama de Interação Exemplo: Intermitente > Desvinculados > Overlay Propaganda – Reino Unido Vinculado ao canal
  38. 38. Diagrama de Interação Exemplo: Intermitente > Desvinculados > Redimensionado Desenho – Estados Unidos
  39. 39. Diagrama de Interação Exemplo: Intermitente > Desvinculados > Apenas Interface Serviço SMS TV - França
  40. 40. Diagrama de Interação Exemplo: Permanente > Sincronizados > Overlay Seriado – Reino Unido Também sem sincronia em alguns formatos
  41. 41. Diagrama de Interação Exemplo: Permanente > Sincronizados > Redimensionado Jockey TV – Reino Unido
  42. 42. Diagrama de Interação Exemplo: Permanente > Sincronizados > Apenas Interface Jornalismo – Reino Unido
  43. 43. Diagrama de Interação Exemplo: Permanente > Sem sincronia > Overlay TV Chat – Reino Unido
  44. 44. Diagrama de Interação Exemplo: Permanente > Sem sincronia > Redimensionado Reality Show – Reino Unido Também intermitente
  45. 45. Diagrama de Interação Exemplo: Permanente > Sem sincronia > Apenas Interface TV Chat – Reino Unido
  46. 46. Diagrama de Interação Exemplo: Permanente > Desvinculados > Overlay Game – Estados Unidos Também local
  47. 47. Diagrama de Interação Exemplo: Permanente > Desvinculados > Redimensionado TV Chat – Reino Unido
  48. 48. Diagrama de Interação Exemplo: Permanente > Desvinculados > Apenas Interface Serviço TV Banking - Itália
  49. 49. Novos Paradigmas Televisão Convencional Televisão Interativa Expectador passivo Participante ativo (usuário) O conteúdo é empurrado até a audiência O conteúdo é puxado pela audiência Modelo de receita baseado na propaganda Modelo de receita baseado no comércio Modelo de programação em função dos canais de transmissão Modelo de programação com conteúdo disponível em banco de dados Programação linear Programação p articipativa Dispositivo Central Ubiqüidade (em qualquer lugar) Uso principal para o entretenimento Uso estendido a compras, comunicação, integração social e educação. Plataforma de comunicação unidirecional Plataforma de comunicação bidirecional O emissor conhece bem o seu papel com relação a gêneros e formatos. O papel do emissor passa a ser flexível e requer maior integração com o usuário.
  50. 50. Tendências no consumo de mídia <ul><li>Maior controle do usuário </li></ul><ul><li>Maior participação </li></ul><ul><li>Consumo de diversos meios; </li></ul><ul><li>Conteúdos partilhados </li></ul><ul><li>Consumo Individualizado </li></ul><ul><li>(Pesquisa BBC – Ofcom, 2004) </li></ul>
  51. 51. Demanda - Internet Fonte: CETIC.br 2008
  52. 52. Demanda - Internet Fonte: CETIC.br 2008
  53. 53. Demanda - Internet Fonte: CETIC.br 2008
  54. 54. Web 2.0 A bolha que fez brotar a Web 2.0
  55. 55. A Cauda Longa <ul><li>No mercado de massa, há escassez de espaço, o que nos faz “otimizar” o conteúdo para obter maior audiência. Nesse novo conceito de negócios (a abundância da Cauda Longa) o não-hit acaba se tornando uma parcela importante do faturamento e concorre diretamente com os poucos e efêmeros sucessos do momento. </li></ul>
  56. 56. Demanda - Celular Fonte: CETIC.br 2008
  57. 57. Demanda Fonte: CETIC.br 2008 A principal barreira de posse dos equipamentos TIC nos domicílios continua sendo econômica: o custo elevado do computador (78%) e do acesso à internet no domicílio (58%), mas o principal motivo declarado que leva o brasileiro a não usar a internet é a falta de habilidade (55%), reforçando que a posse do equipamento não é pré-requisito para o uso.
  58. 58. Demanda Gêneros de programas que o brasileiro mais assiste CPqD, 2005
  59. 59. Demanda CPqD, 2005 Atributos considerados importantes
  60. 60. Demanda <ul><li>Aspectos populacionais </li></ul><ul><li>Concentração populacional em determinadas regiões </li></ul><ul><li>Baixo poder aquisitivo para bens de consumo duráveis </li></ul><ul><li>Boa penetração de DVDs e Celulares (51%) </li></ul><ul><li>98% dos lares com televisão </li></ul><ul><li>34% da população acessa a internet </li></ul><ul><li>Elevada heterogeneidade do público </li></ul><ul><li>Analfabetismo funcional </li></ul>
  61. 61. Demanda Analfabetismo no Brasil 8% - Analfabetos absolutos 30% - Lêem enunciados de uma só frase 37% - Lêem textos curtos (cartas, notícias, etc.) 25% - Compreendem enunciados maiores e relacionam textos diferentes.
  62. 62. Produção <ul><li>Observar elementos que possam estimular a interatividade </li></ul><ul><li>Em programas ao vivo (jogos, shows, auditório), o usuário pode assumir postura mais ativa </li></ul><ul><li>30% dos acessos a serviços durante o comercial </li></ul><ul><li>Comércio eletrônico </li></ul><ul><li>Games </li></ul><ul><li>Reallity Shows </li></ul><ul><li>Serviços ligado ao jornalismo local </li></ul>
  63. 63. Produção <ul><li>Considerar aspectos tradicionais de postura e uso </li></ul><ul><li>Expectativa de baixo esforço físico e cognitivo </li></ul><ul><li>Postura predominantemente passiva </li></ul><ul><li>Distância de 2 a 4 metros </li></ul><ul><li>Aparelho Coletivo X Individual </li></ul><ul><li>Ambiente pode estar escuro </li></ul>
  64. 64. Produção E também novas maneiras de consumo do audiovisual
  65. 65. Grade de Programação <ul><li>Fluxo Televisual Planejado (Raymond Williams, 1974) </li></ul><ul><li>Transmissão seqüencial </li></ul><ul><li>Programa no contexto da programação </li></ul><ul><li>Unidades não acabadas </li></ul><ul><li>O eterno vir a ser </li></ul><ul><li>Cidadania pela informação; </li></ul><ul><li>Lazer pelo entretenimento; </li></ul><ul><li>Orientação por Gêneros; </li></ul><ul><li>Calendário social, relógio da vida cotidiana; </li></ul>
  66. 66. Programação de Televisão <ul><li>Composição temporal (Grade) </li></ul><ul><li>Otimização do espectro (limite de transmissão) </li></ul><ul><li>Fluidez (seqüência harmônica entre programas) </li></ul><ul><li>Coesão (narrativas que se complementam) </li></ul><ul><li>Relevância (priorizar o que pode ser importante) </li></ul><ul><li>Distribuição indiscriminada (não sei quem vai assistir) </li></ul><ul><li>Qualidade (som, imagem e conteúdo) </li></ul><ul><li>TV Digital </li></ul><ul><li>Composição espacial (dados disponíveis) </li></ul><ul><li>Processamento (vídeos e aplicativos que não travam) </li></ul><ul><li>Conveniência (interatividade que não incomoda) </li></ul><ul><li>Usabilidade (interatividade que não frustra) </li></ul><ul><li>Maior qualidade (que justifique a transição) </li></ul>
  67. 67. Fragmento de programação nível de atenção linha do tempo <ul><li>O break tem a função de: </li></ul><ul><li>Garantir a “respiração” para absorver a dispersão </li></ul><ul><li>Permite explorar ganchos de tensão </li></ul><ul><li>Estimular o imaginário </li></ul>Bloco de programa Intervalo
  68. 68. Fragmento de programação i i i i <ul><li>A interatividade ao longo da programação: </li></ul><ul><li>Explora momentos de atenção </li></ul><ul><li>Satisfaz o interesse por conteúdo extra </li></ul><ul><li>Promove uma experiência mais satisfatória </li></ul>
  69. 69. Fragmento de programação i i i merchandising interativo Qual interatividade e em que momento ela é mais conveniente?
  70. 70. Fragmento de programação i i i <ul><li>TV Shop </li></ul><ul><li>Marketing </li></ul>i Até onde vale a pena quebrar o fluxo?
  71. 71. Fragmento de programação i i i i i Interação no programa ( etv ) Qual experiência trará o programa?
  72. 72. Fragmento de programação i i i i i durante o intervalo Qual elo nos manterá no canal?
  73. 73. Fragmento de programação O que a programação tem a ganhar? i i i i independente do programa (EPG) i
  74. 74. Programação - Formatos Programas Quentes Os que não têm sentido fora da programação (telejornal, esporte, auditório, ao vivo em geral, etc.) Programas Frios Os que podem ser gravados (filmes, novelas, séries, documentários, etc.)
  75. 75. Programação - Formatos linha do tempo horário que o usuário dispõe Programação de televisão DVD Auto-programação Canal A Canal B Na competição pelo tempo do usuário, os programas quentes podem perder audiência?
  76. 76. Programação - Formatos linha do tempo horário que o usuário dispõe Programação de televisão DVD Auto-programação Canal A Canal B No entanto, programas quentes são genuinamente televisivos e concorrem menos com outras mídias?
  77. 77. Programação - Formatos controle do emissor controle do indivíduo programação de massa auto-programação
  78. 78. Programação - Formatos auto-programação programação de massa controle do emissor gravação compartilhamento adaptação linearidade relacionamento interesse geral múltipla escolha ação presumida colaboração conteúdo interativo exibição particular produção particular estrutura interativa ... centralidade on-demand controle do indivíduo
  79. 79. Auto-Programação auto-programação programação de massa O conteúdo é empurrado até a audiência O conteúdo é puxado pela audiência O conteúdo é a audiência Telespectador Nível de passividade Usuário Nível de interação reativa Interagente Nível de interação mútua Programação pela transmissão (temporal) Programação pelo acesso (espacial) Auto-programação (espaço-temporal)
  80. 80. Usabilidade <ul><li>Usabilidade está ligada diretamente ao diálogo na interface. É a capacidade do aplicativo em permitir que o usuário alcance suas metas de interação. </li></ul><ul><li>O usuário deve chegar com facilidade no conteúdo (a boa interface é a que passa despercebida) </li></ul>
  81. 81. Usabilidade <ul><li>A usabilidade está associada a cinco atributos: </li></ul><ul><li>ser fácil de aprender (“Learnabilty”) </li></ul><ul><li>ser eficiente na utilização (“Efficiency”) </li></ul><ul><li>ser fácil de ser recordado (“Memorability”) </li></ul><ul><li>ter poucos ou nenhum erro (“Few Errors”) </li></ul><ul><li>ser subjetivamente agradável (“Satisfaction”) </li></ul>
  82. 82. Usabilidade <ul><li>Aspectos de usabilidade </li></ul><ul><li>A boa navegação se apóia nas metas e desejos do espectador evitando que encontre obstáculos desnecessários. </li></ul><ul><li>Objetivos da interface: </li></ul><ul><li>Mostrar ao usuário onde ele está, como chegou lá e facilitar os caminhos para onde ele pretende ir </li></ul><ul><li>Avaliar sempre que ele executar um comando (feedback) </li></ul><ul><li>Ensinar em segundos </li></ul><ul><li>Relacionar modelos culturais e metáforas </li></ul><ul><li>Ser previsível e consistente </li></ul><ul><li>Encorajar a liberdade de movimento </li></ul><ul><li>Facilitar a fuga </li></ul>
  83. 83. Usabilidade <ul><li>Espaço: </li></ul><ul><li>Em geral os espectadores de TV prestam menos atenção no que estão vendo do que os de computador e dispositivos móveis. </li></ul><ul><ul><li>A experiência de televisão se dá curvando-se para trás. </li></ul></ul><ul><ul><li>As pessoas podem achar a interação cansativa e irritante. </li></ul></ul><ul><ul><li>A interface deve ser simples: menos é mais. </li></ul></ul><ul><li>Tempo: </li></ul><ul><li>Espectadores de TV estão acostumados com a uma experiência visual e auditiva muito rica e uma sensação de tempo real. </li></ul><ul><ul><li>A navegação básica deve dar respostas em frações de segundos </li></ul></ul><ul><ul><li>Deve acompanhar o raciocínio do usuário, inclusive na TV Expandida </li></ul></ul>
  84. 84. Design para Usabilidade <ul><li>Princípios de design com foco em usabilidade: </li></ul><ul><li>Visibilidade (visibility); </li></ul><ul><li>Retorno (feedback); </li></ul><ul><li>Restrições (constraints); </li></ul><ul><li>Mapeamento (mapping); </li></ul><ul><li>Consistência (consistency); </li></ul><ul><li>Pistas (affordances) </li></ul>
  85. 85. Design - Visibilidade Trata-se da medida em que os objetos da interação reativa são perceptíveis ao interagente
  86. 86. Design - FeedBack Trata-se do modo como a reação do sistema se torna perceptível ao interagente
  87. 87. Design - Restrições Refere-se a delimitar o tipo de interação que pode ocorrer em um determinado momento.
  88. 88. Design - Restrições Na interface acima, foram ocultadas as cores vermelha, amarela e azul e os números 5, 6, 7, 8, 9, e 0
  89. 89. Design - Restrições As opções “vermelho” e “amarelo” não estão claras na tela. Deveriam estar restritas visualmente para evitar confusão
  90. 90. Design - Mapeamento Trata-se da relação lógica entres os controles de acordo com seus efeitos no sistema
  91. 91. Design - Consistência É transferência de conhecimento entre aplicações de uso semelhante
  92. 92. Design - Affordances Affordance significa “dar uma pista”. É o modo de projetar objetos que se apresentem óbvios quanto à função que exercem. Affordance: percebida e a real
  93. 93. Relação de Aspectos 4:3 Standard 16:9 Widescreen
  94. 94. Relação de Aspectos 4:3 Esticada para 16:9 (Stretched) Centralizada em 16:9 (Pillars) <ul><li>Na exibição, a TV 16:9 tem como opção esticar ou centralizar a imagem para se adaptar. Nessa passagem não há perda de informações. </li></ul>
  95. 95. Relação de Aspectos <ul><li>Porém, quando um programa em widescreen é exibido numa tela 4:3, a imagem é cortada nas extremidades ou encolhida a 75% de seu tamanho </li></ul>16:9 Cortado para 4:3 (Centre cut-out) Centralizado para 4:3 (Letterboxed)
  96. 96. Relação de Aspectos <ul><li>Considerar as extremidades como áreas não seguras e manter apenas informações de fundo para o caso de serem cortadas. </li></ul><ul><li>O texto deve ser grande para ser legível pois também poderá ser encolhido em 25% </li></ul><ul><li>O ideal é projetar interfaces em 4:3, ou interfaces líquidas </li></ul>Se projetar em 16:9...
  97. 97. CRT - O tamanho do Pixel Desenhando no tamanho final, terá distorções Desenhar mais largo e reduzir para que ele seja exibido corretamente O escaneamento do CRT, entre outros fatores, esticam os elementos contidos nas linhas
  98. 98. CRT - Possíveis Distorções A TV CRT foi projetada para imagens fotográficas em movimento. As interfaces gráficas costumam ser sintéticas e estáticas. As imagens na tela da TV são compostas por linhas de varredura que se entrelaçam para formar a imagem. Detalhes muito pequenos (pontos e linhas de 1 pixel de altura) podem sumir ou se duplicar provocando efeitos desagradáveis Elementos contrastantes em cor ou luminância ao longo das linhas podem esticá-las, provocando curvas em linhas verticais
  99. 99. CRT - Possíveis Distorções As cores devem ser tratadas com cuidado, pois a tela de TV monitora gamas de cores mais limitadas que a do computador. Para se alcançar intensidade semelhante, deve-se reduzir a saturação. Branco máximo: 95% (240/240/240) Preto mínimo: 5% (16/16/16) A mudança entre cores saturadas pode provocar invasão de área (sangramento) Quando padrões regulares, como grades ou pontos, são girados, provocam o efeito &quot;Moiré&quot;
  100. 100. Fontes para TV <ul><li>Tamanho mínimo de 18 pontos , preferível 24. </li></ul><ul><li>Texto claro em fundo escuro </li></ul><ul><li>Maior entrelinhas e entreletras (até 130%) </li></ul><ul><li>Uma tela inteira deve ter no máximo 90 palavras </li></ul><ul><li>Fontes mais grossas e sem serifas. </li></ul>
  101. 101. Fontes para TV - Exemplos
  102. 102. Fontes para TV
  103. 103. Interface X Controle Remoto Na Europa, as teclas coloridas tiveram origem como atalhos para páginas de teletexto. Na TV Interativa elas são tidas como aceleradores para mecanismos de navegação simples e até serviços incomuns. Portugal TV Globo – (Uso interno)
  104. 104. Interface X Controle Remoto <ul><li>Se possível, a interface deve manter sempre a mesma ordem de cores, mesmo que uma aplicação não use as 4 cores. </li></ul><ul><li>Cada cor deve estar apta a responder por apenas um item na tela. </li></ul><ul><li>Não usar para funções que seriam supridas por setas (avançar, recuar, etc.) </li></ul><ul><li>As cores das extremidades são as mais importantes </li></ul>
  105. 105. Interface X Controle Remoto <ul><li>A interface deve ensinar o espectador a usar instintivamente o controle apertando os botões certos. As teclas tradicionais básicas não devem ser remapeadas </li></ul><ul><li>O Controle Remoto deve ser leve e as informações visíveis </li></ul><ul><li>Teclas comuns: </li></ul><ul><ul><li>Tradicionais de televisão (volume, canal, liga, etc) </li></ul></ul><ul><ul><li>Números (alguns associados a letras) </li></ul></ul><ul><ul><li>Setas e chave de seleção </li></ul></ul><ul><ul><li>Teclas coloridas (Teletexto) </li></ul></ul><ul><ul><li>Específicas de plataformas adicionais </li></ul></ul><ul><li>Teclas nem sempre presentes: </li></ul><ul><ul><li>Volta / Cancela </li></ul></ul><ul><ul><li>Sair </li></ul></ul><ul><ul><li>Ajuda </li></ul></ul>
  106. 106. Interface X Controle Remoto <ul><li>Embora as teclas numéricas tenham o propósito de mudar de canal, elas também podem auxiliar na navegação: </li></ul><ul><ul><li>Escolha entre itens distintos (menus, enquetes, etc.) </li></ul></ul><ul><ul><li>Devem se posicionar no mesmo lugar em toda tela de um serviço disponível </li></ul></ul><ul><li>Evitar: </li></ul><ul><ul><li>Palavras em vez de numerais para representar uma opção numérica </li></ul></ul><ul><ul><li>Números que se confundam em cor e tamanho com os textos da página </li></ul></ul><ul><ul><li>Item de seleção com mais de um número </li></ul></ul>
  107. 107. Interface X Controle Remoto <ul><li>As setas são as principais ferramentas de navegação por sua flexibilidade. Elas dificilmente são usadas fora de aplicações interativas e por isso não se confundem com as teclas tradicionais. </li></ul><ul><li>Na interface: </li></ul><ul><ul><li>Utilizar ícones triangulares simples para representar setas. </li></ul></ul><ul><ul><li>Uniformizar itens </li></ul></ul><ul><ul><li>Menus verticais são mais óbvios </li></ul></ul><ul><ul><li>Realçar a opção selecionada </li></ul></ul><ul><ul><li>Usar rótulos em textos de múltiplas páginas </li></ul></ul><ul><li>Evitar: </li></ul><ul><ul><li>Disponibilizar itens de forma diagonal ou em curva, pois dificulta pressupor para onde o destaque de moveria </li></ul></ul><ul><ul><li>Ícones complexos que não se relacione claramente com o uso da seta </li></ul></ul><ul><ul><li>Dois eixos de seleção ao mesmo tempo </li></ul></ul>
  108. 108. Concluindo “ Liberdade: essa palavra que o sonho humano alimenta, que não há ninguém que explique e ninguém que não entenda”. Cecília Meireles A interatividade é vista como promessa de liberdade da programação Obrigado!
  109. 109. Referências Obrigado! <ul><ul><li>Livros </li></ul></ul><ul><ul><li>ANDERSON, Chris (2007). A Cauda Longa </li></ul></ul><ul><ul><li>GAWLINSKI, Mark. (2003). Interactive Television Production. </li></ul></ul><ul><ul><li>GRIFFITHS, Alan. (2003). Digital Television Strategies </li></ul></ul><ul><ul><li>JOHNSON, Steven. (2005). A televisão e o videogame nos tornam mas inteligentes. </li></ul></ul><ul><ul><li>NORMAN, D. A. (1988). The Design of Everyday Things </li></ul></ul><ul><ul><li>PRIMO, Alex (2007). Interação Mediada por Computador </li></ul></ul><ul><ul><li>Sites </li></ul></ul><ul><ul><li>CPqD. http://sbtvd.cpqd.com.br </li></ul></ul><ul><ul><li>Style Guide BBCi - www.bbc.co.uk/commissioning </li></ul></ul><ul><ul><li>Aplicativos TVi: www.broadbandbananas.com </li></ul></ul><ul><ul><li>Ofcom - www.ofcom.org.uk </li></ul></ul>

×