Design promovendo a usabilidade no jornalismo on-line

Universidade
Estadual de Londrina

MERYENN MYCHIELLE DA SILVA FRANCISCO

DESIGN PROMOVENDO A USABILIDADE
EM JORNAIS ON-LINE

LONDRINA
2009

MERYENN MYCHIELLE DA SILVA FRANCISCO

DESIGN PROMOVENDO A USABILIDADE
EM JORNAIS ON-LINE

Trabalho de conclusão de curso apresentado ao
curso de Design Gráfico da Universidade Estadual de
Londrina.

Orientador: Profª Vanessa Tavares

LONDRINA
2009

FRANCISCO, Meryenn Mychielle da Silva. Design promovendo a usabilidade em jornais
on-line. 2009. Dissertação (Graduação em Design Gráfico) – Universidade Estadual de
Londrina.

RESUMO

O jornalismo no Brasil a partir da segunda metade da década de 1990 caminhou
naturalmente para sua instalação também no meio digital, desde então passou por
adaptações ao meio. Este projeto tem foco no usuário que usará a interface visual do jornal
on-line e na própria interface visual, pensando na qualidade de uso da mesma e se este
ambiente está preparado para além de apenas fornecer informações (notícias), guiar os
usuários por elas.

Palavras-chave: Design gráfico, jornalismo on-line, usabilidade,

FRANCISCO, Meryenn Mychielle da Silva. Design promoting usability in online
newspapers. 2009. Dissertation (Graduation in Graphic Design) - Universidade Estadual de
Londrina.

ABSTRACT

The jornalism on Brazil after the second half of the 90s went naturally to its instalation
on digital media, and after that it has been adaptated to this media. This project is focused on
the user of visual interface of on-line newspaper and on visual interfaces themselves,
thinking about quality of its use and about if this media is prepared to go further than just
giving information (news), but also guiding users throught it.

Key-words: graphic design, on-line newspapers, usability

SUMÁRIO

1.INTRODUÇÃO .............................................................................................................. 1
1.1 APRESENTAÇÃO DO TEMA ....................................................................................... 1

1.2 PROBLEMA ............................................................................................................. 2
1.3 OBJETIVOS ............................................................................................................. 3
1.3.1 Objetivo geral ...................................................................................................... 3
1.3.2 Objetivo Especifico ............................................................................................. 3
1.4 Justificativa .......................................................................................................... 3
1.5 Metodologia ......................................................................................................... 4
1.5.1 Apresentação da Metodologia 5
1.5.2 Descrição da Metodologia 5
1.6 DESCRIÇÃO DOS CAPÍTULOS 6
2. FUNDAMENTAÇÃO TEÓRICA ................................................................................... 8
2.1 CONTEXTUALIZAÇÃO DO TEMA ................................................................................. 8
2.1.1 História do Jornalismo....................................................................................... 8
2.1.2 História da Internet ............................................................................................. 9
2.1.3 O Jornalismo On-line ......................................................................................... 9
2.1.3.1 Terminologias usadas no jornalismo na internet ......................................... 11
3. EXPLORANDO AMBIENTES VISUAIS DIGITAIS .................................................... 14
3.1 INTERFACE .......................................................................................................... 14
3.2 IHC – Interação Humano Computador .......................................................... 15
3.3 DESIGN ............................................................................................................... 16
3.3.1 Design Gráfico .................................................................................................. 17
3.3.1.1 Comunicação visual ......................................................................................... 18
3.3.1.1.1 Composição visual e percepção ................................................................ 19
3.3.1.1.2 Considerações sobre a imagem em dias atuais ....................................... 20
3.3.2 Hipertexto, Multimídia e Hipermídia................................................................ 22
3.3.3 Design Centrado no Usuário ........................................................................... 23
3.3.4 Princípios Práticos em Design ........................................................................ 26
3.3.4.1 Entendendo o espaço tipográfico ................................................................... 27

4. EM BUSCA DE UMA MELHOR FACILIDADE DE USO -

A USABILIDADE ............................................................................................... 29
4.1 Ergonomia ....................................................................................................... 31
4.1.1 Critérios de Ergonomia e Usabilidade para Interface Digital ....................... 33
5. APRESENTAÇÃO DE ESTRUTURAS DO JORNALISMO ONLINE ATUAL
E SUA RELAÇÃO COM A USABILIDADE ...................................................... 37
6. AVALIAÇÃO DE INTERFACE 39
6.1 PORQUE AVALIAR UM SISTEMA 39
6.2 TIPOS DE AVALIAÇÃO 39
6.2.1 Inspeção de guias de recomendações 40
6.2.2 Percurso Cognitivo 40
6.2.3 Avaliação Heurística 41
6.2.3.1 Graus de severidade dentro das avaliações heurísticas 41
6.2.4 Teste Com Usuários 41
6.2.5 Entrevistas e Questionários 42
6.2.6 Pensando em Voz Alta 42
7. AVALIAÇÃO DE INTERFACE DE JORNAL ONLINE 44
7.1 METODOLOGIA UTILIZADA NA AVALIAÇÃO DA INTERFACE DE JORNAIS ON-LINE 44
7.1.1 Aplicação do Teste de Uso- Plano de Teste 44
8. RESULTADOS DA AVALIAÇÃO DE USABILIDADE 49
8.1 T ESTE PENSANDO EM VOZ ALTA : A NALISE DO TESTE , DISCUSSÃO E

RESULTADOS . 49
8.1.1 A NÁLISE S OBRE AS T AREFAS DO USUÁRIO 1: 56
8.1.2 A NÁLISE S OBRE AS T AREFAS DO USUÁRIO 2: 66
8.2 Q UESTIONÁRIO PAR A TESTE DE USO : APURAÇÃO DE RESPOSTAS DO USUÁRI O

1 E DO USUÁRIO 2 67
8.3 GERAÇÃO DE RESULTADOS FINAIS SOBRE A APURAÇÃO DA AVALIAÇÃO DE

USABILIDADE 70
8.3.1 V ISITA A F OLHA DE L ONDRINA 78
8.3.1.1 Entrevista com editor de conteúdo da Folha de Londrina Marco
Feltrin 79
8.3.1 E LABORAÇÃO D AS S OLUÇÕES G RÁFICAS PARA O S ITE F OLHA DE L ONDRINA
79

INTRODUÇÃO

1.1 Apresentação do tema

Seguindo a tendência de várias áreas da comunicação em utilizar a internet
como um meio de comunicação com grandes chances de sucesso, o jornalismo
começou a lançar suas matérias via internet. O primeiro jornal brasileiro a ter
notícias atualizadas de hora em hora foi a “Folha On-line”, criado especialmente com
versões mais sucintas das notícias para um usuário ávido em se manter sempre
informado, e ainda assim foi criada também a versão on-line do jornal impresso, em
que o leitor pode acessar as notícias integrais como estão no jornal impresso.
Observa-se aqui já a princípio indicações de tipos diferentes de usuários, uma
vez que se trata de um mesmo “produto” (informação) transmitido por dois meios
diferentes (impresso e virtual). O jornalismo no espaço virtual segue ainda muitas
estruturas do jornal impresso, naturalmente por ter sido criado depois, faz assim uso
de diversos elementos de seu antecessor, o que algumas vezes deveria ser
repensado. O fluxo de informação em um jornal impresso e em um virtual pode ser o
mesmo, porém o virtual oferece vantagem de poder ser atualizado rapidamente e
várias vezes por dia.
Outras diferenças remetem “a construção gráfica” de ambos, vale lembrar que
a mídia virtual é composta de um suporte de emissão de luz (monitor, celular, etc.),
logo o tempo que um usuário virtual se concentra na leitura de uma matéria on-line é
compreensivelmente menor do que um leitor de jornal convencional.
Além disso, existe a idéia de “navegação” feita por um jornal convencional e
um jornal on-line, em que no virtual geralmente se tem um menu sempre presente
para que o usuário possa pular de seção a seção quando achar mais conveniente,
enquanto o leitor de jornal convencional se guia em seções já estabelecidas
apresentadas na primeira página do jornal, o que facilitava para os leitores com um
tempo de uso mais avançado do jornal impresso. A primeira página de um jornal
impresso tem por função apresentar os principais assuntos e fragmentos do que
será tratado no decorrer da publicação, e junto ao fragmento a página em que se
apresentaria o texto completo, levando a uma leitura não linear do conteúdo total do
que é apresentado. Isso é reutilizado nas raízes da internet, transferindo para

hiperlinks que tem por função ligar páginas relacionadas, e ainda se desenvolvendo
para o conceito de hipermídia, quando é usado juntamente com essa rede de
fragmentos de leitura não linear (hipertexto) imagens, áudio e vídeos, recursos
amplamente utilizados pelos jornais on-line.
Os jornais no espaço virtual têm o avanço na área tecnológica como um
aliado, é oferecido á eles muitas possibilidades a serem exploradas, diminuindo o
tempo de espera de um usuário por uma informação, ou ainda oferecendo uma
experiência diferente como por meio de vídeo ou áudio, por exemplo. Tem-se ainda
a apropriação de outras tecnologias inovadoras, como o Rich Site Summary (RSS),
que pode manter o usuário vinte e quatro horas informado se sequer acessar o site
do jornal.

1.2 PROBLEMA

A rede mundial de computadores (Web) por si só se apresenta como um
meio de grande fluxo de informações,quando unimos esse fato ao jornalismo, que
tem por função lançar informações do cotidiano de uma comunidade, constitui um
cenário abarrotado de dados de vários gêneros o que por algumas vezes chega ser
obstrutivo ao usuário que procura por uma informação simples e de maneira direta.
Para chegar a meta de ser claro ao usuário algo é essencial, a administração
dessas informações de modo que os usuários a tomem de maneira natural, que ele
seja guiado para a informação desejada sem falhas ou demora, que a facilidade de
uso seja a melhor possível.
O internauta (usuário de internet ou da Web) hoje é abordado diante vários
sentidos, vídeos, imagens, áudio, texto, a simples operação de um menu virtual já
configura sua interação com um universo múltiplo de sentidos. A interface visual a
qual ele se relaciona é anterior mesmo ao texto que será lido nela, logo, de extrema
influência sobre os atos do usuário. Uma interface visual bem projetada é uma dos
fatores de uma boa navegabilidade e da facilidade de uso da mesma.
O problema se revela em como melhorar a visualização, navegação e
facilidade de uso pelo design gráfico das páginas de jornais on-line de acordo com
os vários tipos de usuário que o percorre.

1.3 OBJETIVOS

1.3.1 Objetivo Geral

Observar possíveis soluções em design gráfico, como correção de
composição visual, uso de cores, estrutura da hierarquia de informação, tudo para
uma facilidade de uso (usabilidade) mais agradável a um usuário de jornal on-line.

1.3.2 Objetivos Específicos

• Fazer um levantamento teórico para ter base para uma analise da composição
gráfica de jornais on-line;
• Conhecer critérios de produção de um jornal on-line;
• Fazer teses de uso em um jornal on-line;
• Apontar possíveis sugestões para melhoria no uso do jornal testado.

1.4 JUSTIFICATIVA

O design gráfico é ferramenta importante na melhoria da experiência
interativa entre a interface e o usuário de um site com grande fluxo de informação,
tem-se aqui então o foco da usabilidade (facilidade de uso) no campo de
programação visual e o fenômeno de uma grande quantidade de informações
veiculadas no meio.
Este trabalho propõe analisar o jornalismo veiculado no meio digital (internet)
sob o ponto de vista de um levantamento bibliográfico sobre design gráfico,
ergonomia e facilidade de uso (usabilidade), com a intenção de usar o design gráfico

para propor soluções para questões como má composição visual por exemplo, o que
pode tornar mais fácil o uso da interface gráfica a partir dessa correção.
Deve-se então esclarecer como funciona o meio (apresentação do meio a ser
manipulado) e as ferramentas usadas para solucionar os problemas, e como usar o
design gráfico para promover a usabilidade na web.
O desafio esta em como conciliar tantas possibilidades num formato que tem
por necessidade ser claro, objetivo e confiável como um jornal? O design gráfico
pode oferecer algumas soluções para melhoria na facilidade de uso desses sites
uma vez que se trata de uma mídia visual e interativa. Para tais intenções é
importante que seja feito uma análise da composição gráfica atual de jornais on-line,
desconstruindo o objeto de estudo e examinando qual seria a melhor forma de
representá-lo no caso. Conhecer os critérios de produção também se faz importante
para poder entender quais são os caminhos que estão sendo trilhados e o foco que
esta sendo dado à construção dessas paginas on-line, uma vez que o tipo de
usuário pode variar bastante.
Fazer testes é essencial para estimar pontos positivos e negativos do que já
existe, direcionando melhor o que deve ser reavaliado na construção dos sites, o
que nem sempre é visível com uma avaliação da composição gráfica. Tais testes
serão discutidos em um capitulo exclusivo no decorrer deste trabalho.
Ao fim dessas etapas será possível fazer indicações de melhoria na interface
gráfica e na usabilidade por meio do design.
O bom uso da programação visual em sites de grande quantidade de
informação é imprescindível para que a usabilidade seja satisfeita, assim quando
alguns pontos falhos são corrigidos o uso se faz de maneira mais natural, sem
problemas de navegação causados por excesso de informações simultâneas,
múltiplas funções executadas pelo usuário.

1.5 METODOLOGIA

1.5.1 Apresentação da Metodologia

• Examinar o objeto de estudo, jornais on-line, por meio de uma pesquisa
bibliográfica.
• Conversar com profissionais da área para saber qual o método de construção
dessas páginas, para tanto se colocou a disposição Marco Feutrin, editor de
conteúdo do grupo Bonde de Web da Folha de Londrina.
• Identificar problemas de uso, o que será indicado por um teste de uso com
leitores de jornal on-line.
• Para problemas identificados como problemas passíveis de solução pelo design
gráfico serão indicadas respostas, o que por muitas vezes são questões de
agrupamento de informações visuais distintas, ou emprego de signos visuais,
cores, formas de maneira equivocada, excesso de dados, ambigüidades e uma
série de usos incorretos de elementos visuais.

1.5.2 Descrição da Metodologia

Na pesquisa bibliográfica são levantados diversos aspectos que cercam os
jornais on-line no tocante a design gráfico e a usabilidade, sendo assim, será
proposta diversas pesquisas que darão base às estruturas dos mesmos, como
teorias de composição visual em geral, hipermídia, interação humano computador,
ergonomia e usabilidade.
Depois do levantamento bibliográfico cabe ser feita uma entrevista com
profissionais da área, isso ajudará a esclarecer pontos como metodologias de
criação, composição básica do sistema, além de dar uma visão mais realista do
objeto.

A partir dessas duas etapas (referencial bibliográfico e entrevista) é possível
montar um esquema do sistema e como ele é apresentado, revelando suas
hierarquias, funções, e então pode ser feita uma avaliação de uso de maneira mais
simplificada.

1.6 DESCRIÇÃO DOS CAPÍTULOS

Capítulo 1 – Introdução
No capítulo 1 é introduzida toda a base estrutural do trabalho, apresentando o
tema e os problemas verificados nele, e a partir disso delimitados os objetivos e uma
metodologia para desenvolvimento do trabalho.

Capítulo 2 – Fundamentação teórica: Jornalismo e internet
No capítulo 2 são explanados pontos da história e conceito do jornalismo e da
internet, e como os dois foram se mesclando, atentando para importância de
conhecer o contexto do objeto de estudo deste trabalho para seu melhor
entendimento, tecendo uma breve fundamentação teórica.

Capítulo 3 – Explorando ambientes visuais digitais
No capítulo 3 a fundamentação teórica continua a ser desenvolvida,
explorando conceitos de ambientes virtuais e seus desdobramentos. Interfaces,
comunicação visual, interação, hipermídia são temas investigados no desenvolver
deste capítulo.

Capítulo 4 – Em busca de uma melhor facilidade de uso – a usabilidade
No capítulo 4 é tratada a questão da usabilidade e aspectos próximos, como
ergonomia e seu estudo em interfaces digitais.

Capítulo 5 - Apresentação de estruturas do jornalismo on-line atual e sua relação
com a usabilidade
No capítulo 5 é relatado como o jornalismo on-line tem conseguido se
configurar no meio digital, e a busca da facilidade de uso maior dentro das
possibilidades do objeto.

Capítulo 6 – Avaliação de interface
No capítulo 6 é feito um levantamento dos conceitos de avaliação de
interface, e apresentado vários tipos de avaliações possíveis.

Capítulo 7 – Avaliação de uma interface de jornal on-line
No capítulo 7 são exploradas os modos de aplicação de uma boa avaliação
de interface para o caso de um jornal on-line, e também apresentado o plano de
teste para um teste de uso.

2. FUNDAMENTAÇÃO TEÓRICA: JORNALISMO E INTERNET

2.1 C ONTEXTUALIZAÇÃO DO T EM A

2.1.1 E LEMENTOS H ISTÓRICOS DO J ORNALISMO

Toda sociedade em sua cultura possui uma forma de explicar e transmitir às
novas gerações seu nascimento e fatos importantes a sua vivência, agregando a
própria sociedade como construtores e produtos de sua história, sendo assim, as
informações que a sociedade acumula, conserva e transmite se trata da sua própria
cultura.
Livros, rádio, jornais, televisão, internet informa, comunica, reconta histórias,
fornecem novos significados a algumas outras histórias, tornam viva e perpetuam a
cultura de um povo. Do ato de organizar, transmitir e disseminar uma informação
nasce o jornalismo. “Na sua essência, o jornalismo é uma representação discursiva
de fatos e idéias da vida do homem, construída para se contar ou mostrar a outrem”.
(SOUSA, p. 5)
Tem-se então a representação de passagens deixadas por pinturas rupestres,
ou a formação das primeiras cidades, depois países e impérios, o comércio primitivo,
o princípio da escrita, religiões, desenvolvimento de grandes sociedades, inventos
tecnológicos, tudo de alguma forma foi transmitido geração após geração.
Pode-se ter como ponto de partida para melhor conhecimento dos princípios
do jornalismo como se conhece hoje a Europa do século XVII, cenário de
efervescência político-economica-social, monarquia absolutista de direito divino
francesa, Inglaterra parlamentarista recém saída da guerra civil, lutas de libertação e
independência, o processo colonial avançava, o comércio intensificava-se, a
alfabetização aumentava, mesmo porque para entrar em algumas corporações de
ofício era algo necessário. A sociedade da época estava sujeita a transformações,
instabilidade e mudanças, necessitava e era receptiva a reprodução de informação.

