Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 1

Comunicação Gráfica em Interfaces de Hipermídia de Educação a Distância via WEB

Taciana Burgosi (UFRN)

Resumo: O estudo tem como objetivo discutir a comunicação gráfica de leiautes de hipermídia de interfaces de Educação a Distância via Internet, pela necessidade de termos que construir interfaces para diferentes cursos e públicos. Nessa análise apresentamos os atributos de usabilidade dos elementos de hipermídia que compõem as interfaces de EaD e como resultados apresentamos o Design Virtual de Aprendizagem que representa a proposição de interface em sua estrutura base de usabilidade e navegabilidade. Palavras-chave: comunicação hipermídia, interatividade hipermídia, Educação a Distância Abstract: The study it has as objective to argue the graphical communication of layout of hypermedia of interfaces of Education in the distance it saw Internet, for the necessity to construct to interfaces for different courses and public. In this analysis we present the attributes of usability of the hypermedia elements that compose the interfaces of EaD and as resulted we present the Virtual Design of Learning that represents the proposal of interface in its structure base of usability and navigability. Palavras-chave: communication hypermedia, interactivity hypermedia, Distance Education

Introdução

Na Internet, as práticas de Educação a Distância se fazem em plataformas,

denominadas Ambientes Virtuais de Aprendizagem – AVA, cuja interface converge

elementos diversos, como hipertexto virtual, som, vídeo, imagem, animação, cor,

som, gráficos vetoriais, hiperlinks e ícones. Um AVA corresponde, de certo modo,

ao espaço tradicional da sala de aula, no qual o aluno/cursista interage com o

professor/tutor e demais colegas, como também acessa o conteúdo ministrado e

realiza atividades via interface de hipermídia. Por outro lado, qualquer elemento

de hipermídia que se apresente inoperante, ou que possua um significado

desconhecido ou dúbio, compromete a usabilidade do AVA e, por conseqüência, as

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 2

ações de leitura, identificação de conteúdos e postagem de atividades. Podemos

comparar essa interatividade com a leitura tradicional de um livro, cujo projeto

gráfico (capa, paginação, sumário, notas de rodapé, ilustrações, ícones, glossário,

gramatura e cor do papel, corpo e modelo de família tipográfica, espaço

entrelinhas) pode vir a auxiliar ou prejudicar a compreensão do seu conteúdo.

O desenho gráfico da interface para um AVA é dimensionado em função da

arquitetura da informação, do perfil dos suportes de interação e dos sistemas de

avaliação específicos para seu propósito educacional e curricular. Assim, para a

composição do leiaute, o designer transpõe em forma de comunicação visual a

informação educativa que irá fazer parte do desenho da interface de hipermídia de

EaD. Essa informação é convergida em elementos de hipermídia, e o resultado

deve transmitir uma devida usabilidade ao AVA, de modo que o público escolar a

que é destinado obtenha a máxima comunicabilidade com o conteúdo educacional.

Para isso, é importante que os profissionais responsáveis pelo desenho gráfico

da interface do AVA considerem alguns atributos, tais como, uma navegação

intuitiva que permita a localização dos conteúdos de forma rápida e sensorial, que

as imagens fixas ou em movimento tenham relação com o assunto apresentado, e

que os vídeos tragam informações complementares ao que está sendo estudado.

Esses recursos integram estratégias que precisam estar perfeitamente conectadas

com os contextos do projeto de curso e a formação cultural dos participantes, já

que o AVA é um meio possível de propiciar a co-autoria, a participação e a troca de

informações, que são os fundamentos da interatividade.

Entendemos que uma interface de hipermídia para ensino-aprendizagem deve

acionar em seus alunos/cursistas conhecimentos prévios e, para isso, apresentamos

o Design Virtual de Aprendizagem - DVA. Uma proposta de composição gráfica

fundamentada em atributos de usabilidade e na reunião de elementos de

hipermídia, presentes na interface gráfica dos portais de comércio eletrônico e de

notícias, uma vez que eles apresentam desenhos de arquitetura externa e são

utilizados por diferentes nichos de cursistas. Com a nossa proposição na forma do

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 3

DVA, defendemos que será possível aplicar, com uma usabilidade adequada, a

comunicação gráfica e a tecnologia computacional no contexto escolar.

Os atributos de usabilidade da interface de hipermídia

Definimos o termo hipermídia como um sistema ou interface

