35
´Metodologia de Produção e Mídias ´Metodologia de Produção e Mídias Interativas Interativas 1 Aula 2 Aula 2 Hipertexto Hipertexto Como Projetar Como Projetar Mylene Melly Mylene Melly

´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Embed Size (px)

Citation preview

Page 1: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

´Metodologia de Produção e Mídias Interativas´Metodologia de Produção e Mídias Interativas 11

Aula 2Aula 2HipertextoHipertexto

Como ProjetarComo Projetar

Mylene MellyMylene Melly

Page 2: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 22

Aula 2Aula 2

História e Evolução do HipertextoHistória e Evolução do Hipertexto Como ProjetarComo Projetar Referências Referências

Page 3: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 33

Evoluçaõ das ComunicaçõesEvoluçaõ das Comunicações

Comunicação oral e interativa – culturas Comunicação oral e interativa – culturas tribais mesmo tempo e espaço tribais mesmo tempo e espaço (lembrança=memória auditiva). Uso da (lembrança=memória auditiva). Uso da dramatização, dança, música como forma dramatização, dança, música como forma de transmitir e perpetuar acontecimentosde transmitir e perpetuar acontecimentos

Comunicação escrita – textos lineares e Comunicação escrita – textos lineares e uso de alfabetos (compreensão e análise uso de alfabetos (compreensão e análise fora do contexto da produção)fora do contexto da produção)

Page 4: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 44

Evolução das ComunicaçõesEvolução das Comunicações

3000 AC Mesopotâmia – formas de escrita 3000 AC Mesopotâmia – formas de escrita usando ideogramas e fonemasusando ideogramas e fonemas

3000 AC Egito – papiros e tintas rudimentares 3000 AC Egito – papiros e tintas rudimentares para representação de signospara representação de signos

1700-1500AC – Ásia Ocidental, alfabeto norte 1700-1500AC – Ásia Ocidental, alfabeto norte semíticosemítico

1400 AC – Síria, escrita cuneiforme1400 AC – Síria, escrita cuneiforme 1000 AC – Oriente próximo, escrita aramaica1000 AC – Oriente próximo, escrita aramaica 1000 AC -900 AC – Grécia, alfabeto grego1000 AC -900 AC – Grécia, alfabeto grego Nesta época inscrições eram feita em cerâmica, Nesta época inscrições eram feita em cerâmica,

cera, argila, pelos de animais e papiroscera, argila, pelos de animais e papiros

Page 5: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 55

Evolução das ComunicaçõesEvolução das Comunicações

Sec III AC – biblioteca do museu de Sec III AC – biblioteca do museu de Alexandria (objetivo reunir todo o Alexandria (objetivo reunir todo o conhecimento do mundo). Pergaminho, conhecimento do mundo). Pergaminho, livro como reunião de vários pergaminhos livro como reunião de vários pergaminhos ou papirosou papiros