Houve mudanças nos meios de transmissão, da história contada oralmente de
pai para filho para o documento impresso, passando pela técnica a principio chinesa,
de modo que somente pelo aprimoramento de técnicas chinesas foi possível a
invenção da imprensa. Em 105 D.C. os chineses tinham como opção as pastas de
bambu ou o papel de seda uma alternativa de papel feita de farrapos produzido com
fibras vegetais e trapos, mais tarde tais segredos de fabricação foram levados a
árabes por prisioneiro chineses, além de inovações chinesas em tintas, impressão
xilográfica e com caracteres moveis de argila. (BACELAR, 1999, p.1)
Tal técnica quando levada ao ocidente causa altos impactos na eficácia e
intensidade de produção, sendo, sobretudo uma alternativa mais barata aos já
conhecidos pergaminhos, isso somado a necessidade de documentação devido ao
desenvolvimento comercial, institucional, político e religioso da época, proporcionou
grande aceitação e evolução da técnica. Pouco mais tarde seria visto o nascimento
do processo de impressão de Gutenberg, mais um avanço para a época, e desde
então em constante evolução.
O acesso à informação é um fator que pode dar a oportunidade de estar em
estado de igualdade pessoas de níveis sociais diferentes, pois a partir do momento
em que todos têm acesso ao mesmo tipo de informação, podem promover
mudanças por meio delas. Aqui podemos notar tamanha importância de algo que
faça a ligação entre uma informação e o cidadão, algo que faça a informação chegar
até o indivíduo.
O desenvolvimento da tecnologia da impressão é responsável por uma
revolução nas comunicações, o que refletiria na maneira de pensar e nas interações
sociais, uma vez que a impressão juntamente com a linguagem falada, a escrita e os
meios eletrônicos são verdadeiros marcos na história da comunicação o que
influenciaria as mudanças sociais e intelectuais. (BACELAR, 1999, p.4)

2.1.2 E LEMENTOS H ISTÓRICOS DA I NTERNET

A Internet é um conjunto de recursos tecnológicos que coloca à
disposição de qualquer cidadão que possui computador, um modem
e uma linha telefônica uma enorme quantidade de informação e

possibilidades de acesso e serviços diversificados. (MOHERDAUI,
2007, p.19)

Está é a definição para Moherdaui (2007) sobre internet, por meio da qual
deixa claro que internet nada mais é do que uma ferramenta tecnológica
disseminadora de mega doses de informação. Porém, não foi esse o seu princípio.
Criada em 1969 nos Estados Unidos, com uma rede de quatro computadores,
operando entre universidades, sob o nome “Arpanet” que vem de Darpa, a Agência
de Projeto de Pesquisa Avançada do Departamento de Defesa dos Estados Unidos.
Sua primeira demonstração pública acontece apenas três anos depois. Testes de
uso, transmissão e armazenamento de informações em redes de universidades e
agências de notícias são feitas desde o começo. Em 1977 é gerado o primeiro
sistema de correio eletrônico, o desenvolvimento computadores avança cada vez
mais, em 1984 a Apple lança o primeiro computador pessoal com mouse e interface
gráfica para o usuário e somente em 1990 começa a ser desenvolvida a WWW
(World Wide Web) por Tim Bernes-Lee, a qual une técnicas da informação em rede
e hipertexto, oferecendo navegabilidade entre os arquivos da rede (MOHERDAUI,
2007).
Squirra relata que ainda na década de 1970 começa a ser desenvolvida a
idéia de “cidades cabeadas” nos Estados Unidos, na qual usava de tecnologias para
construir uma estrutura central de cidades conectadas, via telefone, televisão à
cabo, redes de televisão comerciais e públicas e depois pela internet, o que
propiciou o surgimento de uma super-via de informação, com a função de troca de
informações entre pessoas, para amenizar problemas sociais aumentando a
qualidade de vida nas pequenas cidades, estimulando o desenvolvimento cultural
regionalmente localizado. A partir dos anos 1990 a internet foi a que mais cresceu.
(apud MOHERDAUI, 2007, pg.20)
O jornalismo sempre esteve próximo a internet desde seu nascimento em
1969, experimentando a transmissão de informações on-line para seus
telespectadores e leitores, mais adiante existe a concepção de banco de dados,
meio pelo qual as informações são armazenadas virtualmente. E é aqui que a
história do jornalismo entra em mutação mais uma vez.
Sistemas de navegação na internet começam a ser produzidos, em 1993 é lançado
o primeiro navegador gráfico para Web, o Mosaic, no mesmo ano são lançados

dispositivos de pesquisa na internet, que procuram arquivos por palavras-chaves e
na época cerca de sessenta jornais norte-americanos já possuíam sites na internet
(MOHERDAUI, 2007).

2.1.3 A LGUNS P ONTOS S OBRE O J ORNALISMO O N - LINE

Da mesma maneira que a história contada oralmente encontrou no meio
impresso identificação, passando a coexistirem pela função de comunicar, o meio
impresso encontra séculos depois de seu nascimento a internet, um meio não
elimina o outro, e sim se soma a ele.

2.1.3.1 T ERMINOLOGIAS USAD AS NO JORNALISM O NA INTERNET

Existem várias definições para notícias veiculadas na internet, podendo se
diferenciar pela sua natureza ou linguagem jornalística, ou mesmo para qual meio
essa notícia foi criada a princípio. Foram empregadas muitas nomenclaturas
distintas, para Bastos o termo jornalismo eletrônico deve ser usado englobando o
jornalismo on-line e jornalismo digital, sendo que fazer apuração é jornalismo on-
line, desenvolver e disponibilizar é jornalismo digital. (MOHERDAUI, 2007)
É por meio internet que se tem a exploração do hipertexto e da hipermídia,
dois grandes diferenciais do jornalismo feito no meio digital, esses são pontos
característicos, pois trata da manipulação das possibilidades tecnológicas permitidas
pela internet como vídeos, imagens, áudio, todos no mesmo lugar, além de
comportar atualizações em tempo real. Logo, tem-se jornalismo digital como o termo
que designa o jornalismo web ou outros suportes de conteúdo. Também pode ser
jornalismo multimídia, pois se pode manipular dados digitais como texto, som e
imagem. (MOHERDAUI, 2007, p.121)
Moherdaui (2007) propõe ainda um quadro que traça paralelos sobre as
nomenclaturas sugeridas:

Nomenclatura Definição
Jornalismo Utiliza equipamentos e recursos eletrônicos
eletrônico
Jornalismo digital Emprega tecnologia digital, todo e qualquer procedimento que implica
ou jornalismo o tratamento de dados ou forma de bits.
multimídia
Ciberjornalismo Envolve tecnologias que utilizam o ciberespaço

Jornalismo É desenvolvido utilizando tecnologias de transmissão de dados em
on-line rede e em tempo real
Webjornalismo Diz respeito à utilização de uma parte específica da Internet que é a
Web.

Tabela 1: Terminologias para jornalismo em ambiente digital

Tem-se, portanto que a Web é uma ampla rede difusora de informações, e o
jornalismo que tem como característica fornecer informações. O design gráfico
possui domínio sobre um tipo de informação em particular, a informação visual. Ao
tratar informações visuais encontram-se tantas questões como em qualquer outro
meio, como organização imagética, distribuição hierárquica de informações,
leiturabilidade, entre outros.
Para que a informação certa chegue até ao usuário que a deseja é necessária
organização da mesma, seja pelo jornalista, que crie filtros, organize, priorize tipos
de informação, ou pela composição visual da interface gráfica que mostrará a
informação ao usuário, podendo assim também organizar, criar filtros, priorizar
informações por meio do trabalho com a imagem. Desse modo, funções
desempenhadas por profissionais como filtrar e ordenar informações torna-se cada
vez mais necessário (PALÁCIOS, 2003, pg 80)
Quanto à interface tem-se ainda a criação de todo um ambiente virtual, o qual
irá acolher o usuário, e fará o papel de mediador entre informação pura e usuário.
Tal ambiente comunicacional e informacional deve ter fatores de demanda e acesso
a informação, ao invés de apenas emissão e recepção como era pensado em um
modo de comunicação tradicional (SILVA JUNIOR, 2001, p.2).

3. EXPLORANDO AMBIENTES VISUAIS DIGITAIS

3.1 INTERFACE

Para entender melhor o relacionamento entre usuário e jornais on-line é
indispensável esclarecer do que se trata exatamente a interface.
Para Baranauskas e Rocha (2003, p.7): “Quando o conceito de interface
surgiu, ela era geralmente entendida como o hardware e o software com o qual o
homem e o computador podiam se comunicar”. Mais adiante este conceito englobou
aspectos cognitivos e emocionais do usuário durante a comunicação. Logo não é
raro pensar em interface apenas como a tela de um computador, porém esse
conceito é equivocado. A interface pode ser um papel em que esteja anotada uma
informação qualquer, que será vista, processada e entendida pelo usuário.
Além dessa visão inicial sobre a interface tem-se a evolução da mesma, a
qual leva o usuário a ter mais poder, como um editor de textos, que a cada
atualização traz mais opções de manipulação do que a versão anterior, permitindo
ao usuário a possibilidade de customizar seu uso, e atingir objetivos diferentes de
apenas visualizar uma informação, oferecendo assim, mais poder ao usuário.
Será tomada então a definição de interface “como um lugar onde o contato
entre duas entidades ocorre” (BARANAUSKAS e ROCHA, 2003, p.8)
Sobre interface, para Toledo Filho (2007, p.1): “Este formato de apresentação
gráfica, ou o “ambiente digital” funcional, tornou a utilização do computador mais
amigável devido as questões de forma e função dialogando com os princípios
básicos do design.”
Segundo Bonsiepe (1997,p.12) a interface é responsável por fazer produtos
de objetos, transformando sinais em informação interpretável, ou mesmo a simples
presença física em disponibilidade, ou seja, mostra o caráter de ferramenta dos
objetos e o conteúdo comunicativo de fato das informações. (apud
PFUTZENREUTER, 2005, p.169)
Para Freitas (2005, p.189) os elementos de uma interface são “como
receptores inanimados que ao serem acionados conduzem a informação do

acionamento ao núcleo do seu sistema desencadeando as reações previstas em seu
planejamento”.

3.2 IHC – I NTERAÇÃO H UM ANO C OMPUTADOR

Quanto mais bem projetados os computadores e suas interfaces, mais bem
aceitos e usados eles são. Pode parecer uma afirmação lógica, porém por vezes
essa concepção é deixada em segundo plano.
Surge então o IHC: “IHC é a disciplina preocupada com o design, avaliação e
implementação de sistemas computacionais interativos para uso humano e com o
estudo dos principais fenômenos ao redor deles.” (BARANAUSKAS e ROCHA,
2003, p.14)
É pensando em problemas que interfaces mal projetadas podem ocasionar
que algumas empresas de softwares têm melhorado o aspecto físico da interface do
usuário, com intenção de aumentar as chances de sucesso. Nasce assim o termo
“interface amigável” (BARANAUSKAS e ROCHA, 2003, p.14 ), a princípio passando
apenas a elaborar melhor esteticamente alguns elementos de tela, mas ao mesmo
tempo alguns pesquisadores analisavam capacidades e limitações humanas,
estudando o lado humano da interação com computadores, ou seja, por meio do IHC
é possível analisar e traçar a melhor maneira de compor um bom projeto gráfico, de
forma a ajudar ao usuário satisfazer seu desejo, dando livre acesso a informação e a
possibilidade de interação.
Para ajudar pessoas a executar atividades de forma produtiva e com
segurança é usado o IHC, o qual deve promover o desenvolvimento de todo tipo de
sistema, podendo variar desde um sistema de controle de trafego aéreo até sistema
de escritórios, onde a variação se dá exatamente entre a segurança que um deve ter
e a produtividade do outro (BARANAUSKAS e ROCHA, 2003, p.15).
A interação humano computador encontra desafios no jornalismo on-line,
como o desenvolvimento acelerado da tecnologia e o bom desenvolvimento de um

design eficiente para variados tipos de usuários, isso converge a objetivos da IHC,
que se dá na aceitação da interface pelo usuário, para tanto é necessário que tal
interface tenha uma boa facilidade de uso para usuário, contribuindo assim para a
evolução do uso da informação em meios digitais, visto isso é importante que o
responsável pelo desenvolvimento de uma mídia digital tenha conhecimento em
diversas áreas. O homem desenvolveu um meio eficiente de comunicação e
interação com o ambiente material ao seu redor por meio de diversas áreas do
conhecimento, e agora deve tornar possível o mesmo com um ambiente imaterial,
mas tão real quanto o anterior. (FREITAS, 2005, p.186)
Para Toledo Filho (2007, p.2) a interface juntamente a uma linguagem visual
modificam a percepção do ambiente virtual, ele ainda determina que o design atua
especialmente nesse momento, pois será o profissional responsável pela
apresentação gráfica da interface, tem-se na construção do ambiente virtual a
linguagem do design, que propõe soluções para uma apresentação gráfica amigável
e funcional, desse modo a interface juntamente a linguagem visual em projetos
digitais é uma das responsáveis pela percepção do ambiente virtual.

3.3 C ONSIDERAÇÕES SOBRE ALGUNS DOMÍNIOS DO D ESIGN

Para ilustrar os domínios do design Bonsiepe (1997, p.12) propõe uma série
de postulados, os quais esboçam o pensamento do design de uma maneira geral, no
caso do design voltado à interface atentar ao ultimo postulado “design se orienta à
interação entre usuário e artefato. O domínio do design é o domínio da interface”
Além disso, é interessante observar o caráter emancipador do design, quando
Bonsiepe (1997, p.16) diz no segundo e terceiro postulados “o design é orientado
ao futuro” e o “design está relacionado à inovação. O ato projetual introduz algo de
novo no mundo”

• Design é um domínio que pode se manifestar em qualquer área do
pensamento e da práxis humana;
• O design é orientado ao futuro;

• O design está relacionado à inovação. O ato projetual introduz
algo de novo no mundo;
• O design esta ligado ao corpo e ao espaço, particularmente ao
espaço retinal, porém não se limitando a ele;
• O design visa “a ação efetifva;
• Design está linguisticamente ancorado no campo dos juízos;
• Design se orienta à interação entre usuário e artefato. O domínio
do desig é o domínio da interface..(apud PFUTZENREUTER,
2005, p.169)

Pfutzenreuter (2005, p.172) busca explicar de uma maneira simplificada que: “
o design é um processo que leva à criação de objetos que suprem necessidades
definidas no início do processo.”
Para Freitas (2005, p.187) o design resulta de um projeto que possui um
objetivo sempre voltado ao bem estar do homem, e ainda diz existir como referencia
para idéia design “o menor gesto de intervenção intencional no ambiente natural que
resulte em alterações dos níveis de compreensão e conforto na relação entre o
homem e o universo”. Tendo como finalidade sempre o bem-estar do ser humano o
design parte de um pensar que resulta em um ato criativo (projeto), com um objetivo
já predefinido.

3.3.1 D ESIGN G RÁFICO

Quando a atitude projetual se estende em projeto gráfico tem-se o design
gráfico, que muito além do caráter gráfico deve-se entender o local em que a ação
do usuário irá acontecer, a atitude de projeto que se tem dentro do design gráfico
deve ser mantida, mas não mostrando ao usuário como agir com o objeto, ao não
ser em caso de indicação de como utilizar uma embalagem, a ação costuma
acontecer no ambiente. Um cartaz leva a uma ação de querer assistir um filme ou
qualquer outra que ele propor: . (PFUTZENREUTER, 2005, p. 174)

No momento em que um projeto visa ser gerado para Web por meio do
design Campos e Wallace (2008, p.2) esclarecem as interações entre design de
produto e design gráfico, em um instante no qual por não ser um artefato tangível
não pode ser considerado produto, nem gráfico enquanto não impresso. Quando se
fala de criar para internet está sendo criado algo que é tanto produto por ser uma
mercadoria, quanto gráfico, por transmitir informações

3.3.1.1 A LGUNS P ONTOS S OBRE A C OMUNICAÇÃO VISUAL

Para que haja uma boa comunicação o projeto da interface gráfica deve
satisfazer algumas perspectivas, como compor as informações tanto visuais quanto
verbais na tela do computador, necessitando de alguma familiaridade com questões
sobre a composição visual propriamente dita. (PFUTZENREUTER , 2005, p.174).
Os elementos básicos da comunicação visual são os responsáveis pela
construção da composição visual, segundo Dondis (2000): “Sempre que alguma
coisa é projetada e feita, esboçada e pintada, desenhada, rabiscada, construída,
esculpida ou gesticulada, a substância visual da obra é composta a partir de uma
lista básica de elementos”.
A partir de elementos visuais simples como o ponto ou a linha pode-se
construir composições de alto nível de complexibilidade, afirma Dondis (2000) que :
“Os elementos visuais mais simples podem ser usados com grande complexidade de
intenção.”, mas que para compreender a estrutura de uma linguagem visual é
interessante conhecer os elementos visuais de modo individual: “Para analisar e
compreender a estrutura total de uma linguagem visual, é conveniente concentrar-se
nos elementos visuais individuais, um por um, para um conhecimento mais
aprofundado de suas qualidades especificas.” (DONDIS, 2000).
Ela ainda diz que estes são responsáveis por toda estrutura visual por meio
de combinações: ”Por poucos que sejam, são a matéria-prima de toda informação
visual em termos de opções e combinações seletivas. A estrutura da obra visual é a
força que determina quais elementos visuais estão presente, e com qual ênfase
essa presença ocorre.” (DONDIS, 2000).

3.3.1.1.1 C OMPOSIÇÃO VISU AL E PERCEPÇÃO