computacional virtual ou digital, formada por linguagens verbais e não-verbais,

convergidas em hipertextos virtuais, cores, sons, animações, gráficos vetoriais,

imagens, vídeos, hiperlinks e ícones, que se interconectam interativamente e

promovem uma navegação não-linear.

A interface de hipermídia está presente nas mídias móveis, nos jogos, nos

portais de comércio eletrônico e de notícias, como em Ambientes Virtuais de

Aprendizagem. Seu uso na Internet revela inúmeras experimentações, porém, os

atributos de usabilidade estabelecidos até então são direcionados, em sua grande

maioria, para interfaces de comércio eletrônico e de notícias, já que são os tipos

de páginas virtuais mais antigas e populares na web. É através de suas experiências

com esses ambientes, que os cursistas de EaD costumam adquirir seus letramentos

digitais e virtuais, que serão acionados posteriormente, como competências e

habilidades prévias, ao eles estiverem participando de uma atividade de formação

ou capacitação mediada por AVA.

Devemos compreender que uma interface de hipermídia é, acima de tudo,

um meio de comunicação e que, para cumprir seu papel, precisa transmitir para

seu público a mensagem de maneira eficaz, de acordo com o seu objetivo de uso e

comunicação. Visando a essas metas, são empregados os atributos de usabilidade,

que são parâmetros ergonômicos para aplicação de ferramentas, mídias e

tecnologias, que foram testadas e determinadas, visando gerar acessibilidade e

comunicabilidade. A aplicação de atributos de usabilidade reduziu elimina a

possibilidade de erro que um cursista terá ao utilizar uma interface de hipermídia.

Para Krug (2006) criar um novo modelo de atributo de usabilidade em

substituição aos já existentes, como um redesenho de hiperlink, de ícone ou

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 4

seqüência de hipertexto virtual, só é recomendável se ele for suficientemente

auto-explicativo, de forma a não exigir muito esforço dos cursistas para entender,

navegar e intercambiar dados, ou se for uma idéia que acrescente valor a sua

experiência.

Com vistas ao aprofundamento sobre a comunicação gráfica a interface de

hipermídia, apresentaremos a seguir, seus os atributos de usabilidade,

considerando os aspectos da navegabilidade e comunicabilidade.

• Hipertexto virtual: ser aplicado em tipografia não serifada; corpo de sua

fonte entre 10 e 12 pontos; integrar os vídeos como legendas ou

transcrição do áudio; ser empregado no máximo duas famílias

tipográficas; apresentar variação entre caixa alta e baixa; itálico e/ou

negrito somente para destaques e citações; evitar efeitos intermitentes

de brilho e luminosidade, não aplicar hifenizações; os textos devem

somar até vinte linhas e ser subdivididos em parágrafos com até cinco

linhas; os parágrafos devem ser alinhados à esquerda e conter espaço

duplo em si; cada linha de parágrafo deve ser formada pelo mínimo de

quarenta caracteres; quando adicionados a gráficos vetoriais devem

apresentar o mesmo padrão semântico; todos os textos devem

acompanhar hiperlinks para sua ampliação e impressão; indicar o

tamanho e o formato do arquivo para download e acompanhar

marcadores ALT (BURGOS,T.L. 2006; NIELSEN, 1995; NIEMEYER, 2003;

RADFAHRER, 1995).

• Cor: manter a relação semântica com o conteúdo abordado; destacar

itens e áreas temáticas; para marcador em barras de menu para os

hiperlinks acessados e não acessados; para demarcar grupos temáticos;

as cores quentes são apenas para marcadores e as neutras para os planos

de fundo; máximo de duas cores para as famílias tipográficas, uma para o

título e outra para o corpo do texto; não devem reduzir a função de um

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 5

elemento de hipermídia; não devem gerar fadiga vibrações, ilusões de

sombras e imagens sobrepostas - azul próximo ao vermelho, contraste

entre vermelho-verde, azul-amarelo, verde-azul e vermelho-azul –

(FARINA, 2002; KRUG, 2006; PARIZOTTO, 1997).

• Ícone: manter a relação semântica com o conteúdo abordado;

representar signos comuns aos leitores; conter o mesmo padrão de estilo

gráfico e cromático; seu desenho deve ampliar o significado do

hipertexto virtual; possuir aparência simplificada; acompanhar marcador

ALT e rótulos; funcionar como recurso alternativo à barra de menu; ser