IX DC – Contos árabes Mil e uma noites IX DC – Contos árabes Mil e uma noites (12 volumes história contém outra história (12 volumes história contém outra história – primeiro uso consistente de links– primeiro uso consistente de links

Page 6: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 66

Evolução das ComunicaçõesEvolução das Comunicações Sec XII – introduzido papel no mundo ocidentalSec XII – introduzido papel no mundo ocidental Meados do Sec XV – Gutenberg inventou a imprensa e a tipografia. Biblia Meados do Sec XV – Gutenberg inventou a imprensa e a tipografia. Biblia

de Gutenberg é considerada a primeira publicação impressa. (passagem de Gutenberg é considerada a primeira publicação impressa. (passagem dos manuscritos para impresso). Profundas mudanças na comunicação dos manuscritos para impresso). Profundas mudanças na comunicação escrita. Leitor passou a ter acesso a teorias e conhecimentos antes restritos escrita. Leitor passou a ter acesso a teorias e conhecimentos antes restritos aos mestres. Leitura e interpretação mais individualizados – surgimentos de aos mestres. Leitura e interpretação mais individualizados – surgimentos de representações gráficas, tabelas, desenhos, mapas.representações gráficas, tabelas, desenhos, mapas.

Padronização do livro moderno (paginação, sumários, citações, capítulos, Padronização do livro moderno (paginação, sumários, citações, capítulos, títulos, resumos, erratas, esquemas , diagramas, índices, palavras-chaves, títulos, resumos, erratas, esquemas , diagramas, índices, palavras-chaves, bibliografias, glossários, ISBN, data de publicação, edição, etc). bibliografias, glossários, ISBN, data de publicação, edição, etc). Itens corriqueiros, nem notamos a existênciaItens corriqueiros, nem notamos a existência Representou uma forma de interação completamente diferente dos manuscritos Representou uma forma de interação completamente diferente dos manuscritos

anterioresanteriores Forma rápida de permitir ao leitor a possibilidade de avaliar a obra. Através de Forma rápida de permitir ao leitor a possibilidade de avaliar a obra. Através de

citações, referências acesso não linear a outras obras (James Joyce – Ulysses citações, referências acesso não linear a outras obras (James Joyce – Ulysses ver http://publish.uwo.ca/~mgroden/ulysses/)ver http://publish.uwo.ca/~mgroden/ulysses/)

Page 7: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 77

Evolução das ComunicaçõesEvolução das Comunicações

Roda de leitura de Roda de leitura de Agostinho Ramelli – Agostinho Ramelli – primórdio do primórdio do hipertexo (Paris, hipertexo (Paris, 1588). Nunca 1588). Nunca implementadaimplementada

Page 8: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 88

Evolução das ComunicaçõesEvolução das Comunicações

Sec XVIII - Classificação em bibliotecas: fichas Sec XVIII - Classificação em bibliotecas: fichas catalográficas(alfabéticas a partir dos títulos e catalográficas(alfabéticas a partir dos títulos e sumários) e em árvore (árvore do sumários) e em árvore (árvore do conhecimento). conhecimento).

Sec XIX – evoluções tecnológicas no ramo da Sec XIX – evoluções tecnológicas no ramo da eletricidade.eletricidade. 1837 – alfabeto foi codificado em Morse1837 – alfabeto foi codificado em Morse TelegráfoTelegráfo Máquina de escreverMáquina de escrever FonográfoFonográfo Telefone e rádioTelefone e rádio 1890 – cartões perfurados de Hermann Hollerith1890 – cartões perfurados de Hermann Hollerith

Page 9: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 99

Evolução das ComunicaçõesEvolução das Comunicações

Sec XX Sec XX cinema falado, televisão, gravador, caneta cinema falado, televisão, gravador, caneta

esferográfica, fotocopiadora e os primeiros esferográfica, fotocopiadora e os primeiros computadores. computadores.

Novos suporte: fotossensíveis (filme, microfilme, Novos suporte: fotossensíveis (filme, microfilme, microficha), mecânicos (disco de vinil) e magnéticosmicroficha), mecânicos (disco de vinil) e magnéticos

Nesta época começa-se a ter consciência da Nesta época começa-se a ter consciência da enorme quantidade de informação disponível e enorme quantidade de informação disponível e na consequente capacidade de acessá-la e na consequente capacidade de acessá-la e absorvê-laabsorvê-la

Page 10: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1010

História do HipertextoHistória do Hipertexto Vannevar Bush iniciou uma pesquisa Vannevar Bush iniciou uma pesquisa envolvendo militares e academia que envolvendo militares e academia que culminaria no desenvolvimento da. culminaria no desenvolvimento da. Escreveu descrições visionária do Escreveu descrições visionária do potencial uso da tecnologia da potencial uso da tecnologia da informação, inspirando, mais tarde, os informação, inspirando, mais tarde, os criadores da Internet.criadores da Internet.

Foi nomeado pelo Presidente Roosevelt Foi nomeado pelo Presidente Roosevelt Chairman da National Defense Research Chairman da National Defense Research Committee em 1940 para auxiliar na 2- Committee em 1940 para auxiliar na 2- Guerra MundialGuerra MundialEm 1941, Bush foi nomeado diretor na Em 1941, Bush foi nomeado diretor na recem criada "Office of Scientific Research recem criada "Office of Scientific Research and Development", criado para cordenar and Development", criado para cordenar pesquisas no desenvolvimento de armas. pesquisas no desenvolvimento de armas. Esta organização empregava mais de Esta organização empregava mais de 6.000 cientistas no final da guerra e 6.000 cientistas no final da guerra e supervisionou o desenvolvimento da supervisionou o desenvolvimento da bomba atômica.bomba atômica.

2 - Aspectos econômicos, sociais e legais

Page 11: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1111

História do HipertextoHistória do Hipertexto1945 “As we May Think” de Vannevar 1945 “As we May Think” de Vannevar BushBush

““Consider a future device for individual Consider a future device for individual use, which is a sort of mechanized private use, which is a sort of mechanized private file and library. It needs a name, and to file and library. It needs a name, and to coin one at random, "memex" will do. A coin one at random, "memex" will do. A memex is a device in which an individual memex is a device in which an individual stores all his books, records, and stores all his books, records, and communications, and which is mechanized communications, and which is mechanized so that it may be consulted with exceeding so that it may be consulted with exceeding speed and flexibility. It is an enlarged speed and flexibility. It is an enlarged intimate supplement to his memory. intimate supplement to his memory.

.. Vannevar Bush; Vannevar Bush; As We May ThinkAs We May Think; ;

Atlantic Monthly; July 1945 Atlantic Monthly; July 1945

2 - Aspectos econômicos, sociais e legais

Page 12: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1212

História do HipertextoHistória do Hipertexto

Bush acreditava que a mente humana Bush acreditava que a mente humana funcionava por associação de idéias e não funcionava por associação de idéias e não de forma linearde forma linear

Memex propiciaria uma forma individual Memex propiciaria uma forma individual de leitura não linear em diferentes mídias.de leitura não linear em diferentes mídias.

Princípio básico do hipertexto: Princípio básico do hipertexto: interconexão de informação através da interconexão de informação através da associação de idéias (nós, links, âncoras)associação de idéias (nós, links, âncoras)

Page 13: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1313

História do HipertextoHistória do Hipertexto1945 “As we May Think” de Vannevar 1945 “As we May Think” de Vannevar BushBush

•Memex era um dispositivo mecanizado que Memex era um dispositivo mecanizado que permitiria a um pessoa guardar seus livros, permitiria a um pessoa guardar seus livros, fotos, jornais, revistas e correspondências e fotos, jornais, revistas e correspondências e consultá-los de forma rápida e flexível como se consultá-los de forma rápida e flexível como se fosse uma extensão de sua memória. Tratava-fosse uma extensão de sua memória. Tratava-se de uma mesa com telas translúcidas, se de uma mesa com telas translúcidas, teclado, botões, alavancas, e mecanismos de teclado, botões, alavancas, e mecanismos de armazenamento, e projeção baseado no uso de armazenamento, e projeção baseado no uso de microfilmes. A ligação entre itens correlatos microfilmes. A ligação entre itens correlatos seria feito por indexação associativa (um item seria feito por indexação associativa (um item poderia selecionar outro item para ser lido)poderia selecionar outro item para ser lido)•Esta idéia ficou adormecida por quase 20 anos.Esta idéia ficou adormecida por quase 20 anos.

Vannevar Bush; Vannevar Bush; As We May ThinkAs We May Think; ; Atlantic Monthly; July 1945 Atlantic Monthly; July 1945

2 - Aspectos econômicos, sociais e legais

Page 14: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1414

Evolução das ComunicaçõesEvolução das Comunicações

Na década de 50 – rádio a transistor, Na década de 50 – rádio a transistor, circuito integradocircuito integrado

60 – fitas magnéticas usadas em 60 – fitas magnéticas usadas em computadores. Foi criado o satélite de computadores. Foi criado o satélite de telecomunicaçõestelecomunicações

Page 15: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1515

História do HipertextoHistória do Hipertexto 1963 – Douglas Engelbart escreveu o artigo 1963 – Douglas Engelbart escreveu o artigo “ A “ A

Conceptual Framework” no qual defendia a Conceptual Framework” no qual defendia a idéia que o computador poderia aumentar o idéia que o computador poderia aumentar o desenvolvimento do pensamento humano. desenvolvimento do pensamento humano.

1965 – Engelbart inventa o mouse1965 – Engelbart inventa o mouse 1968 – Apresenta ao mercado o sistema de 1968 – Apresenta ao mercado o sistema de

editoração Augment (multi janelas, editoração Augment (multi janelas, colaboarativo, boa interface, funcionando com colaboarativo, boa interface, funcionando com mouse) desenvolvido em Stanford, que fazia mouse) desenvolvido em Stanford, que fazia uso de links para associação de arquivos. Do uso de links para associação de arquivos. Do ponto de vista de trabalho colaborativo pode-se ponto de vista de trabalho colaborativo pode-se citar: mensagens eletrônicas, teleconferência, citar: mensagens eletrônicas, teleconferência, compartilhamento e arquivamento de compartilhamento e arquivamento de mensagens. Segundo Shneirderman e Kearsley mensagens. Segundo Shneirderman e Kearsley a demonstração do Augment foi a pedra a demonstração do Augment foi a pedra fundamental da história do hipertexto.fundamental da história do hipertexto.

(no final desta década foi criada a Arpanet).(no final desta década foi criada a Arpanet).

Vídeos de 1968 – apresentação do Augment - http://sloan.stanford.edu/mousesite/1968Demo.htmlVídeos de 1968 – apresentação do Augment - http://sloan.stanford.edu/mousesite/1968Demo.html

Page 16: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1616

História do HipertextoHistória do Hipertexto Ted Nelson é uma figura controversa. Possui Ted Nelson é uma figura controversa. Possui

grandes ideias, mas nunca terminou nenhum de grandes ideias, mas nunca terminou nenhum de seus projetos. Seu principal projeto, Xanadu de seus projetos. Seu principal projeto, Xanadu de 1967, seria um sistema eletrônico de publicação 1967, seria um sistema eletrônico de publicação distribuído mundialmente cujo intuito era criar distribuído mundialmente cujo intuito era criar uma biblioteca universal. Ted cunhou o termo uma biblioteca universal. Ted cunhou o termo hipertexto. É conhecido por ter idéias radicais, hipertexto. É conhecido por ter idéias radicais, opondo-se a autoridades e tradições. opondo-se a autoridades e tradições. Constantemente ele repete as 4 máximas que Constantemente ele repete as 4 máximas que guiam sua vida: "most people are fools, most guiam sua vida: "most people are fools, most authority is malignant, God does not exist, and authority is malignant, God does not exist, and everything is wrong." (Wolf, 1995)everything is wrong." (Wolf, 1995)

Xanadu foi concebido como uma ferramenta Xanadu foi concebido como uma ferramenta para preservar e aumentar a produção literária e para preservar e aumentar a produção literária e artisitica. Xanadu consistiria numa rede mundial artisitica. Xanadu consistiria numa rede mundial que permitiria que a informação fosse que permitiria que a informação fosse armazenada não como doucumentos separados armazenada não como doucumentos separados e sim como uma litaratura. Documentod ficariam e sim como uma litaratura. Documentod ficariam disponíveis indefinidamente. Cópias virtuais de disponíveis indefinidamente. Cópias virtuais de qualquer documento poderiam ser feitas por qualquer documento poderiam ser feitas por usuários. Ao invez de sistema de copyright, usuários. Ao invez de sistema de copyright, autores seriam remunerados automaticamente a autores seriam remunerados automaticamente a cada cópia feita através de sistemas de cada cópia feita através de sistemas de

Xanadu nunca foi completamente implementado Xanadu nunca foi completamente implementado e está longe disso, WWW tem muito em comum e está longe disso, WWW tem muito em comum com Xanadu, mas este último é muito mais com Xanadu, mas este último é muito mais visionário. O código de Xanadu é também aberto visionário. O código de Xanadu é também aberto ao público.ao público.

Ver: Nelson, T., Literary Machines -

http://xanadu.com.au/ted/TN/PUBS/LM/LMpage.html

Page 17: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1717

História do HipertextoHistória do Hipertexto

Andries van Dam – Brown University Andries van Dam – Brown University estudos sobre hipertextos, computação estudos sobre hipertextos, computação gráficagráfica

1970 – IBM inventa disquete1970 – IBM inventa disquete Comercialização do chip eletrônico Comercialização do chip eletrônico

informática expande-se nas indústrias, no informática expande-se nas indústrias, no setor de serviços e no bancáriosetor de serviços e no bancário

1972 sistema de hipertexto ZOG1972 sistema de hipertexto ZOG

Page 18: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1818

História do HipertextoHistória do Hipertexto

Final da década de 70 – apple e IBM Final da década de 70 – apple e IBM lançam seus computadores pessoais. lançam seus computadores pessoais. Informática alcança escritórios. Surgiram Informática alcança escritórios. Surgiram os primeiros videodiscos hipermídia os primeiros videodiscos hipermídia AspenMovieMap desenvolvido por And AspenMovieMap desenvolvido por And Lippman do MITLippman do MIT

Surge o SW de processamento de texto Surge o SW de processamento de texto WordstarWordstar

Page 19: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 1919

História do HipertextoHistória do Hipertexto

Decada de 80Decada de 80 Videotexto, minitel, fibra ótica, telas touch Videotexto, minitel, fibra ótica, telas touch

sreen, interfaces WYSIWYG, memórias sreen, interfaces WYSIWYG, memórias óticas, scanners, CD-ROMs, protocolo óticas, scanners, CD-ROMs, protocolo TCP/IP, Internet, interfaces mais amigáveis TCP/IP, Internet, interfaces mais amigáveis (menus, janelas, ícones)(menus, janelas, ícones)

Informática começa a fazer parte do cotidiano Informática começa a fazer parte do cotidiano das pessoasdas pessoas

Page 20: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2020

História do HipertextoHistória do Hipertexto

Decada de 80Decada de 80 Vários sistemas de hipertexto comercial surgiram:Vários sistemas de hipertexto comercial surgiram:

Guide para PCs– University of Cantebury – Peter Brown Guide para PCs– University of Cantebury – Peter Brown TIES (The Interactive Encyclopedia System) – University of TIES (The Interactive Encyclopedia System) – University of

Maryland, Bem ShneidermanMaryland, Bem Shneiderman KMS sucessor do ZOGKMS sucessor do ZOG Notecards – Xerox Palo Alto – Frank Halazs, andy Notecards – Xerox Palo Alto – Frank Halazs, andy

Trigg,Tom MoranTrigg,Tom Moran Intermedia – Brown UniversityIntermedia – Brown University HyperCard para Mac – Apple Computer – Bill AtkinsonHyperCard para Mac – Apple Computer – Bill Atkinson 1983 – Randall Trigg – University of Maryland defende a 1- 1983 – Randall Trigg – University of Maryland defende a 1-

tese sobre hipertextostese sobre hipertextos 1987 – Primeira conferência sobre hipertextos1987 – Primeira conferência sobre hipertextos

Page 21: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2121

História do HipertextoHistória do Hipertexto Tim Bernes Lee - The inventor of HTMLTim Bernes Lee - The inventor of HTML. .

Graduate of Oxford University, England, Graduate of Oxford University, England, Tim is now with the Laboratory for Computer Tim is now with the Laboratory for Computer Science ( LCS)at the Massachusetts Science ( LCS)at the Massachusetts Institute of Technology ( MIT). Institute of Technology ( MIT).

He directs the W3 Consortium, an open He directs the W3 Consortium, an open forum of companies and organizations with forum of companies and organizations with the mission to realize the full potential of the the mission to realize the full potential of the Web. Web.

With a background of system design in With a background of system design in real-time communications and text real-time communications and text processing software development, in 1989 processing software development, in 1989 he invented the World Wide Web, an he invented the World Wide Web, an internet-based hypermedia initiative for internet-based hypermedia initiative for global information sharing. while working at global information sharing. while working at CERN, the European Particle Physics CERN, the European Particle Physics Laboratory. Laboratory.

Before coming to CERN, Tim was a Before coming to CERN, Tim was a founding director of Image Computer founding director of Image Computer Systems, and before that a principal Systems, and before that a principal engineer with Plessey Telecommunications, engineer with Plessey Telecommunications, in Poole, England.in Poole, England.

Page 22: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2222

História do HipertextoHistória do Hipertexto Marc Andreesen was a student and part-time assistant at the Marc Andreesen was a student and part-time assistant at the

Nationa l Center for Supercomputing Applications (NCSA) at Nationa l Center for Supercomputing Applications (NCSA) at the University of Illinois when the World Wide Web began to the University of Illinois when the World Wide Web began to take off. His position at NCSA allowed him to become very take off. His position at NCSA allowed him to become very familiar with the Internet. Like just about everyone else who familiar with the Internet. Like just about everyone else who was involved with the Internet, he also became familiar with was involved with the Internet, he also became familiar with the Web. Most of the browsers available then were for Unix the Web. Most of the browsers available then were for Unix machines which were expensive. This meant that the Web machines which were expensive. This meant that the Web was mostly used by academics and engineers who had was mostly used by academics and engineers who had access to such machines. The user-interfaces of available access to such machines. The user-interfaces of available browsers also tended to be not very user-friendly, which also browsers also tended to be not very user-friendly, which also hindered the spread of the Web. Marc decided to develop a hindered the spread of the Web. Marc decided to develop a browser that was easier to use and more graphically rich.browser that was easier to use and more graphically rich.

In 1992, Andreesen recruited fellow NCSA employee, Eric In 1992, Andreesen recruited fellow NCSA employee, Eric Bina, to help with his project. The two worked tirelessly. Bina Bina, to help with his project. The two worked tirelessly. Bina remembers that they would 'work three to four days straight, remembers that they would 'work three to four days straight, then crash for about a day' (Reid, 7). They called their new then crash for about a day' (Reid, 7). They called their new browser Mosaic. It was much more sophisticated graphically browser Mosaic. It was much more sophisticated graphically than other browsers of the time. Like other browsers it was than other browsers of the time. Like other browsers it was designed to display HTML documents, but new formatting tags designed to display HTML documents, but new formatting tags like "center" were included. like "center" were included.

Especially important was the inclusion of the "image" tag which Especially important was the inclusion of the "image" tag which allowed to include images on web pages. Earlier browsers allowed to include images on web pages. Earlier browsers allowed the viewing of pictures, but only as separate files. allowed the viewing of pictures, but only as separate files. Mosaic made it possible for images and text to appear on the Mosaic made it possible for images and text to appear on the same page. Mosaic also sported a graphical interface with same page. Mosaic also sported a graphical interface with clickable buttons that let users navigate easily and controls clickable buttons that let users navigate easily and controls that let users scroll through text with ease. Another innovative that let users scroll through text with ease. Another innovative feature was the hyper-link. In earlier browsers hypertext links feature was the hyper-link. In earlier browsers hypertext links had reference numbers that the user typed in to navigate to had reference numbers that the user typed in to navigate to the linked document. Hyper-links allowed the user to simply the linked document. Hyper-links allowed the user to simply click on a link to retrieve a document. click on a link to retrieve a document.

Page 23: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2323

História do HipertextoHistória do Hipertexto In early 1993, Mosaic was posted for download In early 1993, Mosaic was posted for download

on NCSA's servers. It was immediately popular. on NCSA's servers. It was immediately popular. Within weeks tens of thousands of people had Within weeks tens of thousands of people had downloaded the software. The original version downloaded the software. The original version was for Unix. Andreesen and Bina quickly put was for Unix. Andreesen and Bina quickly put together a team to develop PC and Mac versions, together a team to develop PC and Mac versions, which were released in the late spring of the which were released in the late spring of the same year. With Mosaic now available for more same year. With Mosaic now available for more popular platforms, its popularity skyrocketed. popular platforms, its popularity skyrocketed. More users meant a bigger Web audience. The More users meant a bigger Web audience. The bigger audiences spurred the creation of new bigger audiences spurred the creation of new content, which in turn further increased the content, which in turn further increased the audience on the Web and so on. As the number audience on the Web and so on. As the number of users on the Web increased, the browser of of users on the Web increased, the browser of choice was Mosaic so its distribution increased choice was Mosaic so its distribution increased accordingly. accordingly.

By December 1993, Mosaic's growth was so great By December 1993, Mosaic's growth was so great that it made the front page of the New York Times that it made the front page of the New York Times business section. The article concluded that business section. The article concluded that Mosaic was perhaps "an application program so Mosaic was perhaps "an application program so different and so obviously useful that it can create different and so obviously useful that it can create a new industry from scratch" (Reid, 17). NCSA a new industry from scratch" (Reid, 17). NCSA administrators were quoted in the article, but administrators were quoted in the article, but there was no mention of either Andreesen or there was no mention of either Andreesen or Bina. Marc realized that when he was through Bina. Marc realized that when he was through with his studies NCSA would take over Mosaic for with his studies NCSA would take over Mosaic for themselves. So when he graduated in December themselves. So when he graduated in December 1993, he left and moved to Silicon Valley in 1993, he left and moved to Silicon Valley in California. California.

Page 24: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2424

História do HipertextoHistória do Hipertexto

Avanço do hipertexto na Web – discutido Avanço do hipertexto na Web – discutido na aula passadana aula passada

Page 25: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2525

Elementos Básicos do HipertextoElementos Básicos do Hipertexto

NósNós ÂncorasÂncoras LinksLinks ImportanteImportante

É uma nova forma de escrever, onde a associação de É uma nova forma de escrever, onde a associação de idéias deve prevalecer em detrimento da linearidadeidéias deve prevalecer em detrimento da linearidade

Exemplos na literaturaExemplos na literatura As mil e uma noitesAs mil e uma noites The garden of forking paths - BorgesThe garden of forking paths - Borges

Page 26: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2626

Efeitos SociaisEfeitos Sociais

Hipertexto – não linearidade, objetivando Hipertexto – não linearidade, objetivando auxiliar na busca de informaçõesauxiliar na busca de informações

Novas maneiras de conceituar, estruturar, Novas maneiras de conceituar, estruturar, diagramar, ler, escrever diagramar, ler, escrever

Papel de autor e leitor se confudemPapel de autor e leitor se confudem Levy: “Com hipertexto, toda leitura é uma escrita Levy: “Com hipertexto, toda leitura é uma escrita

potencial” potencial” Autor divide autoriaAutor divide autoria Necessita do mesmo amadurecimento que ocorreu Necessita do mesmo amadurecimento que ocorreu

com a imprensa de Gutenbergcom a imprensa de Gutenberg

Page 27: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2727

Efeitos SociaisEfeitos Sociais Interatividade:Interatividade:

Rádio, TV, imprensa – difusão unilateral, apenas uma visão da realidade (dos Rádio, TV, imprensa – difusão unilateral, apenas uma visão da realidade (dos grupos proprietários da mídia)grupos proprietários da mídia)

Hipertexto: análise e crítica do leitor. O fluxo informacional pode ser reorientado, Hipertexto: análise e crítica do leitor. O fluxo informacional pode ser reorientado, interrompido em tempo real. Permite ainda a elaboração de obras coletivas interrompido em tempo real. Permite ainda a elaboração de obras coletivas (concatenação do conhecimento de vária pessoas)(concatenação do conhecimento de vária pessoas)

Papel de autor e leitor se confudemPapel de autor e leitor se confudem Levy: “Com hipertexto, toda leitura é uma escrita potencial” Levy: “Com hipertexto, toda leitura é uma escrita potencial” Autor divide autoriaAutor divide autoria Quebra dó paradigma da linearidade, da educação que nos foi dada – outra Quebra dó paradigma da linearidade, da educação que nos foi dada – outra

forma de pensarforma de pensar Necessita do mesmo amadurecimento que ocorreu com a imprensa de Necessita do mesmo amadurecimento que ocorreu com a imprensa de

GutenbergGutenberg Web é anarquica: qualquer pessoa pode publicar suas idéiasWeb é anarquica: qualquer pessoa pode publicar suas idéias Exclusão: ocorre como em qualquer outra forma de comunicação: escrita, Exclusão: ocorre como em qualquer outra forma de comunicação: escrita,

telefone, etc.telefone, etc. Universalidade, globalização – processo de produção da informação Universalidade, globalização – processo de produção da informação

horizontal, descentralizado e interativo.horizontal, descentralizado e interativo.

Page 28: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2828

Efeitos SociaisEfeitos Sociais

Quebra do paradigma da linearidade, interatividade, Quebra do paradigma da linearidade, interatividade, compartilhamento de informações promovem o compartilhamento de informações promovem o desenvolvimento de novas relações com o saber – desenvolvimento de novas relações com o saber – precisam ser absorvidos pelos métodos educacionais de precisam ser absorvidos pelos métodos educacionais de contrução do conhecimentocontrução do conhecimento Aprender a aprenderAprender a aprender Aprender coletivamente e de forma interativaAprender coletivamente e de forma interativa Quanto mais participativa a apreensão do conhecimento melhorQuanto mais participativa a apreensão do conhecimento melhor Acesso ilimitado a informaçãoAcesso ilimitado a informação Filtragem da informação (aprender a ir direto ao que interessa)Filtragem da informação (aprender a ir direto ao que interessa) Desenvolvimento do aspecto cognitivo de forma personalizada Desenvolvimento do aspecto cognitivo de forma personalizada

(tours guiados, livre seguir de links, buscas diretas)(tours guiados, livre seguir de links, buscas diretas) Ensino a distância, bibliotecas virtuaisEnsino a distância, bibliotecas virtuais

Page 29: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 2929

DesvantagensDesvantagens

Desorientação no hiperspaçoDesorientação no hiperspaço Ferramentas de buscas ineficientesFerramentas de buscas ineficientes Anarquia – “o que é informação boa” Anarquia – “o que é informação boa”

Page 30: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3030

Substituiçao de TecnologiasSubstituiçao de Tecnologias

Uma tecnologia não substitue as outrasUma tecnologia não substitue as outras A imprensa não eliminou a comunicação oral ou a A imprensa não eliminou a comunicação oral ou a

manuscritamanuscrita A fotografia não acabou com a pinturaA fotografia não acabou com a pintura A TV não acabou com o rádio ou com o teatroA TV não acabou com o rádio ou com o teatro O vídeo e a TV a cabo não acabou com o cinemaO vídeo e a TV a cabo não acabou com o cinema

Uma nova tecnologia influencia outras, e cria Uma nova tecnologia influencia outras, e cria uma nova forma de comunicaçãouma nova forma de comunicação Marshall McLuhan - em “Understanding Media” “o Marshall McLuhan - em “Understanding Media” “o

meio é a mensagem” descreve como a tecnologia meio é a mensagem” descreve como a tecnologia mudou as relações sociais e as ações mentais. mudou as relações sociais e as ações mentais.

Page 31: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3131

Futuro do HipertextoFuturo do Hipertexto

Futuro:Futuro: Videos que vimos: integração massiva das Videos que vimos: integração massiva das

mídiasmídias

Page 32: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3232

ExercícioExercício Ler:Ler:

http://www-writing.berkeley.edu/TESL-EJ/http://www-writing.berkeley.edu/TESL-EJ/ej16/int.htmlej16/int.htmlEm grupo: Montar uma história ( 1 hora)Em grupo: Montar uma história ( 1 hora)Apresentar para a classe (10 minutos)Apresentar para a classe (10 minutos)Cada grupo deve ter uma pessoa que sabe mexer com Cada grupo deve ter uma pessoa que sabe mexer com power point (fazer links) ou com um editor HTMLpower point (fazer links) ou com um editor HTMLDicas: conceituem, trabalhe em grupo, divisão de tarefas, Dicas: conceituem, trabalhe em grupo, divisão de tarefas, comunicaçãocomunicação Ler: Miller, G.A., The Magical Number Seven, plus or Ler: Miller, G.A., The Magical Number Seven, plus or minus two: some limitations on our capacity for processing minus two: some limitations on our capacity for processing information – http://www.well.com/user/smalin/miller.htmlinformation – http://www.well.com/user/smalin/miller.html

2 - Aspectos econômicos, sociais e legais

Page 33: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3333

BibliografiaBibliografia

http://www.eastgate.com/Courses.htmlhttp://www.eastgate.com/Courses.html

http://www.eastgate.comhttp://www.eastgate.comhttp://xanadu.com.au/ted/TN/PUBS/LM/LMpage.htmlhttp://www.netvalley.com/intval3.html#linkhttp://www.cs.brown.edu/memex/ACM_HypertextTestbed/papers/19.html

http://sunahweb.com/wilbur/demo/history.shtmlhttp://mercury.sfsu.edu/~infoarts/links/interactive.theory.htmlhttp://www.netteach.com/courses/001/lectures/Unit2/weblio.htm#hypertext

2 - Aspectos econômicos, sociais e legais

Page 34: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3434

BibliografiaBibliografia

http://www.sun.com/950523/columns/alertbox/histohttp://www.sun.com/950523/columns/alertbox/history.htmlry.htmlhttp://www.thecore.nus.edu.sg/sts/ccst02/http://www.thecore.nus.edu.sg/sts/ccst02/syllabus.htmlsyllabus.htmlhttp://www.thecore.nus.edu.sg/landow/cpace/ht/http://www.thecore.nus.edu.sg/landow/cpace/ht/jhup/contents.htmljhup/contents.htmlhttp://www.thecore.nus.edu.sg/landow/cpace/http://www.thecore.nus.edu.sg/landow/cpace/infotech/infotechov.htmlinfotech/infotechov.htmlhttp://www.robotwisdom.com/web/timeline.htmlhttp://www.robotwisdom.com/web/timeline.html

2 - Aspectos econômicos, sociais e legais

Page 35: ´Metodologia de Produção e Mídias Interativas 1 Aula 2 Hipertexto Como Projetar Mylene Melly

Aula 2Aula 2 Metodologia de Produção de Mídias InterativasMetodologia de Produção de Mídias Interativas 3535

BibliografiaBibliografia

http://sloan.stanford.edu/mousesite/1968Dehttp://sloan.stanford.edu/mousesite/1968Demo.htmlmo.htmlDias, C. A., Hipertexto: evolução histórica Dias, C. A., Hipertexto: evolução histórica e efeitos sociais, Ci. INf. Brasília v.28, n. 3 e efeitos sociais, Ci. INf. Brasília v.28, n. 3 p. 269-277, set./dez. 1999p. 269-277, set./dez. 1999

2 - Aspectos econômicos, sociais e legais