A ferramenta que o design utiliza para realização do seu trabalho é
basicamente os elementos de uma composição visual e a composição em si, por
meio da combinação desses elementos é determinado o significado visual da
composição, é pela composição que os problemas visuais são resolvidos , pois a
determinação do objetivo e significado da manifestação visual é recebido de pelo
espectador com grandes implicações, sendo o processo de composição um ponto
elementar na solução de problemas visuais (DONDIS, 2000 p.29)
. Além disso, Dondis (2000) fala sobre os critérios para o entendimento do
significado da composição, e enfatiza a importância da percepção humana sobre o
assunto, para ela há: “ muitos critérios para o entendimento do significado na forma
visual, o potencial sintático da estrutura no alfabetismo visual, decorrem da
investigação no processo da percepção humana”.
Existem dois passos essenciais para o entendimento visual, que seriam: a
criação da composição e o outro a absorção e entendimento da informação visual.
Sobre o processo de percepção visual e a criação da composição gráfica, Dondis
(2000, p.30) afirma que o significado das mensagens habita o mecanismo
perceptivo humano, e que por meio da intenção de significar uma mensagem por
meio de elementos visuais se tem a composição. O design é criado a partir de vários
elementos como cores, formas texturas e proporções, quando são relacionado esses
elementos almejando um significado, resulta-se em uma composição. Para a
comunicação ser completa além de compor uma mensagem visual sensata a mesma
deve ter suas informações absorvidas pelo receptor, absorver a informação no
sistema nervoso pelos olhos (ver) é outro passo da comunicação visual, isto é
comum a todos os seres humanos, em grau maior ou menor, sendo que tanto ver
quanto criar a composição visual são processos interdependentes.
Para Dondis (2000) a percepção se faz pela soma de componentes físicos e
psicológicos que podem ser revelados e instigados por meio do design, ou
elementos visuais, os quais sempre são intencionais e propõe uma reação do todo.
Os elementos físicos e psicológicos não são absolutos, atuam em conjunto em uma
composição estímulos que não podem ser definidos como intelectual, emocional ou
mecânico, por tamanho, forma ou distancia, sempre possuem uma qualidade

dinâmica, os quais modificam o espaço, ordenam ou perturbam o equilíbrio. Quando
estes atuam em conjunto criam a percepção, ou seja, os elementos visuais nunca
estão ali por acaso, são acontecimentos, ações que incorporam uma reação.
As sensações visuais percebidas no ambiente digital serão transmitas pelo
sistema perceptual, o qual leva as sensações do mundo físicos percebidas por
sistemas sensoriais do organismo e as transforma em representações. Baranauskas
e Rocha (2003).
Há ainda uma série de outros fatores psicofísicos, os quais pesam muito em
uma composição visual, como “Equilíbrio, tensão, nivelamento e aguçamento,
preferência pelo ângulo inferior esquerdo, atração e agrupamento, positivo e
negativo”. (DONDIS, 2000).

3.3.1.1.2 C ONSIDERAÇÕES SOBRE A IM AGEM NOS DIAS ATUAIS

Percebidos os elementos visuais de uma composição os significados da
mesma passam a ser processados pela imagem, Campos e Wallace (2008, pg11)
explicam que os significados são conduzidos pelas imagens, tendo como intenção
controlar a informação, mas só mostram seus significados reais se forem analisados
em conjunto.
Sobre a percepção de parte do conteúdo visual para a do conjunto tem-se a
idéia de gestalt, que identifica no processo de percepção algumas características,
como proximidade, similaridade, fechamento, continuidade e região comum, de
modo que o fundo é percebido de forma mais uniforme e a figura como algo em
particular, o que faz parecer mais próxima, obedecendo às características já citadas
acima, as quais descrevem a capacidade de reconhecimento do todo antes das
partes. Assim a percepção do campo visual começa pela diferenciação da figura e
do fundo. (BETIOL, CYBIS e FAUST, 2007, p.305)
Da mesma maneira se comporta o texto em um primeiro momento, primeiro
percebido como imagem, depois em significado. Quando o texto é usado em
conjunto com uma outra imagem existe uma relação de complementação entre os
dois, a relação da imagem e do texto é descrita por Campos e Wallace (2008) do
seguinte modo:

A inevitável relação entre o texto e o desenho faz lembrar uma
operação caligramática, em que palavras e imagens se completam
para dizer algo em conjunto, [...]Comportar-se-iam antes como uma
escrita que lança no espaço a visibilidade provável de uma
referência, invocando os signos, do âmago da imagem que
configuram – por um recorte de sua massa na página –aquilo de que
falam. [...] é preciso que haja uma subordinação: ou o texto será
regrado pela imagem ou a imagem o será pelo texto. [...] O signo
verbal e a representação visual jamais seriam dados de uma só vez.
Sempre uma ordem os hierarquizaria, indo da forma ao discurso ou
do discurso à forma (CAMPOS e WALLACE, 2008, p.7)

Campos e Wallace (2008, p1) ainda se comentam o processo de avanço
tecnológico, em que a produção de imagem aumenta, tendo de disputar com outras
imagens um espaço cada vez menor para transmitir sua mensagem, formulando
assim um impacto considerável entre avanço tecnológico sobre a imagem,
possibilitando o nascimento de diversos veículos informacionais.
Não somente os métodos produtivos foram reelaborados após o processo de
industrialização, até mesmo processos de organização e apresentação de
informações tiveram mudanças, sinalizar de maneira adequada cidades que
cresciam cada vez mais, ou ainda divulgar produtos novos para um publico então
anônimo. Logo a criação de cartazes, embalagens, revistas e demais veículos
informacionais viram com os avanços tecnológicos exatamente para solucionar
essas questões. (CAMPOS E WALLACE,2008, p.1)
Ainda sobre os impactos sobre os avanços tecnológicos, em um segundo
momento tem-se um fenômeno caracterizado pelo excesso de informação visual
captada pelo receptor, criando uma sobreposição de imagens por meio da
fragmentação das mesmas, no mundo da era da informação a visão é feita como por
parcelas, fragmentos de visão, e sua totalidade só pode ser reconstruída na mente
do observador, ainda que de modo passageiro, como passar de canal em canal na
televisão, a velocidade deste olhar moderno sobrepõe e fragmenta as imagens.
(CAMPOS E WALLACE,2008, P.3)

3.3.2 H IPERTEXTO , M ULTIMÍDIA E H IPERMÍDI A

Como já foi visto no anteriormente a internet a princípio não possuía muitos
recursos, principalmente para multimídias, mas a partir de pesquisas com foco na
produção de interfaces gráficas e avanços tecnológicos que hoje é possível a
visualização de conteúdo em diversas formas. A partir do desenvolvimento
tecnológico, como os navegadores de internet a visualização de conteúdo
multimidial (imagens, áudio, vídeo e animações) começaram a exigir do layout das
páginas uma melhor elaboração; .( CAMPOS E WALLACE, 2008, p.4)
A Web a partir de então se torna um ambiente exato para a evolução das
mídias, especialmente por reunir em um só espaço a TV, o rádio, o jornal e demais
meios de informação. A imagem hoje está cada vez mais presente, sem que se
perca a palavra, a linguagem pode cativar ou manipular audiência, além de informá-
la, assim sendo, a web se torna “mídia das mídias” por trazer em si o rádio, o
telefone, a televisão, a revista, o clube, sendo por excelência, multimidial.
(CAMPOS E WALLACE,2008, P.5).
Pelo agrupamento de informações variadas como som, textos, imagens,
vídeo, etc., em uma mesma tecnologia entende-se multimídia, já a hipermídia se dá
a partir do momento em que se englobam recursos que possibilita ao usuário
navegar por um aplicativo da maneira que achar melhor, como o hipertexto e a
multimídia, sendo que o usuário de hipermídia se difere dos demais usuários, como
um leitor de revista ou de jornal impresso, uma vez que ele é um leitor ativo, que
constrói seu próprio caminho. (LEÃO, 1999, p.16).
Com a hipermídia o usuário passa a interferir no conteúdo acessado,
deixando de ser um receptor passivo, agora ele pode acrescentar comentários,
personalizar páginas, gerar conteúdo inédito, algo que outras mídias poderiam até
fazer, mas apenas de maneira indireta, usando duas mídias em paralelo, como
televisão juntamente ao telefone. (CAMPOS E WALLACE, 2008, P.5)
A estrutura hipermidiatica é flexível e interativa, sendo que todo aplicativo em
hipermídia possui uma série de informações relacionada a um tema central,
ampliando as possibilidades de conteúdo para leitura, de modo que os temas
próximos incluem anexos que podem ser consultados de forma tão direta quanto o

tema central, criando uma rede hipertextual que facilita o acesso as demais
informações (LEÃO, 1999, p.16).
Um dos pontos que transforma uma interface hipermídia mais interativa é o
uso do hipertexto, pois esse permite o acesso não linear das informações, assim o
usuário decide o que ver primeiro, não usando de uma ordem pré-estabelecida e
engessada, ao usar dos links de hipertextos pode-se moldar uma rede hipertextual,
que permite que o leitor faça sua leitura do modo que achar melhor (FERRARI,
2003, p.42). Logo tem-se que interface gráfica junto a organização hipertextual são o
que oferecem a interação ao usuário, e são elementos específicos no projeto de
novas mídias (PFUTZENREUTER, 2005, p.175)
Há um vínculo entre o design e a hipermídia, pois os dois obedecem ao
propósito de comunicar, sendo assim é comum um design gráfico que trabalhe com
hipermídia, pois as áreas têm se inter-relacionado cada vez mais, levando ao design
de hipermídia elementos do design gráfico, sobrepondo ainda mais as áreas do
design gráfico e do desenho de produto, devido tanto a função de comunicar quanto
a utilitária, sendo que o design de hipermídia seria um tipo de design emergente
envolvendo tanto o design gráfico quanto o de produto. Em design de hipermídia por
se utilizar também da comunicação visual existem elementos do design gráfico, mas
em uma tela de computador há a exigência de uma atuação nela mesma, e é ai que
o receptor passa a ser um usuário, um operador, ao contrario de um cartaz
(PFUTZENREUTER, 2005, p. 175)

3.3.3 D ESIGN C ENTR ADO NO U SUÁRIO

É por meio da interface que o usuário tem entrada no universo digital, logo um
projeto hipermidiático bem executado é essencial que na absorção do ambiente pelo
usuário se entenda que a interface é a de fato a apresentação de um projeto para o
usuário. (TOLEDO FILHO, 2007, p.1)
Importante também é a definição do tipo de usuário, pois esse quesito irá
influenciar o conceito e desenvolvimento do projeto, uma vez que ajudará a
caracterizar a interface, mudando de conceito para cada tipo de usuário. Logo, se

faz necessário observar os usuários e descobrir o que eles gostam, o que os ajudam
e em que encontram dificuldades (GALLINA e KOS, 2006, p.2).
Para Mayehew (1992) não conhecer os usuários implica certamente em erro,
no caso dos desenvolvedores é comum achar que todos usuários são iguais ou que
são iguais a eles. É interessante ficar atento as necessidades do usuário, ao
comportamento e objetivos dos mesmos, pois possuem níveis de experiência
diferenciados, e todos devem ser atendidos, se um site estiver adequado aos
objetivos e comportamento de um usuário real, ele será bem sucedido,isso se trata
de design centrado no usuário (apud AGNER e MORAES, 2002, p.9)
Usuários com diferentes níveis de educação, de conhecimentos e diferentes
níveis de experiência com a tecnologia da informação têm diferentes necessidades -
que devem ser acomodadas pelos sistemas. Por isso, o princípio fundamental do
design de interfaces é conhecer o usuário. (AGNER e MORAES, 2002, p.11.)
A experiência do usuário é outra determinante sobre a interação com o
sistema, pois tem necessidades diferentes, a interface deve ser adaptada a
experiência do usuário, que pode pertencer a diversos níveis. Usuários com
experiência de uso diferente possuem necessidade informacionais diferentes, para
um iniciante, por exemplo, é interessante uma explicação passo a passo das ações,
enquanto para um usuário experiente deve-se fornecer atalhos. Para organizar a
informação deve-se desenhar o hipertexto conforme a experiência dos usuários.
(LEULIER, BASTIEN e SCAPIN, apud AGNER e MORAES, 2006)
A Microsoft (2000) apud Agner e Moraes (2002, p.9) classifica usuários
segundo técnicas de design centrado no usuário da seguinte maneira:

• Usuários iniciantes: manuseiam o ambiente com dificuldade, como o uso do
mouse, ações como clicar e arrastar objetos na tela, ou ainda a diferença entre
um clique e um duplo-clique . Muitas vezes não compreende que as janelas são
representadas num espaço tridimensional, o que torna difícil a administração de
janelas. Possuem também dificuldades em gerenciamento de arquivos, e a
organização dos mesmos ou pastas em mais de dois níveis se torna difícil, pois
não é próximo do modelo físico.

• Usuários avançados: necessitam de atalhos ou outras maneiras de promover
uma maior eficiência na interface. Tem dificuldades em se readaptar a mudanças
em uma interface conhecida, e podem depender de interfaces particulares. O
desafio está em dar a uma interface a eficiência necessária a um usuário
avançado sem prejudicar os iniciantes.

Além de verificar os tipos de usuário deve-se ter em mente qual o objetivo do
site, pois isso também definirá grupos de usuários diferentes, com necessidades e
propósitos diferentes, destacando informações relevantes e atenuando as menos
importantes.(GALLINA e KOS,2006)
Princípios básicos do design centrado no usuário de Rubin (1994) apud Agner
e Moraes (2002, p.7), enfatizam o foco no usuário, no seu comportamento e nas
tarefas executadas, de modo que o produto seja testado e modificado varias vezes:

• Deve-se ter como objetivo coletar informações sobre clientes de maneira
estruturada, de maneira a não apenas identificar e categorizar um usuário, o
usuário deve estar sempre em contato com a equipe de designers não só no
desenvolvimento de um produto, mas em todo período de vida, focando sempre
no usuário e suas tarefas.
• Deve-se direcionar a ênfase na coleta de dados como facilidade de uso e
aprendizado, devendo mensurar a utilização do produto empiricamente.
• Deve-se haver a possibilidade de repensar o conceito do projeto, modificando,
testando, desenhando o produto repetidas vezes. As mudanças não apenas
estéticas, mas devem ser feitas até mesmo na formulação do produto.

No começo dos sistemas informatizados pessoas comuns não conseguiriam
operar o sistema, logo a solução foram pesquisas e desenvolvimento em cima
dessas pessoas que não possuíam habilidades específicas sobre o sistema e na
década de 90 então a WWW fez com que a informática entrasse em uma era de
grande popularização. (AGNER E MORAES, 2002, p.1.)

Quando se fala de jornais on-line o tipo de usuário encontrado se trata de um
usuário mais ativo do que o de outras mídias como revistas ou jornais, exatamente
por estar interagindo com o ambiente hipermidiático, por buscar mais informações e
não apenas aceitar o que lhe oferecido passivamente. (FERRARI, 2003)

3.3.4 Princípios Práticos em Design Aplicados ao Meio Digital.

Sistemas computacionais em geral apresentam uma complexidade alta, tanto
de manipulação pelo usuário, quanto de desenvolvimento pela equipe que projeta o
sistema, logo se faz necessário o emprôo de alguns princípios que levem a uma
boa interação do usuário com o sistema. Baranauskas e Rocha (2003, p.25)
descrevem quatro princípios centrais relacionados a design e a interação do usuário,
estes são: a visibilidade, o modelo conceitual, o mapeamento e o feedback:

• Visibilidade: devem-se estar visível em um sistema apenas coisas realmente
necessárias, as quais indiquem as partes de um sistema que podem ser
manipuladas, é a visibilidade que indica o mapeamento entre as ações que
pretendem ser executadas e as reais. É por meio da visibilidade que se sabe se
uma operação foi realmente feita como se pretendia. Para tanto designer devem
deixar sinais claros que indique como executar uma tarefa, a mente humana dá
sentido as coisas que percebe do mundo, mas objetos com um bom design são
fáceis de entender e interpretar, com dicas claras de sua operação.
• Modelo conceitual: é o que possibilita presumir qual será o resultado de uma
ação realizada, sem ele não se sabe qual resposta esperar de um sistema, ou
mesmo o que fazer se o resultado final não satisfazer a premissa da ação.
• Mapeamento: trata-se do relacionamento entre duas entidades, em interfaces
isso significa o relacionamento entre os controles, as ações e os resultados.
Quando os mapeamentos são naturais eles usam de analogias com o mundo do
usuário e padrões culturais, o que leva a um entendimento instantâneo. Algo se
torna de fácil uso quando o conjunto de ações possíveis está bem visível.

• Feedback: resposta que retorna para o usuário informações de como suas ações
foram executadas, se foram realizadas com sucesso, e quais foram os resultados
obtidos.

3.3.4.1 Entendendo o espaço tipográfico

Dentro do Design Gráfico encontram-se alguns elementos que ajudam a
organizar o espaço, o que é um ponto que permite atingir aos princípios acima. A
organização do espaço por esses elementos juntamente a outros já vistos na teoria
de comunicação e percepção visual, sinaliza ambientes, cria atmosferas, fluxos de
leitura, inserindo o usuário no meio e guiando na sua busca a um conteúdo.
Para melhor ilustrar a noção do emprego de elementos no Design Gráfico, adota-
se aqui uma massa de texto qualquer, até mesmo por ser a estrutura essencial de
jornais em geral. Tomando em paralelo a linguagem falada e a escrita, por exemplo,
a linguagem falada possui um fluxo contínuo, não se percebe vazios audíveis entre
as palavras, enquanto na linguagem escrita foi necessário um artifício que separe
uma palavra da outra, o que cumpre essa função é o espacejamento entre palavras,
e a pontuação (LUPTON, 2006, pg 67).
É função do design abrir caminho entre o fluxo de leitura, criando uma quebra no
texto, suavizando a leitura, oferecendo alternativas para explorar a massa de
informação, basta atentar quem no meio digital massas de texto longas costumam
ser quebradas e cada pedaço estar acessível por um hipertexto. Já a tipografia é
responsável por ajudar o usuário/leito a navegar melhor pelo conteúdo. (LUPTON,
2006, pg 63).
Em busca de tornar o ambiente confortável ao usuário, ainda pensando na
linguagem escrita, a menor intervenção nos vazios que envolvem cada uma das
letras de uma palavra altera a percepção da mesma, sendo que se as letras
estiverem uma muito próxima da outra, ou uma muito distante da outra pode ser
desconfortável a sua leitura, ou mesmo impossibilitar a leitura. (LUPTON, 2006, pg
80).
Ainda no espaço tipográfico, para compreensão do mesmo é importante
perceber a relação das partes com o todo. As letras se transformam em palavras,

