Hi Per Textual Ida Des - Mercia Assis

São Paulo - 2008
Dissertação apresentada ao Programa de Pós-Graduação

Stricto Sensu em Design - Mestrado, da Universidade Anhembi
Morumbi, como requisito parcial para obtenção do título de
Mestre em Design
a a
Orientadora: Prof . Dr . Mônica Moura
São Paulo - 2008

Hipertextualidades.com[plexidade]:
os múltiplos caminhos da informação no design de hipermídia.
Dissertação apresentada ao Programa de Pós-Graduação

Stricto Sensu em Design - Mestrado, da Universidade
Anhembi Morumbi, como requisito parcial para obtenção
do título de Mestre em Design. Aprovada pela seguinte
Banca Examinadora:
a a
Prof . Dr . Mônica Moura
Orientadora
Mestrado em Design Anhembi Morumbi
a a
Prof . Dr . Sílvia de Laurentiz
Universidade de São Paulo
Profa. Dra. Cláudia Marinho

Prof. Dr. Jofre Silva

São Paulo - 2008

Todos os direitos reservados. É proibida a reprodução total ou
parcial do trabalho sem autorização da Universidade, do autor e do
orientador.
Tem graduação em Educação Artística com ênfase em Computação Gráfica e

Multimídia (1998) e especialização Lato Sensu em Design de Hipermídia
(2002) ambas pela Universidade Anhembi Morumbi. É professora do curso de
graduação em Design Digital, bem como do curso de pós-graduação Lato
Sensu em Design de Hipermídia da mesma Universidade. Tem experiência
também como profissional atuante em design, programação e análise de
sistemas de dados.
A311h Albuquerque, Mércia de Assis.

Hipertextualidades.com[plexidade]: os múltiplos
caminhos da informação no design de hipermídia. /
Mércia de Assis Albuquerque. 2008.
75f.: il.: 30 cm.
Orientadora: Mônica Moura

Dissertação (Mestrado em Design) Universidade
Anhembi Morumbi, São Paulo, 2008.
Bibliografia: f.71-73.
1. Hipertexto 2. Design. 3. Informação. 4. Hipermídia

I. Hipertextualidades.com[plexidade]: os múltiplos
caminhos da informação no design de hipermídia.
CDD 741.6.
DISSERTAÇÃO DE MESTRADO
DEDICATÓRIA
Dedico este trabalho a meus pais, que apesar de suas

condições humildes jamais dispensaram esforços para a
educação dos filhos; a minha família, suporte material e
emocional tornando o percurso mais leve e agradável; e a meus
amigos, que comprovam que as relações familiares podem ir
muito além das paredes de uma casa e de laços sangüíneos.
AGRADECIMENTOS
A Professora Mônica Moura, minha orientadora, pela confiança

em mim depositada e pelo apoio e incentivo em mais este
desafio.
Aos professores do Mestrado em Design da Universidade

Anhembi Morumbi que no decorrer do curso apontaram
caminhos e abriram portas.
A Professora Hamide Assain José cuja disposição e interesse

são exemplos a serem seguidos.
Agradeço também, aos colegas de trabalho que me mantiveram

firme nos momentos mais difíceis.
RESUMO
Esta pesquisa discute os recursos do hipertexto como instrumento de navegação

e interação nos meios digitais, principalmente na Web, e as possibilidades de
acesso à informação e à comunicação disponibilizadas no ciberespaço a partir
dele. Objetiva a contextualização do hipertexto no momento atual, abordando
alguns modelos em prática e sua comparação com conceitos historicamente
reconhecidos, apontando o distanciamento entre a teorização, e a efetiva
aplicação dessas teorias o que nos leva, conseqüentemente, a um apro-
veitamento inadequado da tecnologia, ou a um desperdício de esforços para
alcançar objetivos. Detecta, por meio da descrição, análise e comparação o uso
de modelos díspares de aplicação da hipertextualidade na Web hoje, com o
intuito de apontar a importância de suas características próprias na construção
de repertório para o designer e na aproximação com o interator. Aproxima teoria e
prática no campo do design de hipermídia, refletindo sobre suas contribuições
mútuas. E propõe a construção de um espaço hipertextual de caráter
experimental onde essas questões possam ser pontuadas e discutidas.
PALAVRAS-CHAVE: Hipertexto. Hipermídia. Informação. Design.
ABSTRACT
This research discuss the resources of the hypertext as an instrument navigation

and interaction in the digital background, mainly on the Web, and the
possibilities of access to the available information and communication in the
cyber space coming from it. Aims the contextualization of the hypertext
nowadays, dealing with some models actually used and comparing them with
concepts historically recognized, pointing the distance between the theorization
and the effective application of those theories, which consequently take us to an
unappropriated use of the technology, or a waste of efforts to achieve results.
Detects, by the description, analysis and comparation the use of different
application models of the hypertextuality on the web today, intending to point the
importance of its own characteristics in the construction of repertoire for the
designer and in the approximation to the interator. It brings theory and practice
closer in the hypermedia desing background, reflecting on its mutual
contributions. And propose the construction of a hypertextual space with an
experimental character where these questions can be pointed and discussed.
KEYWORDS: Hypertext. Hypermedia. Information. Design.

DISSERTAÇÃO DE MESTRADO 01
SUMÁRIO
Introdução
1 Hipertexto: definição 03
1.1 O que é o hipertexto? 03
1.2 Princípios do hipertexto 13
1.3 Principais elementos do hipertexto 19

1.3.1 O "Hyperlink", "Link" ou Vínculo 19
1.3.2 Os blocos de texto ou lexias 21
1.4 Tendências do hipertexto na web 2.0 e 3.0 21
2 Aplicações do hipertexto: "wiki"e "experimental" 29
2.1 Com foco na estrutura: o exemplo das 'wikis' 30
2.1.1 O conceito de 'wikis' 30
2.1.2 Análise de caso 31
2.1.2.1 Conhecendo o sistema "wiki" escolhido 32
2.1.3 Construção do projeto - Percursos:Hipertextualidades 36
2.2 Com foco na linguagem: o exemplo dos sites experimentais 40
2.2.1 Buscando o conceito de "site experimental" 41
2.2.2 Análise de caso 43
2.3 Aplicação dos recursos hipertextuais neste projeto 52
3 Percurso do processo: teoria e prática 53
3.1 Percurso profissional: pensando no usuário de computadores e sua
relação com o sistema. 55
3.2 Projeto do Site 60
Considerações finais 65
Referências Bibliográficas 68
LISTA DE FIGURAS
FIGURA 001_web
FIGURA 001 Representação do hipertexto 04
FIGURA 002 "Lê Diverse et artifiose machine" FIGURA 002_web
05
FIGURA 003_web
FIGURA 003 Imagem da simulação animada do MEMEX 08
FIGURA 004_web
FIGURA 004 Interface do Projeto Xanadu 10
FIGURA 005_web
FIGURA 005 Exemplo de estrutura rizomática 18
FIGURA 006 Parte do quadro: Os três tempos da Internet - web 1.0 22
FIGURA 008 Interface de abertura do espaço - Freakpedia 25
FIGURA 006_web
FIGURA 009 Interface do Projeto Desciclopedia 26
FIGURA 010 Interface do Site Yahoo Pipes 27
FIGURA 007_web
FIGURA 012 Interface inicial da Incubadora Fapesp 32
FIGURA 008_web
FIGURA 013 Interface interna da Incubadora Fapesp 33
FIGURA 009_web
FIGURA 014 Interface do formulário de inscrição 34
FIGURA 010_web
FIGURA 015 Tanque de areia - área de testes 36
FIGURA 011_web
FIGURA 016 Opções de configuração do sistema 37
FIGURA 017 Detalhe da Interface de configuração do portal 37
FIGURA 018 Opções de aparência padrão FIGURA 012_web 38
FIGURA 013_web
FIGURA 019 Configurações passo a passo 39
FIGURA 020 Como carregar o logotipo do projeto 39
FIGURA 021 Interface inicial do Projeto - Percursos: hipertextualidades 40
FIGURA 022 Quadro: verbete - experimental 41
FIGURA 014_web
FIGURA 023 Interface de carregamento do portfólio digital 43
FIGURA 024 Interface de carregamento e texto apresentado FIGURA 015_web
44
FIGURA 025 Interface principal do portfólio digital FIGURA 016_web 45
FIGURA 017_web
FIGURA 026 Segundo nível de informações com a barra de navegação mais pop-up com ilustração 46
FIGURA 027 Interfaces abertas em uma janela pop-up com informações do llustrador e contato FIGURA 018_web 46
FIGURA 028 Interfaces abertas em uma janela pop-up com informações do llustrador e contato 46
FIGURA 019_web
FIGURA 029 Interface de abertura do portfólio digital 47
FIGURA 030 Interface principal do site FIGURA 020_web
47
FIGURA 031 Parte inferior da interface principal do site FIGURA 021_web
48
FIGURA 032 Interface de abertura do portfólio digital 49
FIGURA 022_web
FIGURA 033 Interface principal do site 49
FIGURA 023_web
FIGURA 034 Interface interna do mesmo site 49
FIGURA 024_web
FIGURA 035 Personagem animado constante em toda a navegação 49
FIGURA 036 Interface do site mjau-mjau 50
FIGURA 025_web
FIGURA 037 Interfaces do site Soundspace 51
FIGURA 026_web
FIGURA 038 Interfaces do site Anonymes 51
FIGURA 027_web
FIGURA 039 Interfaces do site Anonymes 52
FIGURA 040 Pop up com a primeira versão 58
FIGURA 041 Pop up com a quinta versão 58
INTRODUÇÃO
Txt_062_Web
O presente trabalho busca apontar a relevância do estudo do hipertexto para o
estabelecimento de uma base conceitual voltada ao desenvolvimento de novos
Codificação utilizada para

recursos comunicacionais, de informação e de criação no universo do design de
acesso direto aos blocos de
texto relacionados na versão hipermídia.
online desta dissertação.
Um dos nossos objetivos é identificar os princípios e elementos do hipertexto,

apontando seus recursos como uma ferramenta de navegação e interação capaz
de facilitar a experiência do interator na sua busca de informação e comunicação
no ambiente da Web, marcado pela mediação do computador, apontando as
novas possibilidades da mídia. Essa mediação obrigatória da máquina, seja ela
um computador, um celular ou um iPod, se apresenta como um complicador na
relação do sujeito com a informação digitalizada, uma vez que, exige um
aprendizado técnico e o limita a sua rigidez física. A chamada “computação
ubíquoa” discute este afastamento da interface física propondo a “computação
invisível”, ou que usaremos sem perceber por estar ela inserida em nosso
ambiente do cotidiano ativada a partir de sensores colocados em roupas, móveis
ou em outros objetos.
Txt_063_Web
Para alcançar este objetivo, no Capítulo 1 buscamos definições historicamente
reconhecidas e as comparamos com a realidade atual da Web considerando sua
evolução que foi marcada pelas rotulações assumidas no meio como, a Web 1.0,
marcada pela preocupação com o armazenamento e a disponibilização de
dados. A Web 2.0, com ponto forte na construção coletiva de conhecimento e
Web, como o exemplo da Wikipedia e sua capacidade de armazenamento,
organização e disponibilização de dados praticamente em tempo real e, a partir
da livre colaboração dos interatores, muito embora, esta liberdade possa ser
somente aparente, uma vez que existem regras para a publicação das
informações. Apresentamos projetos que criticam a falta da liberdade prometida
e propõe um exercício de colaboração real. A Web 3.0, aquele espaço onde o
Txt_063_Web
computador poderá analisar as intenções do interator a partir dos dados
fornecidos e ajudá-lo nas suas decisões, também chamada de Web Semântica.
Baseamo-nos nestas rotulações apenas como critério de comparação e não para
criar juízo de valores ou uma simples datação, uma vez que todos os modelos co-
existem até hoje e se mantém por suas qualidades específicas.
Txt_064_Web
Em seguida, selecionamos e classificamos algumas formas de aplicações
possíveis do hipertexto considerando os levantamentos anteriores. Demonstrar
o uso do hipertexto em projetos atuais foi mais um de nossos objetivos, e
escolhemos duas formas distintas para fazê-lo: a primeira analisando-o como
estrutura, trazendo o exemplo da 'wikis'. A segunda analisando-o como
linguagem, trazendo exemplos de aplicações experimentais, interativas e
exploratórias. Estas análises encontram-se no capítulo 2 e tem o intuito de nos
aproximar da maneira como os designers exploram, atualmente, suas
possibilidades e de cruzar esses métodos de trabalho extraindo novos
resultados para a aplicação no projeto digital que resultará desta pesquisa.
Txt_064_Web
Finalmente, no Capítulo 3, relatamos nossa aproximação gradativa ao objeto de
estudo que se fez por meio de experiências práticas nos âmbitos profissionais e
pessoais e que se deu muito antes do escopo desta pesquisa. Apontamos a
importância de um repertório pessoal para o designer que o ajudará a construir
novas relações entre o homem e a informação, a partir da exploração e da
experimentação de novos recursos comunicacionais, possíveis com as novas
tecnologias. Projetos anteriores são trazidos à discussão atual como
constituintes desse processo prático e criativo.
1. Hipertexto: definição
1.1. O que é o hipertexto?
Txt_001_Web
Vários pesquisadores responderam à pergunta: O que é o hipertexto? Ao
mesmo tempo em que experiências foram lançadas ao uso e análise do público,
ou seja, suas respostas surgiram principalmente à luz de resultados e
comparações e continuam se sobrepondo e se ampliando perante aos recursos
tecnológicos aplicados e reavaliados, as perguntas nasceram simultâneas às
experiências e vivências. A organização e disponibilização da informação, seja
ela, textual, imagética ou sonora, na Web, é o principal objeto deste estudo, e as
possibilidades de armazenamento e acesso dessas informações estão
inerentemente ligadas aos recursos do hipertexto enquanto sistema organizador
da hipermídia e, para Mônica Moura trabalhar com hipermídia significa
relacionar linguagens diferentes na construção de uma linguagem própria ao
meio, diz ela: “Quando pensamos em hipermídia temos que nos remeter à
associação e inter-relação de várias linguagens que isoladamente tem suas
características próprias, mas em união no processo hipermidiático produzem
uma nova abordagem”. Já Silva Junior descreve a hipermídia relacionando-a ao
momento vivido pela tecnologia:
Hipermídia: é a modalidade surgida da convergência entre as

características do hipertexto e da multimídia, porém com
navegação aberta, e capacidade, graças à digitalização, de
ser disseminada em suportes e plataformas os mais distintos,
criando o que denominamos de estado de disseminação e
disponibilização hipermidiática.
[SILVA JUNIOR, 2001, p. 134-135]
acesso direto às citações na CIT_001_Web
versão online desta
dissertação.
Txt_002_Web A principal pergunta deste trabalho é: O que é o hipertexto e o que ele

representa para a hipermídia e para a informação na Web?, considerando o
compromisso comunicacional que ganha novas proporções com o advento da
expansão dos meios eletrônicos e com o surgimento de novos paradigmas.
1
Neste trabalho ao utilizarmos a denominação Web estamos nos referindo a Word Wide Web
sistema de documentação e associação de documentos.
03
Txt_002_Web
Partindo de abordagens já existentes, buscaremos as respostas mais
pertinentes a esta proposta, considerando os esforços anteriores e extraindo do
seu cruzamento indagações que nos levem a refletir mais profundamente sobre
o tema quando direcionadas ao nosso universo de pesquisa e ao momento em
que se insere.
George Landow [1995, p.14] descreve o hipertexto como “um texto composto de
blocos de palavras, ou de imagens, ligadas eletronicamente por múltiplos
caminhos, correntes ou seqüências numa textualidade aberta, perpetuamente
inacabada e descrita pelos termos ligação, nó, rede, teia e caminho” CIT_002_Web .
Veja uma representação desta descrição na Figura 1. Podemos observar na

afirmação do autor alguns dos principais pontos que evidenciam a necessidade
de investigação desse objeto. Temos aqui descritos alguns elementos e algumas
características do hipertexto como, os blocos de palavras ou imagens, a
multiplicidade de caminhos levando a uma leitura mais aberta, construída a
partir das escolhas de cada um, as correntes ou seqüências que garantem a
construção do texto maior, marcando trajetos, e ainda, nos deparamos com
termos como ligação, nó, rede, teia e caminho que caracterizam a materialidade
necessária para a visualização do texto, enquanto estrutura no espaço virtual em
que se insere.

acesso direto às figuras na FIGURA 001_web
versão online desta
dissertação.
FIGURA 1: Representação do Hipertexto