legível em ampliações e reduções da interface; apresentar animação

apenas para itens de destaque; não conter som; possuir diferenciação

cromática quando aplicados como botões (DIAS, 2007; KRUG, 2006;

ROBERTSON 1993).

• Hiperlink: seu texto deve ser formado por palavra em negrito, sublinhada

e na cor azul royal, vermelho para rollover e roxo quando já acessada;

hiperlinks em itálico apenas quando este estiver no corpo do texto;

acompanhar rótulo quando em forma de ícone; conter animações só na

ocasião em que necessite destaque; reunir hipertexto virtual, cor e

elementos gráficos; ser aplicado na barra de menu no formato

breadcrumb e abas; acompanhar marcador ALT; ser visível em todas as

páginas (BURGOS,T.L. 2006; KRUG, 2006; NIELSEN, 2003; PINHO, 2000).

• Animação: manter relação semântica com o conteúdo abordado; ser

diferenciada graficamente dos anúncios publicitários; ilustrar downloads

como barra carregamento progressivo; sua reprodução não deve solicitar

a instalação de plugins; não de apresentar reprodução intermitente; deve

acompanhar hiperlink para uma nova reprodução e para interrupção;

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 6

apresentar ausência de som; não ser empregada em logotipo, slogan ou

como título principal (KRUG, 2006; NIELSEN, 2003-2005; SAUCIER, 2000).

• Som: manter relação semântica com o conteúdo abordado; indicar erro,

ações de sistema e solicitações de permissões; sinalizar o acionamento e

finalização de tarefas e downloads; identificar a inicialização e

encerramento de softwares/sistemas operacionais; sinalizar a abertura,

maximização, minimização e fechamento de janelas; deve integrar os

botões liga, desliga,volume, avanço e regresso quando em players (KRUG,

2006; NIELSEN, 2003-2005; ROBERTSON, 2003).

• Vídeo: manter relação semântica com o conteúdo abordado; acompanhar

recursos interativos para o uso de webcam; descrever o formato e o

tamanho do arquivo para download; apresentar controles de avanço e

regresso; ser legendado; ser disponibilizado em diferentes extensões; seu

roteiro deve ser adaptado para a web; os conteúdos dever ter até cinco

minutos de duração; cada arquivo deve ter entre 20 a 30mb de tamanho

para que as imagens não se pixelizem; carregamento do arquivo em

buffer (AVILA, 2004; LINDSTROM, 1995; LYNCH E HORTON 2002; NIELSEN,

2003-2005).

• Imagens (fotografias): manter relação semântica com o conteúdo

abordado; acompanhar legendas; apresentar formato GIF, JPEG, PNG ou

TIFF; não ser aplicada como plano de fundo; garantir legibilidade entre as

imagens em primeiro plano e a cor do leiaute; acompanhar marcadores

ALT; não comprometer o carregamento da página; não ser aplicada como

ícone; ampliar o significado do texto; manter alinhamento à esquerda;

não acompanhar som; possuir resolução entre 72dpi a 100dpi; compor

uma narrativa quando em slideshow (CARRION, 2008; MCCLURG-

GENEVESE, 2005; NIELSEN, 2005).

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 7

• Gráficos vetoriais: manter relação semântica com o conteúdo abordado;

ser empregado para destacar de áreas temáticas e de plano de fundo; ser

adicionado como marcadores de seções e nos hiperlinks; para o desenho

de ícones; em elementos de plano de fundo deve ser acompanhado por

marcador ALT (CARRION, 2008; DONDIS, 1997; MULLET E SANO 1995).

• Leiaute: manter relação semântica com o conteúdo abordado; empregar

os padrões de organização e composição dos elementos visuais hierarquia

da informação, foco e ênfase, estrutura e equilíbrio, relação de

elementos e unidade de integração; evitar conter rolagem horizontal;

apresentar no máximo duas dobras (rolagens); integrar aplicativos de

interação - fórum, sala de bate-papo, etc. (CARRION, 2008; DONDIS,

1997; MULLET E SANO 1995).

O Design Virtual de Aprendizagem: composição e encaminhamentos

O Design Virtual de Aprendizagem – DVA é um modelo de desenho de

hipermídia que se propõe a estabelecer uma arquitetura mínima de usabilidade,

navegabilidade, e comunicabilidade para o desenvolvimento de leiautes virtuais de

