Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de...
Transcript of Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de...
![Page 1: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/1.jpg)
Criação e Disponibilização de Conteúdo Instrucional para a
InternetAula 1: Criação de Multimidia
Renato M.E. Sabbatini
Silvia Helena Cardoso
![Page 2: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/2.jpg)
Objetivos da Aula
Elaborar o conhecimento do aluno sobre as formas de criação e edição de imagens e sons para cursos a distância baseados ou apoiados pela Internet e pela WWW, incluindo ferramentas de software e recursos disponíveis
![Page 3: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/3.jpg)
Tópicos• Tecnologias de aquisição de imagens digitais:
scanners, câmaras fotográficas e de vídeo, conversores A/D, etc.
• Formatos de imagens para a Internet• Ferramentas de software para trabalho com imagens• Formas de inserção de imagens em um documento
eletrônico• Formatos de vídeo para Internet e ferramentas de
criação e edição• Formatos de áudio para Internet e ferramentas de
criação e edição
![Page 4: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/4.jpg)
Multimídia na Internet• Imagens estáticas
– Gráficos– Fotos– Desenhos
• Imagens dinâmicas– Animações– Videoclipes
• Aúdio– Som sintetizado– Som digitalizado
![Page 5: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/5.jpg)
Formatos de Imagens na Web
Formato Visualizado por:
GIFGraphic Interchange Format
Browser GIF
Tipo
JPEGJournalist’s Photo Experts Group
Browser JPG
PNGPortable Network Graphics
Browser (parcialmente) PNG
PCX, TIF, BMP Aplicativos Auxiliares ---
![Page 6: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/6.jpg)
Tecnologias de Aquisição de Imagens Digitais
• Aquisição indireta:– Descarregamento de bases de imagens na
Internet (pagas ou gratuitas)
• Aquisição direta:– Dispositivos de varredura de imagens
(“scanners”)
– Câmaras fotográficas e de vídeo digitais
– Placas de aquisição de vídeo
![Page 7: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/7.jpg)
Aquisição de ImagensScanner de Página
• Aceita até página A4 ou maior
• Resolução ajustável (75 dpi para Web)
• Número de cores ajustável (256 para GIF, milhões para JPG)
• Kit de transparênciapara slides/raios-x
![Page 8: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/8.jpg)
Aquisição de ImagensScanner Manual
• Preço baixo• Uso muito fácil e
rápido• Alta portabilidade• Dificulta alinhamento
da imagem• Não tem transparência• Atualmente em desuso
![Page 9: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/9.jpg)
Aquisição de ImagensCâmara Fotográfica Digital
• Não é adequada para documentos, fotos existentes, transparências
• Resolução semifixa• Para tirar fotos
rapidas, reportagem• Preços e qualidade
muito variáveis
![Page 10: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/10.jpg)
Aquisição de ImagensCâmaras de Vídeo
• Webcams simplificadas
• Câmaras digitais para videoconferência, imagens médicas
• Câmaras VHS digitais• Gravação ou
transmissão em tempo real
![Page 11: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/11.jpg)
Aquisição de ImagensConversor A/D de Vídeo
• Convertem sinal analógico de câmaras convencionais em sinal digital com ou sem som
• Placas internas (inserção em slot no micro)• Unidades externas (conexão via USB, porta
serial, porta paralela, PCMCIA, etc.)• Produzem vídeos AVI ou MPEG• Resolução de vídeo, velocidade em quadros por
segundo, som mono/estéreo, número de cores, formato de saída, etc. variam entre marcas
![Page 12: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/12.jpg)
Ferramentas de Trabalho com Imagens
• Criação e edição de imagens estáticas: Adobe PhotoShop, MS Image Composer, PaintShop Pro, CorelDraw, Corel PhotoPaint
• Edição de imagens animadas:GIF Construction Set, Image Composer
• Conversão de formatos de imagens:Aardvark, PaintShop Pro
• Edição de mapas sensívels:MapEdit, MapIt!, Cute Image Mapper
![Page 13: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/13.jpg)
Programa de Criação e Edição de Imagens
![Page 14: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/14.jpg)
Programas Gráficos: Funções Básicas
• Leitura e gravação de imagens
• Criação: desenhar, legendar, colorir, etc.
• Modificações: rotacionar, espelhar, redimensionar, mudar número de cores, etc.
• Conversão de formatose resolução
• Processamento de imagens: cor, brilho, contraste, filtros, etc.
• Composição: cortar, colar, mover, duplicar
• Estruturar imagens: criar camadas, vetores, máscaras, paletas, etc.
• Visualizar: zoom, etc.
![Page 15: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/15.jpg)
Administração de Catálogos de Imagens
Softwares que permitem a catalogação de diretórios de imagens de vários tipos e sua visualização rápida e seleção
• ThumbNail Plus• PaintShop Pro Browser• Piccolo• Corel Multimedia Manager• IrfanView• 20/20
![Page 16: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/16.jpg)
Gerenciador de Diretórios de Imagens
![Page 17: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/17.jpg)
Editor de Mapas Sensíveis
![Page 18: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/18.jpg)
Animação de GIFs
WWW GIF Animator
![Page 19: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/19.jpg)
Tipos de Imagens On-Line
• Nenhuma imagem in-line, link de texto para
chamar a imagem
• imagens in-line completas
• imagens em miniatura, con link para chamar
imagem completa
![Page 20: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/20.jpg)
Link de Texto para Imagem
Texto principal comlink de texto
HTML separadocom imagem
![Page 21: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/21.jpg)
Imágens Integradas ao Texto
![Page 22: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/22.jpg)
Imagens em Miniatura (Thumbnail)
Texto principalcom imagem miniatura
HTML separadocom imagem maior
![Page 23: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/23.jpg)
• Sem imagens in-line, link de texto – Fácil de programar– Acesso mais rápido ao documento– Estética muito simples
• Imagens integradas ao texto– Estética profisional, similar à versão impressa– Acesso mais lento ao documento
• Imagens em miniatura– Melhor balanço entre velocidade e estética
Imagens On-Line: Comparação
![Page 24: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/24.jpg)
Formatos de Video na Web
• AVI: AudioVisual InterchangeFormato proprietário de MS Windows sem compressão
• MOV, QT: Movie, QuickTimeFormatos proprietários da Apple
• MPEG: Motion Picture Especialists GroupFormato padrão com compressão até 1:30
![Page 25: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/25.jpg)
Plug-Ins para Videos
Apple QuickTime
Windows Media Player
![Page 26: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/26.jpg)
Formatos de Video na Web (2)
• RA, RM: RealMediaFormato “streaming” proprietário, com alto nivel de compressão
• Outros formatos “streaming”Vxtreme, VDO, etc.
![Page 27: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/27.jpg)
Streaming Media
Visualizaçãocontínua dos
pacotes de áudio e/ouvideo
Envia arquivo de audio e/ou video
em pacotes pequenos e seriais
Cliente Servidor
![Page 28: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/28.jpg)
RealAudio/RealVideo Player
Plug-Ins para Áudio/Vídeo (2)
![Page 29: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/29.jpg)
Plug-Ins para Áudio/Vídeo (3)
Microsoft MediaPlayer
![Page 30: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/30.jpg)
Formatos de Audio
• WAV, AIFF, AU, MPEG3Todo o som é digitalizado em um único arquivo, portanto deve esperar-se até que chegue completamente para começar a tocar. Não necesita um plug-in especial, e é muito fácil de produzir
• RealAudio (RA)O áudio é transmitido em pequenos segmentos, que se tocam à medida que chegam do servidor. Grau alto de compressão. Necessidade de um servidor especial e plug-in no cliente
![Page 31: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/31.jpg)
Real Media: Como Funciona
Microfone
Placa de som
Software
Vídeo
Placa de vídeo
Software
Narração de slides
PowerPoint
.avi
.mpeg
.mov
.ppt.wav
(linkados)
.ram
.htm
http://...
.ra.ra.rm.rm
.wav
.au
Arquivo
Real Converter
Programa
Real Presenter
![Page 32: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/32.jpg)
Edição de Vídeos
• São “ilhas de edição” inteiramente digitais, implementadas por software
• Têm funções como cortar, colar trechos uns nos outros, adicionar trilha sonora e efeitos especiais, exibir trechos determinados, mudar cores, contraste, brilho, etc.
• Exemplo: Adobe Premiere• Geralmente o software vem com placas de
aquisição de vídeo compradas
![Page 33: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/33.jpg)
Edição de Sons Digitalizados
![Page 34: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/34.jpg)
Softwares para Edição de Sons
• Creative WaveStudio• GoldWave• Cool Edit• etc.
Quase todos os kits multimidia para PCs vem com uma ou mais ferramentas desse tipo.
![Page 35: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/35.jpg)
Audio Player Plug-Ins
![Page 36: Criação e Disponibilização de Conteúdo Instrucional para a Internet Aula 1: Criação de Multimidia Renato M.E. Sabbatini Silvia Helena Cardoso.](https://reader033.fdocumentos.com/reader033/viewer/2022051615/552fc181497959413d8f1faa/html5/thumbnails/36.jpg)
Estação Multimídia para Criação de Conteúdo para a Internet
• Pentium PC ou Macintosh com mínimo de 64 Mb RAM e monitor 17” SVGA ou maior, em cores
• Conectividade rápida a Internet (banda larga)• Capacidade multimídia completa: CD-ROM,
altofalantes, microfone, etc., • Câmara fotográfica digital ou câmara de documentos • Scanner de página colorido con kit de transparência • Unidade de aquisição de vídeo (placa A/D)• Gravador VHS, monitor de TV
• Gravador de CD-ROM e/ou ZipDrive