Fonte: a autora.
Txt_003_Web
A construção da leitura e de significados dentro desta liberdade de escolha é um
dos elementos mais discutidos na área com clara intenção de aproximar os
métodos tradicionais de leitura e a leitura hipertextual, Bellei [2002, p. 48].
coloca:
Toda leitura, mesmo do texto impresso, é uma reconstrução

de sentido, em que cada leitor tem certa liberdade de escolher
caminhos, definir ênfases, optar por certos sentidos em
relação a outros, tudo isso de forma a atender preferências
ideológicas, pessoais ou idiossincráticas. Toda leitura, seja ela
textual ou hipertextual, implica descoberta ou invenção de
roteiros.
CIT_003_Web
Para Bellei, a simples possibilidade de escolher o que ler e como ler não justifica
defender a potencialidade do hipertexto eletrônico, torna-se necessário
considerar as alterações ocorridas na "maneira de construir sentidos" a partir de
sua utilização. O autor conclui seu pensamento salientando que a diferença está
no fato do hipertexto ser um grande banco de dados em que cada unidade de
sentido já traz explícitas sugestões para a conexão com outras unidades ou
blocos de sentido: “o hipertexto é um texto que tem as suas unidades de
significado organizadas em termos de rede, e não em termos do que Robert
Coover chamou de a tirania da linha” [BELLEI, 2002, p.48]. CIT_004_Web
Outros fatores a serem considerados são o aumento da velocidade de leitura e a

mudança na forma de armazenamento das informações possibilitadas pelos
meios digitais, há na nossa história momentos marcantes em que
pesquisadores inquietos buscaram alcançar este objetivo vejamos o exemplo
apresentado na Figura 2.
FIGURA 002_web
FIGURA 2: Bookwhell, from Agostinho Ramelli´s

“Lê diverse et artifiose machine” 1588
Fonte: http://en.wikipedia.org
Txt_003_Web
Como podemos notar, já em 1588, alguém pensou em construir uma “máquina
de leitura” que possibilitasse ao pesquisador o acesso a diversos livros ao
mesmo tempo sem que tivesse que sair do lugar.
Txt_004_Web
Com o surgimento das tecnologias digitais e da versatilidade assumida pela
matéria, ou mesmo pela desmaterialização do suporte, se tornou possível
potencializar a leitura, porque além de duplicar o livro, o computador pode
radicalizar sua forma possibilitando uma leitura hipertextual [BELLEI, 2002]. A
velocidade com que a tecnologia avança é um fator importantíssimo no
entendimento dessas mudanças. Gordon Moore co-fundador da Intel
Corporation, já em 1965 publicou um artigo na “Electronics Magazine” onde
defendia um conceito que mais tarde seria conhecido como a “Lei de Moore”,
dizia ele que a cada 18 ou, no máximo, 24 meses a capacidade de
processamento dos computadores dobraria, enquanto os custos
permaneceriam constantes. Essa lei é considerada como verdadeira ainda hoje,
e alguns especialistas defendem que assim permanecerá por mais algumas
gerações de processadores pelo menos até que a sua miniaturização alcance o
limite físico possível.
Txt_005_Web
Dados referentes ao equipamento ou “hardware” e sua evolução,
comercialização e disseminação como objeto popular podem nos ajudar a
entender as mudanças ocorridas nos programas ou “softwares” que, por meio
da lógica, são responsáveis por permitir a exploração adequada desses
equipamentos. Não adiantaria ter um equipamento super capacitado se seu uso
estivesse limitado por processos complexos e inviáveis a pessoas não
especializadas. As ampliações das possibilidades no uso do hipertexto
eletrônico acompanham esta realidade, ou seja, melhorando a máquina,
melhoram também as formas de relacionamento com o usuário, ficando cada
vez mais fácil, para este, entender e interagir com sistema. Outra forma de ver o
hipertexto é a de André Parente [1999] que o destaca tomando-o pelo viés da
funcionalidade, ou seja, ele o caracteriza por suas possibilidades de
estruturação e organização de um amplo material disponível para quem quiser e
puder acessá-lo, lembrando que se trata de uma idealização. Ressaltam-se
ainda outros pontos de sua análise, como o acesso intuitivo à base de dados e o
auxílio à argumentação que enfatizam a importância do hipertexto como uma
ferramenta capaz de ajudar o interator a ampliar sua capacidade de raciocínio
com a tomada de decisões rápidas e facilitando o trabalho em grupo, que poderá
ser desenvolvido simultaneamente.
Txt_006_Web
Theodor Holm Nelson, ou simplesmente, Ted Nelson [1992 apud LEÃO, 2001,
p.20] como é mais conhecido, é considerado o inventor do termo “hipertexto”,
uma vez que em meados dos anos 1960 declarava sua crença na possibilidade
de um suporte que assegurasse o acesso a uma leitura não seqüencial, em 1992
ele afirma que “as idéias não precisam ser separadas nunca mais [...]. Assim, eu
defino o termo hipertexto simplesmente como escritas associadas não
seqüenciais, conexões possíveis de se seguir, oportunidades de leitura em
diferentes direções” CIT_005_Web , no entanto, em 2005 considerando as reais
aplicações do hipertexto na web ele fala sobre sua preocupação com a forma de
utilização das possibilidades existentes:
Agora considere a World Wide Web. Apesar de alguns de nós estarmos

falando em hipertexto em escala planetária há anos, ela surgiu como
um choque quase generalizado. Poucos notaram que ela diluía e
simplificava a idéia do hipertexto.O hipertexto, como foi repentinamente
adaptado para a internet por Berners-Lee e depois Andreessen, ainda é
o modelo do papel! De suas longas folhas retangulares,
adequadamente chamadas de “páginas”, só se pode escapar por links
de mão única. Não pode haver anotações à margem. Não pode haver
notas (pelo menos não na estrutura profunda). A web é a mesma prisão
de quatro paredes do papel que o Mac e o Windows PC, com a menor
concessão possível à escrita nãoseqüencial (“escrita não-seqüencial”
foi minha definição original de hipertexto em 1965) que um chauvinista
da seqüência-e-hierarquia poderia ter feito. Enquanto o Projeto Xanadu,
nosso plano original que foi derrotado pela web, baseava-se
amplamente em links de mão dupla, por meio dos quais qualquer
pessoa poderia anotar qualquer coisa. (E pelos quais os pensamentos
podiam se ramificar lateralmente sem bater nas paredes.)] [NELSON,
2005, p.21].
CIT_006_Web
Em seu desabafo fica claro que ele desaprova o modelo disseminado na Web,
que estabelece ligações muito fortes com a mídia impressa, passando inclusive
a utilizar denominações características desta como, por exemplo, o uso da
palavra página, assumida naturalmente para representar uma interface
bastante complexa e que remete conseqüentemente à linearidade natural do
livro, herdando também o recurso de paginação estabelecida pela seqüência de
Txt_006_Web
Páginas que constitui um documento na Web. Para ele, é preciso abstrair o
espaço retangular do monitor para que o texto possa fluir adequadamente e
tornar a navegação mais livre.
Txt_007_Web
Vannevar Bush, que em 1945 em seu artigo "As We May Think" [O Modo como
Pensamos], propunha a construção do “Memex” [Figura 3], um dispositivo no
qual um indivíduo armazena os dados, e que por meio de mecanismos permite a
consulta a eles, reproduzindo os processos mentais humanos de associação de
idéias. Essas informações estariam disponíveis na máquina como uma
expansão da memória do indivíduo e ligadas por associações entre os assuntos,
podendo ser textuais, visuais e sonoras. O conceito do hipertexto já se fazia
presente, principalmente na quebra da linearidade da leitura e na forma de
agilizar o acesso às informações em um banco de dados pensado para
possibilitar a troca rápida de conhecimento. Com o advento da Web a facilidade
de produção e disseminação da informação também trouxe à tona novas
discussões sobre as questões de autoria das produções culturais nos meios
eletrônicos. Na hipermídia o conhecimento se faz com a somatória de diversos
saberes que se complementam e se fortalecem. Estes saberes partem de muitos
pontos, quase simultaneamente, tornando-se impossível determinar o ponto
inicial. Diferente do modelo anteriormente estabelecido com a produção
assinada e fechada, que ainda tem sua representação, mesmo na Web.
Porém o importante é o fato, o evento e suas conseqüências diretas e não quem

o registrou e apontou. Ted Nelson propõe algumas soluções para se estabelecer
uma relação mais sadia entre o “autor original”, ou devemos dizer “autor
inicial”?, e os colaboradores que co-assinam a produção cultural.
FIGURA 003_web
FIGURA 3: Imagem da simulação animada do “Memex”.

Fonte: http://sloan.stanford.edu
Txt_008_Web
A relação do homem com os dados em formato eletrônico desde que são
colhidos, passando por sua organização e disponibilização, até finalmente
chegar ao usuário e se transformar em conhecimento só é possível por meio de
um sistema que traduza os códigos numéricos processados pelo computador em
novos códigos compreensíveis pela percepção humana. Esse objeto mediador é
conhecido por “Interface” e sua construção se apresenta como um constante
desafio para o Design de Hipermídia. Isto se deve a relação histórica e tensa
entre o homem e a conotação atribuída às máquinas: exatidão, frieza e
distanciamento da sensibilidade humana. Edmond Couchot [1996, p. 46],
falando sobre a relação Arte e as Tecno-Ciências [ou Tecnologia] aponta o
problema da aproximação homem e máquina.
O problema para o artista que se limita a manipular instrumentos se

não inteligentes, pelo menos oriundos das tecno-ciências, é o de
mudar a destinação originária desses modelos que são concebidos
para produzir conhecimento e não arte, de transformar as certezas
das ciências em incertezas da sensibilidade, em gozo estético, e
esse excesso de clareza, em sombra.
CIT_007_Web
A aproximação do Design com a Arte reforça a veracidade desse

questionamento, principalmente quando das escolhas projetuais do designer
em relação ao desenvolvimento de interfaces amigáveis e envolventes, é preciso
e é possível, “des-maquinizar” a linguagem dos espaços hipermidiáticos,
tornando-os mais afeitos à sensibilidade e aos modelos mentais do homem, da
mesma forma que o “Memex” foi idealizado para imitar a agilidade em associar
de idéias da mente humana, chegando ao modelo de leitura hipertextual que
temos hoje. A aproximação do Design com a Arte reforça a veracidade desse
questionamento, principalmente quando das escolhas projetuais do designer
em relação ao desenvolvimento de interfaces amigáveis e envolventes, é preciso
e é possível, “des-maquinizar” a linguagem dos espaços hipermidiáticos,
tornando-os mais afeitos à sensibilidade e aos modelos mentais do homem, da
mesma forma que o “Memex” foi idealizado para imitar a agilidade em associar
de idéias da mente humana, chegando ao modelo de leitura hipertextual que
temos hoje.
Txt_008_Web
Nas reproduções de interfaces do “Xanadu Space” [Figura 4], percebemos a
disposição do conteúdo no espaço tridimensional e os caminhos possíveis para
a leitura do texto.
Txt_009_Web
Considerando o limite físico do teclado o aprendizado de suas outras funções na
manipulação espacial da interface deve se completar em um tempo
razoavelmente curto e totalmente aceitável se estivermos principalmente
preocupados em experimentar o novo. Usar o teclado também nos afasta da
metáfora do “livro” ou da “paginação” tradicional, o interator pode buscar a
informação como se ela fosse um objeto solto no ambiente e a seqüência da
leitura fica a seu critério, mesmo sendo sugerida pelas faixas coloridas que
mostram caminhos possíveis. O “Xanadu Space” é mais um exercício, um
exemplo do que se pode oferecer ao interator, porém, passados mais de
quarenta anos das primeiras preocupações de Ted Nelson com o hipertexto
ainda buscam-se formas e fórmulas ideais, uma vez que são muitas as
possibilidades de apresentação e utilização desse modelo. Talvez possamos
entender o fascínio de desenvolvedores e interatores se o observarmos como um
grande “jogo” [considerando também as interfaces do “Xanadu Space”]
na busca de informação. Navegar, viajar, surfar, buscar, escolher,
encontrar, acumular, observar, e conhecer são verbos que caracterizam
ações na complexidade apresentada pelo ciberespaço e que se
assemelham aos usados em muitos jogos. Parece-nos que estabelecer o
design de informação de um grande banco de dados é uma tarefa muito
próxima a de projetar o roteiro de um jogo considerando todas as
possibilidades de ações que se apresentam a partir da intervenção do
jogador.
FIGURA 004_web
FIGURA 4: Interface do Projeto Xanadu

Fonte: http://xanadu.com - 2007
Txt_010_Web
Pierre Lévy [1993, p. 33] também tem suas convicções em relação ao hipertexto
e, de certa forma opondo-se ao que coloca Ted Nelson, ele o descreveu do ponto
de vista da técnica e da funcionalidade:
Tecnicamente, um hipertexto é um conjunto de nós ligados por

conexões. Os nós podem ser palavras, páginas, imagens, gráficos ou
partes de gráficos, seqüências sonoras, documentos complexos que
podem eles mesmos ser hipertextos. Os itens de informação não são
ligados linearmente, como em uma corda com nós, mas cada um
deles, ou a maioria, estende suas conexões em estrela, de modo
reticular. Navegar em um hipertexto significa, portanto, desenhar um
percurso em uma rede que pode ser tão complicada quanto possível.
Porque cada nó pode, por sua vez, conter uma rede inteira.
Funcionalmente, um hipertexto é um tipo de programa para a
organização de conhecimentos ou dados, a aquisição de informações
e a comunicação.
CIT_008_Web
Sua descrição, bastante otimista, enfatiza que os elementos de construção do

hipertexto não se limitam às palavras, mas são enriquecidos por imagens,
gráficos, seqüências sonoras e até mesmo outros textos, construídos com a
mesma complexidade do primeiro, dentro de uma estrutura não linear. Fala
também sobre a flexibilidade que passa a fazer parte da constituição do texto,
algo esperado, e que deve ser explorado na sua construção. Para ele o hipertexto
é dinâmico e se desdobra diante do interator, mostrando suas várias faces, se
modificando, se dividindo para outra vez se multiplicar, trazendo escondidas em
uma palavra, ou em um trecho do texto, infinitas possibilidades de ramificações
e interpretações. Ele ainda pontua alguns elementos do hipertexto como os nós e
as conexões. Para colaborar com a definição do hipertexto, citaremos Lucia Leão
que acrescenta à discussão as peculiaridades da interação e dos recursos
automáticos de acesso às informações, como as ferramentas de busca.
O hipertexto é um documento digital composto por diferentes blocos de

informações interconectadas. Essas informações são amarradas por
meio de elos associativos, os links. Os links permitem que o usuário
avance em sua leitura na ordem que desejar. Além do modelo
hipertextual baseado no binômio “elos & blocos de textos”, existem
sistemas com outros tipos de estruturas interativas [relações, séries,
série de Petri, etc.], Através dessas estruturas interativas, o leitor
percorre a trama textual de uma forma única, pessoal. Um dos recursos
que o usuário pode utilizar é o search [busca]. Este recurso rastreia um
CIT_009_Web
Txt_010_Web
Mais um elemento importante para o funcionamento do hipertexto é apontado
nesta descrição, o link ou hyperlink, que merecerá uma análise especial neste
trabalho, considerando o peso que assume na navegação, sendo sua adequada
constituição um dos motivos que leva o interator a escolher entre diversos
caminhos, os quais poderá seguir. Para Johnson [2001, p.84], um link, também
chamado de elo ou vínculo, é “uma maneira de traçar relações entre coisas, uma
maneira de forjar relações semânticas [...] um link desempenha um papel
conjuncional, ligando idéias díspares em prosa digital” CIT_010_Web. Outros
recursos como as ferramentas de busca são amplamente difundidos e utilizados

e justificam o investimento nas pesquisas que exploram as potencialidades do
hipertexto. Estas ferramentas são muitas vezes lançadas e utilizadas como
laboratórios de testes, sendo seus resultados distribuídos para outros fins.
Txt_011_Web O que é o hipertexto e o que ele representa para a hipermídia e para a informação
na Web?. Podemos olhá-lo pelo viés da estrutura e entender como os dados
passaram a ser armazenados para garantir as associações dos blocos de
informações e, neste caso, a construção hipertextual é organização de conteúdo.
Olhando-o como método ou ferramenta de navegação, destacamos a
importância dos links como elos associativos que além de agir funcionalmente
ligando um bloco de texto a outro, deve também levar o interator a fazer suas
escolhas, seduzindo-o a partir de uma promessa do conteúdo seguinte e, assim,
o hipertexto torna-se um veículo de acesso, um modelo de acessibilidade às
unidades de informações constituintes do universo hipermidiático. Observando-
o por suas características como a descentralização e a não-lienaridade podemos
destacar sua potencialidade como um modelo de leitura e de organização do
conhecimento, um dispositivo lógico que leva o interator a exercitar sua
capacidade de raciocínio e a estabelecer relações cognitivas entre os diversos
blocos de informações, porque tem ao seu alcance o acesso a “uma forma
híbrida, dinâmica e flexível de linguagem que dialoga com outras interfaces
semióticas, adiciona e acondiciona à sua superfície formas outras de
textualidade” [XAVIER, 2005, p.171] CIT_011_Web. Tudo isto faz da
hipertextualidade um fascinante jogo de construção e reconstrução que
acontece a partir da interação entre o interator e o designer atuante na área da
informação e comunicação; um desafio no armazenamento e na organização da
informação e da comunicação humana contemporânea.
1.2 Princípios do hipertexto
Txt_012_Web Para conhecer melhor as possibilidades do hipertexto, precisamos desconstruí-