Ambientes Virtuais de Aprendizagem.

O objetivo do Design Virtual de Aprendizagem é promover a construção de

leiautes virtuais que possibilitem um AVA no qual cursistas, tutores e conteúdo

estabeleçam uma interação e interatividade ergonômicas. Enquanto os tipos de

design Instrucional, Educacional, Baseado em Sistemas e Pedagógico se expressam

de forma superficial quando o assunto é o planejamento gráfico dos AVA, o Design

Virtual de Aprendizagem se volta inteiramente para essa questão, já que a

interatividade entre cursistas, tutores e conteúdo está intimamente relacionada à

usabilidade da interface, como também para a aplicação, nomeação e disposição

de um item gráfico ou de conteúdo.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 8

As interfaces de materiais educacionais digitais devem estar contextualizadas na cultura do cursista, tanto em relação aos aspectos gráficos e ergonômicos quanto a respeito da lógica aplicada à organização do conteúdo e estrutura interativa. O aluno deve ter a oportunidade de percorrer livremente o material educacional digital de uma maneira não linear, conforme a lógica que estiver construindo em cada momento. O equilíbrio entre os fatores técnicos, gráficos e pedagógicos apoiará a interatividade entre aluno e material educacional digital, assim como também a interação entre aluno-aluno-professor. Deve-se ultrapassar os limites de um design ilustrativo, possibilitando que o aluno encontre a liberdade pra vencer a pressão do pensamento meramente racional e buscar o equilíbrio entre sentir, agir e construir(BEHAR,2009. p. 35).

O DVA reúne em sua interface de hipermídia os seguintes elementos:

• Elementos de Composição de Hipermídia: aplicação dos sete

componentes próprios da hipermídia (cor, som, animação, imagem,

vídeo, gráficos vetoriais, hipertexto virtual);

• Elementos de Navegação: aplicação de hiperlinks e ícones;

• Áreas de Focagem Visual: distribuição dos elementos de composição de

hipermídia e de navegação entre os cinco pontos de focagem visual da

interface virtual (BURGOS,T.L; 2006).

Figura 1: Áreas de focagem visual.

Fonte: biblioteca.universia.net/html_bura/ficha/params/id/19125423.html

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 9

No que se refere à organização e à composição dos elementos visuais de uma

interface gráfica de hipermídia, nossa proposta de Design Virtual de Aprendizagem

leva em conta os cinco padrões de organização e de composição dos elementos

visuais, conforme apresentados por Mullet e Sano (1995). Os padrões são os

seguintes:

a) Hierarquia da informação: compreende, primeiramente, a demarcação

das cinco áreas de focagem visual, para em seguida, haver a aplicação dos

“Elementos de Navegação” e de “Composição de Hipermídia”, a partir da

convergência da arquitetura típica dos portais de notícia e de comércio eletrônico.

Esta proposição, busca transpor para o ambiente de aprendizagem virtual

letramentos já adquiridos pelos cursistas e tutores que utilizarem o ambiente.

Reunir elementos de interação, de interatividade e de hipermídia, já

previamente conhecidos, lhes permite interagir com um leiaute familiar, uma vez

que o desenho

Tem um papel importante em um projeto, pois ele influencia a maneira como o cursista sente e entende a informação que se deseja comunicar. A informação visual comunica de modo não verbal e pode incluir sinais emocionais que motivem, dirijam, ou distraiam o cursista, de modo que a forma como a informação é organizada em uma página possa fazer a diferença entre comunicar uma mensagem, ou não, ou, ainda, deixar perplexo o cursista com a mensagem informada (Cybis, 1997, p. 53).

b) Foco e ênfase: no Design Virtual de Aprendizagem esse item é

representado pelos itens “Áreas de Focagem Visual” e “Elementos de Composição

de Hipermídia”, nos quais as cinco áreas de focagem visual correspondem à junção

do sentido ocidental de leitura e o ponto de ênfase central típico dos monitores de

TV. Após a distribuição do conteúdo, em meio a estes cinco pontos de focagem,

pode-se estabelecer outras áreas de ênfase a partir da geração de um destaque

comunicativo, concedido pela ampliação ou adição do uso de “Elementos de

Composição de Hipermídia”, como as cores, os sons, as animações, os gráficos

vetoriais, as imagens em hiperlinks, os hipertextos, os ícones, as ferramenta(s) de

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 10