que se transforma em linhas, que criam parágrafos, o qual pode vir a ser uma coluna
dependendo da sua extensão. A manipulação dos espaços criados entre esses
elementos cria ritmo, limites, organização, orientação, movimento, os alinhamentos
criam ligações ou separações visuais, se estes forem regulares a textura percebida
na massa de texto será estática, caso haja um intervalo diferente entre esses
elementos o mesmo será percebido como destaque, criando importância e
estabelecendo uma ordem de leitura, uma hierarquia (SAMARA, 2008, pg 23).
A hierarquia, sobretudo ajuda o usuário a se localizar, sinalizando entradas e
saídas, podendo ser sinais espaciais como recuo, entrelinhas, ou gráficos como
tamanho, cor, fonte . (LUPTON, 2006, pg 94).

4 EM BUSCA DE UMA MELHOR FACILIDADE DE USO - A USABILIDADE

Loranger e Nielsen (2007) afirmam que os usuários de web têm sempre um
objetivo especifico em mente ao utilizar da internet, não funciona da mesma forma
que a televisão que é para se distrair, por exemplo. Logo o usuário de internet deve
ser abordado de maneira particular para atingir seus objetivos, em busca de uma
informação específica, seja no formato de vídeo, áudio ou texto, ele deve ser guiado
até seu propósito de maneira clara e objetiva, ou seja, quão fácil é usar a interface
digital para chegar ao objetivo do usuário. Sobre a facilidade de uso de uma
interface tem-se o conceito de usabilidade como o que define a qualidade
relacionada ao quanto algo é facilmente usado, a rapidez de aprendizado de um
usuário em relação ao seu objeto de uso, o quanto aquilo é lembrado, possibilidade
de erros, e se gostam ou não de usar. Algo que não pode ser usado, não precisa
existir (LORANGER e NIELSEN, 2007, p.xvi)
A normatização da usabilidade é feita pela ISO 9241, identificando
capacidades interativas entre um sistema e o usuário, segundo as tarefas a serem
desempenhadas pelo usuário, Betiol, Cybis, e Faust (2007, p.15) dizem: “A norma
ISO 9241 define usabilidade como a capacidade que um sistema interativo oferece a
seu usuário, em determinado contexto de operação, para a realização de tarefas de
maneira eficaz, eficiente e agradável” (BETIOL, CYBIS e FAUST, 2007, p.15).
Eficiência e eficácia são novamente citadas por Andrade (2007, p.38) como
medidas da usabilidade em conjunto com satisfação para o usuário, ele ainda
explica a diferença entre a eficácia e a eficiência para um software, sendo que para
ser eficiente o software deve atingir os objetivos para que ele foi pensado, enquanto
para ser eficiente além de chegar ao resultado isso deve ser feito com o melhor
aproveitamento dos recursos disponíveis.
Se explora ainda a conceituação de eficácia e eficiência como sendo a
eficácia como a capacidade de sistema alcançar seus objetivos com a qualidade e o
número necessários a usuários diferentes e eficiência como a quantidade de
recursos solicitados pelo sistema aos usuários para obter seus objetivos. A partir
desses dois conceitos tem-se a satisfação como o que um sistema proporciona a um
usuário quando ele consegue o resultado almejado. (BETIOL, CYBIS e FAUST,
2007, p.173)

BARROS (2003, p.8) relaciona a usabilidade com mais alguns conceitos,
sendo os principais de suas pesquisas a “ facilidade de aprendizado, a eficiência
para uso, a facilidade de lembrança (memória), a diminuição de erros, e a satisfação
subjetiva”.
Tem-se então que usabilidade além de estar relacionada simplesmente a
facilidade de uso, possui o papel de verificar quais são as dificuldades enfrentadas
pelo usuário no uso de algo. Para tanto o ideal é que seja feito avaliações entre os
usuários e as interfaces, sendo que, tais avaliações não devem ser pensadas
apenas para serem feitas pós a produção da interface, mas durante todo o processo,
pois ajudam em dúvidas surgidas mesmo durante o desenvolvimento de produto,
mesclando-se com o design e dando apoio a criação de algo utilizável (BARROS
2003, p.59)
Baranauskas e Rocha (2003) apontam que a avaliação não deve ser
encarada como uma única fase, e sim em todo período de desenvolvimento e uso da
interface: “usabilidade deve estar sendo avaliada dentro de todo o ciclo de vida de
um projeto, não podendo ser vista como uma fase única a ser realizada apenas em
um momento pontual.” (apud ANDRADE, 2007, p.44)
É igualmente necessária a usabilidade tanto para os usuários quanto para os
envolvidos com a criação ou gerenciamento do sistema, pois se o mesmo for falho
significa desempenho ruim ou falência do mesmo. Pensando pelo olhar do criador
do sistema a usabilidade implica no sucesso ou não do seu produto, no olhar de um
gerente, a baixa usabilidade reduz a produtividade( FERRARI, 2003, p.69).
Para que a usabilidade seja otimizada é preciso usar de um design interativo
e que mostre evolução, a avaliação tem o papel incorporar respostas de erros de
usuários sobre a interface (feedback) de modo a poder corrigir falhas, sendo em
uma avaliação é permitido aos designs e desenvolvedores agregar o feedback dos
usuários para a melhoria da usabilidade. (FERRARI, 2003, p.62)
Define-se uma interface interativa pela sua lógica de operação visando um
sistema agradável, intuitivo, eficiente, e fácil de operar (BETIOL, CYBIS e FAUST,
2007, p.17). Outro quesito importante é a arquitetura de informação que de forma
ideal passa pela esquematização de um sistema de navegação mínimo, que leve o
usuário de forma sutil, com poucas interferências do sistema. Ou seja, um processo
que pareça natural para o usuário. (NIELSEN apud FERRARI, 2003, p.63)

Algumas das origens para soluções em usabilidade são encontradas em
critérios ergonômicos, por isso não é pouco comum se ver princípios de usabilidade
para interfaces próximos aos critérios ergonômicos. Problemas de usabilidade
acontecem na interação, prejudicando o usuário, fazendo com que ele tenha
dificuldades para realizar sua tarefa, mas isso tem origem em um problema de
ergonomia na interface. Isso pode ser explicado, pois a ergonomia tem raizna
usabilidade, visando oferecer eficácia, eficiência, e bem estar ao usuário. ( BETIOL,
CYBIS e FAUST, 2007, p.173)
Para Betiol, Cybis e Faust (2007, p.174) um problema ergonômico e um
problema de usabilidade podem ser identificados, quando algo em um sistema
interativo ocasiona a perda de tempo e compromete ou inviabiliza o desempenho de
uma tarefa . Um problema ergonômico deve ser descrito por quando se reconhece

• Há elementos impróprios em uma interface;
• Alguma recomendação ergonômica estiver sendo desconsiderada;
• Quando há problema de usabilidade devido a alguma falha ergonômica;

Já um problema de usabilidade, segundo os mesmo autores, pode ser
descrito quando:

• Há algum problema de ergonomia, com provável fonte em algum elemento
impróprio sendo usado na interface;
• Há efeitos sobre a tarefa executada pelo usuário, e com que freqüência tal efeito
se repete.

4.1 CONCEITOS SOBRE A ERGONOMIA

Para entender melhor do que se tratam problemas ergonômicos é
interessante conhecer um pouco mais a fundo sobre a atuação da ergonomia. No
caso de ergonomia voltada ao desenvolvimento de interfaces para internet deve-se
pensar nos locais que os links para outras páginas serão colocados, quantos cliques
são precisos para acessar uma informação e a composição gráfica que permitirá
uma boa visualização, incluído fatores da criação da interface gráfica.
( PFUTZENREUTER, 2005, p. 165)
Os ergonomistas no tem caráter multidisciplinar por tratar em vários
momentos de hardware e software, modelos, tarefas, design e impactos
organizacionais design de interfaces, relacionando a ergonomia ao estudo da IHC –
interação humano computador ( AGNES e MORAES, 2002, p.7).

4.1.1 Critérios de Ergonomia e Usabilidade para Interface Digital

Para que seja feitas avaliações de uso deve-se conhecer critérios que as
interfaces devem obedecer, para tanto serão apresentados adiante alguns modelos
que podem ser seguidos, Bastien e Scapin (1993) apud Andrade (2007, p. 41)
propõem oito critérios ergonômicos para interfaces, com a intenção de mapear a
interação do usuário com o sistema, prevendo ações e prevenindo erros:

• Condução: conduzir o usuário por mensagens em sua interação com o
computador, guiando o usuário e facilitando a interação com o sistema.
• Carga de trabalho: diminuir o percurso que o usuário ira trilhar faz com que ele
ganhe tempo e não necessite fazer tarefas complexas e cansativas, diminuir a
carga cognitiva para usuário facilita a interação.

• Controle explícito: o usuário deve ter liberdade, por exemplo, de interromper uma
operação, ou no caso de um usuário avançado pular alguma etapa, fazendo
somente o que ele solicitar.
• Adaptabilidade : o sistema deve identificar o perfil do usuário e se adaptar a ele,
uma interface inteligente neste quesito dialogará melhor com o usuário
• Gestão de erros : erros devem ser evitados ou reduzidas suas ocorrências,
sempre corrigindo automaticamente ou informando ao usuário como corrigir.
• Homogeneidade/coerência: a padronização pode ser feita para formatos de
interface ou para execuções de tarefa em geral, a localização de informações é
maior pois a linguagem entendida e usada pelo usuário será sempre a mesma,
lembrando que a padronização favorece a aprendizagem do sistema.
• Significado dos códigos e denominações: linguagem natural para usuário,
facilitando o dialogo, correspondendo o significado com a ação a ser executada.
• Compatibilidade: ambientes diferentes usados por um usuário devem ser
compatíveis, diminuindo o volume de informação recodificada.

Em paralelo aos critérios ergonômicos de Bastien e Scapin têm-se heurísticas
de usabilidade de Jacob Nielsen e alguns princípios de usabilidade criados por
Andrade a partir dos princípios de Nielsen, é interessante notar a similaridade de
alguns princípios de ergonomia e de usabilidade, isso, como já foi dito
anteriormente, se da exatamente porque alguns problemas de usabilidade tem
fundamentos na ergonomia:
A seguir têm-se algumas recomendações de usabilidade de Nielsen (1993),
apud Baranauskas e Rocha (2003, p.171):

• O sistema promover a visibilidade de seu status;
• O sistema deve informa os usuários sobre o que está acontecendo dentro de um
tempo aceitável (feedback);
• O sistema deve condizer ao mundo real;
• O sistema deve ter linguagem familiar ao usuário ao invés de uma linguagem
técnica;

• O sistema deve adotar convenções do mundo real, assim as informações
fornecidas parecerão mais naturais;
• O sistema sempre deve estar sobre controle do usuário;
• O sistema deve ter saídas de emergência claras, como função de undo e redo,
caso alguma função seja escolhida por engano;
• O sistema deve ter consistência e empregar padrões;
• O sistema deve prevenir erros;
• O sistema pode e deve usar de um design bem trabalho para que o erro seja
prevenido antes que aconteça;
• O sistema deve levar o usuário a reconhece-lo e não a relembrar de seu uso;
• O sistema deve prover visibilidade a opções, ações e objetos, para que o usuário
não necessite lembrar de informações desnecessárias;
• O uso do sistema deve ser flexível e eficiente;
• O sistema deve fornecer atalhos para em ações freqüentes para usuários
experientes, e aumenta a interação;
• Uso de design minimalista;
• Somente informações necessárias devem constar em diálogos;
• Auxilio para os usuários diagnosticar e corrigir erros, sendo que as mensagens
de erro devem ser claras e propondo uma solução;
• Help e documentação não muito extensas e fáceis de serem localizadas, embora
seja melhor um sistema que não precise de documentação.

5. APRESENTAÇÃO DE ESTRUTURAS DO JORNALISMO on-line
ATUAL E SUA RELAÇÃO COM A USABILIDADE

As páginas de jornais on-line possuem elementos característicos na sua composição,
Moherdaui (2007, p.6) cita oito fundamentais: interatividade, hipertextualidade,
personalização, multimidialidade/convergência, memória, atualização contínua, imersão e
conteúdo dinâmico. No momento de produzir a página on-line o responsável deve estar
atendo a diversas necessidades do usuário final e possibilidades de criação, a autora ainda
diz que narrativa deve ser algo primário no planejamento de web:

[...]A narrativa aparece sempre em primeiro plano ao se
planejar uma página na web. O mesmo é notado em autores da área
de design, como Jakob Nielsen (2000) e Tim Harrower (2002),
considerados clássicos (o primeiro sobre mídia digital, e o segundo
sobre papel): não contemplam a composição em seus trabalhos.
Oferecem um guia sobre como estruturar um site a partir a lógica da
usabilidade, dos browsers, das configurações, do hipertexto.
(MOHERDAUI,2007, p. 9).

Andrade (2007, p.17), explica sobre a questão da ainda não padronização dos
jornais on-line, “O jornalismo on-line se encontra em constante evolução, não
existindo ainda padrões ou formatos estabelecidos que possam determinar todas as
suas característica com precisão”, porém diz ser possível identificar algumas
características freqüentes nesse caso segundo Bardoel e Deuze (2001) apud
Andrade (2007, p.17): “é possível elencar uma série de características em maior ou
menor escala, explorada pelos jornais on-line. Dentre elas estão a interatividade,
customização de conteúdo, hipertextualidade, multimidialidade, a memória e a
instantaneidade” .
Andrade (2007, p.17) ressalta ainda que deve se conhecer cada uma dessas
características, pois são “elementos a ser considerados mais adiante ao
estabelecermos os parâmetros das avaliações de usabilidade que serão
conduzidas.”

Aqui será apresentado cada um desses elementos:

• Interatividade: “A interatividade permite que se estabeleça um vinculo entre o
leitor, outros leitores, a notícia e os produtores da notícia, fazendo com que os
leitores sintam-se mais integrados ao processo jornalístico. [...]” (BARDOEL;
DEUZE, 2001 apud ANDRADE, 2007, p.18)
• Customização: para os usuários customização é “configurar o jornal on-line,
determinando o conteúdo a partir de seus interesses individuais” (BARBOSA,
2002, apud ANDRADE, 2007, p.18)
• Hipertextualidade: “ A escrita em formato de hipertexto se baseia na possibilidade
de interconectar conteúdos por meio de links,[...]Tais informações podem, a
qualquer momento, ser acessadas pelo leitor que assim preferir, apenas com um
clique sobre o link.[...]” (BARDOEL; DEUZE: 2001, CANAVILHAS, 1999, apud
ANDRADE, 2007, p.19). Ele ainda cita que o hipertexto tem desempenhado “a
finalidade de disponibilizar índices de organização do conteúdo, ou mesmo para
o oferecimento de notícias complementares ou relacionadas” (MIELNICZUK,
2003 apud ANDRADE, 2007, p.19)
• Multimidialidade: “possibilidade de convergir diversas mídias em um mesmo
suporte para a narração de um fato jornalístico.” (ANDRADE, 2007, p.19)
• Memória: “todo o conteúdo do jornalismo on-line se encontra em meio digital,
permite que sejam armazenados em bancos de dados e facilmente indexados
para realização de buscas e pesquisas de elemento que não fazem mais parte
da edição atual” (ANDRADE, 2007, p.20)
• Instantaneidade ou atualização contínua: “serviços de atualização continua, por
meio de sessões de ultimas notícias ou ao vivo, que em alguns casos são
atualizadas a cada minuto trazendo informações sobre fatos diversos”
(MIELNICZUK, 2003, apud ANDRADE, 2007, p.20)

FERRARI (2003, p.71) faz algumas observações sobre os cuidados a serem
tomados na criação de noticias no espaço digital, como no caso da importância
arquitetura da informação “Contextualizar a informação e saber criar hierarquias de
importância para a noticia – sempre da mais para a menos importante”

Ainda sobre a o peso da arquitetura da informação FERRARI (2003, p.75) diz
que “Um sistema de navegação consistente e funcional, que permita ao usuário
saber em que esta, para onde ir, o que fazer e, é claro, se interessar em voltar ao
endereço clicado, é um grande quebra-cabeça. Nada na internet é aleatório ou
desprovido de intenção”, e a importância de conhecer o espaço disponível para a
publicar uma informação “Precisamos saber exatamente o porquê de determinado
canal ou seção estar disposto naquele espaço geográfico da tela.”
FERRARI (2003, p.78) ainda faz um paralelo entre o profissional de
usabilidade e o de jornalismo: “O trabalho jornalístico na web é sinérgico, reunindo
áreas que a primeira vista são estanques, como exercício de jornalismo e
usabilidade, mas que se encontram, por exemplo, no momento em que o designer
senta ao lado do editor”.
Sobre os usuários de jornal on-line é interessante lembrar que são usuários
com características próprias, o mesmo recebe uma carga de informação grande
todos os dias (tanto visual quanto sonora):

Os sites de conteúdo jornalístico e de entretenimento
produzem, trafegam e armazenam informação. O internauta é
bombardeado 24 horas por dia e sete dias por semana com
informação e dados, que podem ser arquivos de texto, áudio, vídeo
ou imagens. (FERRARI, 2003, p .77)

O usuário é o responsável pelo real domínio do site, a ponto de controlar e
mudar a maneira de narração de um jornalista, ou mesmo narrar a história: “Como
internauta, cada leitor pode até transformar-se em narrador. As histórias não
começam e terminam simplesmente. Elas começam onde o usuário quer começar e
acabam onde ele termina de ler.” (LANSON apud FERRARI, 2003, p.75), segundo
Lanson a web permite o usuário tomar a decisão de qual será a ordem em que
receberá a informação, e que isso é o que o leva a acreditar que a forma de contar
as histórias pela internet tende a mudar: “ A web permite ao usuário decidir em que
ordem quer ler ou apenas visitar um site. Isso deve, segundo Lanson, obrigar os
jornalistas a encontrar outras formas de contar histórias na internet, diferentes dos
grandes blocos de textos.” (LANSON apud FERRARI, 2003, p.75)