lo em seus elementos fundamentais para então chegar a uma estrutura de
análise que possa servir de base para futuras aplicações. Mônica Moura enfatiza
em seu trabalho que a hipertextualidade é a principal característica da
hipermídia. De fato, se considerarmos o protocolo base de acesso a Internet
HTTP [Hypertext Transmition Protocol] - ou, protocolo de transmissão de
hipertexto, fica evidente que os princípios do hipertexto fundamentam as raízes
da hipermídia. Landow em entrevista, defende a não distinção entre hipermídia e
hipertexto
os textos de computador - sejam eles hipertextos ou não

podem facilmente incluir imagens e textos alfanuméricos, já
que, em computadores, é possível armazenar tanto palavras
como imagens na forma de códigos. A interconexão destes
textos ou de combinações de textos e imagens já é o hipertexto
[e a hipermídia]. Não vejo como faria sentido distinguir entre
os dois.
CIT_012_Web
Podemos acrescentar a esta definição de Landow o fato de que a hipermídia

existe a partir das possibilidades tecnológicas de armazenamento e
disseminação de informação em suportes digitais variados e que permitem um
acesso aberto e uma navegação livre e simultânea.
Continuando, podemos encontrar uma das características principais do

hipertexto ainda no trabalho de Landow [1995], que o apresenta como uma
estrutura sem centro ou que tem seu centro em constante mutação. Essa
descentralização do hipertexto está intimamente ligada àquela característica
apontada por Ted Nelson em suas proposições iniciais, ou seja, a possibilidade
de leitura não seqüencial. Este tipo de leitura tem como princípio possibilitar ao
leitor percorrer o texto proposto a partir de qualquer ponto, tornando-o, assim, o
ponto central provisório de seu percurso.
13
Txt_013_Web
Pierre Lévy [1993, p. 25], um pouco mais detalhadamente, propõe seis
princípios básicos para caracterizarmos o hipertexto que, segundo ele,
permitem “preservar as possibilidades de múltiplas interpretações do modelo
do hipertexto”. São eles:
a] Princípio de metamorfose:
A rede hipertextual está em constante construção e renegociação. Ela

pode permanecer estável durante certo tempo, mas esta estabilidade
é em si mesma fruto de um trabalho. Sua extensão, sua composição e
seu desenho estão permanentemente em jogo para os atores
envolvidos, sejam eles humanos, palavras, imagens, traços de
imagens ou de contexto, objetos técnicos, componentes destes
objetos etc [LÉVY, 1993, p. 25].
CIT_013_Web
Este princípio evidencia as possibilidades de construção e reconstrução do

hipertexto que se estabelece a partir da manipulação constante de seus atores,
configurando, assim, uma metamorfose constante. Podemos pensar essa
metamorfose como uma mudança na forma ou mesmo na estrutura do texto,
causada por elementos externos que se agregam ou se sobrepõem ao texto
inicial, mas também podemos vê-la sob o aspecto da conseqüência natural da
evolução técnica do meio que exige novas contextualizações, adaptações e
reposicionamentos.
b] Princípio da heterogeneidade:
Os nós e as conexões de uma rede hipertextual são heterogêneos. Na

memória serão encontradas imagens, sons, palavras, diversas
sensações, modelos, etc., e as conexões serão lógicas, afetivas, etc.
Na comunicação, as mensagens serão multimídias, multimodais,
analógicas, digitais, etc. O processo sociotécnico colocará em jogo
pessoas, grupos, artefatos, forças naturais de todos os tamanhos,
com todos os tipos de associações que pudermos imaginar entre
estes elementos [LÉVY, 1993, p. 25].
CIT_014_Web
Txt_013_Web
Aqui Lévy levanta pontos essenciais a serem considerados pelo designer que
desenvolve projetos na área da hipermídia. A heterogeneidade, característica do
hipertexto, amplia muito o universo de possibilidades na comunicação com o
interator, porque agora imagens estáticas e em movimento, sons, palavras,
tudo pode ser somado para o estabelecimento de uma relação. Em Xavier
[2005, p. 175], encontramos pluritextualidade, termo equivalente à
heterogeneidade de Lévy.
A Pluritextualidade é uma novidade fascinante do hipertexto por

viabilizar a absorção de diferentes aportes sígnicos numa mesma
superfície de leitura, tais como palavras, ícones animados, efeitos
sonoros, diagramas e tabelas tridimensionais. A fusão dos diversos
recursos das várias linguagens numa só tela de computador
acessíveis e utilizáveis simultaneamente em um mesmo ato de leitura
provoca um construtivo, embora volumoso, impacto perceptual-
cognitivo no processamento da leitura.
CIT_015_Web
Sobre as considerações acima, destacamos a questão da heterogeneidade

encontrada nas diferenças culturais que tem seus limites mais difusos dentro da
rede de informações que constitui a World Wide Web. O uso dessas referências
diversificadas é facilitada pela tecnologia, tudo se aproxima e tudo pode ser
transformado. No entanto, essas apropriações e seu uso em um novo contexto
podem levar a distorções que impliquem um esvaziamento do significado, nem
sempre compreendido ou aceito pela sociedade.
Mais um princípio apontado por Lévy,
c] Princípio de multiplicidade e de encaixe das escalas:
O hipertexto se organiza em um modo “fractal”, ou seja, qualquer nó

ou conexão, quando analisado, pode revelar-se como sendo
composto por toda uma rede, e assim por diante, indefinidamente, ao
longo da escala dos graus de precisão. Em algumas circunstâncias
críticas, há efeitos que podem propagar-se de uma escala a outra: a
interpretação de uma vírgula em um texto [elemento de uma micro-
rede de documentos], caso se trate de um tratado internacional, pode
repercutir na vida de milhões de pessoas [na escala da macro-rede
social] [LÉVY, 1993, p.25-26].
CIT_016_Web
Txt_013_Web
Este princípio revela a expansão do texto a partir de um determinado ponto. Cada
nó ou conexão pode levar a uma infinitude de outras conexões, multiplicando de
forma exponencial o envolvimento do interator. Ele revela também um ponto de
preocupação para o design de informação, como assegurar a finitude da
mensagem dentro desse espaço fugidio? Lévy [1993, p. 30] acrescenta que “a
constituição de hipertextos gigantes supõe um minucioso trabalho de
organização, de seleção, de contextualização, de acompanhamento e de
orientação do usuário, e isto em função de públicos bastante diversos”. Couchot
[1996, p. 42] CIT_017_Web, falando do espaço virtual, suas dimensões, e sua
potencialidade mediante a fragmentação aponta que “o espaço muda: virtual,

pode assumir todas as dimensões possíveis, até dimensões não inteiras,
fractais. Mesmo o tempo flui diferente; ou antes, não flui mais de maneira
inelutável; sua origem é permanente ‘reinicializável’” CIT_018_Web. Reiniciar,
voltar a um ponto de partida seguro, começar de novo, optar por dar uma nova
chance diante do fluxo de informações, uma importante característica da
virtualidade para garantir o aprendizado humano em relação aos novos meios.
d] Princípio de exterioridade:
A rede não possui unidade orgânica, nem motor interno. Seu

crescimento e sua diminuição, sua composição e sua recomposição
permanente dependem de um exterior indeterminado: adição de
novos elementos, conexões com outras redes, excitação de
elementos terminais [captadores], etc. Por exemplo, para a rede
semântica de uma pessoa escutando um discurso, a dinâmica dos
estados de ativação resulta de uma fonte externa de palavras e
imagens. Na constituição da rede sociotécnica intervêm o tempo todo
elementos novos que não lhe pertenciam no instante anterior:
elétrons, micróbios, raios X, macromoléculas etc [LÉVY, 1993, p. 26].
CIT_019_Web
Com este princípio começamos a entender a importância de fatores externos

para o crescimento e efetivamente para a constituição da rede hipertextual, ela
não existe se não for “alimentada” a partir de pontos externos a ela e
indeterminados. É preciso trabalhar considerando certo descontrole no
organismo que se constitui a partir dessas contribuições.
Txt_013_Web
e] Princípio de topologia:
Nos hipertextos, tudo funciona por proximidade, por

vizinhança. Neles, o curso dos acontecimentos é uma questão
de topologia, de caminhos. Não há espaço universal
homogêneo onde haja forças de ligação e separação, onde as
mensagens poderiam circular livremente. Tudo que se desloca
deve utilizar-se da rede hipertextual tal como ela se encontra,
ou então será obrigado a modificá-la. A rede não está no
espaço, ela é o espaço [LÉVY, 1993, p. 26].
CIT_020_Web
A utilização de termos como topologia configura a necessidade da construção de

uma visualização para algo que se estabelece dentro da imaterialidade própria
do meio digital. Se existe uma navegação podemos imaginar o mar que a
suporta, se existem caminhos podemos visualizar as rotas que se estabelecem a
partir deles, criando, assim, um espaço, flexível sim, na medida em que permite
reposicionamentos a todo instante, mas também bastante concreto, e rígido, o
suficiente, para a criação de uma imagem real em nossas mentes com regras
próprias e necessárias, estabelecedoras de um percurso seguro, e a metáfora da
rede tem se firmado como a mais apropriada imagem desse espaço. A trama da
rede hipertextual se dará a partir da navegação própria de cada interator, cabe
ao responsável pela formatação da estrutura inicial preocupar-se em
disponibilizar as opções possíveis, utilizando-se das relações de proximidade
das idéias. Reforçando este posicionamento temos, Pierre Musso [2004] que
define a rede como uma estrutura de interconexão instável que por meio de
elementos de interação sofre variação, obedecendo a regras de funcionamento.
e] Princípio de mobilidade dos centros:
A rede não tem centro, ou melhor, possui permanentemente

diversos centros que são como pontas luminosas
perpetuamente móveis, saltando de um nó a outro, trazendo
ao redor de si uma ramificação infinita de pequenas raízes, de
rizomas, finas linhas brancas esboçando por um instante um
mapa qualquer com detalhes delicados, e depois correndo
para desenhar mais à frente outras paisagens do sentido
[LÉVY, 1993, p. 26].
CIT_021_Web
Txt_013_Web
Para facilitar o entendimento dessa multiplicidade de centros, Lévy usa o
exemplo de uma estrutura criada pela natureza e que outros autores também
buscam para permitir a visualização de uma forma para a estrutura do
hipertexto, ou seja, a figura do rizoma [Figura 5] que reforça a possibilidade de
um crescimento infinito se estabelecendo a partir da ramificação de raízes entre
nós de forma aparentemente desordenada e caótica. Cada nó do rizoma pode se
transformar em um centro de onde partem ligações que levam a diversos outros
nós, infinitamente.
FIGURA 005_web
FIGURA 5: Exemplo de estrutura rizomática

Fonte: http://rhizome.org
Também Lucia Leão [2001, p. 69] fala sobre essa característica do hipertexto,
relacionando-a a uma atitude do interator: “A partir de uma metodologia
simultaneamente acentrada e policêntrica, o viajante do ciberespaço traça seu
mapa de domínio de uma forma mais fluida e dinâmica, sem se fixar em um
centro único, como faria um pesquisador de postura centrada”. CIT_022_Web
Não-Linearidade:
Fechando os princípios, enfatizamos uma característica que também é

reconhecida em outros meios que não os digitais, mas que teve sua força
potencializada quando aplicada principalmente à rede Web, trata-se da não-
linearidade. Moura [2003, p. 197-198] afirma que “a característica da não-
linearidade se refere à idéia de possibilitar caminhos e segmentos
Txt_013_Web
abertos, diversos, repletos de desvios, complexos, composto por linhas de
segmento e linhas de fuga” CIT_023_Web. Podemos então entender porque o
termo não-linear é entendido como sinônimo do termo não-seqüencial. O

hipertexto é o recurso que possibilita a não-linearidade nos projetos em
hipermídia porque “possibilita a leitura descontínua, o deslocamento
instantâneo, às ligações rápidas a elos, redes, assuntos, temas
associativos, o compartilhamento de relações, conexões, onde a atitude de
pesquisa, de descoberta é valorizada e exercitada amplamente” .
CIT_024_Web
1.3. Principais elementos do hipertexto

Txt_014_Web
Entre os elementos que constroem um hipertexto podemos destacar os links e os
blocos de texto ou lexias como aponta Lucia Leão:
O hipertexto, em geral, é composto por blocos de informações

e por vínculos eletrônicos [links] que ligam esses elementos.
Os blocos de informações costumam ser denominados lexias.
Uma lexia pode ser formada por diferentes elementos, tais
como textos, imagens, vídeos, ícones, botões, sons, narrações
etc [LEÃO, 2001, p. 27].
CIT_025_Web
1.3.1. O "Hyperlink", "Link" ou Vínculo
A importância do link e de sua constituição na navegação pode ficar mais claro se

analisarmos o uso da palavra “vínculo” em Leão. Um vínculo representa uma
ligação que se estabelece entre os blocos de texto, ele é o responsável pela
efetiva construção da leitura, porque apresenta a idéia do conteúdo que se
seguirá a ele e sua configuração é essencial no projeto de navegação de um
hipertexto.
A representação dos links não se limita ao uso de palavras destacadas dentro do

texto [hotwords], eles também podem ser configurados por imagens icônicas ou
mesmo por animações sugestivas e envolventes, o importante é que a
representação seja projetada principalmente depois de conhecido o sujeito
19
Txt_014_Web
que irá se relacionar com o conteúdo disponibilizado, suas necessidades, sua
cultura, sua faixa etária e o meio social em que vive, garantindo assim um
entendimento mais rápido e eficaz.
Considerando a importância do link e apontando suas formas de aplicação,

Lucia Leão [2001] apresenta uma distinção entre dois tipos: eles podem ser
disjuntivos, quando levam o interator para um ponto determinado assim que
acionados; ou conjuntivos, que permitem acessos simultâneos, sendo, portanto,
mais interessantes. Também David Crystal [2005, p.88], destaca a importância
do link dentro de um texto eletrônico e traça um paralelo deste com as notas de
rodapé de um texto tradicional:
Outra característica das comunicações mediadas por computador nos leva

para mais longe ainda da escrita tradicional. Provavelmente, a mais
importante é o link de hipertexto - o salto que os usuários podem dar se
desejarem ir de uma página ou site para outro. Ele é a propriedade
funcional mais importante da web, sem a qual o veículo não existiria, e
encontra paralelos em algumas das convenções do texto escrito
tradicional. O uso de notas, por exemplo, é um tipo de link de hipertexto
primitivo, que faz o olho se mover de um pedaço da página para outro, ou de
uma página pra outra.
CIT_026_Web
Txt_015_Web
A comparação do hipertexto eletrônico com outros textos mais tradicionais
aparece no trabalho de muitos pesquisadores, muitas vezes, para trazer
inquietações sobre a forma como os recursos da rede estão sendo usados,
grandes textos com rolamentos, por exemplo, configuram um retrocesso que
leva a uma aproximação aos antigos pergaminhos de papel. Muitas vezes para
este tipo de navegação usa-se como recurso o scroll2, às vezes como imensas
barras de rolagem que além de contrariar todos os princípios da mobilidade e
romper com a não-linearidade ainda remetem ao pergaminho, a forma de leitura
de textos impressos em rolos de páginas de papel. Desta forma o uso desse
recurso desconsidera as diferenças específicas entre o suporte impresso e o
suporte eletrônico, ou seja, ler diante de uma tela de computador exige também
um comportamento diferente e acarreta implicações ergonômicas e perceptivas
bem específicas, como por exemplo, problemas relacionados à visão devido
ao brilho do monitor e falta de intuição e envolvimento com as informações
ao se ter que arrastar a barra.
2
A palavra inglesa scroll significa rolo de papel, pergaminho, arabesco, enrolar, arabescar.
1.3.2. Os blocos de texto ou lexias