interatividade (áreas de entrada e saída do sistema, áreas para fixação do

conteúdo programático e postagem de atividades, caixa de busca, mapa do sítio,

players de áudio e vídeo), ferramenta(s) de interação (áreas de fóruns de

discussão, e-mail, podcast, tags, videoconferência e áudio-conferência).

c) Estrutura e equilíbrio: estão presentes no DVA através do item

“Elementos de Composição de Hipermídia”, já que neste item a distribuição do

conteúdo é pensada a partir do seu desenho gráfico. A aplicação de cada elemento

de composição de hipermídia está aliada aos princípios do design e da percepção

visual, tais como: a) Proximidade e alinhamento; b) Equilíbrio, proporção e

simetria; c) Contrastes, cores e brancos: d) Ordem, consistência e repetição; e)

Simplificação; f) Legibilidade e g) Integração. (DONDIS, 1997; RADFAHRER, 1998).

d) Relação de elementos: a utilização dos “Elementos de Composição de

Hipermídia”, isolados ou convergidos referem-se a este item, já que o conceito do

DVA em detrimento do perfil dos cursistas ou tutores pode enfatizar a utilização de

combinações entre elementos ou a sua adição em meio às ferramentas de interação

e interatividade.

e) Unidade de integração: os “Elementos de Navegação” representam esse

item, no tocante a concatenação de hiperlinks e de ícones presentes no leiaute do

DVA Para isso, propomos a utilização de metáforas comuns às práticas sociais dos

cursistas e tutores. Os hiperlinks foram dispostos em forma de aba, com marcação

cromática e animação em rollover, foram adicionados rótulos em ALT,

breadcrumbs, caixa de busca, e mapa do sítio.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 11

A aplicação dos elementos de hipermídia, de navegação e de

focagem visual do leiaute do Design Virtual de Aprendizagem

A interface de hipermídia do Design Virtual de Aprendizagem reúne em sua

composição a convergência dos elementos da arquitetura do portal de notícias e do

comércio eletrônico. Tal desenho se justifica pela familiaridade que os cursistas

possuem com esses desenhos de interfaces, graças à popularidade dos seus desenho

e pelo freqüente acesso que os internautas mantem com esses tipos de interfaces.

De acordo com o Instituto Ibope/NetRating, conteúdos relacionados a

comércio eletrônico, notícias e informações são responsáveis por 36% dos acesos

em portais e sítios. Assim, o cursista ao acessar uma interface de hipermídia

composta a partir do Design Virtual de Aprendizagem acionaria letramentos

prévios, por seus elementos já serem familiares e presentes em outras práticas

sociais de natureza semelhante. Com base nesse pressuposto, o desenho gráfico da

interface proposta para o Design Virtual de Aprendizagem reúne os seguintes

atributos:

• Elementos de Composição de Hipermídia: aplicação dos sete

componentes próprios da hipermídia - cor, som, animação, imagem,

vídeo, gráficos vetoriais, hipertexto virtual; hipertextos virtuais em

parágrafos com até cinco linhas e rotulados por hiperlinks compostos por

até cinco palavras; os resumos dos títulos de conteúdos - “hiperlinks

grandes títulos” – devem ser compostos por um parágrafo com quarenta a

setenta caracteres; os conteúdos textuais devem compor parágrafos com

até vinte linhas e máximo de setenta caracteres por linha; os grupos de

imagens devem formar uma seqüência semântica quando inseridos em

slideshow; os parágrafos com conteúdos de ensino-aprendizagem devem

apresentar arquitetura hipertextual de webnotícia – texto em resumo >

expansão do resumo em texto com até vinte linhas, subdividido em

parágrafos com espaçamento duplo > texto na íntegra.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 12

• Elementos de Navegação: aplicação de hiperlinks e ícones: barra de

menu em abas com diferenciação cromática e ampliação em rollover;

campos de busca visíveis em todas as páginas; versão dos textos em

*pdf; descrição do tamanho e formato dos arquivos; hiperlinks para

ampliação de todos os conteúdos da página, imagens e vídeos; destacar

em negrito as palavras-chave no corpo dos textos; usos de “hiperlinks

