Upload
internet
View
110
Download
2
Embed Size (px)
Citation preview
1
Sistemas Multimídia
Profa. Leila Jane B. L. S. Guimarães
2
• Introdução a Sistemas Multimídia
• As plataformas
• Os projetos
• Design – Recursos de Navegação
• Design – Interfaces
• Princípios da animação
Agenda
3
Sistemas Multimídia
Introdução a Sistemas Multimídia
4
• Por multimídia entenderemos todos os programas e sistemas em que a comunicação homem e computador se dá através de múltiplos meios de representação de informação.
• A multimídia requer o computador como meio de apresentação.
– Acesso não-linear– Interatividade– Integração com programas aplicativos
Introdução a Sistemas Multimídia
5
Ambientes multimídia
Tipos de produtos multimídia
A enorme gama de possibilidades dos produtos multimídia requer uma classificação.
De acordo com o grau de interatividade: Títulos Aplicativos Sites
6
Tipos de produtos multimídia
Títulos
Produtos que se comportam mais como documentos do que como programas.
A flexibilidade está embutida nos seus programas visualizadores ou navegadores, que são os meios de consulta e pesquisa desses documentos digitais.
Existem dois tipos: lineares e hipermídia
7
Tipos de produtos multimídia
Títulos lineares
A apresentação do material segue ordem predeterminada e seqüencial.
O usuário final tem alguns poucos controles: avanço, retrocesso, avanço rápido, etc.
Exemplos: Apresentações Demonstrações Tutorias não-interativos
8
Tipos de produtos multimídia
Títulos hipermídia
A ordem de visualização é determinada pelo usuário final, que disporá de controles para navegação não-seqüencial.
A hipermídia acrescenta gráficos, imagens, som e animações ao hipertexto.
São exemplos de títulos hipermídia: Títulos de referência Ajuda on-line Quiosques informativos Catálogos interativos
9
Tipos de produtos multimídia
Aplicativos com interface multimídia
São aqueles desenvolvidos em ambientes normais de programação de aplicativos gráficos.
Além dos recursos gráficos estáticos, utilizam recursos de animação e som.
Exemplos de aplicativos com interface multimídia: Jogos Aplicativos educacionais básicos Aplicativos de produtividade pessoal
10
Tipos de produtos multimídia
Aplicativos com interface multimídia
11
Tipos de produtos multimídia
Aplicativos multimídia
Processam o próprio material de multimídia, geralmente em tempo real.
A multimídia deixa de ser apenas um recurso de interface, para ser o objetivo central do próprio aplicativo.
Exemplos de aplicativos multimídia: Ferramentas de multimídia Sistemas de visualização técnica e científica Sistemas avançados de entretenimento
Clique para editar o formato do texto da estrutura de tópicos 2º Nível da estrutura
de tópicos 3º Nível da
estrutura de tópicos
4º Nível da estrutura de tópicos
5º Nível da estrutura de tópicos
6º Nível da estrutura de tópicos
7º Nível da estrutura de tópicos
8º Nível da estrutura de tópicos
• 9º Nível da estrutura de tópicosClique para editar o texto mestre
– Segundo nível• Terceiro nível
– Quarto nível» Quinto nível
12
Tipos de produtos multimídia
13
Tipos de produtos multimídia
Sites
A Internet trouxe a possibilidade de acessar e manipular informação situada em locais de todo o mundo.
Por site entendemos um título de hipermídia colocado em um servidor e visualizado remotamente através de um navegador (browser).
Os sites são compostos de páginas, a navegação é feita seguindo-se de página para página através de hiperligações (hyperlinks).
14
Referências
Livro
Multimídia – Conceitos e Aplicações Autor: Wilson de Pádua Paula Filho Editora: LTC – Livros Técnicos e Científicos Editora S.A. Capítulo 1
15
Sistemas Multimídia
As plataformas
16
• Tipos de plataformas– Plataforma de entrega– Plataforma de desenvolvimento
• Plataformas de autoria• Plataformas de criação de material
• Famílias de plataformas– Microcomputadores baseados em Windows– Estações de trabalho baseadas em Unix– Outras arquiteturas, como a família Macintosh
Ambientes para multimídia
17
• Ambiente Windows
– A partir da versão 3.1, o Windows passou a incluir funções de suporte multimídia
– Plataforma de entrega
– Win95: aprofundou a integração dos recursos multimídia com o ambiente operacional
• Os aplicativos têm acesso aos arquivos e dispositivos de multimídia através de chamadas de procedimentos
Ambientes para multimídia
18
• Outros ambientes
– Ferramentas Unix podem ser mais sofisticadas, mas são mais caras
– Produtos de universidades e institutos de pesquisa são gratuitos, mas não há assistência ao usuário
– A arquitetura Macintosh é rica em aplicativos multimídia
• Sistemas oferecidos com grau de interação maior• Pouco difundida no Brasil
Ambientes para multimídia
19
• Serviços de multimídia do Windows
– As bibliotecas e ambientes de execução invocam os serviços de multimídia
– Os serviços chamam os controladores
– Esses serviços são exemplos de APIs (Interfaces de programação de aplicativos)
• GDI• MCI
Arquiteturas para multimídia
20
• Serviços de multimídia do Windows
– GDI (Graphics Device Interface): dá suporte à apresentação de imagens e desenhos (representação e transmissão para dispositivos de saída)
– MCI (Media Control Interface): áudio e vídeo digitais e controle de equipamento multimídia externo
– DirectX: tratamento multimídia orientado para aplicações de tempo real
– OpenGL: API gráfica tridimensional, com recursos avançados de modelagem e animação
Arquiteturas para multimídia
21
• Arquitetura de multimídia para ambientes Windows
Arquiteturas para multimídia
Serv. de mult. do Windows
Controladores do Windows
Dispositivos de multimídia
Título multimídia
Aplicativo multimídia
Ambiente de execução
Bibliotecas do ambiente
22
• Muitas questões de compatibilidade e conectividade devem ser consideradas.
• Exemplo de configuração
– estação de autoria;– estação de vídeo;– estação de áudio;– subsistema de vídeo;– subsistema de áudio.
Integração de um laboratório multimídia
23
Integração de um laboratório multimídia
24
Integração de um laboratório multimídia
Arquitetura de subconjunto de vídeo
25
Integração de um laboratório multimídia
Arquitetura de subconjunto de áudio
26
Referências
Livro
Multimídia – Conceitos e Aplicações Autor: Wilson de Pádua Paula Filho Editora: LTC – Livros Técnicos e Científicos Editora S.A. Capítulo 2
27
Revisão – NP1
Sistemas Multimídia
Os projetos
28
• O ciclo de vida
– Permite dividir a vida útil de um produto em fases bem-definidas.
– Uma fase bem-definida tem insumos, resultados e critérios de aprovação.
– É composto das seguintes fases:Ativação, Especificação, Desenvolvimento e Operação.
Produção de multimídia
29
• Ativação
– É a fase em que são feitos os primeiros contatos com os clientes e as primeiras ideias são lançadas.
– No caso de um produto a ser lançado em mercado aberto cabe a um profissional ou equipe de marketing fazer a definição do produto.
– A proposta deve necessariamente ser resumida.
O processo de desenvolvimento
30
• Especificação - Análise
– Tem como objetivo produzir uma especificação de requisitos do produto.
– Muitos profissionais negligenciam a fase de análise, adiando a definição dos detalhes do produto para o desenvolvimento.
– A especificação detalhada é tanto mais importante quanto mais complexo o produto e quanto mais componentes ativos o produto contém.
O processo de desenvolvimento
31
• Especificação - Planejamento
– Processos e métodos a utilizar;– Organização administrativa do grupo de
desenvolvimento;– Formas de relacionamento com os clientes;– Mecanismos de avaliação e controle da qualidade;– Mecanismos para mudança dos próprios planos;– Recursos humanos e materiais necessários;– Possíveis riscos e respectivas medidas
preventivas;– Custos;– Cronogramas e resultados.
O processo de desenvolvimento
32
• Desenvolvimento – Desenho
Desenho externo – definição detalhada das interfaces do produto com os elementos de seu ambiente.
Desenho da arquitetura – divisão do produto em suas partes principais, e a especificação dos relacionamentos entre estas partes.
Desenho dos testes – Os testes de aceitação devem ser baseados no desenho externo. O testes de integração devem ser baseados no desenho da arquitetura.
O processo de desenvolvimento
33
• Desenvolvimento – Desenho
Planejamento detalhado da implementação – depois de definidos os componentes e os testes, deve ser planejada a ordem de construção e integração.
Em produtos mais complexos, é recomendável construir em versões parciais (releases – liberações).
O processo de desenvolvimento
34
• Implementação
– Construção de uma ou mais releases;
– Testes alfa (caixa-branca);
– Preparação da implantação, que inclui as medidas necessárias para que o produto seja colocado em seu ambiente definitivo.
– Detalhes das tarefas das releases são específicos das aplicações, ferramentas, plataformas e ambientes.
O processo de desenvolvimento
35
• Implantação
– Reprodução – inclui tarefas dependentes do tipo de produto.
– Instalação – colocação do produto nas máquinas onde será executado.
– Testes beta (caixa-preta) – testes de aceitação, realizados no ambiente dos usuários.
– Produção piloto – A utilização do produto é supervisionada e restrita a usuários experientes por um certo período.
O processo de desenvolvimento
36
• Operação
– Dificilmente um produto é entregue completamente sem defeitos, e problemas mais sérios detectados durante a operação são corrigidos através de manutenção.
– Produtos bem-sucedidos normalmente levam a solicitações de melhorias e de novas funções por parte de seus usuários.
– Esses pedidos levam à construção de novas versões, enquanto durar a vida útil do produto.
O processo de desenvolvimento
37
• Manutenção
– Pequenas correções podem ser distribuídas através de patches colocados na Internet.
– Modificações em um produto causadas por atividades de manutenção e de desenvolvimento de novas versões devem ser feitas de forma bastante disciplinada.
– É indispensável o uso de ferramentas de gestão de configurações para manutenção de um produto.
O processo de desenvolvimento
38
Referências
Livro
Multimídia – Conceitos e Aplicações Autor: Wilson de Pádua Paula Filho Editora: LTC – Livros Técnicos e Científicos Editora S.A. Capítulo 4
39
Revisão – NP1
Sistemas Multimídia
Design – Recursos de Navegação
40
• Sistemas de navegação são compostos por uma variedade de elementos.
• Alguns, como barras de navegação gráficas e menus pop-up, são implementadas juntamente com o conteúdo.
• Outros, como sumários e mapas de navegação, provêem acesso remoto ao conteúdo dentro da estrutura de organização.
Sistemas de Navegação
41
• Nos sistemas de navegação os elementos mais importantes são aqueles que estão integrados às telas de conteúdo.
• À medida que os usuários se movem pelas telas do sistema, esses são os elementos que são usados repetidas vezes.
• A maior parte desses elementos se agrupam em duas categorias: barras de navegação e menus pull-down.
Elementos de Navegação Integrados
42
• Barra de navegação
– De maneira simplista, a barra de navegação é uma coleção de links de hipertexto agrupados em uma tela. Esses links podem ter o aspecto de texto puro ou serem gráficos, com o uso de imagens.
– A opção por usar um tipo ou outro está mais ligada ao aspecto da página do que a questões técnicas.
Elementos de Navegação Integrados
43
Elementos de Navegação Integrados
44
• Quadros
– Os quadros (frames) são uma forma de dividir uma mesma janela em várias outras, permitindo que hiperlinks situados em um quadro alterem o conteúdo apresentado em outro.
– Ao permitir a separação do sistema de navegação do conteúdo, os quadros podem prover contextualização e consistência para os usuários.
Elementos de Navegação Integrados
45
Elementos de Navegação Integrados
46
• Quadros
– Contudo, dependendo da resolução utilizada no monitor do usuário, o uso de quadros pode ocasionar a presença de indesejáveis barras de rolagens que ocultam parte do conteúdo da página.
– Também uma página composta por quadros não é adicionada corretamente em uma lista de favoritos (bookmark) pelo fato de ser formada por diversas outras páginas, cada uma acomodada em um quadro com um endereço próprio (URL).
Elementos de Navegação Integrados
47
• Menus pull-down
– O uso de menus pull-down permite que o usuário expanda a informação que aparece em uma linha para apresentar várias outras opções. De forma geral, usuários escolhem uma opção no menu e então pressionam um botão “Ir para” ou “Enviar” para se mover para o local de destino.
– Os menus, por outro lado, ocultam as opções e forçam o usuário agir antes que possa ver as opções.
Elementos de Navegação Integrados
48
Elementos de Navegação Integrados
49
• Menus pull-down
– Os menus pop-up são uma versão mais sofisticada dos pull-down, pois à medida que o usuário move o cursor sobre um palavra ou áreas na tela um menu é disparado. O usuário pode selecionar diretamente uma opção deste menu.
Elementos de Navegação Integrados
50
• Sumários
– De forma similar aos livros e revistas, os sumários para um sistema apresentam os níveis mais elevados da hierarquia.
– Um sumário provê uma visão ampla do conteúdo e facilita o acesso aleatório a porções segmentadas do conteúdo.
– Um sumário na web pode empregar links de hipertexto para permitir ao usuário o acesso direto às páginas do site.
Elementos de Navegação Remotos
51
Elementos de Navegação Remotos
52
• Índices
– De maneira similar ao índices encontrados em material impresso, um índice digital apresenta palavras-chave ou frases em ordem alfabética, sem apresentar a hierarquia.
– Ao selecionar itens para compor um índice, deve-se ter em mente que um índice deve apontar somente para telas destino, e não para telas de navegação.
Elementos de Navegação Remotos
53
Elementos de Navegação Remotos
54
Elementos de Navegação Remotos
55
Revisão – NP1
Sistemas Multimídia
Design - Interfaces
56
• Interface
– A forma como a informação é organizada e como o utilizador interage com essa informação
Introdução
57
• Usabilidade
– Facilidade de uso de uma interface – quanto maior a facilidade de uso melhor para o usuário.
– Assim será possível diminuir o tempo de aprendizagem associado à interface.
Introdução
58
• Usuários
– Pensar como o usuário
– Todas as pessoas são diferentes
– Devemos gastar boa parte do tempo procurando ‘facilitar a vida’ do usuário
– Procurar a melhor, a mais fácil, a mais simples forma de entender e obter a informação desejada.
Introdução
59
• Compatibilidade
– Reduz o tempo de aprendizagem
– Reduz a possibilidade do usuário cometer erros
– Deve levar em conta os hábitos do usuário
– Auxilia a memorização de funções
– Exemplo: utilizar forma de navegação similar a outros programas com os quais o usuário está acostumado. CTRL + C; CTRL + V; CTRL + Z
60
• Compatibilidade de tarefas
– As tarefas devem estar organizadas em função das tarefas do usuário
– A linguagem deve ser a mesma do usuário
– Funções parecidas devem ocupar a
mesma área
Princípios gerais para o desenho de interfaces
61
• Multi-tarefa
– O sistema ou aplicação deve suportar os conceitos de: interromper, voltar atrás, continuar depois, etc.
– Deve-se permitir uma certa ‘mobilidade’ ao usuário – não se deve obrigá-lo a ‘assistir tudo até o fim’
– O usuário não pode ficar sem alternativas, ele deve ter liberdade para controlar o sistema e não o contrário.
62
• Simplicidade
– Os sistemas devem ser simples e fáceis de usar
– Só se deve dar ao usuário o que ele precisa no momento
– Exemplo: sites de busca
Princípios gerais para o desenho de interfaces
63
• Manipulação direta
– O usuário tem autonomia para visualizar, modificar, alterar diretamente os elementos do sistema
– Exemplo: Editores de imagens
64
• Feedback
– Dar ao usuário uma resposta clara por parte do sistema, informá-lo o que está acontecendo ou mesmo o que irá acontecer.
– O tempo de resposta deve ser o mais curto possível.
– Barras de progresso dão uma melhor idéia do que
está acontecendo do que
uma simples ampulheta.
Princípios gerais para o desenho de interfaces
65
• Flexibilidade
– Permitir ao usuário definir uma série de parâmetros relativos à interface: estilos de diálogos, cores, background, etc. Exemplo: MSN Messenger
– Também deve haver flexibilidade com relação aos dispositivos de entrada: mouse e teclado.
Princípios gerais para o desenho de interfaces
66
• Tecnologia invisível
– O usuário deve saber o mínimo possível sobre detalhes técnicos (de como o sistema está implementado, por exemplo).
– O usuário não deve ser confrontado com informações técnicas ou mesmo palavras que desconhece, caso isso ocorra irá gerar uma sensação grande de desconforto.
– Exemplo: Na instalação de um software o tipo de linguagem e informações solicitadas devem ser extremamente acessíveis ao usuário.
67
• Robustez
– O sistema deve tolerar erros por parte do usuário, deve saber lidar com eles.
– O usuário não deve ter a sensação de que qualquer coisa errada que fizer poderá destruir ou danificar alguma coisa.
– Exemplo: os ‘crashes’ do sistema devem ser mínimos (se não for possível torná-los inexistentes).
68
Revisão – NP1
Sistemas Multimídia
Princípios da Animação
69
• Interpolação
– Os quadros chaves são criados pelos animadores como desenhos estáticos. O programa de animação gera os quadros intermediários através de interpolação.
Animação bidimensional
70
• Silhuetas (mattes)
– São utilizadas para esconder determinados objetos em uma animação, embora elas mesmas não sejam visíveis nos resultados finais.
Animação bidimensional
71
• Animação por scripts
– Um script é uma seqüência de instruções para controle dos objetos e suas respectivas propriedades de animação, textura e comportamento.
– Exemplo de script que anima um quadrado em torno de uma esfera que tem sua escala alterada:
Animação bidimensional
72
• Morfos
– Transformações realizadas por interpolação bidimensional de imagens.
– O animador delimita setores da imagem de origem e seus correspondentes na imagem de destino.
Animação bidimensional
73
• Ciclo da animação tridimensional
– Modelagem – criação de objetos geométricos que compõem as cenas;
– Coreografia – criação dos movimentos dos objetos, câmeras e luzes;
– Elaboração – produção de seqüências de imagens bidimensionais animadas a partir dos modelos e coreografias;
– Pós-produção – semelhante à edição de material de vídeo gravado ao vivo.
Animação tridimensional
74
• Ciclo da animação tridimensional
– Estágios típicos da animação:
– Animação em fio-de-arame – objetos são exibidos apenas por representações de seus ‘arcabouços’, como contornos, esqueletos e armações.
Animação tridimensional
75
• Ciclo da animação tridimensional
– Estágios típicos da animação:
– Visualização preliminar – feita com seqüências de imagens estáticas (storyboards) e com seqüências animadas de baixa resolução (previews).
Animação tridimensional
76
• Ciclo da animação tridimensional
– Estágios típicos da animação:
– Visualização definitiva – feita na resolução e freqüência de quadros definidos pelos padrões da mídia definitiva a ser usada.
Animação tridimensional
77
• Coreografia
– Descreve os movimentos de objetos, câmeras e luzes, assim como deformações de objetos e alterações de propriedades de superfícies e luzes.
– O método mais comum é o da interpolação de quadros chaves.
– Exemplo de transformações usadas em uma coreografia obtida por interpolação: posição e fator de escala.
Animação tridimensional
78
• Coreografia
– Exemplo de hierarquia de movimentos:
Cintura
Torso superior
Braço esquerdo
Antebraço esquerdo
Mão esquerda
Braço direito
Antebraço direito
Mão direita
Animação tridimensional
79
• Animação em tempo real
– Deve ser utilizada em aplicações como simuladores e sistemas de realidade virtual.
– Deve-se empregar uma combinação de fatores que minimizam o tempo de elaboração:
• Redução da resolução;• Redução da taxa de animação;• Algoritmos simplificados de elaboração;• Execução em hardware de operações críticas, como
transformações lineares, projeções, conversão de polígonos, memória de profundidade e método de Gouraud.
Animação tridimensional
80
Referências
Livro
Multimídia – Conceitos e Aplicações Autor: Wilson de Pádua Paula Filho Editora: LTC – Livros Técnicos e Científicos Editora S.A. Capítulo 8
81
Perguntas
82
Exercício 1 - Resolução
Questão 1: Cite pelo menos um exemplo de cada tipo de produto multimídia (de acordo com o grau de interatividade).Resp: Títulos – Google Maps Aplicativos – Jogos educativos básicosSites – Páginas da Web em geral
Questão 2: De acordo com o papel do computador para os títulos em multimídia, quais são os 2 principais tipos de plataforma. Descreva-os.Resp: Plataforma de entrega – é a estação do usuário final do produto multimídia, onde ele será executado.Plataforma de desenvolvimento – é a estação do desenvolvedor, usada para a criação dos títulos e aplicativos multimídia.
83
Exercício 1 - Resolução
Questão 3: Qual a plataforma de entrega mais difundida atualmente?Resp: A plataforma Windows.
Questão 4: O que são controladores (drivers)?Resp: São programas específicos para cada dispositivo, fornecidos pelo próprio fabricante.
Questão 5: Cite pelo menos 2 subsistemas necessários em um laboratório multimídia.Resp: Subsistema de vídeo e subsistema de áudio.
84
Exercício 1 - Resolução
Questão 6: No contexto dos projetos, qual a importância de um modelo de ciclo de vida.Resp: Permite dividir a vida útil de um produto em fases bem-definidas, tornando possível administrar de forma eficaz estas fases.
Questão 7: Cite e descreva pelo menos 2 papéis em uma equipe de um projeto multimídia.Resp: O animador é responsável pelo desenho, criação e acabamento de animações bidimensionais e tridimensionais. O especialista em vídeo é responsável pelas atividades de gravação, captura, edição e pós-processamento de material de vídeo.
85
Exercício 1 - Resolução
Questão 8: Qual a diferença entre testes alfa (caixa-branca) e testes beta (caixa-preta)?Resp: Os testes caixa-branca, geralmente, são executados durante a implementação do código. Normalmente são executados pelos próprios desenvolvedores. Os testes caixa-preta são executados quando a implementação já está concluída. Os testadores não precisam ter acesso ao código para testar a aplicação, precisam apenas testar se o funcionamento atende aos requisitos do cliente.
86
Exercício 2 - Resolução
Questão 1: Quais são os tipos de elementos de navegação? Descreva-os.
Resp: Integrados - São os elementos integrados às telas de conteúdo. À medida que os usuários se movem pelas telas do sistema, esses elementos são usados repetidas vezes.
Remotos – São os elementos que provêem acesso remoto ao conteúdo dentro da estrutura de organização.
87
Exercício 2 - Resolução
Questão 2: Cite pelo menos uma vantagem e uma desvantagem do uso de Quadros como elemento de navegação.Resp: Vantagem - A possibilidade de dividir uma janela em várias outras, aumentando a quantidade de conteúdo visualizado.Desvantagem - Dependendo da resolução utilizada no monitor do usuário, o uso de quadros pode ocasionar a presença de indesejáveis barras de rolagens que ocultam parte do conteúdo da página.
Questão 3: Cite dois exemplos de elementos de navegação remotos.Resp: Índice e Mapa de Navegação.
88
Exercício 2 - ResoluçãoQuestão 4: Exemplifique, por meio de representação gráfica (desenho), como seria um mapa de navegação em um site.
89
Exercício 2 - Resolução
Questão 5: Defina Usabilidade e explique porque ela é tão importante para a Interface.Resp: Facilidade de uso de uma interface – quanto maior a facilidade de uso melhor para o usuário. Assim será possível diminuir o tempo de aprendizagem associado à interface.
Questão 6: Cite e dê exemplos de pelo menos 3 princípios do desenho de interfaces. Resp: Compatibilidade – Exemplo: utilizar forma de navegação similar a outros programas com os quais o usuário está acostumado. CTRL + C; CTRL + V; CTRL + ZMulti-tarefa – Exemplo: O sistema ou aplicação deve suportar os conceitos de: interromper, voltar atrás, continuar depois, etc.Simplicidade – Exemplo: Sites de busca.
90
Exercício 2 - Resolução
Questão 7: Qual a importância do Feedback para o usuário de um sistema multimídia?Resp: Dar ao usuário uma resposta clara por parte do sistema, informá-lo o que está acontecendo ou mesmo o que irá acontecer.
Questão 8: Caso alguns dos princípios do desenho de interfaces entrem em conflito, o que deve ser feito?Resp: É preciso ter bom senso para atribuir níveis de importância à cada um dos princípios.