O documento discute ferramentas para autoria de produtos multimídia, dividindo-as em duas categorias: aplicativos fechados e linguagens de programação. Aplicativos fechados são mais fáceis de usar, enquanto linguagens de programação permitem mais flexibilidade mas requerem conhecimento técnico. O documento também menciona ferramentas de autoria e como a Internet serve como uma plataforma para hipermídia.
1. Sistemas e Aplicações
Multimídia
Março - 2015
Professor: Giomar Sequeiros O.
Email: giomar.olivera@anhanguera.com
Conteúdo
Ferramentas para Autoria de Produtos Multimídia I
Aula 4
3. Ferramentas para Autoria de Produtos
Multimídia
Sistemas e Aplicações Multimídia 3
As ferramentas usadas para autoria de produtos multimídia
podem ser divididas em duas categorias que são:
• Aplicativos Fechados
• Linguagens de Programação.
Estas ferramentas são usadas de acordo com o nível de
conhecimento do usuário que pode ser um usuário não técnico
e um usuário com formação em desenvolvimento de software,
especificamente, em desenvolvimento de sistemas multimídia.
4. Aplicativos Fechados
Sistemas e Aplicações Multimídia 4
• Curva de aprendizado menor do que as Linguagens de
Programação.
• Disponibilidade de recursos
• Interface bem intuitiva.
• Alta produtividade
• Aprendizagem rápida
O usuário constrói seu produto multimídia, na maioria das vezes
títulos, usando diálogos, menus e ícones de forma interativa, ou
seja, o usuário não necessita ter conhecimento de programação,
ambientes de desenvolvimento, compiladores ou técnicas de
programação, ou seja, o usuário constrói o seu produto multimídia
usando o aplicativo fechado de forma interativa, sem a
necessidade de programação.
5. Aplicativos Fechados
Sistemas e Aplicações Multimídia 5
Contudo, em aplicativos profissionais, existem recursos de
programação na forma de linguagens de script que oferecem ao usuário
a possibilidade de construir o produto multimídia de forma programada.
Algumas dessas ferramentas permite quem o usuário grave um conjunto
de ações sob a forma de um programa na linguagem de script, onde cada
ação do usuário é mapeada para uma ou mais instruções na linguagem
de script.
O conjunto de ações é gravado como uma Macro que nada mais é do
que um programa na linguagem de script. A Macro então pode ser
executada várias vezes no aplicativo fechado, reproduzindo as ações do
usuário, como se o usuário estivesse usando o aplicativo fechado
interativamente. Esta abordagem é útil para tarefas complexas ou muito
trabalhosas e que são executadas com certa frequência.
6. Linguagens de Programação
Sistemas e Aplicações Multimídia 6
Para a construção de produtos multimídia mais sofisticados,
como jogos por exemplo, é necessário o uso de linguagens de
programação. Esta ferramenta apresenta a vantagem de se ter
maior flexibilidade para a construção do produto, permitindo a
construção de comportamento dinâmico e adicionando maior
interatividade ao produto multimídia criado.
7. Linguagens de Programação
Sistemas e Aplicações Multimídia 7
Entretanto, diferente do aplicativo fechado, a linguagem de
programação apresenta uma curva de aprendizado muito maior e
requer conhecimento técnico não somente sobre a linguagem de
programação em si, mas também sobre o sistema operacional, sobre
redes de computadores, sobre banco de dados, etc.
Além disso, é necessário conhecer técnicas de programação e
construção de algoritmos e estruturas de dados para que se possa
fazer bom uso dos recursos oferecidos pela linguagem de programação.
Esta é portanto uma ferramenta de autoria indicada para profissionais
de informática com formação em desenvolvimento de software. O
conhecimento de boas práticas de desenvolvimento (Padrões de Projeto,
Coesão, Acoplamento, Injeção de Dependências ) e teste de software (
TDD) são fundamentas para o sucesso no projeto de software.
8. Linguagens de Programação
Sistemas e Aplicações Multimídia 8
As linguagens de programação são usadas através de ambientes de
desenvolvimento integrado ( IDE do inglês Integrated Development
Environment ) que oferecem vários recursos necessários à atividade de
programação tais como compilador, depurador, conjunto de bibliotecas
suportadas pela linguagem, ajuda on-line, recurso auto-complete para
ajudar na codificação das instruções, entre outros. ).
9. Linguagens de Programação
Sistemas e Aplicações Multimídia 9
As linguagens de programação mais conhecidas são:
Cobol, Fortran, List que ainda são usadas em aplicações muito
específicas em plataforma alta mas que não são usadas em aplicações
multimídia.
Linguagem Pascal e Basic que foram criadas para o ensino de
programação e que evoluíram para uso profissional na forma de dialetos
como Visual Basic da Microsoft e Delphi da Borland.
Linguagem C que é uma poderosa linguagem de programação, sendo
usada para criação de praticamente todo tipo de software, incluindo aí
software multimídia.
Linguagem C++ que é uma variação da linguagem C mas com recursos
de programação orientada a objetos.
10. Linguagens de Programação
Sistemas e Aplicações Multimídia 10
As linguagens de programação mais conhecidas são:
Linguagem Java que se tornou padrão de mercado e que é usada para
aplicações corporativas e sistemas web corporativos. Teve muito
progresso na melhoria de desempenho na execução dos programas
criados porém ainda é mais lenta do que outras linguagens como Pascal
e C ou C++.
Linguagem C# que é uma cópia da linguagem C++ só que para a
plataforma .Net que é a plataforma da Microsoft para desenvolvimento de
software.
Linguagens de Script como PHP, Python e Ruby que são muito usada
para criação de Web Sites e Comercio Eletrônico.
11. Ferramentas de Autoria
Sistemas e Aplicações Multimídia 11
A construção de produtos multimídia sofisticados pode ser feita também
com as chamadas ferramentas de autoria que oferecem uma solução
intermediária entre os aplicativos fechados e as linguagens de
programação, pois permitem a manipulação direta de menus, controles
de caixas de ferramentas e ainda oferecem recursos de programação sob
a forma de linguagens de script.
Uma vantagem deste tipo de ferramenta é que permite ainda a integração
com módulos ( .dll, .jar ) construídos com outras linguagens de
programação.
12. Ferramentas de Autoria
Sistemas e Aplicações Multimídia 12
As ferramentas de autoria são usadas para produção de títulos sob a
forma de slides, um documento, um livro eletrônico, entre outros.
Os títulos lineares são a forma mais usada para consumo de
informações, no caso de apresentações e livros eletrônicos por exemplo.
Apesar de a ordem de apresentação do conteúdo ser predefinida o
conteúdo pode ser bastante rico em áudio, vídeo e animações,
proporcionando uma experiência rica em termos de informação ao leitor.
13. Autoria de Títulos Lineares
Sistemas e Aplicações Multimídia 13
São ferramentas que permite a construção de produtos multimídia, os
títulos com avanços manuais, de forma sequencial, em apresentações.
Algumas dessas ferramentas oferecem suporte à tecnologia OLE que
permite a inclusão de multimídia nos títulos sob a forma de áudio,
vídeo e animações, mas também outros tipos de conteúdo tais como
cronograma de projetos, planilhas de cálculos, etc.
Exemplo de ferramentas para autoria de títulos lineares temos:
Powerpoint (Microsoft ) e Impress ( Open Office ) orientados para a
construção de apresentações eletrônicas Acrobat orientado para a
construção de documentação on-line.
14. Autoria de Títulos Hipermídia
Sistemas e Aplicações Multimídia 14
As ferramentas para autoria de títulos hipermídia adicionam aos
recursos multimídia controles para navegação não sequencial pelo
usuário através de hipertexto.
Para isso o hipertexto dispõe de recursos como controles de navegação,
através dos quais o usuário percorre o título de forma não sequencial.
Estes controles são apresentados na forma de botões, links e imagens
que direcionam a navegação para outras paginas do documento, sem
seguir uma ordem pré-definida e proporcionando um grau de
interatividade maior do que os títulos lineares.
15. Autoria de Títulos Hipermídia
Sistemas e Aplicações Multimídia 15
Devemos considerar os aspectos abaixo em uma ferramenta de autoria
para hipermídia:
Estilo de Autoria: Pode ser interativo ou programado.
Modo de Operação: Modo de execução ou modo de Edição.
Capacidade de intercâmbio de dados: É muito importante que a
ferramenta de autoria suporte os principais formatos e tipos de mídia
existentes no mercado e que permita a importação destes formatos para
serem adicionados ao título.
16. A Internet como Plataforma de Hipermídia
Sistemas e Aplicações Multimídia 16
17. A Internet como Plataforma de
Hipermídia
Sistemas e Aplicações Multimídia 17
O uso da WWW como plataforma de hipermídia faz dela o ambiente
hipermídia mais rico disponível. E hoje a linguagem HTML se tornou o
padrão de hipertexto para a Web. Existem razões para isso.
• Primeiro a HTML é padronizada pelo W3C e não é uma tecnologia
proprietária, presa a uma plataforma específica ou a um fabricante.
• Segundo, é fácil de usar e possui milhares de ferramentas para
elaborações de conteúdo HTML disponíveis, muitas delas gratuitas.
• Terceiro, a HTML suporta todos os formatos de áudio, vídeo e
desenho disponíveis, a partir da versão 5 estes conteúdos
multimídia são suportados nativamente.
18. Localização de recursos
Sistemas e Aplicações Multimídia 18
O formato URL (Universal Resource Locator) é conhecimento como
endereço web e usado para localizar páginas e outros tipos de
recursos, imagens por exemplo.
Um URL é um caso particular de URI ( Uniform Resource Identifier ), um
texto que identifica um recurso de forma única. O URL vai além disso
pois além de identificar o recurso ele fornece meios para localizá-lo. Um
URL tem a seguinte forma:
protocolo:[//dominio[:porta]/] caminho do arquivo [?texto de consulta]
[#ancora]
19. Localização de recursos
Sistemas e Aplicações Multimídia 19
O protocolo mais usado é o http, mas também é usado o https, para o
caso de transações seguros como em comercio eletrônico ou home
banking. Também é usado mailto para o envio de mensagens de correio
eletrônico e o file para arquivos locais, além do ftp para transferência de
arquivos. Quando o domínio não é indicado, o navegador assume o http
como padrão.
O domínio indica o nome da entidade ou empresa que disponibiliza o
conteúdo, conforme registro feito por um registrador de nomes de
domínio que é credenciado pelo órgão que regula a atribuição de
domínios da Internet.
A porta raramente é usada, mas pode ser quando um domínio oferece
mais de um serviço, por exemplo, servidor web na porta 8888 e servidor
de banco de dados postgresql na porta 8654.
20. Localização de recursos
Sistemas e Aplicações Multimídia 20
O caminho do arquivo equivale à estrutura de diretórios usada pelo
sistema operacional do servidor, partindo do diretório raiz atribuído ao
servidor.
São exemplos de URLS:
http://en.wikipedia.org/wiki/URL#Syntax
http://localhost:8080/query.php?regiao=centro-oeste
file://d:/trabalho/multimedia/livro.doc
22. Autoria de sites
Sistemas e Aplicações Multimídia 22
Os sites são um conjunto de páginas que pode conter conteúdo
bastante diversificado, indo desde páginas estáticas até páginas
dinâmicas e com conteúdo multimídia, incluindo áudio, vídeo, animações,
etc. As páginas são organizadas em uma estrutura de pastas que reflete
o mapa de navegação do sites e a hierarquia entre os documentos, indo
do conteúdo mais geral para o mais específico.
Os possíveis materiais que podem compor um site são os seguintes:
• Páginas de hipertexto;
• Material gráfico e de multimídia incorporado a estas páginas (
imagens, áudio, vídeo, animações );
• Outros tipos de documentos;
• Arquivos de trabalho usados pelo software servidor do site;
• Scripts que conferem interatividade a páginas do site ( PHP, ASP, JSP,
etc. )
23. Sites estáticos e dinâmicos
Sistemas e Aplicações Multimídia 23
Um site pode ser estático ou dinâmico, dependendo do conteúdo
apresentado ao usuário.
Sites estáticos oferecem pouca interatividade com o usuário e
apresentam informação numa página que foi gerada em tempo de
desenvolvimento, ou seja, quando o site foi construído.
Sites dinâmicos oferecem maior interatividade com o usuário, sob a
forma de pesquisas, escolhas de opções e geram informação com base
nas informações do usuário, gerando as páginas em tempo de execução
e apresentando informações sempre atualizadas. Normalmente as
informações são lidas em um banco de dados e as páginas possuem
scripts que são processados pelo servidor que interpreta o script
gerando o conteúdo da pagina dinamicamente. Estes scripts são
escritos em alguma linguagem de script tal como PHP, ASP, JSP e que
pode ser interpretada pelo servidor web.
24. Servidores
Sistemas e Aplicações Multimídia 24
Um servidor web é um programa que recebe uma requisição HTTP de
um computador cliente através de um navegador e devolve uma
resposta HTTP, no mesmo formato da requisição, que geralmente é uma
ou mais páginas HTML que pode então ser apresentada ao usuário
também através do navegador. O nome é usado também para o
computador que hospeda o programa servidor.
Tanto a requisição quanto a resposta são feitas no formato HTTP que é
amplamente usado na internet por ser o protocolo padrão de
hipertexto, padronizado e mantido pelo W3C.
O protocolo HTTP usa os serviços do protocolo TCP para estabelecer
conexões entre o cliente ( usuário ) e o servidor. Estas conexões
permitem que sejam trocadas mensagens no modelo de requisição e
resposta.
25. Servidores
Sistemas e Aplicações Multimídia 25
O protocolo HTTP não guarda o estado de uma requisição, ou seja,
não se lembra dos dados de uma requisição. Esta limitação é superada
por recursos de programação usados do lado do cliente ou do lado do
servidor.
Para transações de comércio eletrônico, banco online, é usado o
protocolo HTTPS que possui recursos de criptografia para garantir a
comunicação segura entre cliente e servidor.
O servidor web mais usado atualmente é o Apache HTTP Server. Ele é
gratuito e é conhecido simplesmente como Apache, sendo mantido
Apache Software Foundation e está disponível para os principais
sistemas operacionais.
O segundo servidor web mais usado é o IIS da microsoft mas este é
limitado ao ambiente Windows.
26. Servidores
Sistemas e Aplicações Multimídia 26
O servidor web a ser usado depende da plataforma de
desenvolvimento usada. Se você for usar Java terá de usar um servidor
como Tomcat, JBoss, Web Logic ou GlassFish. Se voce estiver
usando .Net então usa única opção será mesmo o IIS. Observe que
quanto mais aberto for o software usado maiores são as opções em
termos de servidor, ferramenta, linguagem de programação, etc.
Hoje em dia existe um grande número de sites com Apache Server e
PHP com banco de dados MySQL ou PosgreSQL. São usados
principalmente para sites dinâmicos e de comércio eletrônico.
29. Sites estáticos
Sistemas e Aplicações Multimídia 29
A autoria de sites estáticos envolve as tarefas abaixo:
• Autoria do material gráfico ( imagens, videos, animações ) que deve
ser incluído nas páginas
• Autoria das páginas HTML
• Autoria da interligação entre as páginas
• Testes de visualização nos navegadores escolhidos
• Publicação em um servidor web.
30. Sites estáticos: Scripts
Sistemas e Aplicações Multimídia 30
Os Scripts do lado do cliente são um recurso interessante para se fazer
pequenos efeitos visuais em uma página. Normalmente são
implementados através de linguagens de script que são executadas
diretamente no navegador, ou seja, do lado cliente.
Estas linguagens são interpretadas e possuem recursos capazes de
manipular os elementos de uma página, alterando seu comportamento.
Por exemplo, ao passar o mouse sobre um elemento da página, um
formulário, pode-se exibir uma mensagem para o usuário.
As linguagens de Script mais comuns são Javascript, VbScript,
ActionScript e JScript.
31. Sites estáticos: Scripts
Sistemas e Aplicações Multimídia 31
JavaScript é a mais usada e aceita em todos os navegadores. Possui
sintaxe bastante parecida com a linguagem Java e é padronizada pela
ISO.
VbScript é usada no navegador IE da Microsoft e é um dialeto da
linguagem Basic.
ActionScript é a linguagem de script para animações em Flash. Com a
chegada do HTML5 e seus recursos nativos para animação a tendência é
que esta linguagem seja cada vez menos usada no futuro.
Todas as linguagens de Script podem ter o código-fonte exibido no
navegador e isso é um problema com relação à segurança. Por conta
disso, validações e tratamentos de regras de negócio ou cálculos
devem ser feitos do lado servidor com uma linguagem de servidor como
PHP ou ASP.NET.
34. Sites dinâmicos
Sistemas e Aplicações Multimídia 34
São sites que fazem uso de alguma linguagem de script de servidor
que permite a criação de páginas em tempo de execução, de forma
dinâmica, normalmente acessando um banco de dados a partir do qual
consultam informações que são então inseridas nas páginas
dinamicamente. A geração de páginas dinâmicas é feita da seguinte
forma:
O cliente envia uma requisição, via protocolo HTTP, contendo uma URL
do aplicativo, componente ou script que será processado no servidor,
gerando em tempo de execução, o conteúdo da página de resposta.
O aplicativo, componente ou script processa a requisição e gera uma
página de resposta em HTML, mas que pode conter scripts tanto do lado
cliente quando do lado servidor. A página de resposta é enviada então ao
navegador para visualização pelo usuário.
A
37. Etapas de criação de um site
• Planificação e Objetivos
• Realizar um esboço (wireframe)
• Maquetação
• Inserção de conteúdo
• Publicação
Sistemas e Aplicações Multimídia 37
60. Publicação do site: hosting
Sistemas e Aplicações Multimídia 60
• Hostinger
http://www.hostinger.com.br/
• Google Drive
https://drive.google.com/
• ByeHost
http://byethost.com/
61. História breve sobre o web design
The dark ages of web design (1989)
Sistemas e Aplicações Multimídia 61
http://blog.froont.com/brief-history-of-web-design-for-designers/
62. História breve sobre o web design
Tables – The beginning (1995)
Sistemas e Aplicações Multimídia 62
63. História breve sobre o web design
JavaScript comes to the rescue (1995)
Sistemas e Aplicações Multimídia 63
64. História breve sobre o web design
The golden era of freedom – Flash (1996)
Sistemas e Aplicações Multimídia 64
65. História breve sobre o web design
CSS (1998)
Sistemas e Aplicações Multimídia 65
66. História breve sobre o web design
Mobile uprising – Grids and frameworks (2007)
Sistemas e Aplicações Multimídia 66
67. História breve sobre o web design
Responsive web design (2010)
Sistemas e Aplicações Multimídia 67
68. História breve sobre o web design
The times of the flat (2010)
Sistemas e Aplicações Multimídia 68
69. História breve sobre o web design
The bright future (2014)
Sistemas e Aplicações Multimídia 69
70. Tendências de web design 2015
• Longer scrolling sites
• Storytelling and interaction
• Removing non-essential design elements in favor of simplicity
• Professional high quality custom photography
• Hidden main menus
• Very large typography
• Flat design
• No more boxes
• Material design
Sistemas e Aplicações Multimídia 70
78. Princípios de Desenho de Interfaces
com o Usuário
Consistência, pelo qual ações de natureza semelhante devem ser
ativada de forma semelhante
Realimentação - O aplicativo deve fornecer feedback ao usuário sobre
como entendeu a tarefa solicitada;
Minimização de erros - O aplicativo deve ajudar o usuário a não cometer
erros, oferecendo opções no momento certo, desabilitando funções que
não devem estar disponíveis para o usuário em um determinado contexto,
etc.
Recuperação de erros - Mesmo assim o usuário erra e a interface deve
dar a opção de desfazer o erro;
Sistemas e Aplicações Multimídia 78
79. Princípios de Desenho de Interfaces
com o Usuário
Múltiplos níveis de treinamento - A ajuda deve considerar o perfil do
usuário. Usuários novos devem ser bem orientados. Usuários experientes
nem tanto mas ainda assim devem ser ajuda e orientação suficientes.
Minimização da memorização - Não sobrecarregar o usuário com
informações em excesso, obrigando-o a memorizar dezenas de comandos
e conceitos;
Leiaute adequado das telas - Telas simples, limpas, objetivas e com boa
estética é o que o usuário espera de um aplicativo.
Sistemas e Aplicações Multimídia 79
80. Revisão – Trabalho em grupo
Fazer um Wareframe (esboço) de um site
Sistemas e Aplicações Multimídia 80
81. Bibliografia Recomendada
PAULA FILHO, Wilson de Pádua.
Multimídia: Conceitos e Aplicações. 2. ed.
Rio de Janeiro: LTC, 2014. .
Básica
Sistemas e Aplicações Multimídia 81
82. Bibliografia Recomendada
Complementar
MARTINO, Luis M. S.. TEORIA DAS MIDIAS DIGITAIS.
1ª ed. : VOZES, 2014.
FOROUZAN, Behrouz A.. A comunicação
de dados e redes de computadores. 1ª
ed. Rio de Janeiro: McGraw
COMER, Douglas; BARCELLOS, Marinho. Redes de
Computadores e Internet : abrange transmissão de
dados, ligação inter-redes e web.. 4ª ed. Porto Alegre:
Bookman, 2007.
Sistemas e Aplicações Multimídia 82
83. Material, Comunicação e Critérios de
Avaliação
Avaliação I (Peso 4,0)
- Prática : 2,00 (ATPS)
- Prova: 8,00
- Lista de exercícios: 1,00 (Opcional)
Avaliação II (Peso 6,0)
- Prática : 2,00 (ATPS)
- Prova escrita oficial: 8,00
- Lista de exercícios: 1,00 (Opcional)
Frequência igual ou superior a 70%.
Sistemas e Aplicações Multimídia 83
Média final >=6 (Não existe arredondamento)