grandes títulos” (texto de três a cinco palavras que descreve o título do

hiperlink), “hiperlink legenda” (descrição de três a cinco palavras que

acompanha as imagens), “hiperlink índice” (palavras dispostas como

índice para descrever sessões), “hiperlink ícone” (ícones ou fragmentos

de imagens com temáticas referentes aos títulos e sub-títulos aos quais

se destinam), “hiperlink subtítulo” (texto de três a cinco palavras que

descrevem o “link título”); os hiperlinks, as ícones e as imagens devem

acompanhar marcadores ALT; aplicação de breadcrumbs; adição de

legendas ou sinopses para as imagens, áudios e vídeos em players;

distinção cromática dos itens já visitados, a partir do padrão cores azul,

vermelho e roxo; os rótulos dos hiperlinks e dos campos temáticos são

grafadas com iniciais maiúsculas.

• Áreas de Focagem Visual: distribuição dos elementos de hipermídia e de

navegação, entre os cinco pontos de focagem visual da interface virtual

de aprendizagem; adição mapa de arborescência da página; espaço duplo

entre parágrafos; aplicação de página explicativa, em tópicos, sobre o

conteúdo do módulo e das suas ferramentas de interação e de

interatividade; emprego de fontes não serifadas; navegação entre

páginas transcorrida em apenas uma janela; aplicação de cores quentes

somente para marcadores; a página ou sua moldura deve apresentar a

mesma cor da aba de menu correspondente; manter em todas as páginas

o mesmo desenho gráfico para o leiaute; os títulos dos hipertextos e dos

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 13

hiperlinks devem ser alinhados à esquerda; os gráficos vetoriais devem

demarcar áreas temáticas, de login, de players e de imagens prioritárias;

ampliação e distinção gráfica e cromática do corpo da fonte dos

hipertextos que devam ser lidos com prioridade; aplicar sistemas de

exibição randômicos ou seqüenciados para imagens em slide show.

Leiaute da interface de hipermídia com o Design Virtual de Aprendizagem

A seguir, ilustramos o leiaute do Design Virtual de Aprendizagem para uma

interface inicial de AVA e para três modelos de módulos de aprendizagem. Nos

desenhos destacamos a aplicação dos elementos de composição de hipermídia, de

navegação e de focagem visual.

Figura 2: Interface de entrada de AVA segundo o DVA.

Figura 3: Descrição da interface de módulo após o login – DVA modelo 1.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 14

Figura 3: Descrição da interface de módulo após o login – DVA modelo 1.

Figura 4: Navegação entre os conteúdos - DVA modelo 1.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 15

Figura 5: Navegação entre os conteúdos – DVA modelo 2.

Figura 6: Navegação entre os conteúdos – DVA modelo 3.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 16

Considerações Finais

O DVA não busca estabelecer definições estanques ou modelos fechados de

desenho de interface de hipermídia, mas sim ampliar diálogos sobre o tema e

apontar para a importância da aplicação de atributos de usabilidade e de

navegabilidade, com vistas à comunicabilidade em interfaces de EaD. De fato, um

Ambiente Virtual de Aprendizagem cujo desenho aplica atributos de usabilidade

colabora para as ações de interatividade e interação. A esse respeito, sabe-se que,

apesar de não impedir completamente o uso de um AVA ou de seus módulos de

aprendizagem, um baixo grau de interatividade pode, em certa medida, dificultar,

desestimular, gerar abandono, insegurança e desorientação nas atividades de

ensino-aprendizagem. Assim, eliminar os problemas de usabilidade e de

interatividade proporciona aos desenvolvedores do desenho gráfico, arquitetos da

informação e produtores de material didático, o acesso a um emprego ergonômico

dos elementos de hipermídia em interfaces virtuais, e é isso que nossa proposta de

DVA pretende lhes oferecer.

A aplicação dos elementos de composição de hipermídia, de navegação e as

áreas de focagem visual propostos no DVA possibilitam a criação de interfaces com

navegação intuitiva e de fácil utilização. Com isso, espera-se que o leiaute leve

interatividade a cursistas e tutores, como amplie a produtividade e a satisfação na

execução das tarefas. Dessa forma, pode-se evitar a evasão dos participantes,

minimizar a idéia de ineficiência da educação a distância via Internet, como

também disponibilizar interfaces que promovam a facilidade de aprendizado, a

eficiência de uso, a facilidade de memorização, a baixa taxa de erros e a satisfação

subjetiva.

Dessa forma, é importante, no projeto de arquitetura de uma interface de

hipermídia, dar atenção ao desenho do seu leiaute, como também à aplicação de