6. AVALIAÇÃO DE INTERFACE

6.1 PORQUE AVALIAR UM SISTEMA DE INTERAÇÃO DIGITAL

As avaliações costumam revelar as necessidades e os problemas enfrentados
por um usuário, levando essas informações aos desenvolvedores e designers, dessa
maneira dúvidas que podem surgir durante o desenvolvimento podem ser
respondidas, direcionando e mesclando o desenvolvimento ao design. Avaliar o
sistema pode abordar três focos: a funcionalidade do sistema, observando se o
sistema permite ao usuário desempenhar suas tarefas da melhor maneira possível;
o efeito da interface com o usuário, medindo o impacto do design com usuário,
avaliando como é fácil aprender a usar o sistema; e problemas específicos de o
sistema, que identifica aspectos de design que podem causar resultados
inesperados ou confusão com os usuários (BARANAUSKAS; ROCHA, 2003, p.165)

6.2 TIPOS DE AVALIAÇÃO

Um sistema pode ter sua usabilidade avaliada de diversas maneiras, cinco
grupos principais podem ser considerados (ANDRADE, 2007, p.45)

1. Método de inspeção de usabilidade, sem a assistência de usuários reais;
2. Teste com usuários, essencialmente centrado em usuários;
3. Experimentos controlados, com todas variáveis controladas, realizados em
laboratório;
4. Avaliação interpretativa, na qual o usuário participa da coleta e da análise dos
dados;
5. Modelos cognitivos, os quais antecipam a usabilidade a partir de
representações de sua interface ou usuários;

A seguir serão descritos algumas técnicas de avaliação de IHC:

Tipo Técnica
Inspeção Inspeção de guias de recomendações
Percuso cognitivo
Avaliação heurítica
Teste com usuário Entrevista com usuário
Questinionário com usuário
Pensando em voz alta
Tabela 2: técnicas de avaliação de IHC

6.2.1 Métodos de inspeção

6.2.1.1 Inspeção de guias de recomendações

A inspeção reconhece problemas de usabilidade em uma interface, os quais
podem causar usabilidade reduzida ao usuário, e com base nos problemas fazem
recomendações para sua melhora (BARANAUSKAS; ROCHA, 2003, p.167). Aqui é
inspecionado uma série de itens relacionados a aspectos ergonômicos, observando
problemas em uma interface (ANDRADE,2007, p.47), sendo que esse teste visa
rastrear a qualidade das ferramentas da interface, pois estas indicarão onde estão
os problemas de usabilidade (BARROS, 2003). Existem várias guias, como as
regras de ouro de Shneiderman (1998) que se preocupa com o feedback necessário
ao usuário e a prevenção de erros, a guia de Smith e Mosier (1986) com 944 itens e
usada como base para o padrão internacional ISO de qualidade de interfaces, e a
Ergolist feita pela Labiutil da UFSC, baseada no critério ergonômico para avaliação
de interfaces homem computado de Bastien e Scapin (1993) (ANDRADE,2007,
p.47.)

6.2.1.2 Percurso Cognitivo

Esta técnica inspeciona o nível facilidade de aprendizagem em uma interface,
sendo que o avaliador simula ser o usuário executando tarefas predefinidas,
descrevendo as situações e baseando-se em como os usuários reconhecerão o
resultado que querem atingir, como saberão se uma ação está disponível, como
saberão qual ação é mais adequada ao seu objetivo, e como saberão se chegaram
ao seu objetivo (ANDRADE, 2007, p.48). Para realizar essa técnica o avaliador deve
saber qual o conhecimento do usuário pela tarefa e o percurso que o usuário
percorre para realizá-las (BARROS, 2003, p.65). O percurso cognitivo é ideal para
interfaces que podem ser assimiladas de modo exploratório, ou que exigem muito
treinamento. (BARANAUSKAS; ROCHA, 2003, p.170)

6.2.1.3 Avaliação Heurística

Um grupo de avaliadores, no mínimo três e no máximo cinco, buscam
individualmente problemas que desrespeite alguma das heurísticas, e os julgando de
acordo com um grau de importância , sendo que os avaliadores podem usar de
abordagens diferentes quanto a análise (ANDRADE, 2007, p.49). É importante que
os avaliadores conheçam as heurísticas, as quais se baseiam em regras que
descrevem prioridades comuns em interfaces. Depois dos avaliadores examinarem
pelo menos duas vezes a interface, localiza-se o problema, relatando-o e
associando segundo as heurísticas violadas. Feito isso se deve unir as listas de
problemas em uma única lista (BARROS, 2003, p.40).

6.2.1.3.1 Graus de severidade dentro das avaliações heurísticas.

Após detectar os problemas pelas heurísticas deve-se avaliar os graus de
severidade dos problemas. (BARANAUSKAS; ROCHA, 2003, p.185), como em
avaliações heurísticas podem ser reconhecidos muitos problemas os graus de
severidade servem justamente para distinguir qual é a real importância desses
problemas, sendo que estes podem estar distribuídos de diversas formas
(ANDRADE, 2007, p.67). A gravidade se refere com três fatores: a freqüência que
ele ocorre; o impacto, se ele é de fácil ou difícil resolução para usuário; e a sua
persistência de modo a incomodar repetidamente o usuário (BARANAUSKAS;
ROCHA, 2003, p.185),

6.2.5 Teste Com Usuários

Neste tipo de teste envolvem-se usuários em participação direta, é indicado que
seja realizado em um laboratório onde as variáveis podem ser controladas, apesar
de não ser indispensável, pois o equipamento usado costuma ser bastante simples.
Os dados podem ser obtidos pelo avaliador por questionários ou pelo método
pensado em voz alta. (ANDRADE, 2007, p.50)

6.2.2.1 Entrevistas e Questionários

O questionário é mais indicado quando o sistema é disperso geograficamente
ou o número de usuários participante é muito grande, sendo desenvolvido de
acordo com o tipo de sistema a ser avaliado. Já a entrevista permite a interação do
avaliador com o usuário, devendo ser definido um roteiro para entrevista, podendo
ser acrescentadas novas questões durante a avaliação se for necessário. Deve ter
em mente um grupo focal, com um grupo de discussão do assunto de até 10
pessoas mais o avaliador que terá a função de mediador, os problemas de

usabilidade podem ser observados tanto pelas respostas surgidas durante a
discussão quanto das simples reações do usuário em frente a interface. (ANDRADE,
2007, p.51)

6.2.2.2 Pensando em Voz Alta

A técnica se trata em pedir que os usuários descrevam suas ações, falando
em voz alta tudo o que fizer no sistema, isso ajuda a entender a razão das ações,
podendo reconhecer a falha e corrigi-la.. (LORANGER; NIELSEN, 2007, p.6). O
teste pode ser feito usando de gravação de áudio ou vídeo, podendo ser
acompanhado um avaliador, sendo que se deve considerar natural que os usuários
cometem mais erros ou agem de maneira mais lenta por se preocuparem em relatar
seus pensamentos. (ANDRADE, 2007, p.51)
Loranger e Nielsen (2007, p.6) descrevem como pode ser feito um teste
pensando em voz alta passo a passo, sendo que deve ser feita uma gravação do
monitor e outra do usuário:

• Usuários são testados separadamente;
• Em frente ao computador o usuário deve descrever suas ações e as respostas
do sistema;
• Um moderador e observadores devem estar sentados atrás do usuário ou em
selas separadas em um laboratório de usabilidade;
• Para cada teste são fornecidas três tarefas específicas para serem realizadas no
site, informando ao usuário onde ir e o que devem realizar.

7. AVALIAÇÃO DE INTERFACE DE JORNAL ON-LINE

7.1 METODOLOGIA UTILIZADA NA AVALIAÇÃO DA INTERFACE DE JORNAIS ON-LINE

A proposta deste trabalho trata de avaliar problemas de usabilidade
mais freqüentemente encontrados em jornais on-line. A intenção dessa
avaliação é reconhecer problemas que afetem a usabilidade do sistema e por
conseqüência o desempenho do usuário de jornais on-line em geral, e para as
que forem passíveis de solução pelo design, propor soluções. Para tanto foi/será
usado teste com usuário “pensando em voz alta”, no qual o usuário descreve as
ações que executa no sistema, usando também do monitoramento do monitor e
mouse do usuário através de um software que grava a imagem da tela do
computador enquanto o usuário executa as tarefas, e também das expressões
do usuário por uma camera de vídeo, o que poderá apontar dificuldades
passadas pelo usuário. Esse teste possui a vantagem de ter uma experiência
direta com usuários reais, tendo resultado mais sensível à realidade do usuário,
sendo mais relevante. Baranauskas e Rocha (2003, p.203) propõem uma
estrutura como escopo para testes de uso com usuários reais, nele ah uma série
de pontos que ajudam a definir a organização e o funcionamento do teste, os
quais são usados como base deste teste de uso. Nesse esboço é proposto
basicamente delimitar qual é o objetivo do teste, quando e onde ele será
aplicado, sua duração, o que será necessário para realizar o teste (suporte
técnico), o ponto de partida do usuário no sistema, informações sobre o usuário,
como quantos usuários participarão do teste e quais requisitos mínimos são
necessários ao usuário para participar do teste, em que situação o usuário
poderá receber ajuda, e quais dados serão coletados e como serão analisados.

7.1.1 Aplicação do Teste de Uso- Plano de Teste

• Objetivo do teste

O objetivo do teste segundo Baranauskas e Rocha (2003, pg.203) é
determinado basicamente pelo o que se deseja obter com o teste, nesse caso
especifico deseja-se obter ajuda na melhoria de interfaces de jornais on-line,
avaliando pontos bons ou ruins e como o design pode ser melhorado.

• Local e data do teste

O teste pode ser feito em qualquer local com o suporte técnico necessário, o que
facilita bastante a execução, uma vez que tal suporte é de fácil acesso. No caso será
utilizado o Laboratório de Ergonomia e Usabilidade do departamento de Design
Gráfico da Universidade Estadual de Londrina, o qual possui computadores que
podem ser facilmente preparados para o teste de uso.
A data será no dia 19 de novembro de 2009, quinta feira, das 14:00 às 18:00.

• Duração de cada teste

O teste deve durar tempo suficiente para que os usuários cumpram as tarefas
determinadas, costumando durar de 1 a 3 horas (BARANAUSKAS e ROCHA, 2003,
p.204). Para execução das tarefas solicitadas nesse teste será dado até 1 hora para
cada usuário.

• Suporte técnico necessário

Será necessário para execução do teste um computador com sistema
operacional Windows XP ou equivalente, configurado na resolução de tela de
1024/768 px, tendo instalado os softwares Internet Explorer mais recente (IE8), um
programa de captura de imagem da tela do monitor do usuário, que no caso será o
AutoScreenRecorder 3.1, por ser uma versão não paga; e um programa de captura
de áudio, o qual será Audacity 1.3.8, também de licença não paga. Será necessário
além do software de captura de áudio um dispositivo que permita a captura, como
um microfone.

• Estado de início do sistema no inicio do teste

O usuário encontrará como inicio do teste a página inicial do jornal
http://www.bonde.com.br/folha/, um jornal regional de grande fluxo de leitores, o qual
foi escolhido pelas maiores chances de se achar um usuário real para o teste de
uso.
Para o teste foi escolhido um site de um jornal com um público regional bastante
considerável, a importância de um usuário com as características mínimas de um
leitor de jornal on-line se dá pelo fato de que o usuário já terá as habilidades
mínimas de navegação em um sistema semelhante ao que será testado, sendo
assim os problemas encontrados serão de fato problemas do sistema do site, e não
do sistema operacional/ manuseio do computador como um todo, como seria o caso
de um usuário que nunca teve contato com a internet, mas ainda assim, os usuários
escolhidos terão níveis de habilidade diferentes, sendo um usuário iniciante , um
médio e um experiente.

• Sobre os usuários

Define-se como número de usuários duas pessoas, seguindo recomendações de
Baranauskas e Rocha (2003, p.204) que diz que um teste piloto costuma ter de 1 a 3
usuários, neste caso serão usados 2 usuários, um com habilidade iniciante e outro
avançado na manipulação de interfaces visuais. Os mesmos precisam preencher o
requisito mínimo de ser leitor freqüente de jornais on-line, tendo o ideal de grupo de
usuários alvo, aproximando mais o teste de resultados fiéis.

• Tarefas solicitadas aos usuários

As tarefas requeridas ao usuário são tarefas contextualizadas aos exercícios
comuns de um usuário real, sendo assim, o usuário executará as tarefas com
menos dificuldade, e maior naturalidade, dando espaço aos problemas reais
encontrados no decorrer do teste. A ordem das tarefas é efetuada em dificuldade
gradativa, de modo que há conhecimento de que uma tarefa pode ser executada de
várias formas diferentes, de modo que o usuário sempre deve estar narrando o que
está fazendo, espera ou não do sistema. Entre as tarefas está solicitar que o
usuário traga dados sobre a percepção visual da página do jornal, já na página
inicial, como o tamanho da letra e se tem como alterar algo, se há alguma
dificuldade em encontrar uma informação do dia na pagina inicial. Logo após isso, é
pedido ao usuário que acesse alguma área interna especifica do jornal, fazendo com
que ele necessite sair da página inicial, e busque auxilio de alguma ferramenta,
como ferramenta de busca ou menu. Por fim será pedido ao usuário que consiga
alguma informação antiga do jornal, o qual o usuário necessite acessar um arquivo
de matérias do site, ou conseguir a informação de uma maneira indireta.

• Em que caso o usuário poderá ter ajuda durante o teste
Ao ser solicitado o experimentador deve atender ao usuário, desde que não interfira
na realização das tarefas, pois estas devem ser executadas unicamente pelo
usuário, invés disso o experimentador deve guiar o usuário para que fale
sempre, seguindo as recomendações do método “pensar em voz alta”.

• Quais dados serão coletados e como serão analisados

As informações colhidas dizem respeito a interação do usuário com o sistema,
obtidas pela captura da tela do monitor do usuário, e mesmo narradas pelo
usuário sendo gravadas para análise. Algumas medidas indicadas por
Baranauskas e Rocha (2003, p.209) para definição de dados são:

• O tempo usado pelo usuário para realizar as tarefas
• Ações do usuário obtiveram sucesso;
• Ações e errôneas, e as subseqüentes;
• Tarefas, comandos e características diferentes utilizados pelo usuário dentro
do limite de tempo, e também comandos e características nunca utilizadas;
• Se o “help” do sistema foi usado.
• Comentários dos usuários favoráveis ou não sobre o sistema e quantos
usuários disseram preferir outro sistema ao utilizado;
• Se houve desvio do objetivo da tarefa pelo usuário.

8. RESULTADOS DA AVALIAÇÃO DE USABILIDADE

Após serem feitas a avaliação de usabilidade através de dois testes deve-se
fazer a analise e apuração dos dados colhidos. No teste “pensando em voz alta”
serão analisados os quatro vídeos (um da captura da tela de cada usuário, e outro
das expressões faciais de cada usuário) e o áudio gravado da narração do teste de
cada um dos usuários. Os questionários servirão para ter visão da opinião dos
usuários sobre o uso da interface do jornal on-line, tendo entre as questões a
opinião dos usuários sobre quanto agradável acharam a interface e se acharam as
tarefas de fácil ou difícil execução.

8.1 T ESTE PENSANDO EM VOZ ALTA : A NALISE DO TESTE , DISCUSSÃO E

RESULTADOS .

• Usuário1:

o Tarefa1: Diga o que você vê na página inicial da Folha de
Londrina, descrevendo os elementos que compõem as informações,
ex: texto, imagem, etc
No primeiro minuto o usuário 1 faz a descrição do que vê na
página da Folha de Londrina, diz que vê muitos anúncios do lado direito
da página. Vê as notícias principais, rola a página para baixo, a
continuidade de anúncios de venda na lateral direita, verifica a existência
de um classificado imobiliário e de automóveis no fim da página.
Para reconhecer a página o usuário faz leitura da mesma com o
auxilio do mouse, começa pela esquerda e logo se dirige para direita e
observa os banners comerciais. Vê toda extensão da página com ajuda
da barra de rolagem, e volta ao topo onde estão os destaques, em um
fluxo de navegação bastante natural.

o Tarefa 2: Liste 3 notícias do dia encontradas na primeira página do
site da Folha de Londrina, e a que elas se referem
Tarefa 2: Em 00: 01:10 minuto a partir do início do teste o usuário
1 começa a executar a segunda tarefa, que pede que liste 3 notícias do
dia. A primeira notícia vista pelo usuário é o destaque, descreve que vê
uma foto sobre a notícia, reconhece o título dela “feito a mão” percorre um
pouco o fragmento de texto que acompanha a foto, clica no texto para
saber mais informações. Foi aberta uma nova guia, , o usuário1 clica na
nova guia e há um tempo de espera até que o usuário veja a mensagem
de pedido de login. Enquanto a aba de login é carregada a mesma volta
para página inicial sem avisar ao usuário1, o qual tem uma reação de
estranhamento, mas acaba voltando a página de login. Coloca o nome de
usuário e a senha nos respectivos campos e clica no ok, espera pelo
tempo de resposta por mais de 10 segundos, e é redirecionado
novamente para página inicial. Clica novamente na noticia destaque a
qual é aberta em uma nova guia, aguarda pela visualização da mesma,
depois percorre um pouco a página com o mouse e então começa a
leitura da notícia, lê sobre local onde o evento irá acontecer, imagens que
acompanham a notícia, e sobre os convites. A leitura foi feita de maneira
bastante objetiva, procurando apenas pelas informações gerais que
foram pedidas, sem leitura do texto todo, do forma bastante breve.
Até o momento de finalização da primeira etapa da segunda tarefa (no
tempo de 00:04:25 minutos) o usuário possui 3 abas abertas.
Para começar a segunda etapa da segunda tarefa o usuário 1 procura
uma página inicial dentre as abas que já estavam abertas, mudando de
aba e encontrando a página inicial o usuário 1 procura por uma segunda
notícia do dia, escolhe uma notícia também em destaque, somente com
texto trabalhado de forma mais evidente do que o restante das notícias,
sem imagens, clica para ver a notícia, a qual é aberta em uma nova aba,
aguarda a resposta do sistema o qual pede novamente para que o
usuário1 faça login de usuário. O usuário1 digita o e-mail e a senha
necessários para o login em seus respectivos campos, clica em “ok” para
confirmar a ação, espera a resposta do sistema e finalmente pode ver a