Txt_016_Web
Sobre os blocos de texto ou lexias podemos dizer que o grande desafio do
design da informação é a estruturação dos conteúdos de forma a propiciar a
construção de repertório a um interator ativo, aquele que assume o controle da
leitura, e ainda tem em suas mãos um suporte que quebra as regras da
linearidade. Portanto, os blocos de texto ou de conteúdo assumem vital
importância, pois devem, não só, serem suficientemente autônomos para que
em um primeiro contato o interator já consiga alguma informação relevante,
como também aguçar o interesse para um envolvimento mais profundo. Cabe
ao designer classificar, selecionar e reagrupar as informações sempre
projetando para o melhor aproveitamento do usuário/interator. A dinâmica de
leitura estabelecida dentro do bloco de texto está ligada a uma preocupação
com a usabilidade, garantindo, assim, o entendimento do conteúdo pelo
interator por meio de uma composição formal.
1.4. Tendências do hipertexto na web 2.0 e 3.0
Txt_017_Web
O uso de rótulos como web 1.0, 2.0 e 3.0 é muito discutido no próprio meio, a
preocupação é que essa divisão em “caixinhas” venha a simplificar e
empobrecer a visão do que representa de fato a Web desde sua popularização.
Realmente, fica difícil separar os acontecimentos quando estes convivem
conjuntamente no mesmo espaço/tempo e quando um é conseqüência do
outro, como é o caso de todos os modelos de Web. Como temos o propósito de
apontar o uso do hipertexto diante de novos recursos, esses rótulos servirão
como localizadores desses modelos e facilitadores na nossa movimentação
por idéias.
Buscamos exemplos e resultados diretamente na Rede, considerando os fatos