atributos de usabilidade e de navegabilidade aos seus elementos de hipermídia. As

limitações de interatividade, impossibilidades de localização de áreas de postagem

de conteúdos e de atividades, a necessidade de reaprender a cada novo acesso ao

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 17

AVA e aos seus módulos são problemas graves no contexto da educação a distância

via Internet. Para solucioná-los, propomos o Design Virtual de Aprendizagem, na

forma de um desenho para interface de hipermídia que reúne os elementos de

navegabilidade e de comunicabilidade próprios de portais de comércio eletrônico e

de notícias. Essa reunião de arquitetura se justifica pela popularidade desses tipos

de interfaces em meio aos diferentes perfis de cursistas, mas, principalmente, por

sua arquitetura objetiva, composta por hiperlinks e conteúdos externos.

O Design Virtual de Aprendizagem se mostra, pois, como um modelo de

desenho que reúne os atributos de usabilidade que levam à interface de hipermídia

uma navegação intuitiva, composta por elementos de comunicabilidade comuns aos

vivenciados por cursistas e tutores cotidianamente na Internet

Referências Bibliográficas ÁVILA, R. N. P. Streaming: crie sua própria "Rádio" web e TV digital, São Paulo: Editora Brasport, 2004. BURGOS, T.L. O hipertexto eletrônico de meio ambiente na sala de aula: práticas de navegação e estratégias de leitura: 2006. 297f. Dissertação (Mestrado em Estudos da Linguagem) Curso de Pós-Graduação em Estudos da Linguagem, Universidade Federal do Rio Grande do Norte, Natal/RN, 2006. BURGOS,T.L. Comunicação Gráfica em Interfaces de Hipermídia de Educação a Distância via WEB: 2010. 229f.Tese (Doutorado em Estudos da Linguagem) Curso de Pós-Graduação em Estudos da Linguagem, Universidade Federal do Rio Grande do Norte, Natal/RN, 2010. CARRION, W. Design para web designers: princípios do design para web. Rio de Janeiro: Alta Books, 2006. DIAS, C. Usabilidade na web: criando portais mais acessíveis. Rio de Janeiro: Altabooks, 2007. DONDIS, Donis A. Sintaxe da linguagem visual. São Paulo: Martins Fontes, 1997. FARINA, M. Psicodinâmica das cores em comunicação. São Paulo: Ed. Blucher, 2002.

Universidade Federal de Pernambuco - Núcleo de Estudos de Hipertexto e Tecnologias na Educação 18

KRUG, S. Não me faça pensar: uma abordagem de bom senso à usabilidade na web. Rio de Janeiro:Brasport, 2008. LINDSTROM, R. L. Guia Business Week para Apresentações em Multimídia. São Paulo: Makron Books, 1995. LINDSTROM, R. L. Guia Business Week para Apresentações em Multimídia. São Paulo: Makron Books, 1995. MCCLURG-GENEVESE, J. The principles of design. [S.I.] 2005. Disponível em L: http:// www.digitalweb.com/articles/principles_of_design/. Acesado em: 17 de julho de 2009. MULLET, K; SANO, D. Designing visual de interfaces: communication oriented techniques, New Jersey, SunSoft Press, 1995. NIELSEN, J. Usability Engineering. Academic Press, Cambridge, MA,2003. ______; LORANGER H. Usabilidade na web: projetando websites com qualidade. Rio de Janeiro: Elsevier, 2005. NIEMEYER, L. Elementos de semiótica aplicados ao design. Rio de Janeiro:2AB, 2003. PARIZOTTO, R. Proposta de um guia de estilo para serviços de informação em ciência e tecnologia via web. [S.I]: 1997. Disponível em:<uttp://www.labiutil.com.br/estilo/guiaweb.ps>. Acesso em: 12 de agosto de 2009. PINHO, J.B. Publicidade e vendas na internet: técnicas e estratégias. São Paulo: Summus, 2000. RADFAHRER, L. Design / web / design. São Paulo: Market Press, 1995. ROBERTSON, G. G.Information visualization using 3D interactive animation. Communications of the ACM, 1993. SAUCIER, C. Animação e interatividade na web. São Paulo: Market Books, 2000. i Taciana de lima BURGOS, Dra. Universidade Federal do Rio Grande do Norte (UFRN) Departamento de Comunicação Social tacianaburgos@hotmail.com