notícia. O usuário então lê o título do da notícia, percorre a página com o
mouse em busca de mais detalhes sobre a notícia da qual se trata de um
apagão ocorrido no mês de novembro de 2009, o usuário lê brevemente
sobre as causas do acontecimento, e verifica que há algumas opiniões de
profissionais da área. Novamente a leitura foi dinâmica e breve, lendo
apenas o que seria do seu interesse imediato, finalizando a segunda
etapa do teste aos 00:06:54 minutos.
Para começar a ultima etapa da segunda tarefa o usuário 1 procura em
uma das abas já abertas a página inicial do jornal, mas volta a aba da
ultima notícia lida (sobre o apagão) e clica no cabeçalho “folha de
londrina” o qual retorna da página interna da notícia para a página inicial,
aguarda um pouco a resposta do sistema, visualiza a página e percorre a
página inicial com o mouse atrás de uma terceira notícia. O usuário
escolhe uma notícia também das que estão listadas como destaques
gerais, mas que não é mais um destaque principal, está listada entre
outras como um destaque secundário mas logo no começo da página
inicial. O usuário clica sobre a notícia, e é direcionado diretamente para
página da notícia dessa vez, sem necessidade de login, por estar
utilizando de uma aba na qual já havia feito o login. O usuário 1 já na
página interna da notícia lê o título da mesma que fala sobre esporte e
começa a percorrer a página com o mouse a procura de mais detalhes
sobre a notícia, fala um pouco sobre a notícia e finaliza sua tarefa aos
00:08:54 minutos. Não observou a imagem que ilustra a matéria nem sua
legenda, agiu de maneira objetiva apenas buscando o essencial da
notícia. Ao finalizar a segunda tarefa o usuário1 observa que está com 4
abas abertas e decide fecha-las e deixar apenas uma.
O usuário1 possui uma habilidade com a interface já bem
desenvolvida, então costuma pedir para que as matérias abertas sejam
em abas, o que acaba por confundir o usuário algumas vezes quando as
abas começam a se acumular.
Perdeu um pouco de tempo até entender o processo de login, que não
tinha a propriedade de atualização em abas múltiplas. O login no Internet
Explorer se faz em uma página própria, o ideal é que ele fosse um

aplicativo que fosse aberto e fechado sobre a própria página como um
pop-up.
O usuário não tem usa como ponto de referencia para página
inicial o próprio cabeçalho do jornal por já ser experiente.,e as três tarefas
escolhidas estavam no campo de destaques do dia do jornal
demonstrando seu domínio sobre o a interação com a interface.

o Tarefa 3: Você provavelmente ouviu falar nos últimos meses de
uma certa redução de impostos sobre alguns produtos, o IPI.
Descubra pelo site da Folha de Londrina, o que significa essa sigla
(IPI) e informações sobre o seu funcionamento (a que produtos ele
se aplica, de quanto será essa redução, quando começou e quando
irá terminar).
Tarefa3: A terceira tarefa inicia aos 00:09:54, após ler o que foi
pedido na tarefa o usuário1 se direciona ao campo de busca direita por
palavras chaves da página interna que se encontrava aberta. No campo
de busca escreve a palavra “IPI”, clica em “OK” para confirmar a ação de
procura e aguarda a resposta do sistema. Retorna uma página de
resposta sobre a busca feita. O usuário 1 lê o que está escrito no topo da
página, o que diz : “você pesquisou por IPI. Sua busca retornou 82
ocorrência...” o usuário reage com espanto quanto ao número elevado de
ocorrências da resposta e indaga “será que eu consigo?” em um tom de
surpresa e desanimo. O usuário começa a percorrer a página, com auxilio
da barra de rolagem, e escolhe uma das notícias dadas pela resposta da
busca, observa a data da notícia, de 30/10/2009 e lê o título da mesma
“IPI incentiva a eficiência energética”, clica para abri-la sem muita certeza
de ser o que está procurando, indaga “vamos ver se me ajuda com o que
eu preciso”. Enquanto espera a notícia ser carregada em uma nova aba o
usuário1 ainda percorre um pouco mais a página de resposta de buscas
com o mouse. Quando a página da notícia é carregada o usuário 1 clica
sobre a aba da mesma para visualizar a notícia, lê novamente o título já
na página da notícia e começa a vasculhar a página por mais
informações, já no começo encontra o significado da sigla “IPI” e fala

sobre a que tipos de produtos eles seriam aplicados, no caso o usuário lê
“produtos da linha branca, ou seja, eletrodomésticos”, percorre o restante
da página a procura de maiores informações, clica sobre a aba da
resposta da busca, e clica imediatamente na aba da notícia escolhida _se
confunde um pouco entre as abas_ observa que já conseguiu metade
das informações pedidas na tarefa 3, na página da noticia aberta lê a
informação de que o “IPI foi prorrogado por mais três meses, e deduz que
seu final seria em janeiro visto que a noticia é do dia 30/10/2009.
Faltando um item para finalizar a tarefa o usuário 1 clica na aba de
resposta para procurar por outra notícia que complemente sua tarefa, vai
até o fim da página da resposta, pede para ver a segunda página da
resposta da busca direta na paginação situada na fim da página, na
segunda página da resposta da busca lê o título de uma das respostas:
“Fim do IPI eleva vendas de fogões e geladeiras”; e lê também parte do
subtítulo: “Prazo final encerra dia 31 ...”, e julga que pode conseguir a
resposta por essa notícia dizendo: “então, talvez ele me de a notícia de
quando começou isso” clicando sobre a notícia para que ela abra em uma
nova abra. O usuário1 aguarda a página carregar, faz expressões faciais
de impaciência mordendo os lábios, enquanto a nova página é carregada
o usuário1 vai até a aba da primeira notícia da terceira tarefa e procura
mais um pouco por informações. Quando a nova aba é carregada o
usuário retorna a ela e faz uma leitura rápida sobre a tela, diz não ter
encontrado a resposta naquela notícia, e fecha a aba imediatamente.
Acaba retornando a primeira notícia sobre o IPI que diz parecer mais
completa, lê mais algumas informações sobre o seu funcionamento: “o IPI
servira para beneficiar uma camada maior da população, para que
tenham acesso a esses produtos” , “60% da população não tem maquina
de lavar roupas” .
O usuário para por um momento, observa que ainda não
conseguiu saber quando foi que começou o IPI e decide voltar novamente
a página dos resultados. Na página de resultados da busca o usuário 1
clica acidentalmente em noticia que é aberta em segundo plano em uma
nova aba, e ainda na página de respostas decide ir para quinta pagina
das respostas da busca, deduzindo que a notícia de quando começou o

IPI estaria nas páginas mais antigas. Enquanto aguarda a ultima página
de busca carregar o usuário1 decide já cumprir a tarefa 4 com a primeira
notícia que ele encontrou, por estar mais completa, que se trata de enviar
a mensagem para um amigo, aos 00:18:40 minutos, abandonando na
ultima etapa a tarefa 3.
O usuário 1 já usa como recurso para encontrar a notícia pedida o
campo de busca direta por palavras chaves, se atendo as dezenas de
resultados tidos como resposta, mostra desanimo ao perceber a lista de
respostas da busca, driblando isso por métodos próprios como dedução
de em qual lugar da lista da resposta talvez estaria, mas não há nenhum
recurso do próprio sistema que auxilie na organização dessas respostas,
a ponto de desistir de encontrar um item da tarefa e partir para próxima,
demonstrando irritação e desanimo por algumas vezes durante a
execução da tarefa

o Tarefa 4. Encontrada uma matéria com essas informações,
envie a matéria para um amigo e tire uma cópia impressa para você.
Tarefa4: para executar a tarefa 4 o usuário 1 decide usar a aba da
notícia “IPI incentiva a eficiência energética” clicando sobre sua aba,
percorre então a página interna dessa notícia e verifica que há um link
“enviar por e-mail”, clica nele, o qual abre uma janela pop-up, o usuário lê
a que se referem os campos de envio “nome” “e-mail” , “e-mail de um ou
mais amigos” e “seu comentário”, indaga se o “e-mail” pedido seria o do
login, mas deduz que seria por existir o campo “e-mail de um ou mais
amigos” que seria o e-mail de destino. Preenche todos os campos, clica
sobre o “enviar”, recebe o aviso de sucesso do envio, e fecha a aba. Para
finalizar a tarefa 4 o usuário 1 precisa imprimir uma cópia da notícia,
então ele localiza o link de “versão para impressão” o qual está do lado do
“enviar por e-mail” utilizado recentemente, clica sobre o link “versão para
impressão” que é aberto em uma pop-up, localiza o botão de impressão
para confirmar a tarefa e fecha a janela pop-up, terminando a tarefa 4 aos
00:21:58 minutos.

A tarefa foi executada pelo usuário 1 sem grandes complicações,
fora a questão de termos usados para descrever os campos de entrada
de dados na janela pop-up de envio da notícia.

o Tarefa 5: Um músico que está morando na cidade de Londrina
quer concorrer no Guinness Book como o ‘baixista mais rápido do
mundo’. A folha de londrina publicou uma reportagem sobre este
músico no dia 29 de setembro de 2009, tendo como título "recorde
musical - o baixista mais rápido do Brasil". Encontre essa
reportagem e depois retorne para página inicial do jornal.
Tarefa5: aos 00:22:00 o usuário 1 começa a executar a tarefa 5,
decide que usará o campo de busca direto, na página interna da notícia
“IPI incentiva a eficiência energética” que ainda se encontra aberta. Digita
no campo de busca “recorde musical – o baixista mais rápido do Brasil”,
exatamente da maneira que havia sido passado como título da notícia na
tarefa, aguarda um tempo pela resposta do sistema fazendo expressões
faciais de impaciência. É aberta na mesma página a resposta da busca
com apenas um resultado, o qual era justamente a noticia pedida, o
usuário1 diz: “Achei! Foi direto ao ponto”, verifica a data sendo dia 29 de
setembro e que foi publicado na folha 2, depois de encontrada a notícia o
usuário 1 retorna a página inicial como é pedido na tarefa, sendo que para
isso clica sobre o cabeçalho “Folha de Londrina” que redireciona para a
página inicial, finalizando a tarefa 5 as 00:24:40 minutos.
O usuário1 utiliza novamente o campo de busca direta por
palavras chaves, usando o título da notícia e achando a matéria
imediatamente, concluindo a tarefa em 2:30 de forma eficiente. Não
repara na possibilidade do uso do campo arquivo.

o Tarefa 6: Você quer fazer um comentário à redação do jornal
Folha de Londrina, encontre o endereço, telefone, e e-mail da
redação do jornal.
Tarefa 6: terminando a tarefa 5 o usuário 1 começa imediatamente a
tarefa 6, percorre toda página inicial entre seções e texto, em busca de
um contato da folha de londrina, diz: “geralmente é aqui em baixo” e vai
até o final da página com auxilio da barra de rolagem e encontra o menu
fale conosco (o qual havia também no topo da página), clica sobre o
menu e aguarda carregar na mesma página. Visualiza a página, observa
o título do conteúdo como sendo “Expediente” e lê algumas informações:
“empresa jornalística Folha de Londrina”, “telefone da assinatura, e-mail
comercial, da redação, dos classificados”, lê o endereço “rua Piauí 241,
telefone: 3374-2020, e e-mail: editoria@folhadelondrina.com.br”
finalizando a tarefa 6 aos 00:25:38 minutos.
O usuário1 não se deu conta que o menu horizontal é espelhado,
no topo e no final da página. Se guiou pelo seu repertório e buscou um
campo que desse a resposta no fim da página onde estava acostumado a
encontrar a informação.

o Tarefa 7: Por ultimo saia da sua conta de usuário no jornal
(faça logout)
Tarefa 7: a tarefa 7 é feita a partir da própria página de Expediente,
sendo que o usuário só se dirige ao link de sair do sistema “log-off”,
terminando todas as tarefas aos 00:26:15

8.1.1 A NÁLISE S OBRE AS T AREFAS DO USUÁRIO 1:

O usuário 1 possui habilidade avançada sobre a manipulação de
interfaces digitais, passou: 26 minutos e 15 segundos para executar todas as
tarefas. Percorreu bem a página, sem desvios do objetivo pedido em cada uma
das tarefas, mas teve um pouco de problemas com o login e com o entendimento

de alguns termos, sendo que não obteve sucesso apenas em parte da terceira
tarefa, que se tratava de uma pesquisa avançada. Se guiou basicamente pelo
campo de busca por palavra chave, e pelo seu repertório. Procurava pelas
informações de maneira objetiva em uma leitura dinâmica, o que pode ser motivo
para se ter um campo com o resumo da notícia em um campo estratégico da
página de notícia em destaque, em geral não via os títulos nem imagens, apenas
buscava as informações, provavelmente pela disposição e trabalho gráfico deles.
Teve um uso razoável, mas poderia ser melhor com alguns recursos de auxilio de
busca, melhores termos nos campos de dados, login e parte gráfica do texto e
imagens melhor trabalhados, não existe help no sistema.

• Usuário 2:

o Tarefa 1: Diga o que você vê na página inicial da Folha de
Londrina, descrevendo os elementos que compõem as informações,
ex: texto, imagem, etc
Tarefa1: O usuário 2 começa a primeira tarefa lendo o enunciado
da mesma com atenção, observa um pouco a página inicial do jornal,
exclama : “estou estranhando aqui”, o primeiro local onde o usuário 2 se
dirige com o mouse é sobre as publicidades, que são vídeos animados na
borda direita, fica por vários minutos percorrendo a página inicial com o
mouse, sobre os textos, usa a barra de rolagem para ver o restante da
página, e continua sua leitura com o auxilio do mouse, passa por um
momento sobre o menu de seções lateral esquerdo, volta ao conteúdo e
começa a falar sobre o que vê na página inicial: “na primeira página a
gente vê um resumo do que estaria no jornal todo, praticamente é isso” e
parte já para segunda tarefa aos 00:02:35 minutos.
O usuário2 responde mais aos estímulos visuais, até porque sua
referencia de é pequena por ser um usuário iniciante, não é estranho
então que o primeiro local para onde o usuário se dirige ser o local onde
se encontra as publicidades animadas, com cores fortes, e movimento,
catalisando muita atenção, e competindo com o restante das informações

do conteúdo do jornal. Também pela falta de hábito o usuário se sente
bombardeado por informações, como se palavras e cores estivessem
desordenadas sobre a tela, o recurso que o usuário inicial usa é a leitura
de cada um dos itens percebidos pelo mouse, reconhecendo imagens,
títulos e corpos de texto.

o Tarefa 2: Liste 3 notícias do dia encontradas na primeira página
do site da Folha de Londrina, e a que elas se referem
Tarefa2: O usuário 2 inicia a segunda tarefa lendo em voz alta o
enunciado da tarefa percorre mais um pouco a página com o mouse,
estando no meio do comprimento total da página, observa por um tempo
uma imagem miniatura da capa do jornal impresso do dia, sobe até o topo
da página e a desce fazendo a leitura dos fragmentos de texto com a
ajuda do mouse, pára alguns instantes sobre uma publicidade animada
(banner) que ocupa o meio do conteúdo da página inicial, desce um
pouco mais, e para sobre uma notícia da seção da página dois, localizada
quase ao fim da página inicial, clica sobre ela e começa a ser carregada
uma nova página, e então ela visualiza uma página de login e diz:
“cadastrado, digitar a senha”, fica por alguns instantes mexendo com o
mouse sobre a tela de login, a procura de um campo para digitar a senha,
tenta clicar sobre o título “sou cadastrado” na tentativa de surgir algo ou
ser redirecionado para algum lugar. Localiza logo abaixo o texto “quero
me cadastrar” passo o mouse sobre e ele e verifica que se trata de um
link, clica sobre ele e é redirecionado para página de cadastro de usuário.
Volta a página anterior (a de login) com ajuda do botão voltar do próprio
navegador Internet Explorer. De volta a página de login encontra no topo
da página os campos de login e senha, os quais não estão anexos ao
conteúdo principal da página de login. Digita o email e a senha em seus
respectivos campos de login, clica em “OK” para confirmar a ação e
finalmente é carregada a página interna da notícia selecionada pela
página inicial. Assim que consegue visualizar a página (aos 00:06:10
minutos) o usuário 2 começa a falar sobre a notícia “ a primeira notícia
que eu selecionei foi da Folha Dois”, percorrendo um pouco a folha com
o mouse, até o fim dela, e voltando ao topo, o usuário clica em buscar do

campo de busca direita e é redirecionado para página de resposta de
busca, verifica um pouco a página de resposta, percorre o menu lateral
direito no campo de “Editorias”, clica sobre o menu “Opinião da Folha”, e
é direcionada para página de listagem de notícias da “Folha Opinião”,
enquanto busca por uma nova notícia faz expressões faciais de
impaciência, torce o nariz, bate as unhas sobre a mesa algumas vezes, e
então clica na primeira notícia da lista da “Folha Opinião” (aos 00:08:32
minutos), e aguarda carregar a nova página para qual foi direcionado.
Visualizando a página o usuário 2 lê o titulo: “ é uma reportagem sobre a
inclusão não pode focar deficiência”, gagueja um pouco na leitura do
título, lê mais um pouco e diz: “Achei, ta aqui, trata-se de uma reportagem
sobre a inclusão de crianças especiais, que é um processo complicado”
percorre um pouco mais a página, indo até o fim da mesma e voltando ao
topo. Ao chegar ao topo recorre imediatamente ao menu lateral esquerdo
de “editorias”, clicando logo em sua primeira opção e diz “vou ler uma
sobre política agora” clicando sobre a opção “Política” do menu aos
00:10:20 minutos, aguarda um pouco e diz: “muito demorado”, ao
visualizar a página “Folha Política” exclama : “deu Folha dois, que tinha
pego antes”, confundindo a folha de política com a Folha dois que já tinha
havia visto anteriormente, recorre novamente ao menu lateral, percorre
ele debaixo para cima a procura da seção “política” e volta a clicar nela
mesmo a seção estando selecionada já. Retornando a página de seção
“política” o usuário 2 continua confuso, percorre um pouco a tela no
sentido de baixo para cima e clica sobre o cabeçalho “Folha de Londrina”
o que o leva de volta a página inicial. Na página inicial o usuário 2
percorre a página no sentido de cima para baixo, parando na parte de
seções do conteúdo, seleciona uma das notícias, clica sobre ela, aguarda
um pouco até a nova página interna ser carregada lendo o subtítulo da
notícia “Prefeitura tenta regulamentar incentivos”, “vamos ver do que se
trata o assunto”. Já na nova página interna da notícia ela começa a ler um
pouco da notícia, a começar pelo título (aos 00:12:10 minutos) “Prefeitura
tenta regulamentar incentivos” , “A prefeitura de Londrina encaminhará ...
projetos.. vereadores... solicitando... pagamento dos incentivos dos
médicos plantonistas...” não da forma que está escrito, mas saltando