como eles nos são apresentados e acrescentando reflexão própria auxiliada
pelos autores que estudamos.
21
Txt_017_Web
No exemplo apresentado no quadro abaixo [dividido em três partes [Figuras: 6,
3
7 e 11], publicado na Revista Época [on-line: 22.11.2007], temos uma síntese
dessas alterações na Web desde os anos 1990, acompanhada de explicações
básicas dos rótulos aqui utilizados e também os melhores exemplos de cada
modelo de “web”. Tratando-se de uma publicação popular a revista resume de
forma pontual e simples os, aqui chamados, "três tempos da Internet".
FIGURA 006_web
Figura 6: Parte do quadro apontando os três tempos da Internet

Fonte: http://revistaepoca.globo.com
Txt_018_Web
Acompanhando o raciocínio das informações apresentadas no [quadro] temos
na web 1.0 a preocupação com o armazenamento e a disponibilização de
dados. O acesso é o foco principal dos mecanismos dos sistemas, os portais se
“abrem” permitindo a busca da informação, quanto mais possibilidades mais
adeptos se aproximam do portal aumentando sua popularidade, a abertura no
campo da comunicação como espaços para bate-papo e correio eletrônico é
um grande atrativo para o público nesse momento e, de forma mais comercial,
a publicação de propagandas (banner's e outros) e a possibilidade de vendas
on-line de certa forma ajudaram a sustentar os investimentos na área. Aqui o
hipertexto é explorado como uma ferramenta que possibilita a inserção de
“links” e o acesso aos “nós” de informação.
3
Revista Época on-line: publicação em 22/11/2007.
http://revistaepoca.globo.com/Revista/Epoca/0,,EDG77010-6014-465-2,00.html.
Txt_018_Web

Uma vez tendo assimilado este universo maior da Web 1.0, o simples usuário
percebe que pode colaborar com a construção de conteúdo e também se
colocar e expor suas idéias tornando-se co-autor. Surge então a denominada
Web 2.0, integrando aos recursos já existentes, a interação e a construção
coletiva de conhecimento. O criador do termo “Web 2.0”, Tim O´Rellay em
entrevista veiculada na web apresenta uma definição:
Web 2.0 é a mudança para uma internet como plataforma, e

um entendimento das regras para obter sucesso nesta nova
plataforma. Entre outras, a regra mais importante é
desenvolver aplicativos que aproveitem os efeitos de rede pra
se tornarem melhores quanto mais são usados pelas pessoas.
[O´REILLY, 2006, on-line]
CIT_027_Web
É na fase Web 2.0, que surge a Wikipedia que é um dos mais abertos exemplos
que acompanhamos hoje com a proposta de ser aberta e livre para inclusão,
alteração e exclusão de informações. Porém sabemos que esta “liberdade” é
também controlada.
Txt_019_Web
A apresentação e definição desse projeto, bem como as expectativas com sua
utilização, podem ser encontradas no próprio site:
A Wikipedia é uma enciclopédia cujo conteúdo é livre e regido

pelos termos da licença conhecida como GFDL [Gnu Free
Documentation License]. Isto significa que tal conteúdo, em
sua plenitude, pode ser livremente copiado, alterado e
redistribuído por terceiros, desde que sejam dados os devidos
créditos, segundo as determinações da citada GFDL. A
Wikipedia é construída continuamente por meio de um projeto
alojado em um sítio da internet [o qual você está lendo neste
momento], hospedado e financiado pela Wikimedia
Foundation nos Estados Unidos da América e com diferentes
versões para variados idiomas. [Http://pt.wikipedia.org]
CIT_028_Web
Observem a frase: “livremente copiado, alterado e redistribuído por terceiros,

desde que sejam dados os devidos créditos”. Outra vez voltamos a constatar a
preocupação com a autoria das informações e associando este fato a um ponto
“ruim” indicado no quadro acima, ou seja, que ”é difícil lidar com o excesso de
informação inútil”, tocamos em uma fragilidade do modelo: a desconfiança em
relação à informação disponibilizada, resultando no uso de critérios de
publicação, muitas vezes, extremamente subjetivos, que reprimem a liberdade
oferecida. Existem alguns projetos, surgidos à margem das pesquisas formais,
que fazem uso da estrutura das “wikis” para fazer críticas a sua utilidade, a real
liberdade de colaboração e a preocupação com confiabilidade de seus dados.
Um bom exemplo é a “Freakpedia” [Figura 8], que é um projeto de “Web Arte” de
Edgar Franco e Fábio Oliveira Nunes [2007, on-line], que em artigo publicado na
Web, revela o distanciamento entre a intenção e os acontecimentos reais.
A sua verdadeira liberdade estaria então assumida para

abarcar inclusive aquilo que não caberia nunca em uma outra
enciclopédia: movimentos underground, alternativos,
pequenos movimentos sem represen-tatividade nos meios
comerciais e oficiais e personagens oriundos deste mesmo
universo distante da massmedia. A verdadeira liberdade está
em dar voz a todos, sem exceções e não somente fazer de
todos os internautas, potenciais editores. Mas infelizmente
não é isso que realmente acontece: os administradores -
wikipedistas estão preocupados com a relevância daquilo que
é publicado. Como “acontece em qualquer enciclopédia”. E
isso é um grande erro.
CIT_029_Web
Txt_019_Web
Figura 8: Interface de abertura espaço - Freakpedia
Fonte: http://www.freakpedia.org
Txt_020_Web O texto de abertura já apresenta algumas críticas a outras estruturas que se

propõem livres, mas que na verdade, filtram os dados antes de publicá-los e só
liberam os que são mais relevantes dentro de suas expectativas. Na contramão
deste modo de pensar, os autores desse trabalho colocam em sua interface
principal informações sobre sua experimentação:
Nada daqui precisa ser importante aliás, quem teria o

distanciamento necessário para enciclopediar
ortodoxamente os fatos? Só pedimos que tudo aquilo que
você insere seja real, como uma enciclopédia realmente livre
deveria ser. Nosso caráter FREAK existe porque cultivamos a
irrelevância das pequenas coisas, os pormenores e
particularidades. Há universalidade no particular e
grandiosidade na despretensão, desde que não se confunda
despretensão com futilidade, pois essa já é adepta da
gigantesca maioria.[http://www.freakpedia.org]
CIT_030_Web
Outros projetos seguem esta proposta e seu conteúdo tem geralmente o intuito
de provocar ou criticar. Estas propostas podem se associar no sentido de mais
confundir do que esclarecer, caminhando em sentido contrário ao da utilidade
esperada pelos desenvolvedores oficiais do sistema sem serem
necessariamente falsas.
Txt_020_Web
Veja o exemplo na representação abaixo [Figura 9] com destaque para o nome
do Projeto Desnotícias e para os itens de navegação desnotícias, descionário,
deslivros e desentravistas:
FIGURA 006_web
Figura 9: Interface do Projeto Desciclopedia

Http://desciclo.pedia.ws
A maneira descompromissada e irreverente como o conteúdo é disponibilizado

parece até esconder o esforço aplicado na construção e manutenção do projeto
e, assim, se insere novamente no universo que critica colocando em pauta uma
reflexão sobre os modelos `wikis´.
Txt_021_Web Dentro do modelo atual de Web colaborativa existe a proliferação dos

“Mashups” que na Revista IDG NOW recebeu a seguinte descrição:
Nomeados a partir do fenômeno musical que mistura voz e

batida de canções diferentes, os mashups são aplicações on-
line resultantes da soma de dois ou mais conteúdos ou
serviços que, juntos, oferecem uma nova função para o
usuário. [http://idgnow.uol.com.br]
CIT_031_Web
O sites deste modelo agregam informações retiradas diretamente de outros

endereços e indicadas pelos próprios internautas, uns se especializam em
fotos, outros em vídeos e outros ainda, concentram-se na busca de
informações e são muito usados como agendas pessoais ou para indicar locais
de eventos e encontros.
Txt_021_Web
Outra ferramenta mashup muito interessante é o Yahoo Pipes, que possibilita a
integração de múltiplas fontes e bancos de dados partindo das preferências do
internauta - cada um monta seu próprio espaço mashup. Veja como a imagem
[Figura 10] da interface introdutória do site representa uma síntese do que
estamos falando partindo da metáfora de encanamentos entrecruzados,
maleáveis, moldáveis a gosto do internauta.
Figura 10: Interface do site Yahoo Pipes Agregar, manipular, combinar? Misturar? Mashup!
Fonte: http://pipes.yahoo.com/pipes/ [My Pipes] Obs.: pipes = tubulações, canos.
Nesse momento o hipertexto deixa de ser visto apenas como um recurso

estrutural e surge como resultado de uma construção coletiva. A comunidade
estabelece os links, os nós com o conteúdo, os caminhos se multiplicam
exponencialmente, a rigidez e a ordem estrutural cedem lugar a certo “caos” e a
exploração intuitiva dos recursos. O controle foge das mãos de poucos
especialistas e passa às mãos de todos aqueles que queiram participar. As
redes sociais se fortalecem. Há uma aproximação maior das idéias de Ted
Nelson em relação ao hipertexto e escapamos dos “links de mão única".
Txt_022_Web
A web 3.0, também conhecida como Web Semântica é uma idéia do criador da
Web Tim Berners-Lee, e que significa a aglomeração de dados, considerando o
seu sentido dentro de determinado contexto. Desta forma diminuindo o
trabalho humano, e justamente, por isso, os sites de buscas são os mais
interessados nessa tecnologia. Web “pervasiva” e computação “ubíqua” são
conceitos também relacionados a este momento. O primeiro diz respeito à Web
que pode ser acessada de qualquer lugar e dispositivo; e o segundo trata da
computação tornada invisível, ou que usaremos sem perceber por estar ela
inserida em nosso ambiente do cotidiano.
Txt_022_Web

Podemos tomar como exemplo as experiências envolvendo roupas,

eletrodomésticos e, até mesmo, ambientes físicos, inteiramente
informatizados que respondem a comandos e a movimentos das pessoas em
um processo de interação. Devemos lembrar que o conceito de ubíquo está
relacionado à onipresença, ausência, inexistência e também remete a
universalidade, a aquilo que é geral. Diante disto nos resta questionar se na
Web realmente o nível de invisibilidade ou de inexistência será atingido, uma
vez que, para acessar a rede, necessitamos de dispositivos físicos e materiais
que estabelecem primeiramente a existência e presença de uma interface.
2. Aplicações do hipertexto: “wiki” e “experimental”
A fábrica do futuro deverá ser aquele lugar em que o homem

aprenderá, juntamente com os aparelhos eletrônicos, o quê,
para quê, e como colocar as coisas em uso. [...] O que importa
é que a fábrica do futuro deverá ser o lugar em que o Homo
faber se converterá em Homo sapiens sapiens, porque
reconhecerá que fabricar significa o mesmo que aprender, isto
é, adquirir informações, produzi-las e divulgá-las.
[FLUSSER, 2007, p. 43]
CIT_032_Web
Txt_023_Web
A citação acima apresenta o pensamento de Flusser que analisando a história do
trabalho humano e sua relação com a 'Fábrica' ou o ambiente considerado
apropriado para a 'fabricação' de um mundo ideal para a sobrevivência física,
mental e espiritual do homem, conclui que podemos dividir essa história nos
seguintes períodos: o das mãos, o das ferramentas, o das máquinas e o dos
aparelhos eletrônicos. Para ele estamos vivendo um momento de transição em
que essas maneiras de trabalhar coexistem e ganham novas características
considerando o fortalecimento dos meios eletrônicos e a 'transformação' da
idéia de 'posse'. É, portanto, um momento importante para o entendimento do
que o futuro nos possibilitará porque ainda temos espaço aberto para
comparações, podemos ver uma gama muito grande de modificações
acontecendo ao mesmo tempo. Reconhecer que “fabricar [produzir, divulgar]
significa o mesmo que aprender” é uma postura fundamental para o
desenvolvimento de trabalhos como este que se propõe a ser apenas mais um
ponto de observação dessa transição.
Txt_024_Web
Neste capítulo serão abordadas duas formas de apresentação de projetos
embasados em uma estrutura hipertextual. Essas abordagens são necessárias
para uma maior aproximação do objeto de estudo e, com o auxílio de
exemplificações de usos reais, tentaremos responder às questões de Flusser: “o
quê, para quê e como colocar as coisas em uso”. Para um maior alcance dois
pontos de vista aparentemente contrários foram escolhidos: um exemplo onde a
estrutura, o acesso, o compartilhamento de dados e informações se torna mais
evidente; é quase como se olhássemos o projeto por dentro, por trás dos
bastidores, percorrendo seus caminhos unicamente com a intenção de entender
seu funcionamento, suas conexões hipertextuais e sua sobrevivência na Rede.
29
Txt_024_Web
Outro exemplo escolhido é um 'projeto experimental' salientando que,
especialmente neste caso, o termo 'experimental' se aplica à forma como a
'linguagem' proposta para as interfaces é explorada para garantir um
envolvimento subjetivo, emocional e lúdico ao interator que, neste caso, é levado
a “esquecer” toda estrutura da construção técnica do projeto e se envolver de
forma mais subjetiva com o conteúdo, ou seja, para ele, aqui, não importa de que
forma foi armazenado e conteúdo, mas o quanto ele pode envolver-se com ele
por meio dos elementos escolhidos para constituir a interface, como imagens e
sons que podem facilitar a navegação e levá-lo a uma experiência interativa mais
significativa.
Txt_025_Web
2.1. Com foco na estrutura: o exemplo das “wikis”
2.1.1. O conceito de “wiki”
O wiki é uma metodologia aplicada para facilitar a construção de conteúdos

colaborativos em formato hipertextual. Estes conteúdos podem ser alterados por
qualquer pessoa por meio da utilização de um simples navegador de web. O
termo “wiki” escolhido para nomear esse sistema é explicado no próprio projeto:
Os termos wiki (pronunciado "viquie" ou "uikie" no Alfabeto fonético

internacional) e WikiWiki são utilizados para identificar um tipo específico
de coleção de documentos em hipertexto ou o software colaborativo usado
para criá-lo. O termo "Wiki wiki" significa "super-rápido" no idioma havaiano.
Já em maori Wiki significa "fim-de-semana". É também a forma diminutiva
de Wikitoria, versão Maori do popular nome cristão Victoria. Chamado "wiki"
por consenso, o software colaborativo permite a edição coletiva dos
documentos usando um sistema que não necessita que o conteúdo tenha
que ser revisto antes da sua publicação. Wiki (com um 'W' maiúsculo) e
WikiWikiWeb são por vezes usados para se referir ao Portland Pattern
Repository, primeiro wiki; os proponentes desta utilização sugerem a
utilização de um 'w' minúsculo para distinguir o conceito. Porém, a
utilização de diferenciação através de tipos maiúsculos e minúsculos é
problemática em função deste tipo de uso não ser aceito nas linguagens
humanas. [http://pt.wikipedia.org]
CIT_033_Web
30
Txt_025_Web
Segundo os organizadores da Wikipédia, a enciclopédia livre que é um dos
sistemas 'wikis' mais conhecidos, o que garante uma movimentação mais fácil
para a grande maioria dos usuários é que alguns mecanismos de edição se
aproximam muito dos mais conhecidos editores de texto utilizando o sistema
“WYSIWYG” ["What You See Is What You Get", que significa basicamente "o que
se vê é o que será"] preservando o usuário da obrigação de entender os códigos
das linguagens de programação que viabilizam o sistema. Mas mesmo
buscando uma padronização, os 'wikis' variam seu grau de complexidade,
alguns permitem apenas a inclusão e edição de textos enquanto outros
suportam também tabelas, imagens e até elementos animados e interativos. A
estrutura de navegação não-linear é possível por meio da utilização de uma
sintaxe específica, o chamado "padrão link".
Txt_026_Web O foco deste trabalho é a construção de textualidade por meio das conexões
criadas ou pelo interator ou pelo sistema por trás da interface. Analisamos um
sistema modelo ‘wiki’ partindo da experiência de sua utilização, pois a
facilidade de acesso e uso do sistema defendido pelos seus divulgadores
precisa ser observada, e de forma pontual.
2.1.2 Análise de caso
Para entender melhor o sistema “wiki” acompanhamos a construção passo a

passo de um projeto e para tornar isto possível precisamos nos conectar ao
sistema e ‘aprender’ a usá-lo, explorando seus recursos, assim, ao mesmo
tempo em que entendemos sua estrutura também construímos parte do
projeto ‘Hipertextualidades.com’ onde disponibilizamos os resultados desta
pesquisa. Aprender com o sistema para poder colaborar com sua
transformação, aguardando os resultados para outra vez aprender, é o modelo
“fábrica/escola”, sugerido por Flusser. Nossa análise/aprendizado se fez por
meio do Projeto “Percursos: hipertextualidades”[http://percursos.incubadora.
fapesp.br/portal] onde construção e análise caminharam juntas para um
melhor entendimento. Utilizamos o sistema disponibilizado pela Incubadora
Virtual da FAPESP por considerar que ele tem compatibilidade com as questões
principais do nosso projeto.
31
Txt_027_Web
2.1.2.1. Conhecendo o sistema ´Wiki´ escolhido
Na interface de apresentação da incubadora encontramos as seguintes

informações:
A Incubadora Virtual de Conteúdos Digitais destina-se à criação
cooperativa de conteúdos digitais abertos, de interes-se acadêmico,
tecnológico ou sócio-cultural. [...] Conteúdo aberto quer dizer que tudo
que você estiver desenvolvendo ficará acessível para qualquer
usuário da Internet. Assim você poderá compartilhar "conhecimento"
e, ao mesmo tempo, terá a oportunidade de aproveitar o
"conhecimento" de outras pessoas. Essa troca de informação ajuda
na difusão de conteúdo de qualidade para toda a comunidade.
[http://iv.incubadora.fapesp.br]
CIT_034_Web
Procuramos entender como se faz essa ‘criação cooperativa de conteúdos’,

estudando o sistema que a torna possível. A interface de abertura apresentada
contém informações sobre a incubadora; mecanismo de busca que possibilita
uma pesquisa no próprio sistema, por pessoa ou projeto, ou se abre para a Web
com o sistema Google; últimas notícias; destaques; estatísticas e mecanismo de
acesso por meio de senha se o usuário já tiver um cadastro ou a possibilidade de
cadastramento.
FIGURA 007_web
Figura 12: Interface inicial da Incubadora Fapesp.
Fonte: http://incubadora.fapesp.br
Ao observar a disposição dos elementos da interface

[Figura 12], podemos perceber que as informações
textuais assumem grande parte do espaço e há um
destaque maior para a barra de navegação superior que
suporta os itens permanentes entre as interfaces: o
logotipo da incubadora, os mecanismos de acesso e
busca, um ‘splash’ convidativo para a proposta de novos
projetos.
O link de ajuda que é destacado por uma cor diferente. Apesar de sua
simplicidade essa interface mostra uma preocupação com os elementos
projetuais, cores e formatos diferenciados, aplicados inclusive aos textos,
formas, barras de títulos, imagens arredondadas, mostra uma preocupação com
as “escolhas” antes da aplicação. Mas a interface se mantém apenas nas
primeiras camadas de informações e, uma vez que nos aprofundamos no
conteúdo, ela assume o formato comum das ‘wikis’ [Figura 13].
32
Txt_028_Web
FIGURA 008_web
Figura 13: Interface interna da incubadora

Indicadores numéricos em vermelho incluídos para análise
Nesta figura podemos observar alguns itens comuns às interfaces do sistema:
[1]
1 Abertura para acessos rápidos e contato com o órgão.
[2]
2 O formato mais comum com o uso de 'Abas' para organização do conteúdo
simulando o uso de pastas em um arquivo de gavetas.
3 Um recurso defendido pelos estudos de usabilidade: “O caminho de migalhas”

[3]
o usuário tem o seu percurso marcado e seu retorno garantido a qualquer ponto
do percurso.
4 Mecanismo de acesso aos projetos pessoais a qualquer momento. E, mais

[4]
abaixo: ajuda, enquete, notícias e calendário.
5 Acesso ao conteúdo e as ações permitidas ao seu 'status' dentro do sistema.

[5]
Também os links espalhados no próprio conteúdo podem levar a informações

internas ou externas. A simplificação da interface, bem como sua padronização,
se justifica considerando que cada interface em uma estrutura desse tipo
possibilita, na verdade, o acesso a uma pequena parte de um conteúdo maior
criado de forma colaborativa por incontáveis usuários.
Txt_029_Web
Um fator importante observado em uma primeira incursão pelo sistema da
incubadora Fapesp é a evidência que o processo de tradução do software da
língua original para o português ainda não garante um envolvimento natural a
todos os usuários e pode trabalhar contra a idéia de colaboração desejada
dificultando a fruição ou desenvolvimento do processo. Observem que
informações internas estão parcialmente traduzidas, assim temos: wiki search e
recent changes como títulos de pastas e ainda a assinatura: last edited 4 months
ago by monteiro. Em outros momentos a simbiose de línguas se mostra mais
evidente e, muito embora o conhecimento básico da língua inglesa seja
importante para o melhor aproveitamento dos recursos da Web, essa ‘mescla’
em uma mesma interface denota uma possível fragilidade na administração do
sistema que se oferece em português e se mostra apenas parcialmente
traduzido.
Txt_030_Web
Passemos à descrição dos passos para a construção de nosso
portal Percursos: hipertextualidades. A primeira etapa foi
aprender como podemos proceder para a sua criação e
manutenção para isto, apro-veitamos muito do material de
“ajuda” da incubadora e encontramos alguns tutoriais, um título
“como fazer”, um glossário e as categorias nas quais a
documentação está organizada: Categoria Ambiente GForge,
Categoria Ambiente Plonetarium, Categoria Como, Categoria
Tutorial. Explorando a interface chegamos ao item - COMO criar
uma conta na Incubadora e procedemos ao cadastramento. A
[figura 14] apresenta uma parte do formulário de
cadastramento e fica evidente a despreocupação com a
qualidade de sua apresentação, nenhuma tentativa de
FIGURA 009_web aproveitamento de espaço com uma diagramação mais
apropriada ou de uso de recursos gráficos que enriqueçam a
interface. Há somente uma disponibilização de campos de
forma seqüencial e com algumas 'dicas' de preenchimento. O
peso da interface está no objetivo central - a coleta de dados.
Aqui também encontramos informações não traduzidas, como

Country e Brazil.
Figura 14: Formulário de inscrição

Txt_031_Web
Descobrimos quais são as quatro formas de participação na incubadora:
visitante, usuário, membro e administrador. Essa informação é importante
porque essas formas representam o estabelecimento de um controle dentro do
sistema. Nada impede que o participante salte de uma forma para outra, no
entanto, o sistema pode averiguar o seu comportamento e estabelecer limites.
O visitante não precisa estar ‘logado’ ao sistema, e neste caso, tem direito
apenas a leitura; o usuário tem que estar ‘logado’, para ganhar uma página
pessoal e poder participar de projetos e discussões, quando convidado por um
administrador; o membro é aquele usuário que, também quando convidado,
passa a fazer parte de um projeto dentro da incubadora e suas funções são
atribuídas pelo administrador; o administrador tem direitos plenos sobre o
conteúdo e o gerenciamento de um portal, e são estas características que
assumiremos para construir o projeto. Existe ainda um código de ética para o
uso adequado da incubadora que estabelece regras de privacidade,
transparência e uso apropriado dos recursos.
Txt_032_Web
As regras de privacidade da incubadora Fapesp alertam para a importância de
respeitar a sua identificação e não usar o código de acesso de outros usuários,
exceto em caso de emergência, e ainda esclarecem que os administradores da
incubadora podem acessar dados dos usuários em caso de manutenção do
sistema. As regras de transparência abordam o respeito às licenças específicas
de cada projeto e a responsabilidade pela veracidade dos dados informados.
Somos lembrados também da necessidade de respeitar o espaço comunitário,
a integridade do sistema, as regras de segurança e o cunho acadêmico das
propostas. Há ainda um aviso de penalidades possíveis: [http://iv.incubadora.
fapesp.br/portal/ética].
Esse código de ética deve ser conhecido e respeitado por todos os membros da
Incubadora, o desrespeito de qualquer uma das regras pode ocasionar
suspensão temporária ou até exclusão da conta de usuário e de todo o
conteúdo do projeto, ficando a penalidade a critério da equipe da Incubadora.
Txt_033_Web
Ao propor uma familiarização com o sistema antes de utilizá-lo efetivamente, a
incubadora Fapesp oferece uma área de teste chamada “tanque de areia”, onde
usuários iniciantes podem exercitar a publicação de texto sem temerem maiores
conseqüências [figura 15].
FIGURA 010_web
Figura 15: Tanque de areia área de testes
Todas essas características da incubadora apresentam um sistema pensado

para possibilitar uma inclusão não-traumática no universo da web colaborativa,
mas fica evidente também a necessidade de um tempo dedicado à
aprendizagem, o acesso e a navegação não são intuitivos e dependem de
escolhas racionais baseadas em conhecimento técnico suficiente para
obedecer a uma seqüência lógica. Caso contrário ficariamos refém do método de
acerto/erro.
2.1.3. Construção do projeto Percursos: Hipertextualidades
Para exemplificar os modelos de hipertexto analisados aqui e também publicar

os resultados alcançados, produzimos um sistema hipertextual que, utilizando
os atuais mecanismos da Web, serve como um espaço para reflexões e
discussões sobre o design de hipermídia e sua responsabilidade com a
qualidade e o acesso às informações. Construímos os dois modelos de formatos
escolhidos, os mecanismos ‘wiki’ para a web colaborativa e o modelo de sites
experimentais mais intuitivos e que exploram muito mais a linguagem gráfica. O
primeiro modelo tem por objetivo possibilitar um espaço colaborativo para
discutir a transposição entre os espaços físico e virtual. Utilizamos a estrutura da
Incubadora Virtual da Fapesp onde o projeto é tratado como um portal.
36
Txt_034_Web
Configurações do portal
Tarefa: Editar as configurações do portal utilizando as ferramentas do sistema.
FIGURA 011_web
Figura 16: Opções de configuração do sistema

A [figura 16] apresenta a interface onde estão disponibilizadas as

configurações possíveis no sistema. Cada um desses links abre uma variedade
de novas possibilidades e isto representa um grande acúmulo de informações a
serem assimiladas pelo administrador do portal. No primeiro item
“Adicionar/Remover produtos”, por exemplo, abrem-se outros itens para
ativação ou remoção, no entanto, apenas uma minoria apresenta uma
explicação de qual é a sua função. Nosso objetivo aqui foi agir de maneira
prática e instalar nosso projeto como o faria qualquer outro usuário, portanto,
nossa maneira de aprender a utilidade de cada uma dessas configurações do
Portal foi buscando-as quando houve necessidade de seu uso, quando a
criação do ambiente nos levou a elas. Seguindo esse raciocínio pudemos
estabelecer uma lógica pessoal de trabalho, neste caso, o item que pareceu
mais interessante foi: Configurações do Portal.
Figura 17: detalhe da interface de Configurações do Portal

Txt_035_Web
Ainda podemos escolher outras configurações como: idioma padrão, política
de senhas, habilitar recursos de editor de texto, ou não, e modificar a forma de
exibição de títulos. Depois de salvar as informações escolhemos outro item -
Configuração da Aparência. Neste item podemos escolher uma aparência
padrão dentro de algumas formatações disponíveis [figura 18]; podemos
também liberar ao usuário a escolha da aparência enquanto navega ou fazer
com que a aparência escolhida persista como um padrão que já foi
estabelecido.
FIGURA 012_web
Figura 18: Opções de aparência padrão

As diferenças entre as aparências geralmente se restringem à escolha de cores

e à alteração da barra superior de navegação. Da mesma forma que
comentamos a falta de preocupação com a apresentação de formulários na
interface, também parece haver aqui uma simples demonstração das
possibilidades de personalização do espaço sem, no entanto, haver a
necessidade de que essas possibilidades sejam de fato exploradas. Isso pode
frustrar o interator que poderá querer, por exemplo, usar as cores da opção
“soft” com a formatação textual da opção “Metal”, ou ainda, optar por escolher
diretamente cores e formatações, embora em um nível um pouco mais
avançado de conhecimento outras alterações se tornem possíveis e possam
integrar as opções padrões, nesse momento do processo o interator apenas
recebe uma indicação do que é permitido mudar.
Txt_036_Web
Uma vez iniciada a criação do portal, o sistema disponibiliza um passo a
passo no lado direito da interface com sugestões de modi-ficações
consideradas fundamentais [figura 19]. As modificações iniciais da
aparência, nesse momento, já estão realizadas, agora fizemos o ‘upload’
do logo e conferimos à estrutura de navegação.
FIGURA 013_web
Figura 19: Configurações passo a passo

Para que o portal assuma a identidade do projeto foi preciso criar um

logotipo adequado. A opção escolhida foi trabalhar uma variação do
logotipo original criado para o material gráfico desta pesquisa. Veja na
[figura 20] a ferramenta e as instruções de carregamento do logotipo, bem
como o logotipo finalizado.
Figura 20: Como carregar o Logotipo do Projeto.

Fonte: http://percursos.incubadora.fapesp.br
O item “alterar a estrutura de navegação” permite que sejam inseridos ou

eliminados pequenos elementos da interface. Essas, por sua vez, têm uma
determinada função visual no site e podem ser colocados na coluna da
esquerda ou da direita e suas posições podem ser alteradas dentro da
própria coluna de cima para baixo.
Txt_036_Web
Figura 21: Interface inicial do Projeto Percursos: hipertextualidades

Fonte: http://percursos.incubadora.fapesp.br
Feitas as alterações iniciais o portal assumiu o formato apresentado na

[figura 21]:
Para o propósito inicial desta pesquisa, analisar e compartilhar dados na

estrutura mais difundida da web 2.0, consideramos o material suficiente e
encerraremos aqui a construção. O projeto permanecerá aberto para a
comunidade e se construirá a partir de sua colaboração, podendo se tornar
material para futuras análises.
Txt_037_Web
2.2 Com foco na linguagem: o exemplo dos sites experimentais
O que se debate aqui é o conceito de informar, que significa

impor formas à matéria. [FLUSSER, 2000, p.31]
CIT_035_Web
Partimos do pressuposto que, uma vez conhecida a “matéria” ou “conteúdo” é

preciso escolher a “forma” mais adequada e eficaz para sua apresentação,
aproveitamento e possibilidades de interação.
Se informar corresponde a impor ou dar formas a matéria, conforme o

pensamento de Flusser, vamos verificar que nos processos experimentais isso
pode ocorrer de várias maneiras, em um processo circular. Tanto a informação ou
conteúdo levam à forma quanto a forma constitui a informação e também
constrói o conteúdo, no caminho entre as idéias, o texto, a imagem, o som, a
fruição e a interação.
40
Txt_037_Web
2.2.1. Buscando o conceito de “site experimental”
Para esclarecer o que estamos entendendo por “site experimental”

algumas palavras da descrição do verbete ao lado são
fundamentais: experiência, empírico e experimentação. Estas três
palavras associam-se mutuamente na questão do experimental. É a
experimental
vivência, a experiência que nos possibilita, por meio do aprendizado,
{verbete} organizado ou não, a construção e ampliação do repertório de
Acepções
conheci-mentos. Para isto, a observação, a experiência obtida por
■ adjetivo de dois gêneros
1 relativo à experiência
meio de nossos sentidos e sensações, o exercício da tentativa, do
2 que tem fundamento ou ensaio, do acerto e do erro são somados ao tempo.
base na experiência; empírico
3 que deriva apenas da experiência
4 que usa experimentação [diz-se
de pesquisa, estudo, método etc.]
[http://houaiss.uol.com.br]
Figura 22: Verbete

Fonte: autora
O empirismo nos aponta que o conhecimento provém da experiência vivida
no mundo subjetivo e introspectivo, bem como no mundo exterior. Por sua
vez, a experimentação implica efetivamente ação.
Txt_038_Web A difusa relação entre Arte e Ciência, principalmente no que diz respeito à
busca de novos recursos e novas sensações neste século XXI, tem se
tornado ainda menos nítida pela facilitação do acesso às tecnologias
digitais. Tudo está ao alcance das mais diferentes mãos e idéias, e um
mesmo recurso tecnológico pode ser aplicado a diferentes objetos e
projetos explorando as mais diversas formas. Neste momento, surgem
experimentos no mundo todo e grande parte deles tem na Web um
ambiente de disseminação e divulgação garantido. Documentos e
simulações são disponibilizados para pesquisa e têm retorno [feedback]
imediato, possibilitando maior aprofundamento.
Propor uma experimentação com o intuito de abrir novas perspectivas de

construção de linguagem, não é novidade dentro do universo da Web e os
designers interessados em garantir a comunicação efetiva e o acesso às
informações precisam estar atentos a esses exercícios e aos métodos
escolhidos para sua aplicação.
41
Txt_039_Web
A “Net-art” ou “Web-art” são campos de exploração de sensações, interação e
linguagem bastante difundidas, e o empirismo ou experiência prática, tanto do
artista/cientista quanto do interator, se difunde com o conhecimento teórico,
abrindo novos caminhos. O resultado dessas experimentações artísticas,
portanto, servem de ponto de partida aos olhares atentos dos designers que
podem então assegurar sua aplicação aos recursos comunicacionais e propor
projetos mais ousados e inovadores, bem como os mais adequados ao meio que
se propõe.
Em um site experimental uma nova experimentação é proposta a partir de

pesquisa e métodos específicos ou não. O processo de produção ou projetação
experimental implica uma atitude aberta a várias possibilidades, à busca de
referências, questionamentos, recriações, mudanças e transformações. É o
pensar e produzir soluções díspares, diferenciadas, construindo novos
significados e no sentido contraditório da construção de modelos, fórmula e
estilos.
Txt_040_Web
A atitude e o gesto projetual da experimentação levam o resultado ou o produto a
instigar e exigir do interator o exercício de experimentar ao se relacionar com o
produto. A partir dessa experimentação, o interator pode unir sua experiência
anterior à adquirida na vivência e relação com o novo produto/espaço e, por
meio dessa prática, apontar outras inquietações ainda não detectadas. Desta
forma o processo pode se reiniciar, indefinidamente. Mas para que haja essa
interação e envolvimento entre o sujeito e o produto é necessário instigar a
curiosidade e despertar a motivação do interator para que ele explore o produto
ou espaço do mesmo. Este é ponto principal onde os elementos
comunicacionais bem aplicados farão a diferença. Bonsiepe [2000/2001, p.10-
11] acredita que o design é fundamental na comunicação, pois ele garante a
construção de uma interface que considere a melhor forma de apresentar e
disponibilizar conhecimento. Ele diz que,
[...] sem a intervenção do design, a apresentação do

conhecimento e a comunicação simplesmente não funcio-
nariam, pois o conhecimento precisa ser mediatizado por uma
interface que possa ser percebida e assimilada. De outra
forma, o conhecimento permaneceria abstrato, e não seria
nem acessível, nem experimentável.
CIT_036_Web
Txt_040_Web
Também Flusser [2007, p.28] trata dessa “materialização”, este “aparecimento”
do conteúdo “A matéria no design, como qualquer outro aspecto cultural, é o
como as formas aparecem” CIT_037_Web
. O “como”, apontado por Flusser, foi o
objeto central da análise que fizemos sobre as formas e/ou informações e sua
disponibilização em um site experimental.
Txt_041_Web
Para proceder à análise dos sites experimentais consideramos a aplicação da
linguagem na construção das interfaces e a forma como esta se desenvolve a
partir dos recursos disponíveis na mídia digital e principalmente na construção
hipertextual, possibilitada por ela. Diferentemente da análise do modelo “wiki”, o
conteúdo aqui é fundamental e norteador das escolhas feitas para a sua
disponibilização na Web. Entender a construção da interface a partir dos
elementos comunicacionais que a compõem abriu novas perspectivas para a
produção e publicação deste sistema hipermidiático que comporta o conteúdo
desta dissertação, bem como, de parte do material teórico que ajudou na sua
composição.
2.2.2. Análise de caso
Durante o processo de escolha do produto a ser analisado, detectamos que para

uma melhor abrangência na questão experimental deveríamos trazer para esta
discussão e análise alguns exemplos de sites, apontando aspectos especiais e
diferenciados em cada um deles.
Txt_042_Web
Site: My Pet Skeleton FIGURA 014_web
Começaremos área do site que contém o portfólio

digital e que pode ser acessada por meio do “banner”
com “espantalhos”, situado no rodapé da interface
inicial [figura 23] onde constam também outros
projetos e que tem um formato de “portal”
unicamente informativo.
Figura 23: Interface de carregamento do portfólio digital

Fonte: http://www.mypetskeleton.com
43
Txt_042_Web
Na interface de apresentação [figura 24], é utilizado um recurso bastante
expressivo no design de hipermídia que é: envolver o interator com o conteúdo
enquanto alguns eventos tecnológicos inevitáveis, como o carregamento do site,
por exemplo, se concretiza. Nesse caso, a poesia, a música e pequenas
animações foram os recursos escolhidos. Na prática profissional em hipermídia
temos o retorno [feedback] de informação esperado pelo interator como um
recurso comunicacional fundamental para um relacionamento saudável com o
sistema, uma obrigatoriedade quando considerada a variedade de tipos de
conexões existentes. Segundo Julio Plaza [1996, p.73], “o instantâneo feedback
é necessário para tornar efetiva a participação entre usuário e computador. Para
CIT_038_Web o computador interativo a resposta deve ser imediata”. E neste caso, em relação
ao carregamento, a resposta aparece no rodapé da poesia por meio de uma
delicada animação totalmente inserida na linguagem visual do projeto, ao
mesmo tempo em que outra animação mostra detalhes do conteúdo imagético
que se seguirá antecipando o envolvimento.
FIGURA 015_web
And when I say good night

E quando eu digo boa noite
the pictures in my head
As imagens na minha cabeça
will dance around my room
Dançarão ao redor de meu quarto
and frolic in my bed
E brincarão em minha cama
and when i say good day
E quando eu digo bom dia
they hide behind my eyes
Elas se escondem atrás de meus olhos
waiting for the dreaming
À espera que o sonho
to bring them back alive
As traga de volta à vida
Figura 24: Interface de carregamento e texto apresentado [Autoria não apontada]
Txt_043_Web
Essa introdução poética prepara o interator para aceitar o ambiente onírico ao
qual será levado e a compreender o contexto das ilustrações apresentadas.
Txt_043_Web
Em seguida a essa preparação a interface principal de navegação expõe o
interator a um ambiente fortemente marcado por uma imagem carregada de
expressividade [figura 25], ou seja, apenas pelo acesso inicial ele já sabe se o
material disponibilizado será de seu interesse, tanto pela própria ilustração
apresentada quanto pela ambientação sonora e também pela exploração da
tipografia integrada à interface e contribuindo para a sua construção.
FIGURA 016_web
Figura 25: Interface principal do portfólio digital

A navegação torna-se intuitiva e exploratória, sugerida pela sensibilidade,

apontando levemente caminhos títulos para os conteúdos que se seguirão
aparecem por um breve tempo no espaço ao lado do nome do portfólio sendo
logo levados pelo nevoeiro quando o cursor, levado pelo interator, passa sobre as
figuras dispostas na interface, cada espantalho torna-se um ponto de acesso,
primeiro a uma barra de esco-lhas e depois às ilustrações finais [figura 26].
Txt_044_Web
A casa ao fundo, significativamente, leva às informações sobre o pro-jeto e sobre
as pessoas que o produziram, inclusive permi-tindo contatos profissionais e
comerciais, já que se trata de um portfólio que visa à prospecção de clientes
[figuras 27 e 28]. Um destaque para os créditos é a preocupação em indicar a
origem da sonorização do ambiente.
Txt_044_Web
FIGURA 017_web
Figura 26: Segundo nível de informações com a barra de navegação e uma

janela pop-up contendo a ilustração escolhida
Temos aqui a utilização dos links conjuntivos, apontados por Lucia Leão [2005,
p. 31], em análise das questões de navegação no ciberespaço, uma
característica hipertextual bastante interessante e categoria da qual fazem parte
as janelas pop-up:
Os links conjuntivos são bem interessantes de serem usados, pois

levam a uma experiência de simultaneidade. Quando se programa um
link do tipo pop-up viewer, por exemplo, ao “clicar” na hotword surge
uma definição em uma pequena janela que se sobrepõe à tela que
estava sendo lida. Assim, o leitor tem a possibilidade de continuar na
página e ao mesmo tempo acessar uma informação adicional.
CIT_039_Web
FIGURA 018_web
As janelas pop-up permitem navegar sem

perder de vista a interface principal e,
geralmente, mantém uma composição visual
com o todo, formando um conjunto. Elas
também podem conter diversos ní-veis de
informação como observamos nas figuras 27 e
28 que representam a janela de créditos e
contato do projeto sendo, ela mesma, um
Figuras 27 e 28: Interfaces abertas em uma janela pop-up com
espaço hipertextual. informações sobre o ilustrador e dados para contato
Nessas janelas a identidade visual é mantida e também a característica intuitiva da

navegação. Porém, assume um formato mais ordenado, como um “menu de opções” anexado
à borda da janela interna de informações, propondo uma exploração rápida e objetiva.
Txt_045_Web FIGURA 019_web

Site: Mis Printed Type 3
Figura 29: Interface de abertura do portfólio digital

Fonte: http://www.misprintedtype.com
Muitos são os sites onde são explorados os mesmos recursos visuais,

baseados em ilustrações e também no envolvimento sonoro, geralmente
tratam-se de portfólios pessoais ou de estúdios. A Figura 29 apresenta a
interface de abertura do projeto: Mis Printed Type 3, onde a tipografia
ultrapassa sua funcionalidade de informar textual-mente algo e carrega as
características estéticas da ilustração.
FIGURA 020_web
ABOUT
name: Eduardo Recife
location: BRAZIL
Belo Horizonte - MG
freelance: yes
Commercial website at:

http://www.eduardorecife.com
Figura 30: Interface principal do site

A interface principal [Figura 30] é auxiliada pela existência de uma barra de

navegação tradicional na base inferior da imagem inicial, mas ela continua no
sentido vertical e quando descemos pela barra de rolagem do navegador
encontramos links espalhados pelo espaço e representados por ilustrações,
constituindo uma unidade visual com a ilustração maior e a tipografia também
está integrada à imagem.
Txt_045_Web
Site: Mis Printed Type 3
Esses links têm suas características funcionais comuns, de ligações entre as

informações, desassociadas de sua representação, causando certa surpresa
na navegação e levando o interator a explorar o espaço em busca dos acessos
possíveis. [Figura 31].
FIGURA 021_web
Figura 31: Parte inferior da Interface principal do site

Txt_046_Web
Nesse projeto o envolvimento espacial é estritamente bidimensional e apresenta
uma relação direta com a textura própria do papel, no entanto, trata-se de um
“papel” com suas propriedades modificadas por meio da exploração dos
recursos do hipertexto. A hibridização das linguagens próprias dos meios
impresso e digital coloca o interator diante de um novo objeto a ser apreendido.
Apesar da composição gráfica e visual das interfaces deste site remeterem ao

caráter experimental, podemos perceber que os sistemas de navegação e de
organização das informações ocorrem de forma um tanto convencional e
relacionada a padrões estabelecidos para o meio impresso. A presença da
“barra de rolagem”, a apresentação das imagens em seqüência numérica, a
falta de sonoridade estabelecem o distanciamento do interator das
possibilidades mais características da hipermídia. Muito diferente da proposta
na forma e nas soluções hipermidiáticas e hipertextuais presentes no exemplo
My Pet Skeleton.
Txt_047_Web
Site: Out of target
Figura 32: Interface de aberturado portfólio digital

Fonte: http://www.outoftarget.com
No exemplo “Out of target” [Figuras 32, 33 e 34] temos mais alguns itens que
devemos observar: uma moldura com informações constantes que representa
um limite para o espaço das interfaces; o título do site apresentado na interface
principal, estabelecendo uma identidade que é reforçada também pela
presença de um personagem animado, um ponto focal forte o boneco de um
bebê que aparece em todas as interfaces em atitudes aparentemente
desligadas do peso da imagem [Figura 35]. Esse bebê é responsável pelo acesso
ao e-mail do ilustrador e também “cospe” algumas frases provocativas e
informações sobre os conteúdos dos links que estão ocultos na própria imagem
que constitui a interface.
FIGURA 022_web FIGURA 023_web
Figura 33: Interface principal do site Figura 34: Interface interna do mesmo site
http://www.outoftarget.com http://www.outoftarget.com
FIGURA 024_web
As atitudes do bebê, que chega a brincar com o pé em uma

piscina de sangue ao lado de um cadáver, causam sensações
conflitantes que, sem dúvida, nascem do peso da simbologia e
Figura 35: Personagem animado constante em
toda a navegação em atitudes displicentes
dos contrastes, também são recursos de linguagem textual,
apesar do peso do ambiente visual e sonora que devem integrar o repertório do designer.
Txt_048_Web
Site: Mjau-mjau.com
Figura 36: Interface do site mjau-mjau. Destaque para a escolha de uma linguagem gráfica
que explora e reforça a idéia de tecnologia aplicada aos meios digitais.
Fonte: http://www.mjau-mjau.com
Existem outros modelos de sites experimentais que primam por divulgar a

tecnologia ao mesmo tempo em que exploram seus recursos e um desses
exemplos é o site - mjau-mjau um clássico entre os pesquisadores de recursos
tecnológicos para a Web [figura 36]. A imagem que suporta a interface é
resultado de uma montagem só possível com recursos digitais. Há várias formas
de se chegar ao conteúdo, uma delas é o “menu de opções” disponível do lado
direito da interface, em uma janela transparente - sobreposição bastante
difundida para o melhor aproveitamento do espaço limitado do monitor do
computador - onde os projetos são disponibilizados em forma de lista simples
enquanto ainda há a opção de navegar por meio dos pequenos retângulos que
contêm detalhes de imagens, sendo assim uma navegação mais exploratória
auxiliada pela aplicação de sonorização aplicada aos movimentos do cursor e
por sinalização textual.
A fuga da imagem estática também é um diferencial nessa interface. As imagens

do fundo se movimentam esporadicamente e os ícones retangulares
apresentam atitudes com a movimentação do cursor se aproximando e se
afastando dele, causando assim dinamismo ao ambiente e dando uma
sensação de poder de interferência ao interator.
Txt_049_Web
Site: Soundspace
FIGURA 025_web
Figura 37: Interfaces do site Soundspace

Fonte: http://www.lesondujour.com
Alguns projetos buscam novos meios de apresentação do conteúdo. Em

“Soundspace”, por exemplo, a locução é o principal meio de comunicação
utilizado, juntamente com uma ambientação sonora envolventemente
relacionada às interfaces fotográficas que têm sua condição de imagens
estáticas quebrada pela integração de pequenos trechos de vídeos e animações
[Figura 37].
FIGURA 026_web
Site: Anonymes.net versão 2
O vídeo integrado à interface e com reações

diante da intervenção do interator para contar
uma estória envolvendo duas pessoas é a
experi-mentação proposta no projeto
“Anonymes” [Figura 38 e 39], finalista na
competição francesa “Flash Festival en
France” [www.flashfestival.net], o mesmo se
Figura 38: Interfaces do site Anonymes
aplica ao exemplo anterior. Fonte: http://www.anonymes.net
Foram escolhidas cores diferentes para cada “capítulo” da estória e os vídeos

acompanham estas escolhas reforçando a integração entre os elementos
formais.
Txt_049_Web FIGURA 027_web
Figura 39: Interfaces do site Anonymes

Dois vídeos se cruzam acionados pelo movimento do mouse e os personagens invertem suas
posições na interface, bem como, seus comportamentos no roteiro.
Um mérito a ser apontado neste projeto é a exploração da interatividade

associada aos vídeos. A ação do interator provoca reações inesperadas nos
atores ou mudanças nos cenários alterando a significação da cena.
Txt_050_Web
2.3. Aplicação dos recursos hipertextuais neste projeto
Os recursos gráficos, sonoros de interação e navegação considerados ideais

para a publicação deste texto na Web são aqueles resultantes dos pontos
positivos levantados até aqui, tanto no que diz respeito à estrutura dos dados
nos ambientes 'wiki' quanto à exploração da linguagem apropriada a exemplo
dos sites experimentais.
O projeto se inicia pela reestruturação do conteúdo desta dissertação em

blocos de texto com ligações semânticas entre si por meio dos links. Esses links
podem ser conjuntivos, imagens e animações apresentadas em janelas pop-
up, ou disjuntivos, a partir das escolhas pessoais de cada internauta, segundo
concepção de Lucia Leão [2005]. A leitura não seqüencial e a multiplicidade de
opções são abordadas na navegação explorando as possibilidades de
interação oferecidas. O espaço é explo-rado de maneira que haja um
afastamento das metáforas herdadas do livro impresso, como páginas
numeradas e simulação do papel. Esse afastamento será reforçado com a
aplicação de ambientações sonoras e de movimento.
52
Txt_050_Web
Conservamos dos modelos “wiki” a organização das informações por trás da
interface e a preocupação com sua disponibi-lização clara e imediata com o uso
do “caminho de migalhas” e a ferramenta de busca. No entanto, reconhecemos
essa interface como sendo de caráter experimental à medida que reúne e
hibridiza várias linguagens e processos criando um espaço aberto e interativo.
Txt_051_Web
3. Percurso do processo: teoria e prática
O texto apresentado neste 3º capítulo segue um padrão diferenciado dos

demais, uma vez que, consideramos importante o relato do processo de uma
experiência individual na medida em que ele explica o percurso do
desenvolvimento desta pesquisa. Por este motivo, o 3º capítulo encontra-se
com o texto narrado na primeira pessoa do singular.
Este capítulo retoma alguns pontos abordados nos anteriores e aponta as

razões que me trouxeram a efetivar esta pesquisa e a transformá-la em um
projeto hipermidiático, considerando, inclusive, o meu percurso e processo
profissional e acadêmico. O início de minha relação com a mídia digital se deu
há 25 anos [1983] quando acompanhei a instalação de um CPD [Centro de
Processamento de Dados] na empresa na qual trabalhava.
Era a primeira vez que eu estava diante de um computador com a

responsabilidade de produzir sistemas para o armazenamento e a organi-
zação de dados públicos e confidenciais. Mesmo antes da abertura de dados
possibilitada pela Internet e pela Web, a preocupação com a segu-rança já
consumia muito esforço em pesquisa e investimentos pesados feitos pelas
grandes empresas. Buscar soluções para o acesso seguro à informação tornou-
se então uma constância em minha vida profissional, levando-me a
acompanhar o desenvolvimento da tecnologia tanto física quanto
conceitualmente. Desde então, estudo e exploro as possibilidades da
hipermídia e as transformações ocorridas com a distribuição de dados na
grande rede de comunicações que é a Word Wide Web.
53
Txt_052_Web
Como ponto de partida para relatar esse processo, levarei em consideração às
denominações profissionais com as quais fui nomeada no início do meu
envolvimento com a “informática”. Primeiro, “Programadora”, profissional que
efetivamente conhece a linguagem de programação disponível e estabelece um
diálogo com a máquina alimen-tando-a com aplicativos úteis ao usuário final,
tornando-se um mediador ou tradutor entre o sujeito e o sistema. Uma
característica do profissional de programação é a necessidade intrínseca de
conhecimento dos códigos da linguagem e de suas possibilidades práticas o que
lhe permite um maior controle da máquina. A busca desse conhecimento implica
constantes estudos e reavaliações de procedimentos acompa-nhando sempre a
evolução da tecnologia. Já a denominação de “Analista de Sistemas” denota a
fina relação entre a disseminação de sistemas de dados e o profissional capaz
de acompanhar esse crescimento de forma analítica e também produtiva,
colaborando para um melhor aproveita-mento de seus recursos. Esse
profissional é responsável pelo bom desempenho dos sistemas principalmente
quando eles são efetivamente implantados e abertos à utilização dos usuários
finais. Essa experiência profissional e as dificuldades enfrentadas diante de
algumas imposições técnicas e culturais foram as principais fontes das
inquietações que me mantiveram atenta às mudanças ocorridas e às discussões
envolvendo-as.
Txt_053_Web
A experiência em sistemas fechados para empresas mostrou-se
fundamentalmente importante a partir da propagação de dados com a chegada
da Web o que também trouxe novos pontos a serem conside-rados. Como por
exemplo, o crescimento exponencial de usuários de um mesmo sistema ao
mesmo tempo em que crescia a complexidade do armazenamento, organização
e disponibilização dos dados em conseqüência desse uso. No momento em que
a computação gráfica tornou-se possível em computadores pessoais ou de
pequeno porte, surgiram novas propostas comunicacionais relacionadas à
interface. As chamadas “interfaces gráficas” abriram o campo para a pesquisa
do uso de sinais e signos próprios capazes de substituir ou de representar
seqüências de texto. A comunicação iconográfica se espalhou, inclusive, por
outros meios que não os digitais. O insípido espaço visual da tela do computador
ganhou cores e texturas não possíveis anteriormente. Para os profissionais de
sistemas esse acontecimento representou um grande desafio, pois trazia muitas
implicações para o seu trabalho, levando-o a buscar soluções em outras áreas
de conhecimento. Uma nova linguagem se estabelecia e uma comunicação
eficiente só se faria se os novos códigos fossem assimilados e explorados. Novas
profissões se estabeleceram com a aproximação de saberes das quais a de
designer de web é um exemplo.
Txt_054_Web
3.1. Percurso profissional: pensando no usuário de computadores e
sua relação com o sistema.
O desenvolvimento de interfaces amigáveis considerando as questões da

usabilidade, ou seja, a busca pelo conforto no uso de sistemas e equipamentos
por profissionais, melhorando sua relação com o ambiente de trabalho e
conseqüentemente sua produção, foi no início o ponto principal de meu trabalho.
Ao mesmo tempo em que eram desenvolvidas soluções para a visibilidade e
utilização, havia a preocupação com o armazenamento eficiente das
informações, uma vez que, dessa eficiência dependia a exatidão dos resultados
dos sistemas produzidos, como por exemplo, a integração entre um Sistema de
Contabilidade com um Sistema de Contas a Pagar e com um Sistema de Folha de
Pagamento de Funcionários, permitindo que dados inseridos por um dos setores
fossem aproveitados por outros, agilizando, assim, o processo e a tomada de
decisões. As interfaces próprias para Web herdaram muitas características dos
sistemas fechados das empresas, principalmente porque a interface física do
hardware, ou o computador, ainda tem os mesmos componentes de interação: o
teclado alfa-numérico, o mouse e o monitor; com algumas melhorias na
qualidade, mas sem grandes alterações no formato.
Txt_055_Web
As alterações que ocorreram nos sistemas nos últimos anos foram mais
conceituais e lógicas, tais como a relação homem/máquina que foi ampliada
para homem/máquina/homem se considerarmos que a máquina recebe
“alimentação”, processa esses dados e retorna novas informações sempre sob o
controle do homem. Sendo este “homem” então o centro desse processo, nada
mais justo que a busca de aproximação da linguagem da máquina com a
linguagem humana, com os símbolos e signos pertinentes à sua comunicação.
Em uma época na qual as Interfaces Gráficas como conhecemos hoje, ainda não
estavam disponíveis, a relação entre o homem e o computador era realizada
apenas por meio de formulários de entrada [input] de dados e relatórios de saída
[output] de informações. Ou seja, dados organizados e processados a partir de
uma requisição do usuário. O relacionamento homem x máquina era efetivado
somente de forma textual por meio do modelo de questionários e saber solicitar
era fundamental para se obter a resposta ou a informação desejada, em alguns
casos, inclusive, era preciso usar a sintaxe da linguagem de programação da
máquina.
55
Txt_056_Web
A aparência técnica das interfaces iniciais sugeria um conhecimento prévio no
manuseio do sistema e limitava seu uso aos ambientes internos das empresas e
a funcionários capacitados. Paralelamente, no entanto, profissionais de outras
áreas, especialistas em tecnologia, adolescentes e outras pessoas interessadas
começaram a explorar de maneira livre, as potencialidades do computador,
rompendo os limites, abrindo códigos, distorcendo pixels, trocando informações
e experiências, criando jogos e programas para entretenimento. Isso
demonstrou o interesse público e a garantia do retorno em investimentos nessa
área, aquecendo o mercado de desenvolvimento de hardware e software,
inclusive com apoio de publicações especializadas e voltadas a todos esses
públicos. Hoje, os formulários de entrada de dados ainda são uma das formas de
nos relacionarmos com o sistema, e um projeto mal estruturado pode fragilizar o
processo de fidelização do cliente, o que é uma grande preocupação de
empresas que usam a Internet. Portanto, pesquisas, tanto conceituais quanto
técnicas, se tornam fundamentais na busca de soluções práticas para seu uso,
principalmente as que considerem as características próprias da hipermídia.
Txt_057_Web
Os recursos gráficos alcançados por hardwares e softwares trouxeram formas de
relacionamento mais intuitivas, exigindo cada vez menos que o usuário conheça
as necessidades do sistema da máquina: suas necessidades pessoais é que
devem ser atendidas. A interatividade passou a ser o foco principal de estudos,
tornando-se intensa a busca de soluções para atender esse usuário que também
passa por transformações importantes e começa a agir não como um simples
usuário do que é lhe é imposto e sim como alguém que interage diretamente com
as ferramentas ou, por meio delas, com outros interatores. O “feedback” passa a
ser conseqüência de um cruzamento de dados e de atitudes comportamentais,
de escolhas associadas a infinitas possibilidades. No entanto, quando estamos
envolvidos em projetos voltados ao mercado, a reflexão e, muitas vezes, a
experimentação são deixadas de lado por questões práticas e econômicas. No
meu caso, a solução para romper com esse comportamento e atitude
pragmática veio com a oportunidade de lecionar no Bacharelado em Design
Digital da Universidade Anhembi Morumbi. A Universidade é o espaço ideal para
a pesquisa e experimentação e o comprometimento com os alunos é um
incentivo bastante forte para um professor buscar sempre a atualização de seus
conhecimentos. Pude assumir uma atitude e uma prática no campo da reflexão e
da experimentação.
Txt_058_Web
O meu trânsito entre os universos prático e acadêmico se deu de forma gradativa
enquanto os interesses de um campo buscavam apoio e co-relação nos
resultados do outro campo. Fato que ainda continua a acontecer. Meu
aprendizado inicialmente como autodidata, tanto de aprofundamento cultural
quanto de conhecimentos tecnológicos, foi ampliado por vários cursos técnicos
de programação de computadores e de análise de sistemas; uma passagem de
dois anos pelo curso de Comunicação Visual da FAAP – Fundação Armando
Álvares Penteado; uma incursão pelo curso de Ciência da Computação da
Universidade São Judas Tadeu; a realização do Bacharelado em Artes em
Computação Gráfica e Multimídia da Universidade Anhembi Morumbi ampliado
no desenvolvimento da especialização em Design de Hipermídia da mesma
instituição. Paralelamente a esta formação cultural, dentro e fora das
instituições educacionais, mantive sempre um exercício de criação e exploração
em técnicas artísticas variadas, como o desenho livre; a pintura: com nanquim,
aquarela e óleo; a colagem, a serigrafia e a xilogravura.
Txt_059_Web
A experiência com materiais, texturas e com processos criativos, contribuiu na
construção de um repertório pessoal sobre essas técnicas, processos e,
também, sobre o universo da imagem como: formas, cores e poder de síntese
para a informação e comunicação. Devido a este repertório a transição para o
uso dos softwares, que passaram a simulá-las no computador foi menos
traumática. A simulação do que nos é familiar pode ser um ponto de partida para
novas experimentações no campo da criação, principalmente quando nos
deparamos com novas tecnologias e, a partir de sua exploração, alcançamos
segurança suficiente para estabelecer relações antes impossíveis, como, por
exemplo, a interatividade. Exemplificando temos as interfaces experimentais
analisadas no capítulo anterior, que simulam ambientes e objetos reais
atribuindo-lhes outros significados, enriquecendo a imagem figurativa com o uso
da animação e sonorização.
Txt_060_Web
O dia-a-dia na sala de aula apontou-me a dificuldade dos adolescentes em
compreender as alterações ocorridas com a realidade do ciberespaço. Em seus
projetos a leitura hipertextual um fundamento da hipermídia era tratada de
forma displicente e só acontecia como uma obrigação da disciplina a ser
cumprida, fato que me levou a trabalhar no projeto [RE]CONTANDO que é a
transcriação de um conto publicado em livro para o formato hipermidiático. O
4
texto escolhido foi: “O iniciado do vento” de Aníbal Machado e contei com a
colaboração da Professora Hamide Assain José, também integrante do corpo
docente da Universidade Anhembi Morumbi e minha parceira no grupo de
desenvolvimento do projeto.
A transcriação acontece passo a passo e tem várias versões, cada uma delas
agregando uma característica da hipermídia que é comentada e comparada com
a versão anterior objetivando tornar clara a necessidade de sua aplicação.
Txt_061_Web
Figura 40: Pop-up com a primeira versão.
Na figura 40 podemos ver como todo o texto é lançado inteiro em uma página
HTML, sem nenhum tratamento especial, com a fonte tipográfica comum ao
navegador, o texto é o único recurso comuni-cacional e para lê-lo o internauta
tem que acionar uma barra de rolagem no lado direito da janela.
Os problemas aqui apontados são: a linearidade da leitura e a ausência de uma

preocupação gráfica com a interface, principalmente com a tipografia.
4
MACHADO, Aníbal M., A morte da porta-estandarte e Tati, a Garota e outras histórias
. 10ª Edição. Rio de Janeiro, José Olympio, 1980. págs.3-34.
Txt_061_Web
As versões se sucedem e na de número cinco [Figura 41] já temos alterações
interessantes, pois, destacamos o título, localizamos o leitor apontando com
uma tipografia diferente a “página” ainda estamos próxi-mos à mídia impressa
em que ele se encontra, separamos os diálogos do restante do texto com o uso
de cores diferentes, retiramos definitivamente a barra de rolagem, trocando-a
por um acesso fixo às páginas; situado no rodapé da janela pop-up. Esse acesso
causa uma falsa impressão de quebra da linearidade porque apesar de poder ler
qualquer parte do texto sem obedecer a ordem numerada, o entendimento da
história é bastante prejudicado, pois cada trecho só tem sentido quando lido
depois do trecho que o precede.
Figura 41: Pop-up com a quinta versão
Com o ingresso no Mestrado em Design pude ampliar e apresentar minhas

idéias em relação à hipertextualidade à luz de outros pesquisadores,
aprofundando o projeto acima e partindo para novos projetos apoiada em uma
base teórica mais consistente. A exploração dos elementos que caracterizam o
hipertexto e o design de hipermídia na organização e disponibilização das
informações representa o fechamento deste percurso acadêmico e o início de
novas discussões.
3.2. Projeto do site
Objetivos:
- Explorar as técnicas de construção de hipertexto analisadas na dissertação;
- Apresentar os autores pesquisados;
- Publicar o andamento e os resultados da pesquisa de Mestrado;
- Compartilhar as informações com a comunidade acadêmica permitindo sua

participação com comentários e sugestões;
- Permanecer como um espaço aberto a discussões sobre o suporte;
- Construir uma Rede de Informações com outros projetos pertinentes;
Conceito de criação:
Para a criação do site partimos do princípio que o hipertexto deve ser não linear
desde sua concepção. Este princípio norteia todas as outras escolhas e a
fluidez, a metamorfose, a multiplicidade e a descentralização são exploradas
enquanto construtoras da navegação e da interação a partir dele.
Projeto do logotipo:
O logotipo foi desenvolvido como base no título desta pesquisa e usado para
garantir a identidade de todo material gráfico resultante dela, e também e para
aproximar o projeto digital desse material.
A complexidade visual, construída com o uso de linhas, pontos e com a

exploração da tipografia busca remeter a própria complexidade do meio. O
dinamismo aplicado as letras "X" reforça visualmente a contribuição do
movimento e da distorção espacial na construção da hipertextualidade e no
meio digital estes movimentos e distorções acontecem, de fato.
60
Conceito de navegação e interação:
Explorar a não linearidade aplicando uma navegação que se faz por meio,
principalmente de links e de ferramentas de busca. O interator pode optar
também por navegar apenas por imagens ou pelas citações dos autores. Existem
links externos para ampliar o campo de discussão e uma ligação direta com o
projeto Percursos: Hipertextualidades, que conta com a colaboração dos
internautas para tornar-se um ponto referência para futuras pesquisas.
O conteúdo é apresentado por meio de cada capítulo desta dissertação

utilizando a totalidade do espaço do monitor tendo o interator a possibilidade de
usar recursos de aproximação e afastamento que garantirão uma visualização
mais confortável do todo e de detalhes específicos.
Ferramenta de navegação por meio dos capítulos
BOTÃO PARA DESCARREGAR TUDO
As setas apresentam as cores usadas para cada conteúdo.

Auxiliares para a navegação:
Foram criados alguns ícones para auxiliar a navegação tendo como base o uso
de sinais tipográficos, uma vez que, fazem parte integrante da construção do
texto. Os recursos de animação e sonorização também foram utilizados para
fortalecer a relação entre o símbolo gráfico e o conteúdo da dissertação. São
eles:
A escolha dos "colchetes" como parte da formalização destes ícones permite

uma aproximação ao Logotipo e também estabelece uma ligação maior com o
texto, uma vez que, neste os "parenteses" foram substituídos por "colchetes".
Alguns destes ícones foram aplicados neste projeto gráfico com o intuito de
manter a linguagem visual entre as duas formas de publicação garantindo
também o reconhecimento dos ítens a partir de sua participação na
construção do texto [imagens, links, citações etc].
Ferramentas de busca e navegação: ÍCONE PARA EFETIVAR A BUSCA
ESPAÇO PARA DIGITAR O CÓDIGO DA CITAÇÃO
ESPAÇO QUE APRESENTA OS DADOS

BIBLIOGRÁFICOS
LISTA DE CITAÇÕES PARA ACESSO DIRETO

ÍCONE PARA ARRASTAR O QUADRO
Os quadros de busca são elementos

fundamentais e facilitadores de um acesso
não linear ao conteúdo. Permitem ao
interator navegar apenas pelas citações ou
partir de uma delas para acessar o texto
relacionado [acessa texto]. O mesmo
acontecendo com as imagens ou figuras.
Alguns quadros estão relacionados entre sí,
por exemplo, quando uma citação é
acessada automaticamente as referências
bibliográficas referentes a ela aparecem no
quadro apropriado.
Ferramentas de busca e navegação:

ÍCONE PARA EFETIVAR A BUSCA
ESPAÇO PARA DIGITAR O CÓDIGO DA FIGURA
DO BLOCO
ESPAÇO QUE APONTA A QUANTIDADE DE VEZES

QUE A PALAVRA SURGE NO CAPÍTULO
ÁREA RESERVADA PARA DIGITAÇÃO DA PALAVRA

ÍCONE PARA ARRASTAR O QUADRO
Os dois primeiros quadros de busca acima permitem um carregamento direto de

figuras e de blocos de texto [observem que os textos desta dissertação impressa
estão marcados pelos mesmos códigos utilizados na Web, como: Txt_001_Web ou
Figura 020_web]. O terceiro quadro possibilita ao interator encontrar mais
rapidamente uma palavra específica dentro dos blocos presentes na interface,
apontando-as com um traço ou sublinhando-as.
Ficha técnica:
Título: Hipertextualidades.com[plexidade] os múltiplos caminhos
da informação no design de hipermídia.
Endereço on-line: www.hipertextualidades.com
Tecnologia: Adobe Flash CS3

XML Extensible Markup Language
PHP Hypertext Preprocessor
Concepção e produção: Mércia Albuquerque

Considerações finais
Consideramos esta pesquisa apenas como mais um “nó” que se somará aos que
o antecederam e a outros que o sucederão na rede de informações e reflexões
que se fortalece a cada contribuição. Partimos do objetivo inicial de identificar
os princípios e elementos do hipertexto dentro do espaço hipermidiático,
apontando seus recursos facilitadores da navegação interativa voltada a um
interator que busca informações a todo o momento e tem na comunicação por
meio da Web um recurso midiático inserido no seu cotidiano.
Alguns apontamentos históricos se fizeram necessários para uma melhor

localização das mudanças conceituais e lógicas e sua associação com as
mudanças tecnológicas, uma vez que, estão intimamente ligadas.
Consideramos que a atenção a estas mudanças é fundamental para o
profissional responsável por projetar novas experiências interativas em um meio
que se transforma rapidamente como o meio digital. O designer, portanto, deve
estar sempre atento por aproximar o seu público da informação, considerando a
mediação de cada nova tecnologia que se apresenta, ajudando a construir uma
nova linguagem, também esta, mutável e flexível. Detectamos que, no entanto, é
comum o distanciamento entre o surgimento da tecnologia e exploração efetiva
de suas possibilidades. A hipertextualidade em meios eletrônicos, por exemplo,
ainda encontra resistência na sua aplicação, mesmo sendo reconhecidamente
um recurso inerente a hipermídia. Podemos justificar este fato mediante o
reconhecimento da complexidade das questões levantadas com seu uso.
Conceitos como multiplicidade, processamento, potencialidade, conectividade,
heterogeneidade, metamorfose, mobilidade, hibridismo, não-linearidade e
interatividade, comuns ao universo da hipermídia estão, cada um deles,
carregados de significados próprios e quando somados ampliam
exponencialmente o campo da pesquisa.
65
Portanto, mesmo quando chegamos ao encerramento deste trabalho sabemos

que ele não se esgota aqui, outras abordagens se fazem necessárias como, por
exemplo, o hipertexto e a mudança no processo humano de adquirir
conhecimento. A cognição tem sido o foco de estudo de muitos pensadores e foi
abordada no presente trabalho no momento da análise de projetos e de como
estes exploram os elementos comunicacionais. Comunicação que só se efetiva
na assimilação da informação, gerando conhecimento.
A análise de projetos disponibilizados na Rede nos ajudou a identificar algumas

características dessa nova linguagem e quanto sua aplicação procura se
adequar ao projeto. Analisar uma proposta que aplica seus esforços a
organização e ao acesso de um grande banco de dados e que em sua interface
com o interator evidencia a, quase exclusiva, importância destes dados, como é
o caso dos modelos “wikis”, ajudou-nos a traçar um paralelo entre a importância
desta organização e a importância de uma linguagem, bem como, de exercícios
navegacionais e interativos mais próximos da maneira de ver e pensar do
homem. Os sites experimentais fazem justamente esta aproximação
trabalhando elementos imagéticos, sonoros e animados juntamente com
elementos textuais. No entanto, percebemos que mais experimentais e
resolvidos são os projetos, quanto menor a quantidade de informação por trás de
sua interface. Parece-nos que a confiança na força de outros elementos que não
os textuais decai paralelamente ao aumento da quantidade de informações.
Esta ocorrência apontou-nos a necessidade de novas experimentações

acompanhadas de reflexão, e nos propusemos a disponibilizar o material desta
pesquisa na Web aplicando o aprendizado adquirido no processo e somando-o à
nossa experiência profissional e acadêmica, uma vez que, como foi dito
anteriormente, a complexidade da hipermídia exige conhecimentos além do
conteúdo desta pesquisa para uma aplicação verdadeiramente exploratória de
seus recursos.
Esta experiência foi pontuada neste trabalho com o intuito de confirmar a

seriedade com a qual nos aproximamos do tema, ou seja, queremos deixar claro
que ela é conseqüência de um longo processo e vem somar-se a ele como um
aglutinador dos conhecimentos adquiridos até este momento e um ponto de
partida para novas propostas.
Referências Bibliográficas
BELLEI, Sérgio Luiz Prado. O livro, a literatura e o computador. São

Paulo: EDUC, 2002.
BONSIEPE, Gui. Ciência/Comunicação/Design. Arcos, Rio de Janeiro,

v.3, s.n., p.104-121, s.m. 2000/2001 versão digitalizada.
COUCHOT, Edmond. Da representação à simulação: evolução das

técnicas e das artes de figuração. In: Parente, André. Imagem-
máquina: a era das tecnologias do virtual. São Paulo: Ed. 34, 1996.
CRYSTAL, David. A revolução da linguagem. Tradução: Ricardo Quintana;

consultoria, Yvone Leite. Rio de Janeiro: Jorge Zahar, 2005.
FLUSSER, Vilém. O Mundo Codificado - por uma filosofia do design e da

comunicação. Org.: CARDOSO, Rafael; tradução: ABI-SÂMARA,
Raquel. São Paulo: COSAC&NAIFY; 2007.
JOHNSON, Steven. Cultura da Interface: como o computador transforma

nossa maneira de criar e comunicar. Tradução: Maria Luísa X. de A.
Borges; revisão técnica, Paulo Vaz. Rio de Janeiro: Jorge Zahar,
2001.
LANDOW, George P. Hipertexto La convergencia de la teoría crítica

contemporánea y la tecnologia. Barcelona: Paidos, 1995.
LÉVY, Pierre. As tecnologias da inteligência o futuro do pensamento na

era da informática. Tradução de Carlos Irineu da Costa. Rio de
Janeiro: Ed. 34, 1993.
LEÃO, Lucia. O Labirinto da hipermídia - arquitetura e navegação no

ciberespaço. São Paulo: Iluminuras, 2005.
MOURA, Mônica. Design de hipermídia. Tese [Doutorado]. Pontifícia

Universidade Católica de São Paulo. São Paulo: 2003.
MUSSO, Pierre. A filosofia da rede. In: PARENTE, André. Tramas da rede:

novas dimensões filosóficas, estéticas e políticas da comunicação.
Porto Alegre: Sulina, 2004.
68
NELSON, Theodor Holm. Libertando-se da prisão. In: FILE - Festival

Internacional de Linguagem Eletrônica - SYMPOSIUM 2005. São
Paulo: Imprensa Oficial do Estado de São Paulo IMESP, 2005.
NUNES, Fábio Oliveira. A liberdade dos Wikidiotas. 19/03/2007 -

http://www.cronopios.com.br/site/internet.asp?id=2269
O´REILLY, Tim. O'Reilly define a Web 2.0. in: http://w2br.com/2006/

11/30/ tim-oreilly-define-a-web-20/ - Último acesso: 29/02/2008
Por: Gilberto Jr.
PARENTE, André. O virtual e o hipertextual. Rio de Janeiro: Pazulin,

1999.
PLAZA, Julio. As imagens de terceira geração, tecno-poéticas. In:

Parente, André. Imagem-máquina: a era das tecnologias do virtual.
São Paulo: Ed. 34, 2ª ED. 1996. Páginas 72-88.
SILVA, Cícero Inácio da. Depois do hiper. In: FILE - Festival Internacional
de Linguagem Eletrônica - SYMPOSIUM 2005. São Paulo: Imprensa
Oficial do Estado de São Paulo IMESP, 2005.
SILVA JUNIOR, José Afonso da. Do Hipertexto ao Algo Mais: Usos e

abusos do conceito de hipermídia pelo jornalismo on-line. In:
LEMOS, André; PALACIOS, Marcos (org). As Janelas do ciberespaço.
Porto Alegre: Sulina, 2001, 2ª Ed. (p. 128-139)
XAVIER, Antônio Carlos. Leitura, texto e hipertexto. In: MARCUSCHI, Luiz

Antônio; XAVIER, Antônio Carlos.[ORG.]. Hipertexto e gêneros
digitais. 2a. ed. Rio de Janeiro: Lucerna, 2005 [Pgs.170 a 180].
webgrafia
http://desciclo.pedia.ws/wiki/Desnot%C3%ADcias:P%C3%A1gina
_principal - último acesso: 29/02/2008
http://en.wikipedia.org/wiki/image:Bookwheel.png
http://houaiss.uol.com.br/busca.jhtm?verbete=experimental&
cod=86469
http://idgnow.uol.com.br/internet/2007/05/24/idgnoticia.2007-05-
24.3179902089/ - Por Guilherme Felitti, repórter do IDG Now!
Publicada em 25 de maio de 2007
http://iv.incubadora.fapesp.br/portal/doc/OQue_c3_a9AIncubadora
http://www.freakpedia.org - último acesso: 29/02/2008
http://pt.wikipedia.org/wiki/Wikipedia:FAQ_Geral#O_que_.C3.A9_
a_Wikipedia.3F
http://pt.wikipedia.org/wiki/Wiki - acesso:26/02/2008
http://revistaepoca.globo.com/Revista/Epoca/0,,EDG77010-6014-465-
2,00.html último acesso: 29/02/2008
http://rhizome.org/starrynight/10.php3?page=10
último acesso: 29/02/2008
http://sloan.stanford.edu/MouseSite/Secondary.html
último acesso: 25/02/2008
http://xanadu.com - último aceso: 25/02/2008
Sites Analisados:
http://www.mypetskeleton.com/index2.html
http://www.mjau-mjau.com/classic.html
http://www.lesondujour.com/soundscape/main_load_content.html
http://www.anonymes.net
http://www.outoftarget.com
http://www.misprintedtype.com

Hi Per Textual Ida Des - Mercia Assis

Enviado por

Dados do documento

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Hi Per Textual Ida Des - Mercia Assis

Enviado por

Direitos autorais:

Formatos disponíveis

São Paulo - 2008

Dissertação apresentada ao Programa de Pós-Graduação

São Paulo - 2008

Dissertação apresentada ao Programa de Pós-Graduação

Profa. Dra. Cláudia Marinho

Prof. Dr. Jofre Silva

São Paulo - 2008

Tem graduação em Educação Artística com ênfase em Computação Gráfica e

A311h Albuquerque, Mércia de Assis.

Orientadora: Mônica Moura

1. Hipertexto 2. Design. 3. Informação. 4. Hipermídia

Dedico este trabalho a meus pais, que apesar de suas

A Professora Mônica Moura, minha orientadora, pela confiança

Aos professores do Mestrado em Design da Universidade

A Professora Hamide Assain José cuja disposição e interesse

Agradeço também, aos colegas de trabalho que me mantiveram

Esta pesquisa discute os recursos do hipertexto como instrumento de navegação

PALAVRAS-CHAVE: Hipertexto. Hipermídia. Informação. Design.

This research discuss the resources of the hypertext as an instrument navigation

KEYWORDS: Hypertext. Hypermedia. Information. Design.

1.3 Principais elementos do hipertexto 19

Codificação utilizada para

Um dos nossos objetivos é identificar os princípios e elementos do hipertexto,

1.1. O que é o hipertexto?

Hipermídia: é a modalidade surgida da convergência entre as

Txt_002_Web A principal pergunta deste trabalho é: O que é o hipertexto e o que ele

Veja uma representação desta descrição na Figura 1. Podemos observar na

Codificação utilizada para

FIGURA 1: Representação do Hipertexto

Toda leitura, mesmo do texto impresso, é uma reconstrução

Outros fatores a serem considerados são o aumento da velocidade de leitura e a

FIGURA 2: Bookwhell, from Agostinho Ramelli´s

Agora considere a World Wide Web. Apesar de alguns de nós estarmos

Porém o importante é o fato, o evento e suas conseqüências diretas e não quem

FIGURA 3: Imagem da simulação animada do “Memex”.

O problema para o artista que se limita a manipular instrumentos se

A aproximação do Design com a Arte reforça a veracidade desse

FIGURA 4: Interface do Projeto Xanadu

Tecnicamente, um hipertexto é um conjunto de nós ligados por

Sua descrição, bastante otimista, enfatiza que os elementos de construção do

O hipertexto é um documento digital composto por diferentes blocos de

recursos como as ferramentas de busca são amplamente difundidos e utilizados

1.2 Princípios do hipertexto

Txt_012_Web Para conhecer melhor as possibilidades do hipertexto, precisamos desconstruí-

os textos de computador - sejam eles hipertextos ou não

Podemos acrescentar a esta definição de Landow o fato de que a hipermídia

Continuando, podemos encontrar uma das características principais do

A rede hipertextual está em constante construção e renegociação. Ela

Este princípio evidencia as possibilidades de construção e reconstrução do

Os nós e as conexões de uma rede hipertextual são heterogêneos. Na

A Pluritextualidade é uma novidade fascinante do hipertexto por

Sobre as considerações acima, destacamos a questão da heterogeneidade

Mais um princípio apontado por Lévy,

c] Princípio de multiplicidade e de encaixe das escalas:

O hipertexto se organiza em um modo “fractal”, ou seja, qualquer nó

potencialidade mediante a fragmentação aponta que “o espaço muda: virtual,

A rede não possui unidade orgânica, nem motor interno. Seu

Com este princípio começamos a entender a importância de fatores externos

Nos hipertextos, tudo funciona por proximidade, por

A utilização de termos como topologia configura a necessidade da construção de

e] Princípio de mobilidade dos centros:

A rede não tem centro, ou melhor, possui permanentemente

FIGURA 5: Exemplo de estrutura rizomática

Fechando os princípios, enfatizamos uma característica que também é