• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Design promovendo a usabilidade no jornalismo on-line
 

Design promovendo a usabilidade no jornalismo on-line

on

  • 3,499 views

 

Statistics

Views

Total Views
3,499
Views on SlideShare
3,473
Embed Views
26

Actions

Likes
1
Downloads
98
Comments
0

4 Embeds 26

http://www.linkedin.com 17
http://www.lmodules.com 7
http://www.slideshare.net 1
https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Design promovendo a usabilidade no jornalismo on-line Design promovendo a usabilidade no jornalismo on-line Document Transcript

    • 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
    • 9. CONCLUSÃO 94
    • 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.