palavras e lendo apenas o que o interessa, terminando a tarefa aos
00:12:35 minutos. Se dirige então o botão voltar do navegador Internet
Explorer, mas clica fora da área de ação, move um pouco o mouse
enquanto aguarda alguma resposta do sistema, e começa a ler o
enunciado da terceira tarefa.
O usuário 2 se atém mais as notícias localizadas nas seções da
parte de baixo da página, que aparecem com títulos mais visíveis e
menos textos explicativos, além de ter sempre uma imagem ilustrativa
junto as manchetes. Ao chegar ao login se atrapalha um pouco, o mesmo
não é mostrado da mesma maneira que foi para o usuário 1, (ver figura),
não tem um campo de inserção de dados na área que existe a explicação
sobre o login, ou seja, tem dois tipos de login, mas não mostra uma lógica
ou padrão para uso dele. O usuário 2 consegue fazer o login depois de
algumas tentativas. Mesmo a matéria tendo um tíulo e subtítulo o usuário
necessita ainda de uma área no texto com resumo do texto para que o
usuário tenha certeza já a principio de que a matéria que está lendo é a
matéria que ele procura, para que a leitura deixe de ser cansativa. O
usuário 2 usa também várias vezes como recurso o menu lateral de
seções para se guiar, evitando assim que tenha que voltar a página
inicial. Por algumas vezes o usuário não percebe a imagem ou lê a
legenda dela. Sobre o cabeçalho de seção o usuário 2 acaba não
percebendo que a seção havia mudado, pelos cabeçalhos serem muito
semelhantes e as designações das seções não estarem na evidencia
necessária, como se estivesse sido colocada em segundo plano pelo
palavra “FOLHA” que a acompanha.

o Tarefa 3: Você provavelmente ouviu falar nos últimos meses de
uma certa redução de impostos sobre alguns produtos, o IPI.
Descubra pelo site da Folha de Londrina, o que significa essa sigla
(IPI) e informações sobre o seu funcionamento (a que produtos ele
se aplica, de quanto será essa redução, quando começou e quando
irá terminar).
Tarefa 3: O usuário lê o enunciado da tarefa 3 e aos 00:13:32
minutos se dirige com o auxilio do mouse ao campo de busca direito por

palavras chave dizendo “buscar aqui o que significa IPI”, lá digita: “IPI” e
clica em “Buscar” para confirmar a ação, depois diz “deve ser por aqui”.
Logo depois o usuário 2 vai ao menu horizontal superior e clica em
“Inicio”, enquanto aguarda a resposta o usuário mostra por diversas vezes
sinais de irritação e impaciência, fazendo expressões faciais com o a
boca, coçando a cabeça. Ao visualizar a página inicial o usuário mostra
sinais de estranhamento, franzindo a testa, começa a percorrer a página
inicial, e clica algumas vezes em falso, e é redirecionada para uma
página, observando isso retorna a página inicial através do botão voltar do
navegador Internet Explorer, clicando diversas vezes. Na página inicial se
encaminha novamente ao campo de busca e digita “IPI”, clica em “buscar”
e é direcionada para página de resposta da busca. Na página interna de
resposta da busca por palavra chave, ela move um pouco o mouse
reconhecendo o conteúdo da página, lê a página a partir do título:
“Busca”, “você pesquisou IPI. Sua busca retornou 82 ocorrência. Você
deseja buscar...” e observa o link “CENTRAL DE BUSCAS” que vem a
seguir e clica sobre ele. A partir do link é aberta uma janela pop-up com
uma busca avançada, o usuário2 lê novamente o enunciado da tarefa e
diz: “eu acho que não é por aqui, mas..” identifica o campo “Palavra-
chave”, escreve nele “significado palavra IPI” e clica logo em “pesquisar”
para confirmar a ação, então é aberto pelo sistema uma nova janela de
navegador, e o usuário 2 mostra uma expressão de surpresa com a
abertura de uma nova janela, a qual não traz nenhum resultado. O
usuário 2 move o mouse sobre o texto da resposta da busca e decide
fazer mais uma busca no campo de busca que a página retornou
digitando “IPI” e clicando em “pesquisar”, a pagina então aberta é uma
página de resposta de busca geral do portal “O Bonde” que possui a
Folha de Londrina como um de seus parceiros, a resposta dessa busca
mostra resultados de várias páginas da internet e não apenas da Folha de
Londrina.
Aos 00:20:19 minutos o usuário lê na resposta da página de
buscas geral: “Achei aqui! Imposto sobre produto industrializado”
continuando sua pesquisa o usuário 2 faz outra busca usando do campo
de pesquisa da própria página de resposta da busca geral, digitando no

campo “IPI-FUNCIONAMENTO” e clica em pesquisar e recebe uma nova
página de resposta, lê brevemente o enunciado da primeira noticia da lista
e clica sobre ela e é redirecionado para uma página fora do portal do “O
Bonde” (www.portaltributario.com.br) e faz a leitura dinâmica com auxilio
do mouse, o texto que corresponde a resposta de sua busca: “Achei
aqui... imposto...produtos industrializados... nacionais... campo de
incidência abrange ...produtos com alíquota ... zero...na tabela....Bom
achei aqui... se aplica” saltando algumas palavras, percorre o restante da
página com auxilio da barra de rolagem, depois de atingir o final volta ao
topo e se dirige ao botão voltar do navegador.
Voltando a página de resposta da busca geral o usuário 2
percorre um pouco da página em busca de mais informações, mas logo
volta ao campo de busca geral, e digita “IPI-A QUE SE APLICA- PRAZO”
e clica em pesquisar, com a demora na resposta do sistema clica em
pesquisar novamente. É retornada uma lista de respostas e o usuário 2
fica atento a uma lista de notícias na lateral direita que estão em destaque
(são anúncios google) clica sobre o quarto deles, com a demora para a
resposta clica mais algumas vezes sobre o anúncio. É redirecionado para
uma loja on-line (www.submarino.com), percorre com o mouse todo o
comprimento dela, exclama “Nada haver” e clica no botão voltar do
navegador Internet Explorer.
Retorna a página de busca geral, percorre um pouco as respostas
da busca geral, clica novamente em pesquisar, clica sobre a resposta que
já havia visto anteriormente (do portal tributário), percorre mais um pouco
a página da notícia. Vendo a dificuldade em executar a tarefa eu me
reporto ao usuário 2 e pergunto (aos 00:27:00): “o que você achou?” e o
usuário responde: “Ai.. realmente aqui eu sinto meio complicado, porque
eu não tenho muita... eu não domino muito bem, está difícil de achar
aqui”, “eu estou perdida aqui”, e faz expressões faciais, como não com a
cabeça e suspira, em um tom de cansaço. Diz ainda “estou tentando
achar aqui informações sobre seu funcionamento, a que se aplica e de
quando será essa redução, quando começou e quando irá terminar.”,
“voltei aqui”, “eu acho que estou no caminho errado, mas vamos lá”,
percorre mais um pouco a página do portal tributário que não é vinculado

ao jornal, e acaba por ir ao botão voltar do navegador Internet Explorer, e
logo em seguida fecha essa janela pela opção fechar do navegador. É
visualizado então uma outra janela que já estava aberta em segundo
plano, a qual ainda continha o pop-up da central de ajudas aberto, o
usuário 2 fecha a janela pop-up, deixando aberto em primeiro plano
somente a pagina de resposta de busca da Folha de Londrina que já
estava ali anteriormente. O usuário 2 percorre as respostas dadas pela
busca e escolhe uma para ler (aos 00:28:55 minutos): “com a redução do
IPI prorrogado, o governo esta incentivando produtos que gastam menos
energia...” percore um pouco mais a página de resposta da busca e diz”
tem bastante coisa aqui, deixa eu ver”, voltando logo a notícia que havia
acabado de ler, clicando sobre ela para abrir a notícia, ao vizualizar a
nova página o usuário2 começa a ler “folha do dia 06 do 11... Com a
redução do IPI prorrogada...” , “deixa eu ver o que eu vou fazer”, então o
usuário percorre a toda a extensão da noticia brevemente, clica em falso
algumas vezes em diversas áreas, faz expressão facial de desanimo, e
vai até o final da página onde encontra uma área de “outras notícias desta
editoria”, move o mouse sobre os links que estão listados ali e clica em
um chamado “MERCADO FINANCEIRO”. Quando abre a nova página o
usuário diz “vou voltar na página inicial, e enquanto o usuário2 aguarda a
página carregar ele comenta “o outro item 3 e 4, realmente não estou
conseguindo, estou desistindo, voltar para página inicial e vamos ver” se
referindo ao restante da tarefa aos 00:32:15 minutos, e começa a ler a
próxima a tarefa em voz alta.
A primeira opção que o usuário2 usou foi ir diretamente ao campo
de busca por palavras chaves, sem muita certeza do que estava fazendo,
e ao ver o volume alto de resultados procura por ajuda na central de
buscas, acaba por cair em uma página que oferece busca pelo portal do
O Bonde e a partir de então começa uma jornada em busca da
informação já fora do jornal de londrina, o tempo todo sem saber bem
onde estava, se sentiu muito confusa, não consegui completar a tarefa,
não tinha o feedback necessário, faltou sinalização e explicação de como
utilizar as ferramentas. O usuário abandona as tarefas e se sente
desencorajado ao executar as próximas

o Tarefa 4: Encontrada uma matéria com essas informações,
envie a matéria para um amigo e tire uma cópia impressa para você.
O usuário não tenta executar a tarefa devido a falta de dados
necessários da tarefa anterior

o Tarefa 5: Um músico que está morando na cidade de Londrina
quer concorrer no Guinness Book como o ‘baixista mais rápido do
mundo’. A folha de londrina publicou uma reportagem sobre este
músico no dia 29 de setembro de 2009, tendo como título "recorde
musical - o baixista mais rápido do Brasil". Encontre essa
reportagem e depois retorne para página inicial do jornal.
Tarefa 5: depois de ler o enunciado da tarefa 5, já na página
inicial o usuário2 dirige o mouse diretamente ao menu horizontal no topo
da página clicando sobre “Arquivo da Folha”, onde é redirecionado para
uma página de busca específica no arquivo da Folha, no calendário
mostrado no arquivo o usuário inicial clica no menu drop-down de meses
para mudar o mês de novembro para setembro, após o calendário mudar
de mês o usuário 2 clica sobre o dia 29 de setembro, sendo redirecionado
para a página com uma lista notícias desse dia. O usuário 2 percorre a
página dessa lista a em busca da notícia pedida, chegando seção da
folha 2 ela percorre a área mais devagar e acha a notícia e diz: “Record
musical ... o baixista mais rápido, achei! Vamos lá” e clica na reportagem.
A página da notícia é aberta e o usuário2 diz: “essa foi mais fácil”, “ok,
vamos voltar ao inicío”. Nesse momento o usuário clica algumas vezes
em falso com o botão direito do mouse, e diz ainda “para quem não sabe
é muito complicado” clica em falso mais uma vez dessa vez no menu
horizontal do topo sobre o “fale conosco” e é redirecionado para essa
página, e diz enquanto percorre a página em busca de algo que o leve
para página inicial: “estou tentando voltar para página inicial, mas
está.....ok, voltei a página inicial” e clica sobre “Inicio” no menu horizontal
do fim da página, aos 00:37:54 minutos o usuário 2 finaliza a tarefa 5.
Como o usuário2 precisou percorrer por maior tempo a tela e com
mais atenção do que o usuário1 que possui um domínio mais avançado

sobre interfaces, ele reconheceu alguns campos que o usuário1 não havia
nem percebido, logo o usuário 2 faz uso de mais ferramentas, como o uso
do menu lateral esquerdo, ou mesmo do arquivo da Folha de Londrina
como foi no caso da execução dessa tarefa, mas ainda assim ele se
atrapalha um pouco no uso, pela falta de uma ordem lógica de execução
na ferramenta ou mesmo de uma explicação de uso breve nela. O
cansaço e a confusão visual fazem com que mesmo depois dele executar
a tarefa acabe indo para uma página que ele não planejava.

o Tarefa 6: Você quer fazer um comentário à redação do jornal
Folha de Londrina, encontre o endereço, telefone, e e-mail da
redação do jornal.
Tarefa 6: O usuário2 lê o enunciado da tarefa 6, percorre a página
em busca da informação pedida, por algumas vezes passa pelo menu
lateral esquerdo, passa o mouse sobre o menu drop-down do “O Bonde”
no topo da página e diz e aos 00:38:08 minutos diz“Humm... comercial,
fale conosco, deve ser esse, vou tentar aqui” , “vou ver se vai dar certo”, o
usuário 2 passa o mouse sobre o “fale conosco mas não clica” então
vasculha o restante da página atrás de um local que satisfaça essas
informações, volta ao menu superior horizontal e clica no fale conosco,
enquanto aguarda a página carregar diz : “é...não estou conseguindo
achar, vou ficar devendo”, “é.. não tenho paciência não” a página é
visualizada, o usuário2 percorre a página com o mouse por alguns
minutos, sobe até a barra de endereço do navegador, verifica os
endereços, percorre um pouco mais a página de expediente, até
encontrar a redação, passa o mouse sobre o link do e-mail da redação,
clica sobre ele duas vezes, esperando uma resposta do sistema o qual
abre uma janela de email pop-up que é fechada logo em seguida, diz:
“consegui achar telefone, endereço da redação, mas não conseguir
entrar, mas achei” , finalizando a tarefa aos 00:45:43 minutos.
O usuário2 acha com facilidade o local, mas não consegue
perceber as informações pedidas, mesmo elas estando visíveis, um

melhor trabalho gráfico na disposição delas pode ajudar a resolver o
problema.

o Tarefa 7: Por ultimo saia da sua conta de usuário no jornal
(faça logout)
Tarefa 7: o usuário 2 lê em voz alta o enunciado da tarefa 7, e diz:
“agora danou-se”, dá alguns cliques com o botão direito do mouse na
própria página de expediente que se encontrava aberta, verifica a caixa
de dialogo aberta, da alguns clique com o botão esquerdo do mouse,
aguarda resposta do sitema, expressa impaciência, diz: “realmente é
muito complicado.. não tenho paciência para isso não, muito difícil de
achar, muito complicado, pensei que fosse mais fácil, mas olha, se
depender de achar alguma coisa aqui eu desisto logo... aí, não fecha, não
dá certo”, “perai, achei aqui, logof... logoff, vamos lá, ok,”, “voltei a página
inicial.. perdidinha aqui, não sei...” , sem saber ao certo se havia saído do
sistema, diz ainda: “terminei com negação pelo jeito, por que eu desisto”,
aos 00:50:35 o usuário 2 finaliza o teste.

8.1.2 A NÁLISE S OBRE AS T AREFAS DO USUÁRIO 2:

O usuário 2 levou 50 minutos e 35 segundos para finalizar o teste de uso
“pensando em voz alta”, apresentou por diversas vezes sinais de estresses e
cansaço. Sendo um usuário iniciante ainda não está familiarizado com alguns
aspectos de uma interface digital, como a função de fazer cadastro, entrar e sair de
um sistema, também não conhece as terminologias que costumam ser usadas,
como no caso log-off ou log-out. Ele cumpre a tarefa por dedução, mas não tem
certeza de ter saído do sistema, o que seria facilmente resolvido com uma resposta
do sistema de conclusão da ação por uma caixa de dialogo, ou um “help” cedido
pelo sistema, o que não acontece. O usuário 2 esteve por algumas vezes perdido, e
acabou se desviando do objetivo das tarefas a ponto de não completar algumas.

Q UESTIONÁRIO PAR A TESTE DE USO : APURAÇÃO DE RESPOSTAS DO USUÁRIO 1 E DO

USUÁRIO 2

Figura1: respostas dos usuários 1 e 2 para o questionário sobre uso da interface visual da Folha de
Londrina on-line

Aqui um gráfico de comparação de dificuldade de uso entre o usuário 1 e o usuário
2, tendo como base a primeira pergunta do questionário para teste de
uso:

Figura2: Gráfico comparativo de dificuldade no uso da interface visual do site Folha de Londrina

Aqui um gráfico sobre o quão agradável o usuário 1 e o usuário 2 acharam as
páginas do jornal de londrina.

Figura3: Gráfico sobre o quão agradável o usuário 1 e o usuário 2 acharam as páginas do site Folha
de Londrina

8.3 GERAÇÃO DE RESULTADOS FINAIS SOBRE A APURAÇÃO DA AVALIAÇÃO DE

USABILIDADE

A partir da discussão feita a partir dos dados apresentados nos resultados da
avaliação de usabilidade é possível propor uma série de soluções gráficas para as questões
encontradas. Para ter base visual comparativa entre as soluções e a atual interface visual do
site Folha de Londrina, serão apresentadas aqui as principais páginas do sistema:

Página inicial:

Figura4: Primeira página do jornal on-line Folha de Londrina (1024/768px)

Figura5: Primeira página do jornal on-line Folha de Londrina, em todo seu comprimento (1024/900px)

Páginas internas:

Figura6: Página interna de seção do jornal on-line Folha de Londrina (1024/768px)

Figura7:Página interna de notícia do jornal on-line Folha de Londrina (1024/768px)

Figura8: Página interna de notícia do jornal on-line Folha de Londrina, em todo seu comprimento
(1024/ 1270px)

Figura9: Detalhe da página interna de notícia do jornal on-line Folha de Londrina, notícias
relacionadas e opção de escrever comentário pelo usuário.

Figura10: Página interna de busca do jornal on-line Folha de Londrina (1024/768px)

Login:

Figura11: Login apresentado ao usuário 1

Este login aparece para o usuário 1 quando o mesmo tenta acessar qualquer
primeira notícia, estando no formato pop-up, a qual trava a interface abaixo da janela
pop-up impedindo que o usuário execute alguma ação na página do jornal enquanto
não fizer login.

Figura12: Login apresentado ao usuário 2

Este login aparece para o usuário 2 quando o mesmo tenta acessar qualquer
primeira notícia, direcionando o usuário para uma outra página fora da Folha de
Londrina (na página do portal do O Bonde). Nele é dito os passos que o usuário
deve executar para fazer login, mas não apresenta nele campos para preenchimento
para ser feito login, e também um texto longo para ser explicativo, o que acaba
sendo cansativo.
Também se tem como fundamentação de como é o planejamento feito
para o site da Folha de Londrina uma visita feita a Folha de Londrina, a qual
rendeu uma entrevista com o editor de conteúdo do portal digital “O Bonde”.

8.3.1 V ISITA A F OLHA DE L ONDRINA

Motiviação: A visita ao jornal Folha de Londrina pretende entender como é o
processo de criação, como é pensada a página, como usuário é considerado, como
é feito o processo de adaptação da idéia inicial do jornal on-line para as
necessidades do usuário. Para tanto são tomados como referencias o seguintes
pontos:

• Como é preparado o ambiente virtual para o leitor de jornal on-line?
• Qual é o processo de criação e disposição dos elementos, como
categorizações, como são utilizados os elementos gráficos como imagens,
fontes, etc?
• Como é pensada a usabilidade dentro de um jornal on-line?
• São feitas avaliações de usabilidade nas páginas do jornal?

8.3.1.1 Entrevista com editor de conteúdo da Folha de Londrina Marco
Feltrin

A Folha de Londrina produz duas edições separadas, a impressa e a virtual,
sendo que a virtual se torna mais dinâmica, com possibilidades de atualizações mais
imediatas do que na impressa. A produção do site passa pelo portal “O Bonde”, o
qual agrega outros parceiros e é atualizado constantemente, como no caso do “Bond
News” no qual as notícias são atualizadas de hora em hora.
A versão digital da Folha de Londrina passou por um processo de re-design
recentemente, a cerca de um ano e meio, partindo da idéia de despoluir o site já
existente. O processo de criação diária do site no jornal começa ao receber a
notícia, então ela é vinculada a uma categoria e lançada ou não na página inicial de
acordo com o abastecimento de noticias. Quanto ao design o departamento de
marketing fica responsável por gerar as diretrizes do que deverá ser feito, sendo que
as propostas devem passar pela aprovação da redação, e a partir daí ser feitos
testes internos. Para o re-design a Folha de Londrina pensou na idéia de “ir além da
manchete”, apostando na diferente que a imagem pode fazer, valorizando mais ela.
Em questão de acompanhamento sobre a usabilidade do jornal digital, o
editor de conteúdo Marco Feltrin contou que não são feitas avaliações e que para
saber como o leitor está recebendo o site da Folha, e se está havendo aceitação ou
não, é somente por teste e erro mesmo, e verificando os page-views.

E LABORAÇÃO D AS S OLUÇÕES G RÁFICAS PARA O S ITE F OLHA DE L ONDRINA

Tendo como apoio toda a fundamentação teórica levantada neste trabalho,
mais os testes de usabilidade feitos, que guia o que deve ser repensado no site, e a
opinião de um profissional da área, responsável pelo conteúdo do site pode-se gerar
algumas soluções gráficas para a melhoria de uso da interface visual da Folha de
Londrina. Foi pensada uma estrutura que poderia ser dividida proporcionalmente as
dimensões da página da Folha de Londrina on-line, de visualização em resolução de

1024/768 pixels, a qual seria a mais utilizada atualmente segundo o instituto ‘net
applications’, especializado em pesquisas sobre internet:

Figura13: Resoluções mais usadas no mês de novembro de 2009 segundo net applications
Fonte: (net applications) http://marketshare.hitslink.com/report.aspx?qprid=17

O grid usado se faz sobre a largura de 975 px, para ter uma área de
respiro segura nas laterais, dividindo a largura em 6 colunas, com espaço entre
colunas correspondente a 5% da largura total, e a altura divida em 5 linhas
dentro dos primeiros 650 px de altura da página (limite para barra de rolagem).
Para montagem de todas as páginas, tanto a inicial, quanto as internas é usado
esse grid como base de calculo para o espaço. O numero de publicidades foi
drasticamente reduzido, sendo que na página inicial havia de 6 a 8 publicidades,
sendo o primeiro lugar o qual o usuário se direcionava, competindo
abusivamente com as notícias veiculadas no jornal on-line. Outra questão sobre
as publicidades é que por vezes o tema da publicidade não condiz com a página
que ela se encontra, se tornando pouco relevante para o público que a veria,
sendo assim, as publicidades foram trocadas por um numero menor, em lugares
estratégicos, e de acordo com o tema de cada página, a tornando mais relevante
e com maior possibilidade de serem acessadas.
A seguir uma lista de imagens contendo o planejamento de composição
visual mais adequada segundo indicações de usabilidade das principais páginas
do site da Folha de Londrina, acompanhados de seus grids:

Figura 14: solução para página inicial Folha de Londrina

Aproveitando a intenção da edição da equipe do “O Bonde”, responsável
pelo site da Folha de Londrina, de usar mais do poder da imagem no site, a
primeira página foi pensada de modo a colocar as imagens que acompanham a
notícia em evidencia. Nos primeiros 600 pixels de altura as imagens são
maiores, sendo que a notícia principal ocupa 4 das 6 colunas de largura do grid,
e a imagem que a acompanha 2 dessas 4 colunas. Os destaques secundários
ocupam metade colunas de largura do destaque principal (2 colunas de largura
total), e o restante das notícias ocupam 1 coluna de largura.

Figura 15: solução para página inicial Folha de Londrina – grid

Login: Esta solução foi pensada para evitar problemas de
redirecionamento para páginas externas ao jornal quando é feito o login, assim o
usuário deve se cadastrar ou preencher os dados de seu login se já for
cadastrado. A caixa de login foi reelaborada, tornando o login mais direto e
menos cansativo. Esta caixa pop-up é ativada na primeira tentativa do usuário
ler qualquer notícia

Figura 16: solução para primeira tentativa de login Folha de Londrina

Login no cabeçalho: além da opção pop-up automática que é direcionada
para usuários inicantes, é necessário ter uma versão mais direta para usuários mais
avançados, para tanto foi colocado no cabeçalho um link com a opção
cadastrar/entrar, sendo que clicando em entrar é ativada uma caixa de dialogo
estilizada para login.

Figura 17: solução para Login Folha de Londrina

Usuário logado: Neste caso observa-se como seria quando o usuário
estiver logado.

Figura 18: solução para login Folha de Londrina – usuário logado

Log-out (sair) no cabeçalho: o log-out também foi localizado no
cabeçalho, sendo que foi mudada a palavra “logo out” por sair, para facilitar o
reconhecimento para usuários inciantes. Também é importante destacar que
quando se posiciona o mouse sobre o link sair aparece uma mensagem
perguntando se o usuário deseja sair do sitema.

Figura 19: solução log-out Folha de Londrina

O cabeçalho foi todo repensado para suportar essas funções, tendo a
logo da Folha de Londrina reposicionada em um ponto mais evidente, podendo
se tornar referencia de retorno para página inicial por ficar mais visível. Também
foram posicionadas ao cabeçalho de forma discreta as opções de login e a de
busca, sendo todas essas funções essenciais para o usuário, posicionadas em
um mesmo lugar.
Após ser feito o logo ut do sistema é importante ter uma confirmação de
que se saiu do sistema, o que foi feito através dessa caixa de dialogo.

Figura 20: Aviso de log-out feito com sucesso

Menu: O menu original era posicionado verticalmente na lateral direita,
nesta proposta ele foi repensado e colocado na horizontal logo abaixo do
cabeçalho, agregando mais uma função a ele e liberando o espaço lateral (mais
de 100 px) que poderá ser melhor aproveitado com notícias.

Figura 21: solução para opções de menu Folha de Londrina

Figura 22: solução para página interna Folha de Londrina – resposta de busca

Para criar uma continuidade visual entre as páginas internas as páginas
começam logo abaixo do cabeçalho indicando onde os usuários se encontram, no
caso “buscas”. Também com idéia de continuidade as duas ultimas colunas direita
sempre são ocupadas de maneira a desempenhar alguma função auxiliar a página
interna, no caso da página interna de resposta de busca esse espaço direito foi
ocupado por uma ferramenta de pesquisa do arquivo da Folha de Londrina, para
auxiliar nas buscas. Na listagem das respostas da busca a estrutura se faz por:
categoria, sempre mais destacada, data, título (todo em negrito e em tamanho
maior, em uma linha), e uma introdução do texto em uma linha, sendo que a lista
está numerada para usuário se guiar com maior certeza de onde está.

Figura 23: solução para página interna Folha de Londrina – resposta de busca - grid

Figura 24: solução para página interna Folha de Londrina – índice de seção

Continuando a idéia da lateral direita funcional, neste caso a duas ultimas
colunas são destinadas aos destaques dessa seção, com miniaturas das imagens
que as acompanham. Nos primeiros 400 px de altura tem-se uma notícia como

destaque principal da seção, com uma imagem ocupando até 3 colunas de largura,
orientada da lateral esquerda para o centro, e da lateral direita para o centro
ocupando outras 3 colunas o título da notícia todo em negrito e em tamanho maior e
em negrito, a data, e uma descrição da notícia também em negrito. A lista de índice
da seção ocupa 4 colunas, e as notícias estão dispostas em ordem cronológica,
apresentando primeiro a data, o titulo em destaque em uma linha e uma descrição
da notícia em uma linha.

Figura 25: solução para página interna Folha de Londrina – índice de seção – grid

Figura 26: solução para página interna Folha de Londrina – página da notícia

A lateral direita da página da notícia possui ferramentas importantes,
como a versão para impressão, tamanho de texto, enviar por e-mail, a opção de
o usuário deixar uma opinião sobre a matéria. Além disso, tem uma série de
links que relaciona a matéria exposta a uma série de links de outras matérias
relacionadas, auxiliando o usuário a numa navegação mais fluida. Quando a
notícia possui imagem esta ocupara as 2 primeiras colunas das esquerda de
largura, seguida por duas colunas com o autor, título em destaque em até duas
linhas, data da publicação da notícia e um resumo em destaque em uma letra
menor do que a do título. Essas informações ocuparão aproximadamente 500 px
de altura, e serão responsáveis por dar a primeira impressão da notícia para
usuário, sendo que essa estrutura auxilia a leitura de um usuário com uma
leitura mais dinâmica como é no caso da internet.
O texto corrido da notícia terá corpo 12pt em verdana regular, entre
linhas 20pt, sendo que a cada 6 linhas no máximo deverá ter uma quebra
pulando uma linha para que a leitura não seja exaustiva, ocupando 4 das 6
colunas de largura.

Figura 27: solução para página interna Folha de Londrina – página da notícia – grid

9. CONCLUSÃO

Os resultados gerados neste projeto tornam visíveis a premissa inicial que o
justifica: “o design gráfico é uma ferramenta importante na melhoria da usabilidade
de um site com grande fluxo de informação [...]”, visto na página 4 deste mesmo
trabalho.
Por meio do design gráfico criaram-se soluções como quanto à ordenação
das informações, segmentando de maneira mais natural possível as notícias
passadas logo na primeira página do jornal on-line em blocos temáticos.
Junto a isso foram criados níveis de prioridade para as notícias, sendo que
as mais relevantes para cada página eram trabalhadas de maneira a evidenciá-las
visualmente, seja por sua disposição na página ou pelo tamanho da imagem ou do
título que a acompanhava criando uma hierarquia entre as informações e guiando a
leitura do usuário pelo jornal on-line.
A diagramação das páginas propõe um grid que dosa a informação para o
usuário e que também cria uma continuidade visual entre as páginas, o que não
havia anteriormente, tudo com a intenção de melhorar a usabilidade do jornal on-line
Folha de Londrina tendo como base essencial às indicações do que deveria ser
mudado através dos testes com usuários.
Todavia, mesmo afirmando o sucesso dessa premissa, este projeto não é
algo definitivo, pois qualquer trabalho que visa melhoria de qualidade (qualidade de
uso nesse caso) sempre está em constante desenvolvimento.

REFERENCIA BIBLIOGRÁFICA:

AGNER, L. C., MORAES, A. Design centrado no usuário e dialogo clientes-
organizações através de Interface na web. Disponível em:<
http://www.senac.br/BTS/281/boltec281c.htm> acesso em: abr. 2009.

ANDRADE, Antonio Luis Lordelo. Usabilidade de interfaces web: avaliação
heurística no jornalismo online. Rio de Janeiro: e-papers, 2007.

BACELAR, Jorge. Apontamentos sobre a história e desenvolvimento da
impressão. Disponível em: < http://www.bocc.ubi.pt/_esp/autor.php?codautor=3>.
1999

BARANAUSKAS, M. C. C , ROCHA, H. V. Design e avaliação de interfaces
Humano-computador. Campinas, SP: Nied/Unicamp. 2003.

BARROS, V. T. O. Avaliação da interface de um aplicativo computacional
através de teste de usabilidade, questionário ergonômico e análise gráfica do
design. 2003. Dissertação (Mestrado em Engenharia da Produção) – Programa de
Pós-Graduação em Engenharia da Produção, UFSC, Florianópolis.

BETIOL, Adriana Holtz. CYBIS, Wakter, FAUST, Richard. Ergonomia e
Usabilidade: conhecimentos métodos e aplicações, São Paulo : Novatec, 2007.

CAMPOS, J. L., WALLACE, V. S. O DESIGN E A REPRESENTABILIDADE DOS
SIGNOS DENTRO DA WORD WIDE WEB. 2008. DISPONÍVEL EM:<
http://www.bocc.ubi.pt/pag/campos-jorge-silva-wallace-design-representabilidade-
dos-signos.pdf > ACESSO EM: ABR. 2009

DONDIS, A. DONIS. Sintaxe da linguagem visual. Santos: Martins Fontes, 1997.

FERRARI, Pollyana. Jornalismo digital, São Paulo: Contexto, 2003.

FREITAS, Júlio César de. O design como interface de comunicação e uso em
linguagens hipermidiáticas. In: LEÃO, Lúcia (org.). O chip e o caleidoscópio:
reflexões sobre as novas mídias. São Paulo: editora SENAC São Paulo, 2005.
p.183 – 193.

GALLINA, M.C. KOS, J. K.,, InfoDesign: a apresentação da informação em
Websites. 6º CONGRESSO INTERNACIONAL DE ERGONOMIA E USABILIDADE,
DESIGN DE INTERFACES E INTERAÇÃO HUMANO-COMPUTADOR. 2006.

LORANGER, Hoa, NIELSEN, Jakob. Usabilidade na web: projetando website com
qualidade. Rio de Janeiro: Elsevier, 2007.

LUPTON, Ellen. Pensar com tipos: guia para designers, escritores, editores e
estudantes. São Paulo: Cosac Naify, 2006.

MOHERDAUI, Luciana. Guia de Estilo Web: produção e edição de notícias online .
3ª Ed. São Paulo: Editora Senac São Paulo, 2007.

MOHERDAUI, Luciana. Os critérios de composição no jornalismo digital. 2007.
Projeto de Pesquisa do curso de doutorado do Programa de Pós-Graduação em
Semiótica e Comunicação.Linha de Pesquisa: Processos de criação nas mídias.
PUC-SP. São Paulo. Out. 2007.

PALÁCIOS, Marcos. Jornalismo online, informação e memória. In: FIDALGO, A.;
JOAQUIM, P. S. (org.). Informação e comunicação online, jornalismo online.
Covilhã – Portugal: Labcom Books. 2003. Disponível em: <
http://www.livroslabcom.ubi.pt/sinopse/ficha_fidalgo_serra_icovol1.html> .
Acesso em Abr. 2009.

PFUTZENREUTER, Edson do Prado.Contribuições para a questão da formação do
designer de hipermídia. In: LEÃO, Lúcia (org.). O chip e o caleidoscópio:
reflexões sobre as novas mídias. São Paulo: editora SENAC São Paulo, 2005.
p.165 – 182.

SAMARA, Thimothy. Grid: construção e desconstrução. São Paulo: Cosac Naify.
2007.

SILVA JUNIOR, José Afonso da Silva. A relação das interfaces enquanto
mediadoras de conteúdo do jornalismo contemporâneo: agências de notícias
como estudo de caso. Universidade Federal de Pernambuco, Recife, Outubro de
2001. Disponível em: < www.bocc.ubi.pt/pag/junior-jose-afonso-interfaces-
mediadoras.pdf >. Acesso em: Abr. 2009.

SOUSA, Jorge Pedro: Uma história breve do jornalismo no Ocidente.
Universidade Fernando Pessoa e Centro de Investigação Media & Jornalismo. 1997
Disponível em: <www.bocc.ubi.pt/pag/sousa-jorge-pedro-uma-historia-breve-do-
jornalismo-no-ocidente.pdf>.
Acesso em: Abr. 2009.

TOLEDO FILHO, J. C. L. . Estrutura Visual, Leitura da Forma e Diagramação
Digital. Revista Acadêmica Alvorada Plus, v. 3, 2007, p. 6.

Design promovendo a usabilidade no jornalismo on-line

Design promovendo a usabilidade no jornalismo on-line

Mais conteúdo relacionado

Semelhante a Design promovendo a usabilidade no jornalismo on-line

Design promovendo a usabilidade no jornalismo on-line