Tcc re design pergamum

UNIVERSIDADE DO SUL DE SANTA CATARINA FERNANDO MAIA RODRIGUES

RE-DESIGN DE INTERFACE PARA SISTEMA DE PESQUISA PERGAMUM

Trabalho de Conclusão de Curso apresentado ao Curso de Graduação em Design da Universidade do Sul de Santa Catarina, como requisito parcial à obtenção do título de Bacharel em Design.

Orientadora: Profª Luciana Sayuri Oda, Esp.

Florianópolis 2008

UNIVERSIDADE DO SUL DE SANTA CATARINA FERNANDO MAIA RODRIGUES

RE-DESIGN DE INTERFACE PARA SISTEMA DE PESQUISA PERGAMUM

Trabalho de Conclusão de Curso apresentado ao Curso de Graduação em Design da Universidade do Sul de Santa Catarina, como requisito parcial à obtenção do título de Bacharel em Design.

Florianópolis, 25 de novembro de 2008. _____________________________________________________ Professora e orientadora Luciana Sayuri Oda, Esp. Universidade do Sul de Santa Catarina ______________________________________________________ Professora Claudia Batista, Dra. Universidade do Sul de Santa Catarina ______________________________________________________ Roberto Forlin, MsC. Universidade do Sul de Santa Catarina

Aos meus pais, pois sem eles nada disso seria possĂ­vel.

AGRADECIMENTOS

À minha orientadora, Luciana Sayuri Oda, e aos professores membros da Comissão Examinadora que me incentivaram. À bibliotecária Tatyane Barbosa Philippi por sua gentileza em me auxiliar no desenvolvimento da proposta.

Minha irmã, Lilian, pela ajuda nos momentos mais difíceis. À Juliana, namorada e amiga, por sua paciência e apoio durante todo o trabalho e em todas as minhas escolhas de vida. Às amigas Nicolle Geller e Jordana Schulka que compartilharam das mesmas dificuldades, oferecendo seu apoio sempre que foi preciso.

A todos que participaram voluntariamente da pesquisa.

Por fim, a todos os colegas e professores do Departamento de Design da Unisul, que de alguma forma contribuíram para esta pesquisa.

RESUMO

Interfaces que são desenvolvidas sem atender os requisitos de usabilidade reduzem a qualidade da interação diminuindo o desempenho do usuário no sistema e podem até impedir a realização da tarefa. Considerando que a usabilidade e a comunicação visual são fatores determinantes para o sucesso de uma interface, este presente trabalho faz uma pesquisa sobre os principais fatores para o desenvolvimento de uma interface que supra as necessidades dos usuários. Foram feitas análises da interface atual do site da biblioteca da Unisul do Campus Norte da Ilha, a partir de análise heurística e testes de usabilidade com aplicação de questionários aos usuários com o objetivo de medir o nível de satisfação e principais dificuldades encontradas durante a realização do exercício proposto. Os resultados desses estudos demonstraram quais as características a serem levadas em consideração no desenvolvimento do modelo conceitual. Também foram analisadas outras interfaces de pesquisa de bibliotecas a fim de determinar o atual estado da arte. O início do desenvolvimento da proposta foi por meio do desenho esquemático de cada interface, onde os elementos foram estruturados de forma a prever quais os caminhos a serem percorridos durante a navegação. Posteriormente foram geradas alternativas da proposta visual, que foi validada pela bibliotecária responsável pena unidade da Biblioteca Unisul do Campus Norte da Ilha. Por fim, faz-se recomendações para a eventual implementação da proposta.

Palavras-chave: Biblioteca, On-line, Webdesign, Design, Projeto de interface, Usabilidade e Arquitetura da Informação.

ABSTRACT

Interfaces which are developed without responding to usability requests, reduce the quality of interaction, decreasing user performances on the system, and they could even prevent the task accomplishment. Considering that usability and visual communication are determining factors to interface success, this present work makes a research about the mains factors to the development of an interface which fulfill users needs. It were made some analysis on the actual interface the Unisul do Campus do Norte da Ilha, from heuristics analysis and usability tests with users, applying with the objective to measure the satisfaction level and major difficulties found during the proposed exercise realization. The result of this studies show which characteristics must be considered on the conceptual model. Others libraries interfaces were also analyzed with the purpose to determinate the actual art state.

The purposed development started with each interface sketch, where the elements were structured in a way to preview which way the user will use during the navigation. After that, some visual proposal alternatives were created, and validated by the Unisul do Campus do Norte da Ilha Library Responsible. At least it made some recommendations for an eventual implementation of the proposal.

Key-words: Online, Library, Webdesign, Design, Interface, Project, Usabilit. and Information Architecture.

LISTA DE ILUSTRAÇÕES

Figura 1- Proposta de gerenciamento de informação da World Wide Web, 1989. ... 19 Figura 2- Diagrama ontológico do software design ................................................... 21 Figura 3- Em um sistema de hipertexto a navegação pode ignorar completamente a hierarquia, permitindo ao usuário chegar a um lugar a partir de qualquer lugar....... 24 Figura 4 - Interface do sistema de busca do Google Books...................................... 29 Figura 5 - Página de busca avançada do Google Books .......................................... 30 Figura 6 - Interface de busca por diferentes conteúdos e link para busca avançada 30 Figura 7 - Sistemas de busca e navegação integradas ............................................ 31 Figura 8- Diagrama ontológico do design.................................................................. 34 Figura 9 - Sistema de ícones da Apple Computers 1983-1984................................. 43 Figura 10-Interface do sistema Pergamum da UFSC. .............................................. 45 Figura 11 - Interface do sistema Pergamum do SENAI/SC ...................................... 46 Figura 12 - Interface do sistema Pergamum da UFSC. ............................................ 46 Figura 13- Interface do sistema de pesquisa da Biblioteca Universitária Unisul....... 50 Figura 14 - Página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul......................................................................................................................... 51 Figura 15 - Página sem resultados do sistema de pesquisa da Biblioteca Universitária Unisul.................................................................................................... 52 Figura 16 - Página de resultados da avaliação com usuários................................... 53 Figura 17 - Página de detalhes da avaliação com usuários...................................... 54 Figura 18 - Página de detalhes da avaliação com usuários...................................... 55 Figura 19 - Interface de pesquisa rápida da NCSU Libraries.................................... 58 Figura 20 - Interface de pesquisa avançada da NCSU Libraries. ............................. 59 Figura 21 - Recursos para manipulação dos resultados da busca NCSU Libraries. 60 Figura 22 - Página sem resultados da busca NCSU Libraries. ................................. 60 Figura 23 - Interface do sistema de busca da Emerald............................................. 61 Figura 24 - Recursos para manipulação dos resultados da busca Emerald. ............ 62 Figura 25 - Tela de Busca simples. ........................................................................... 66 Figura 26 - Tela de Busca avançada......................................................................... 67 Figura 27 - Tela de resultados................................................................................... 69 Figura 28 - Filtros da tela de resultados. ................................................................... 71 Figura 29 - Listagem de resultados. .......................................................................... 72 Figura 30 - Página de detalhes da obra. ................................................................... 73 Figura 31 - Janela de envio ....................................................................................... 74 Figura 32 - Janela de reserva.................................................................................... 75 Figura 33 - Página sem resultados............................................................................ 76 Figura 34 - Notificações do sistema .......................................................................... 77 Figura 35 - Interface de busca simples ..................................................................... 78 Figura 36 - Interface de busca avançada. ................................................................. 79 Figura 37 - Ajuda contextual na interface.................................................................. 80 Figura 38 - Página de resultado da pesquisa............................................................ 81 Figura 39 - Página de resultado da pesquisa............................................................ 82 Figura 40 - Aviso de não preenchimento da caixa de busca..................................... 83 Figura 41 - Caixa de diálogo para reserva ................................................................ 84 Figura 42 - Caixa de diálogo para envio por e-mail................................................... 85

LISTA DE TABELAS

Tabela 1 - Problemas encontrados na Interface do sistema de pesquisa da Biblioteca Universitária Unisul.................................................................................................... 50 Tabela 2 - Problemas encontrados na página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul. ............................................................................. 51 Tabela 3 - Problemas encontrados na página sem resultados do sistema de pesquisa da Biblioteca Universitária Unisul............................................................... 52 Tabela 4 - Problemas encontrados na página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul. ............................................................................. 56

SUMÁRIO

1 INTRODUÇÃO..................................................................................................................11 1.1 PROBLEMATIZAÇÃO ..........................................................................................................11 1.2 OBJETIVO GERAL .............................................................................................................13 1.3 OBJETIVOS ESPECÍFICOS .................................................................................................13 1.4 JUSTIFICATIVA ..................................................................................................................14 1.5 METODOLOGIA .................................................................................................................15 1.6 DELIMITAÇÃO DO TRABALHO .............................................................................................16 2 FASE INVESTIGATIVA ....................................................................................................17 2.1 CONTEXTUALIZAÇÃO ........................................................................................................17 2.2 INTERFACE GRÁFICA ........................................................................................................20 2.3 USABILIDADE ...................................................................................................................22 2.4 ARQUITETURA DA INFORMAÇÃO ........................................................................................23 2.4.1 Sistema de Organização ...........................................................................................23 2.4.2 Sistema de Navegação .............................................................................................24 2.4.3 Sistema de Rotulação ...............................................................................................25 2.4.4 Sistema de Busca......................................................................................................26 2.5 INTERFACE PARA SISTEMAS DE BUSCA ..............................................................................27 2.5.1 Interface .....................................................................................................................28 2.5.2 Página com resultados .............................................................................................31 2.5.3 Página sem resultados .............................................................................................33 2.6 DESIGN ...........................................................................................................................34 2.6.1 Funções do design....................................................................................................35 2.6.2 Identidade visual .......................................................................................................36 2.6.3 Códigos visuais .........................................................................................................36 2.6.4 Princípios de percepção visual................................................................................38 2.6.5 Tipografia ...................................................................................................................41 2.6.6 Cores ..........................................................................................................................41 2.6.7 Ícones .........................................................................................................................42 3 FASE ANALÍTICA ............................................................................................................44 3.1 ANÁLISE DE DEMANDA ......................................................................................................44 3.2 ANÁLISE DO SISTEMA PERGAMUM .....................................................................................45 3.2.1 Avaliação da usabilidade do sistema pergamum ..................................................47 3.2.1.1 Avaliação heurística.................................................................................................47 3.2.1.2 Avaliação com usuários ...........................................................................................52 3.2.1.3 Avaliação dos princípios do design..........................................................................57 3.3 ANÁLISE DE SIMILARES .....................................................................................................58 4 FASE CONCEITUAL........................................................................................................64 4.1 CONCEITO DA INTERFACE.................................................................................................64 5 FASE PROJETUAL..........................................................................................................65 5.1 DESENVOLVIMENTO DO MODELO CONCEITUAL ...................................................................65 5.2 WIREFRAMES ...................................................................................................................66 5.2.1 Tela de busca simples ..............................................................................................66 5.2.2 Tela de busca avançada ...........................................................................................67 5.2.3 Página de resultados ................................................................................................69 5.2.4 Página detalhes da obra ...........................................................................................73 5.2.5 Página sem resultados .............................................................................................76 5.2.6 Notificações do sistema ...........................................................................................77

5.3 5.4 6

LAYOUTS DAS TELAS ........................................................................................................78 RECOMENDAÇÕES PARA A IMPLEMENTAÇÃO......................................................................86

CONCLUSÃO ...................................................................................................................87

REFERÊNCIAS......................................................................................................................89 APÊNDICE .............................................................................................................................92 APÊNDICE A - ROTEIRO DE TESTE COM USUÁRIOS ORIENTADO À TAREFAS..........93 APÊNDICE B – LAYOUTS PROPOSTOS ............................................................................99 ANEXOS ..............................................................................................................................107 ANEXO A - DIAGRAMA OS ELEMENTOS DA EXPERIÊNCIA DO USUÁRIO .................108

11 1

1.1

INTRODUÇÃO

PROBLEMATIZAÇÃO

A definição tradicional de biblioteca é a de um espaço físico onde se guardam livros. De modo geral, biblioteca é todo espaço concreto ou virtual destinado a uma coleção de informações de quaisquer tipos, sejam escritas em papel ou digitalizadas. Estas informações são organizadas por áreas de interesse e dispostas de forma a auxiliar o usuário no momento da pesquisa. Nos dias de hoje, este modelo de biblioteca que armazena somente livros, enciclopédias e, supostamente abarca todas as áreas de conhecimento não é mais admissível.

Com o surgimento e popularização dos sistemas computacionais e redes de acesso a internet, as bibliotecas automatizaram seus acervos por meio da digitalização e publicação na web, oferecendo diversas possibilidades aos bibliotecários: possibilidade de cadastrar itens presentes na biblioteca, fisicamente ou não, oferecer a possibilidade de consulta, reserva de exemplares, etc.

A Biblioteca Universitária da Unisul conta atualmente com doze bibliotecas, localizadas nos diversos campi de vários municípios. A Unisul também possui uma biblioteca virtual para acesso on-line, para dar apoio à pesquisa e à obtenção de informações. Para este fim a Unisul utiliza o PERGAMUM: Sistema Integrado de Bibliotecas. Desenvolvido pela Divisão de Processamento de Dados da Pontifícia Universidade Católica do Paraná, este sistema informatizado é responsável pelo gerenciamento de bibliotecas. Contempla suas principais funções de forma integrada desde a aquisição até o empréstimo.Um dos componentes do sistema Pergamum é uma interface gráfica onde se dá a interação entre bibliotecário, usuários e o sistema. O modelo desta interface gráfica é compartilhado por todas as instituições que fazem parte da rede Pergamum, sendo diferenciadas apenas pela logomarca de cada instituição.

A partir da crescente quantidade de informações disponíveis nos acervos das bibliotecas virtuais da rede Pergamum, é fundamental oferecer ao usuário formas de encontrar facilmente a informação desejada. O problema que move este

12 trabalho é que a utilização de características para atender a requisitos de usabilidade não é uma prática comum em projetos de interfaces para bibliotecas online, o que causa um desempenho deficiente e uma redução da qualidade da interação do usuário com a ferramenta. Dessa forma, pretendeu-se investigar quais os principais fatores que colaboram para a satisfação do usuário.

13

1.2

OBJETIVO GERAL

Projetar uma nova interface para o sistema Pergamum da biblioteca da Unisul.

1.3

OBJETIVOS ESPECÍFICOS

Tem-se como objetivos específicos: a) Efetuar uma revisão bibliográfica com a finalidade de fornecer um embasamento teórico para este trabalho; b) realizar análises da interface a fim de compreender melhor a interação dos usuários e coletar dados para subsidiar o trabalho de design; c) realizar um estudo analítico de sites que fornecem o serviço de biblioteca on-line para fazer uma comparação funcional destes sites; d) projetar segundo a metodologia proposta, utilizando como suporte teórico os conceitos de usabilidade e princípios do design; e) apresentar estrutura de navegação, arquitetura de informação e desenvolvimento dos layouts das telas estáticas do site; f) apresentar as conclusões deste trabalho com recomendações para implementação.

14 1.4

JUSTIFICATIVA

A Biblioteca Universitária da Unisul possui diversificados recursos informativos, desde o material impresso até o digital. O espaço destinado à biblioteca é construído especialmente para esta finalidade e, de acordo com o público que vai fazer uso do acervo. Portanto, da mesma forma que se encontra na biblioteca física um ambiente minimamente organizado, de fácil acesso às obras, deve-se perceber a mesma organização e facilidade de acesso ao acervo nos ambientes digitais.

Dada a importância da biblioteca virtual na atividade acadêmica, faz-se necessário um projeto que tenha ênfase no usuário a fim deque se aproveite todo o potencial oferecido por estes sistemas.

Muitos produtos que requerem a interação dos usuários para a realização de suas tarefas (p. ex.: comprar ingresso pela Internet, fotocopiar um artigo, gravar um programa de TV) não foram necessariamente projetados tendo o usuário em mente;foram tipicamente projetados como sistemas para realizar determinadas tarefas. Pode ser que funcionem de maneira eficaz, olhandose na perspectiva da engenharia, mas geralmente os usuários do mundo real são sacrificados. O objetivo do design de interação consiste em redirecionar essa preocupação, trazendo a usabilidade para dentro do processo de design. Essencialmente, isso significa desenvolver produtos interativos que sejam fáceis, agradáveis de utilizar e eficazes – sempre na perspectiva do usuário. (PREECE, 2007, p24)

A melhoria destas interfaces não contribui apenas para a realização da tarefa no ambiente digital, mas constitui uma melhoria geral dos serviços oferecidos pela biblioteca, tornando o usuário mais independente na realização de suas atividades, sem a necessidade constante de acompanhamento.

Portanto, é fundamental projetar uma interface que tenha ênfase no usuário, oferecendo todos os recursos responsáveis por tornar a interface fácil e agradável, bem como eficiente a tarefa de busca por informação na Biblioteca Universitária Unisul.

15 1.5

METODOLOGIA

Para o desenvolvimento da interface do sistema Pergamum, a metodologia escolhida segue o diagrama Os Elementos da Experiência do Usuário (vide Anexo A), lançado pelo Arquiteto da Informação Jesse James Garrett (2008). Neste diagrama o autor sugere uma seqüência de etapas para guiar o processo de desenvolvimento do projeto. a. necessidades / Objetivos: Pesquisa com usuários para definir objetivos e metas; b. requisitos: Definição dos elementos do conteúdo e funcionalidades necessárias; c. estrutura: desenvolvimento de fluxos para facilitar as tarefas do usuário; d. informacional: estrutura dos elementos da interface e menus de navegação por meio de protótipo de baixa resolução (wireframe) ; e. visual: tratamento visual dos elementos da interface.

A metodologia proposta é muito mais abrangente do que apenas definir o look and feel de um web site; ela envolve também decisões e definições do seu comportamento e o que os usuários podem fazer com ele. O modelo conceitual criado pelo autor apresenta elementos organizados em camadas (vide Anexo A), da mais abstrata até a mais concreta, e faz perceber que existe uma grande coerência quando se diz que tudo é uma questão de design da experiência do usuário. Todas as áreas têm grande responsabilidade no processo de desenvolvimento da experiência do usuário, já que o que vai ser desenvolvido pelas camadas mais concretas é baseado e influenciado pelo que foi definido nas camadas mais abstratas.

Este trabalho irá propor uma nova estruturação dos elementos da interface e apresentação visual do site da biblioteca da Unisul, não atingindo definições do sistema como produto. Portanto, optou-se por trabalhar apenas as duas últimas etapas propostas na metodologia.

16 1.6

DELIMITAÇÃO DO TRABALHO

Optou-se por desenvolver um protótipo não funcional que represente o conceito da navegação, da estruturação e apresentação do conteúdo das interfaces de busca, o que excluiu as representações do conteúdo institucional e funcionalidades como serviços on-line e contato com a biblioteca.

17 2

2.1

FASE INVESTIGATIVA

CONTEXTUALIZAÇÃO

“Não é possível compreender a essência e a função do design digital sem uma visão ampla do meio em que vamos trabalhar, o ciberespaço.” (ROYO, 2008, p.

19). Como o objeto de estudo deste TCC trata de uma ferramenta baseada em novas tecnologias de informação,é necessária a conceituação de diversos temas relacionados à construção do projeto.

Como explica Royo (2008), em toda a história da humanidade, nunca houve tanta informação disponível, distribuída pelos mais diversos meios. Nunca foi tão difícil a comunicação. Há uma nova percepção de tempo e na maneira de ler o mundo, onde o constante fluxo de informações tornou necessária a adequação de diversas ferramentas. Isso ocorre a partir do surgimento de sistemas de redes organizacionais, estruturas capazes de reunir indivíduos e instituições, de forma democrática e participativa, em torno de objetivos e/ou temáticas comuns tornando a informação não-linear e descentralizada. Assim, foi possível a disseminação dos conteúdos mais diversos, multiplicando-se em redes que compartilham, geram conteúdo e referenciam entre si, criando novos espaços de comunicação.

Dependemos completamente das redes (e das estruturas de rede): sem a eletricidade não poderíamos nem nos mover, uma vez que em uma cidade sem rede elétrica nem os semáforos funcionam. Desta forma a estrutura em rede, o aumento da velocidade e outros parâmetros em relação à linearidade, ao ritmo e à seqüencialidade da narração tradicional são os órgãos vitais do corpo da nossa sociedade atual. (ROYO 2008, p. 12)

O conceito chave que possibilitou estes avanços foi desenvolvido em meados dos anos 1960, pelo americano Theodor Nelson que traçou um paradigma de informação interconectada, vislumbrando uma espécie de sistema-biblioteca global chamada Xanadu. Tratava-se de uma biblioteca onde pessoas poderiam trocar imagens, sons, diálogos, interações, etc. (LEÃO 1999, p.16).

18 Ainda segundo Royo (2008, p. 62): Nelson inventou o termo hipertexto para referir-se a um acúmulo de informações ou escrita, reunida de forma não-seqüencial, mas horizontal, que permitia ao usuário buscar informações com maior liberdade, gerando o seu próprio conteúdo. A materialização dessas idéias pode ser encontrada, hoje em dia, na internet.

Para Radfahrer (2000) o hipertexto é uma seqüência de páginas interligadas que trazem informações complementares a respeito de um assunto, permitindo com que o leitor seja ativo.

Para Leão (1999), a hipermídia é um tipo de documento de escrita complexa onde diferentes blocos de informações são interconectados por meio de hiperlinks. A autora ainda afirma que devido as características do meio digital é possível vincular uma enorme quantidade de informações criando o que chama de rede multidimensional de dados, que permite que o leitor torne-se ativo, estabelecendo relações próprias e criando seu próprio percursos de leitura. “[...] um labirinto

a

ser

visitado,

a

hipermídia

nos

promete

surpresas,

percursos

desconhecidos”. (LEÃO 1999, p.16) De acordo com Bonsiepe (1997), a hipermídia combina as imagens, sons e música presentes na multimídia, permitindo ainda a interação na forma de navegação entre nós semânticos. Ela ainda difere dos outros meios áudio/visuais por se tratar de informações organizadas em rede e a capacidade de navegação por parte do usuário.

Segundo Leão (1999, p.16), “encontramos a hipermídia em dois casos: em aplicativos de CDROM e na WWW.” Complementa-se que cada endereço na WWW pode ser entendido como um nó da rede e estas conexões podem ser tanto para outras páginas do mesmo endereço quanto para outro endereço, outro site.

Conforme Royo (2008), a WWW (world wide web) começou a ser desenvolvida em 1989 por TIM Berners-Lee, engenheiro britânico que trabalhava no CERN, Conseil Européen pour la Recherche Nucléaire - Centro Europeu de Pesquisas Nucleares, situado na Suíça, em caráter interno. Tratava-se de uma proposta de gestão de informações baseado num sistema de hipermídia. Após um período experimental a WWW foi lançada pelo CERN em 1991.

19 A figura a seguir apresenta o fluxograma de gestão de informações proposto por TIM Berners-Lee.

Figura 1- Proposta de gerenciamento de informação da World Wide Web, 1989.

Fonte: Berners-lee (1989)

A WWW é uma rede de informações baseada em um sistema de hipermídia onde o usuário navega de forma não-linear. Para Leão (1999, p. 22). “A web se baseia numa interface gráfica que permite o acesso a dados diversos (textos, músicas, sons, animações, filmes, etc.) através de um simples “clicar” no mouse” Para Bonsiepe (1997, p.147), “a digitalização do mundo gira em torno da rede”, sendo as estruturas de textos lineares substituídos pelas estruturas de textos em rede, onde o ferramental digital do computador revela seu verdadeiro poder.

Neste contexto, surgem as bibliotecas virtuais com o objetivo de apoio educacional e

20 a democratização do acesso à informação confiável e de qualidade, trabalhando para proporcionar maior racionalidade nas rotinas diárias de trabalho. Por esse motivo, surgiram sistemas para facilitar o uso de equipamento computacional e programas desenvolvidos para desempenhar as funções de uma biblioteca. Estes sistemas são apresentados ao usuário por meio de representação gráfica na tela do computador, a interface gráfica do usuário, objeto de estudo deste trabalho.

2.2

INTERFACE GRÁFICA

A interface gráfica do usuário também conhecida como GUI (Graphical User Interfaces) surgiu como novo campo de estudo em meados dos anos 1980 com os primeiros sistemas operacionais gráficos. Define-se a interface como “a área de comunicação entre ohomem e a máquina”. Royo (2008, p.89) Para Netto (2004, p.73), no momento em que surgiu, o conceito de interface era compreendido como o hardware e o software através dos quais o humano e a máquina comunicavam-se. Atualmente este conceito evoluiu incluindo aspectos relativos ao processamento perceptual, motor, viso-motor e cognitivo do usuário.

Bürdek (1999, p.316), definiu a interface como sendo uma superfície de uso viabilizada através do computador. “Nela se opera em um terreno intermediário entre o design gráfico e o design industrial, priorizando a função visual, tátil e acústica de maneira que permitam a fácil inteligibilidade do usuário”.

O conceito atual de Interface Gráfica do Usuário, conforme nos propõe Royo (2008), começou a popularizar-se com o surgimento do sistema operacional gráfico Alto, apresentado pela Xerox em 1981. Era uma interface gráfica baseada numa metáfora de desktop onde ícones das pastas tornavam-se janelas que podiam ser sobrepostas e a navegação pelo sistema se dava através de ícones herdeiros dos sinais viários. “Os espaços reais de nosso mundo começaram a se estabelecer como espaços virtuais, espaços de informação representados por metáforas e ícones.” (ROYO, 2008, p.53).

21

As assim chamadas interfaces de manipulação direta, ou interfaces gráficas, são constituídas por janelas, ícones, menus e teclas. Elas são compreendidas como instrumentos metafóricos de uma realidade com a qual o usuário está hoje em dia familiarizado. Porém, os objetos gráficos não representam uma realidade, mas constituem uma realidade. Para o usuário, a diferença entre o mundo metafórico e o mundo real tem pouco interesse. O usuário vive e trabalha em um só mundo, por isso podemos dizer que os elementos visuais sobre o monitor não são réplica de uma realidade, pois abrem um espaço para a ação. (BONSIEPE, 1997, p.41-42):

A partir do que foi proposto anteriormente observa-se que esta relação de acoplamento estrutural entre homem e máquina é possível utilizando convenções básicas onde o usuário possa interagir sem a necessidade de compreender a linguagem de programação dos computadores (ver Figura 2), mas realizando uma atividade conhecida no meio físico.

Figura 2- Diagrama ontológico do software design Fonte: Adaptado de Bonsiepe. (1997, p.40)

É imprescindível que esta interface seja capaz de apresentar as informações de forma legível, fácil de localizar e processar; de modo que o usuário deve sempre estar no controle, sendo capaz de localizar a informação que necessita quando precisar.

22 2.3

USABILIDADE

Usabilidade é parte fundamental do produto digital, visto que é responsável pela forma e apresentação da informação e nesta ordem o usuário é o centro das preocupações do projeto. Para Royo (2008, p.90), “o trabalho principal de um design responsável é que os aparelhos sejam usáveis” e ainda completa: “um design que não é funcional e não facilita a utilização do objeto não é e nunca terá sido um bom design.” É importante definir os fundamentos da usabilidade: A usabilidade é um atributo de qualidade relacionado à facilidade de uso de algo. Mais especificamente refere-se à rapidez com que os usuários podem aprender a usar alguma coisa, a eficiência deles ao usá-la, o quanto lembram daquilo, seu grau de propensão a erros e o quanto gostaram de utilizá-la. Se as pessoas não puderem ou não utilizarem um recurso, ele pode muito bem não existir. (NIELSEN; LORANGER, 2007, p.xvi)

Usabilidade não é uma propriedade singular, unidimensional de uma interface. Ela possui componentes múltiplos associados tradicionalmente aos seguintes atributos (NIELSEN, 1993 apud MEMORIA, 2005, p. 6): a. ser fácil de aprender: o aplicativo deverá ser fácil para aprender, a fim de que os usuários possam rapidamente começar a realizar suas tarefas; b. ser eficiente na utilização: o aplicativo deverá ser eficiente para que o usuário tenha um bom nível de produtividade; c. ser fácil de ser recordado: o aplicativo deverá ser fácil de relembrar, para que quando um usuário casual, depois de um tempo sem usá-lo, não tenha que aprender novamente; d. ser subjetivamente agradável: o aplicativo deverá ser agradável quando utilizado, para que os usuários fiquem satisfeitos. Eles devem gostar dele. e. ter poucos erros: o erro é definido com uma ação que não leva ao resultado esperado. O aplicativo deve ter uma pequena taxa de erros durante a sua utilização; Para os designers, a usabilidade deve ser vista como um fator imprescindível para o sucesso da interface uma vez que ela é responsável direta pela qualidade da experiência do usuário.

23 2.4

ARQUITETURA DA INFORMAÇÃO

Rosenfeld e Morville (1998) relacionam estreitamente a arquitetura de informação à biblioteconomia, considerando, inclusive, que os biblioteconomistas e documentalistas seriam as pessoas mais capacitadas para atuar nesta área, uma vez que envolve a estruturação e organização de informação para o que se utilizam os conceitos oriundos da ciência da informação.

A interface do sistema de pesquisa Pergamum tem a função de ser um intermediador entre a informação e os seus usuários, não limitando-se somente a atender aos pedidos feito por seus usuários, mas também divulgando informações que são importantes na rotina da sua comunidade. Em vista do grande volume de informações disponíveis num sistema de biblioteca é necessário que os conteúdos sejam organizados de forma que os usuários encontrem o que procuram.

Rosenfeld e Morville (1998) dividem a Arquitetura de Informação de um web site em quatro grandes sistemas interdependentes, cada um composto por regras próprias e suas aplicações. Seriam eles: Sistema de Organização; Sistema de Navegação; Sistema de Rotulação e Sistemas de Busca.

2.4.1 Sistema de Organização

Rosenfeld e Morville (1998) descrevem o Sistema de Organização como o sistema que determina o agrupamento e a categorização do conteúdo informacional, destacando alguns desafios a serem encarados ao se organizar o conteúdo de um web site.

O primeiro desafio é a ambigüidade: Muitas vezes a linguagem é ambígua, isto é, as palavras são susceptíveis de serem entendidas em duas ou mais formas possíveis. Outro desafio é a heterogeneidade: Em um mesmo site podem estar presentes conteúdos de diversos tipos. As perspectivas: Toda organização é afetada pela perspectiva do seu criador. Além disso, diferentes usuários têm diferentes perspectivas. O desafio é o de organizar a informação a fim de atender as

24 diferentes perspectivas de cada usuário. Políticas Internas: Caso onde decisões políticas influenciam diretamente a organização da informação de modo a resolver interesses internos ao invés de atender as necessidades do usuário. A Estética: que tem a função de atribuir forma ao conteúdo de maneira a facilitar a organização das informações.

2.4.2 Sistema de Navegação

Para projetar a estrutura de um web site Rosenfeld e Morville (1998) sugerem que seja feito um balanço cuidadoso de facilidade de acesso com a necessidade de estabelecer categorias e subcategorias de informação para benefício dos usuários.

Fleming (1998) revela que a web é baseada em ações: buscar, escolher, comprar, conversar, baixar arquivos ou fazer cópias de segurança. O que se busca na web é liberdade de movimento, caminhos claramente marcados, serviços personalizados, entrega rápida e respostas imediatas.

Figura 3- Em um sistema de hipertexto a navegação pode ignorar completamente a hierarquia, permitindo ao usuário chegar a um lugar a partir de qualquer lugar.

Fonte - Rosenfeld e Morville. (1998, p.45)

25 Segundo os autores o conteúdo da web permite grande liberdade de navegação, diferente de conteúdos com ramificações hierárquicas, que forçavam o usuário a se mover apenas para cima e para baixo. A partir disso estabelecem três sistemas de navegação: a. navegação global – É aplicado a todo o site. Normalmente apresenta-se como um elemento horizontal no topo dos sites; b. navegação local – Necessário para complementar o sistema global de navegação com um ou mais sistemas de navegação local. Normalmente apresenta-se como uma coluna vertical contendo lista de itens clicáveis; c. navegação contextual – Links contidos em frases ou parágrafos. Tem natureza mais editorial do que arquitetural.

Segundo Nielsen (2000), um bom sistema de navegação deve, a todo o momento, responder a três perguntas básicas: Onde estou? Onde estive? Onde posso ir?

2.4.3 Sistema de Rotulação

Sistema

de

Rotulação

estabelece

formas

de

representação

da

informação, definindo signos para cada elemento informativo. Para Rosenfeld e Morville (1998), um dos grandes problemas na web é que os usuários não sabem para onde estão indo ao acionarem um link. Desta forma, deve haver um esforço no sentido de antecipar para o usuário, de maneira precisa, a que parte da informação será remetido, para que o acionamento de um link não seja uma experiência frustrante.

Desta forma o sistema de rotulação visa melhorar o entendimento dos links para que o usuário consiga interpretar a página de destino antes do acionamento, reduzindo sua desorientação.

O sistema de rotulação, segundo Fox (2008), é a interface do esquema de organização – os nomes dados às diferentes categorias e se estrutura em palavras

26 do sistema de navegação. A autora afirma que o sistema de rotulação é um dos mais importantes aspectos da arquitetura de informação e um dos pontos mais difíceis de executar.

A dificuldade e a importância do sistema de rotulagem residem no fato de precisar refletir o conteúdo ao usuário e por isso deve ser escrito em linguagem que lhe seja comum.

2.4.4 Sistema de Busca

Diferentes usuários têm diferentes necessidades. É importante atender a múltiplos modos de localização da informação. Alguns usuários sabem exatamente o que procuram. Sabem que o item existe e como está rotulado. Esses usuários somente desejam localizar a informação e sair o mais rápido e sem problemas possíveis. Essa é a chamada busca de item conhecido.

Outros usuários não sabem o que procuram. Eles vem ao site com uma vaga idéia da informação que necessitam, muitas vezes sem saber os rótulos corretos para descrever o que querem ou mesmo se existem. Se eles casualmente exploram o site, podem aprender sobre os produtos ou serviços não considerados anteriormente.

Para Rosenfeld e Morville (1998), o sistema de busca determina as perguntas que o usuário pode fazer e o conjunto de respostas que irá obter.

Esses modos de localizar informação não são mutuamente exclusivos.

Em um sistema bem projetado, muitos usuários alternarão entre busca de item conhecido e o folheamento casual à medida que exploram o site. Desta forma podemos classificar as diferentes necessidades de informação de cada usuário como: a. procura por item conhecido - Ocorre quando o usuário tem claramente definidas suas necessidades de informação. Sabe que a informação existe e onde encontrá-la; b. procura por um item existente - Ocorre quando o usuário sabe o que quer, mas não sabe como descrever ou se a resposta existe;

27 c. procura exploratória Ocorre quando o usuário sabe formular a sua questão, mas não sabe exatamente o que espera encontrar, está apenas explorando e tentando aprender mais sobre o tema; d. procura ampla - O usuário deseja tudo que existe disponível sobre um determinado tema. Como no caso da pesquisa científica.

2.5

INTERFACE PARA SISTEMAS DE BUSCA

Rosenfeld e Morville (1998) apresentam como fatores importantes no resultado da busca: quantidade, superficialidade ou profundidade das informações; tempo, urgência, velocidade e atualidade das informações; e confiabilidade dos resultados apresentados. Os autores apresentam, ainda, as principais variáveis para o projeto de interface de busca: a. perfil do usuário – Os níveis de experiência e o conhecimento de estratégias de busca determinam os recursos a serem implementados: operadores booleanos ou linguagem natural, interface simples ou avançada, recurso de ajuda, entre outros; b. tipo de informação requerida – É importante saber se o usuário poderá realizar uma navegação ou uma pesquisa profunda, ou ainda se obterá resultados superficiais ou detalhados; c. modos de busca – São decisões sobre como o usuário irá interagir: campos de formulários; texto corrido; formato HTML, entre outros; d. quantidade de informação – Oferecer acesso a fontes que possam ampliar e aprofundar o conteúdo procurado.

Rosenfeld e Morville (1998) ainda recomendam que as opções de busca devem ser claras para o usuário: o que está sendo procurado; como formular o que será buscado; como classificar a ordem dos resultados; sugestões para quando o usuário não obtiver respostas para a busca. Também argumentam que a navegação exploratória e a busca devem estar próximas na mesma página, para o usuário

28 escolher qual recurso utilizar. Além disso, a página ou área de resultados deve ser similar à de busca e ao restante do web site, com a mesma linguagem visual.

Nielsen e Loranger (2007) afirmam que embora alguns usuários optem diretamente pela busca, ainda existem aqueles que preferem encontrar as informações por meio de outros métodos como através do sistema de navegação. O sistema de busca por palavra chave é interessante para aqueles usuários que sabem exatamente o que procuram, mas oferecer um bom sistema de navegação pode encorajar outros usuários a explorar o site e descobrir o que está disponível, espacialmente quanto eles não sabem quais palavras inserir no campo de busca. É importante oferecer suporte para esses dois tipos de comportamento.

Ainda para Nielsene Loranger (2007, p.140), “as novas diretrizes de usabilidade não servem apenas para projetar uma boa busca; servem para projetar a busca esperada. Desviar-se do design esperado quase sempre resulta em problemas.” O autor informa que durante os testes, os usuários gostam que as pesquisas em sites e intranets funcionem como nos seus site de busca preferidos; Google, Yahoo! e MSN. Basicamente estes sistemas apresentam. uma caixa onde é possível digitar palavras, um botão rotulado Pesquisar, que ao ser clicado executa a busca e uma nova página que lista os resultados de forma linear e priorizada.

Isto demonstra um enraizamento de um comando de busca no modelo mental dos usuários. Trabalhar a partir de um design esperado permite que o usuário concentre-se em seus objetivos e não em aprender a mecânica da ferramenta.

Para Rosenfeld e Morville (1998), o projeto de um sistema de busca envolve três partes básicas, classificadas como: Interface, Página com resultados, Página sem resultados.

2.5.1 Interface

Conforme Nielsen e Loranger (2007), a interface de busca deve contar com uma caixa de texto onde o usuário insere consultas, combinado com um botão

29 rotulado Pesquisar, assim como apresentado na Interface do sistema de busca do Google Books(figura 4).

Figura 4 - Interface do sistema de busca do Google Books.

Fonte: Google books (2008)

Sobre a caixa de texto Nielsen e Loranger (2007) afirmam que existe uma relação desejável entre comprimento da consulta e largura da caixa de texto. Caixas de textos maiores - a partir de 27 caracteres - são melhores por que encorajam usuários a fazerem consultas mais longas, que normalmente resultam em resultados mais precisos e úteis e também por haver um menor número de erros de digitação já que o usuário consegue ler o que está escrevendo.

Para Memória (2005, p.62) é importante que a caixa de busca seja simples e direta, sem muitas opções e filtros aparentes. Páginas de busca avançada, como a do Google Books (figura 5), oferecem diferentes filtros de pesquisa e devem ficar separadas da pesquisa básica.Embora a maioria dos sites e sistemas de busca ofereça recursos de pesquisa avançada, Nielsen e Loranger (2007, p.150) afirmam que “A menos que sejam bibliotecários tecnicamente qualificados, os usuários não sabem usar a de pesquisa avançada.” E ainda completa: A principal diretriz para uma busca avançada é esta: evite-a. Poucas pessoas utilizam a pesquisa avançada corretamente, e na maioria das vezes ela traz mais problemas que benefícios. (NIELSEN; LORANGER, 2007, p.150)

30

Figura 5 - Página de busca avançada do Google Books Fonte – Google books (2008).

Os autores Rosenfeld e Morville (1998) afirmam que a interface deve oferecer suporte aos diferentes modos de busca a fim de atender as diferentes necessidades de informação dos mais diversos tipos de usuários. Sendo características desejáveis: Áreas de busca por diferentes conteúdos (figura 6), com diferentes níveis de sofisticação. Oferecendo opções de busca simples e busca avançada.

Figura 6 - Interface de busca por diferentes conteúdos e link para busca avançada Fonte: Livraria Martins Fontes Paulista (2008)

31 Sistemas de busca e navegação integradas (figura 7), já que normalmente os usuários precisam mudar do sistema de busca para o de navegação e vice-versa.

Figura 7 - Sistemas de busca e navegação integradas Fonte: Mercado Livre Brasil (2008)

2.5.2 Página com resultados

A página com resultados da busca deve oferecer dados precisos, claros e relevantes. Apresentando as características principais de cada documento.

Para Rosenfeld e Morville (1998) existem diversas formas de configurar a página de resultados de um sistema de busca, embora todas dependam de dois fatores básicos. a. Grau de estrutura do conteúdo. O conteúdo está suficientemente estruturado de forma que possa exibir as informações de um autor, uma data, um resumo, e assim por diante. b. O que os usuários realmente deseja. Quais informações o usuário precisa e o que ele espera do que o sistema forneça como resultado. O usuário pode escolher de qual forma gostaria que o sistema exiba os resultados. Neste caso é necessário considerar as seguintes questões:

32 – Quantidade de informações exibidas para cada item?

Para o tipo de página que exibe grande quantidade de resultados existe uma regra simples que consiste em mostrar menos informações por item a fim de tornar a leitura da página mais rápida. Outra regra consiste em mostrar menos informações para usuários que sabem o que estão procurando e muito mais informações para aquele usuário que não sabe. Desta forma ajudando-o a diferenciar os resultados. É possível criar recursos para diferentes necessidades de informação, permitindo, por exemplo, que o usuário escolha a quantidade de informação que deve ser exibida por página.

– Quais informações devem ser exibidas por item?

Existem diversas informações que podem ser exibidas para cada ítem de uma página de resultados, como por exemplo: título, assunto, autor, etc. No caso do sistema de busca proposto nesta pesquisa, para usuários que desejam uma pesquisa por autor, deve ser possível mostrar-lhes apenas resultados não apenas ordenados por autor, mas omitindo campos desnecessários de forma a listar uma maior quantidade de itens por página.

– Quantos itens devem ser exibidos por página?

A quantidade de itens a serem exibidos depende dos dois fatores anteriores. Neste caso é possível oferecer ao usuário um recurso que possibilite configurar o número de itens por página de acordo com suas próprias necessidades, sempre informando ao usuário o numero total de itens encontrados na pesquisa.

– Como os itens devem ser classificados?

Normalmente as possibilidades de classificação dos itens de um resultado de pesquisa incluem: • ordem cronológica; • alfabética por título, autor, etc; Para os autores, ainda existem outras características desejáveis em uma página de resultados de pesquisa:

33 – mostrar ao usuário onde ele está nas páginas de resultados; é útil para o usuário saber que está vendo a página dois de um resultado de cinco páginas; – mostrar o total de documentos encontrados. O usuário precisa saber a quantidade de itens encontrados para que possa refinar a pesquisa no caso de um resultado muito grande; – repetir a palavra-chave na página de resultados. Usuários navegam a partir da pesquisa e podem esquecer o que pesquisavam em primeiro lugar; – tornar simples ao usuário refazer a busca. Mantendo uma caixa de texto com a palavra pesquisada em todas as páginas de resultados.

2.5.3 Página sem resultados

Para Nielsen e Loranger (2007, p.159), uma página sem resultados deve sempre dar feedback ao usuário indicando claramente que não foram encontrados resultados para os parâmetros digitados. Retornar uma página em branco pode evitar que o usuário repita a busca, criando a impressão de que o sistema apresentou problemas. É necessário que esta página contenha recursos que auxiliem o usuário a modificar sua consulta a fim de obter melhores resultados. Para isso é fundamental repetir na página de resposta os comandos usados na busca.

Rosenfeld e Morville (1998) ressaltam a importância de solicitar ao usuário revisar os parâmetros digitados, principalmente a ortografia das palavras chaves e por fim, oferecer a possibilidade de entrar em contato com os administradores do site.

34 2.6

DESIGN

Ao descrever o diagrama ontológico do design, Bonsiepe (1997) sugere um diagrama composto por três domínios, unidos por uma categoria central: a interface. Em primeiro lugar o usuário que realiza uma ação. Em segundo, a tarefa que o usuário pretende executar. Em terceiro lugar o artefato que o usuário necessita para efetivar a ação.

A

figura

abaixo

representa

o

diagrama

ontológico

do

design,

representando as relações presentes no ato de regar uma planta.

Figura 8- Diagrama ontológico do design.

Fonte: Adaptado de Bonsiepe. (1999, p.10)

Segundo o diagrama, a conexão entre o usuário, um objetivo e uma ferramenta (analógica ou digital) ocorre por meio de uma interface. A interface seria então o meio onde se estrutura a relação entre usuário, ferramenta (artefato ou signo) e ação efetiva.

A interface revela o caráter de ferramenta dos objetos e o conteúdo comunicativo das informações. A interface transforma objetos em produtos.

A interface transforma sinais em informação interpretável. (BONSIEPE, 1997, p.12).

35 Bonsiepe (1997, p.31) define design como “o domínio no qual se estrutura a interação entre usuário e produto para facilitar ações efetivas.” Portanto, para ele, o domínio central do design é a interface.

O trabalho de um designer é o de dar forma à linguagem, representando-a na forma de sinais, textos, hipertextos, imagens, ícones, etc.

O design de Interface Gráfica do Usuário é uma disciplina em si mesma, filha direta do design industrial (que nos relaciona com aos conhecimentos de ergonomia neste campo), do design de sinalização espacial (nas pesquisas de sistema de navegação e pictogramas), do design editorial (por ser antecessor direto da organização de informação) e do design da informação (design de diagramas e imagens com forte caráter de informação e organização.) (ROYO, 2008, p.90)

Em todos estes casos, o designer cria interfaces para os usuários, sendo o design digital uma disciplina herdeira de outras áreas do design; a soma de diferentes dimensões do design em função desta nova prática projetual.

2.6.1 Funções do design

Para Dondis (1997) cria-se um design a partir de inúmeras cores, formas, texturas, tons e proporções relativas; relacionando interativamente esses elementos; tendo em vista um significado.

Cada interface contida no ciberespaço representa um novo espaço usável de informação. Neste contexto a função do design é a de dotar este espaço de identidade e sinalização de forma consistente, onde todos os elementos tenham a função de comunicar algo. Para um bom trabalho de design, Royo (2008) propõe que o designer deve ser capaz de dotar o espaço de identidade e sinalização, apoiando-se no conhecimento e aplicação correta de códigos visuais.

36 2.6.2 Identidade visual

A identidade visual não é vista por Royo (2008) como apenas uma representação gráfica de uma marca de uma empresa ou instituição; ela pressupõe “representar valores e as idéias de uma organização que estarão representadas em diversos campos”. Esta identidade soma os seguintes fatores: a. Representação gráfica. Comunicação dos valores por intermédio dos elementos gráficos que a organização utiliza a partir de elementos visuais como (tipografia, cor, imagens, etc.) estabelecendo desta forma um entendimento entre a organização e o usuário; b. Estilo de comunicação escrita. Juntamente às representações gráficas, a forma da linguagem escrita também gera valores de identidade; c. Funcionalidade ou usabilidade. Se as ações realizadas forem fáceis para o usuário ele terá uma experiência positiva passando a impressão de uma identidade forte. Neste caso o usuário retornará, caso contrário nunca retornará ao site. d. Diálogo e participação. Estabelecendo um espaço de comunicação (feedback) com o site trará maior satisfação ao usuário que compreendera melhor a organização.

Para uma identidade visual consistente é necessário uma padronização gráfica de elementos (por exemplo, tipografia coerente, família de ícones, cores, etc.) a fim de manter uma coordenação gráfica em toda interface.

2.6.3 Códigos visuais

Conforme Pignatari (1998) toda relação que se estabelece entre duas coisas cria um vínculo de alguma ordem que é expresso em termos de linguagem. Quem fala relação, fala linguagem, uma vez que a relação só pode ser explicada por

37 alguma forma sígnica. Neste contexto o designer é aquele capaz de perceber e/ou criar novas relações a arranjos de signos.

De acordo com Niemeyer (2003, p.19), a semiótica “é a teoria geral dos signos”. O signo é algo que representa alguma coisa para alguém em determinado contexto. ...é inerente à constituição do signo o seu caráter de representação, de fazer presente, de estar em lugar de algo, de não ser o próprio algo...pela articulação dos signos se dá a construção dos sentidos. Os signos se organizam em códigos, constituindo sistemas de linguagem.

Estes sistemas constituem a base de toda e qualquer forma de comunicação”. (NIEMEYER, 2003, p.19)

Desta forma a semiótica é um fenômeno que se relaciona com a linguagem à comunicação, sendo fundamental para o desenvolvimento das interfaces pois oferece suporte a comunicação com o usuário. Ainda segundo a autora, “fornece base teórica para os designers resolverem as questões comunicacionais e de significação e tratar do processo de geração de sentido do produto – a sua semiose”. (NIEMEYER, 2003, p.16) Pignatari (1998) propõe uma classificação a partir da relação de representação que o signo mantém com seu objeto: a. ícone, quando possui alguma semelhança ou analogia com seu referente.

Exemplo: uma fotografia, uma estátua, um esquema, um pictograma; b. índice, quando mantém relação direta com seu referente, ou a coisa que produz o signo. Exemplo: chão molhado, indício que choveu; pegadas, indícios de passagem de animais ou pessoa; c. símbolo, quando a relação com o referente é arbitrária, convencional. As palavras, faladas ou escritas são, na sua maioria, símbolos. Exemplo: a fala ou escrita que designa um determinado objeto é feito através de um som ou desenho de letras, pré estabelecidos por meio de convenção.

Embora exista esta classificação, certos signos podem possuir mais de uma relação de significado, dependendo da forma como representam um mesmo objeto.

38 Segundo os conhecimentos semióticos, é possível transmitir uma idéia, funções e conceitos, apenas utilizando imagens, através das dimensões conotativas (duplo sentido) e denotativas (sentido real) que cada elemento visual pode conter.

Para Royo (2008) os sistemas de códigos visuais são criados pela necessidade de otimizar o fluxo dos usuários, embora seja necessário um sistema de construção que contemple três dimensões semióticas: a. dimensão semântica – Relação da imagem com seu significado. b. dimensão sintática – Contextualização e concisão entre os ícones de um sistema. c. dimensão funcional – Compreensão do ícone pelo usuário.

Desta forma deve-se manter uma relação direta dos elementos visuais da interface, sejam eles figuras, tipografia, signos - suas formas e cores. Todos devem ser escolhidos sob análise semiótica, através de sua relação de significação com o público alvo.

O planejamento estrutural da interface depende de códigos visuais cujas características estruturais dão forma à comunicação. “Códigos visuais são nossas ferramentas para construir as diferentes realidades por meio da linguagem.” Os códigos visuais podem ser classificados em duas categorias: Escrita alfabética (alfabeto, tipografia), escrita não alfabética (ícones, esquemas) e a imagem fixa (ilustração, fotografia) (ROYO 2008, p.136). Devido à profundidade do tema serão apresentadas apenas características estruturais básicas dos códigos visuais relacionadas diretamente com o objetivo da pesquisa.

2.6.4 Princípios de percepção visual

Os princípios da percepção visual humana são temas de estudo da Gestalt. A Gestalt é a escola de psicologia que tornou-se importante ao estudar os aspectos psíquicos, sociais, fisiológicos e físicos (Perazzo, 1997). Embora existam diversos princípios da percepção visual, apenas alguns são adequados à Internet.

39 Segundo Radfahrer (2000) estes princípios podem ser resumidos em sete: proximidade e alinhamento; equilíbrio, proporção e simetria; contraste, cores e brancos; ordem, consistência e repetição; simplificação; legibilidade e integração.

1. Proximidade e alinhamento Esta primeira regra é descrita por Radfahrer (2000, p.21): "elementos que têm algo em comum devem estar juntos no layout, ou seja, alinhados e agrupados, para que o leitor os reconheçam como um grupo. Quando as coisas que pertencem a um mesmo grupo estão espalhadas, a impressão é de uma bagunça."

Para isso o autor sugere que seja aplicado um mínimo de coerência, agrupando os elementos e relacionando-os a fim de dar-lhes sentido. Estabelecendo uma relação entre os elementos de um mesmo grupo e entre os outros grupos.

Desta forma cria-se uma hierarquia e uma ordem de leitura. Isso facilita o acesso à informação, transmitindo melhor a mensagem.

Além de agrupados, os elementos devem estar alinhados, e esse alinhamento deve ser consistente: é bom repeti-lo em todas as páginas, sempre que o assunto ou a hierarquia de elementos (texto, botão, foto, barra de conexão) forem os mesmos.

2. Equilíbrio, proporção e simetria Uma forma geométrica que apresente duas metades iguais é simétrica. A simetria é baseada na perfeição, buscando formas ideais, porém apesar de apresentar soluções bonitas, produz efeito estático e artificial. Geralmente é utilizada quando não se tem a necessidade de chamar a atenção.

Já o equilíbrio é mais difícil de conseguir, utilizam-se elementos de pesos e tamanhos diferentes que se opondo se completam, criam movimento e interesse sobre o todo. O contraste de cores, tamanhos, formas e direções costumam conseguir um trabalho equilibrado.

3. Contrastes, cores e brancos Um layout apresenta contraste quando varia tamanhos, peso, estilo, forma e cor dos elementos. Quanto mais intensos e numerosos os contrastes mais

40 interessante e curioso será o resultado. Em um layout onde não há contraste algum entre os elementos, o resultado é concordante e normalmente sem maiores atrativos. Normalmente apresenta margens do mesmo tamanho, título e textos no mesmo tipo de letra. Mas a pior relação é a conflitante, que se apresenta quando o designer quer inovar mas não ousa muito, então executa pequenas variações de tipo, corpo, estilo de texto, imagens e a similaridade acaba dificultando a leitura pois não são nem concordantes, nem contrastantes. Espaços em branco ou vazios equilibram o layout, reforçam a unidade de um grupo, harmonizam áreas e aumentam o contraste.

4. Ordem, consistência e repetição No design de um conjunto de documentos, seja web sites, programação visual de uma empresa, projeto gráfico de uma revista, e assim por diante, são definidas algumas regras que não podem ser mudadas no meio do caminho. São famílias de letras, contraste, alinhamento, disposição de fotos, cores, espaços, fundos que criam uma unidade e orientam o usuário.

5. Simplificação A simplicidade requer objetividade, firmeza, clareza da mensagem e elegância de design.

6. Legibilidade Um texto deve ter legibilidade ou então ter um bom motivo para sacrificar o leitor e despertar sua disposição para maior esforço de leitura.

7. Integração Nela os conceitos devem ser testados, harmonizados, agrupados, alinhados, simplificados, ordenados, sintetizados e integrados.

41 2.6.5 Tipografia

Segundo Niemeyer (2006) tipografia é a representação gráfica da linguagem compreendendo desde o desenho e a produção de letras até sua distribuição e espacejamento sobre uma superfície (física ou digital), com a função de transmitir informações e facilitar a compreensão.

A escrita alfabética é para Royo (2008) a “codificação gráfica da fala” cujas características tanto no meio impresso como no meio digital, são regidas por três critérios básicos: a. legibilidade e contraste. O tipo de letra a ser utilizado deve ser visualizado com clareza pelo usuário, utilizando espaços entre linhas de maneira a facilitar a leitura. O contraste entre formas e utilização de espaços vazios também é fundamental para obter-se boa legibilidade; b. hierarquia de informações. Títulos, subtítulos e outros tipos de textos devem ter características que o leitor consiga distinguir, a fim de diferenciar um texto de outro; c. consistência. Os textos mantêm uma aparência integrada com o site por meio de características como cor, tamanho, etc. Trazendo ao usuário a sensação de controle ao perceber que navega por um site real. Esta regra está relacionada à identidade visual do site.

Estes critérios demonstram a importância da correta aplicação da tipografia, não apenas como elemento gráfico decorativo mas como elemento transmissor de informação e parte integrante da identidade visual.

2.6.6 Cores

A cor pode ser entendida como sensações visuais provenientes do reflexo da luz sobre os objetos. Cada estímulo visual tem características próprias,

42 possuindo tamanho, proximidade, luz e cor. A percepção visual, portanto, é distinta para cada pessoa.

Sobre o indivíduo que recebe a comunicação visual, a cor exerce uma ação tríplice: a de impressionar, a de expressar e a de construir. A cor é vista: impressiona a retina. É sentida: provoca uma emoção. E é construtiva, pois, tendo um significado próprio, tem valor de símbolo e capacidade, portanto, de construir uma linguagem que comunique uma idéia. (FARINA, 1990 p.27)

Segundo Guimarães (2000) a aplicação intencional da cor, ou do objeto, possibilitará ao objeto que contém a informação cromática receber a denominação de signo. Desta forma, sugere que ao considerar uma aplicação intencional da cor, trabalha-se com uma informação implícita, que será percebida e decifrada pela visão, interpretada pela nossa cognição e transformada em informação Pelo fato das cores serem elementos de grande importância na composição visual, suas potencialidades devem ser utilizadas a fim de possibilitar uma comunicação eficiente entre o sistema e o usuário.

A

aplicação

incorreta

das

cores

em

interfaces

pode

aumentar

significativamente o tempo de resposta do usuário.

A padronização de cores é um aspecto importante da interface, desta forma é possível facilitar o desempenho do usuário perante o sistema, aumentando a eficiência da transmissão de informação, na medida em que a cor tem a capacidade de direcionar a atenção do usuário, enfatizando alguns aspectos da interface, diminuindo a ocorrência de erros e tornando a interface mais fácil de ser memorizada (aprendida).

2.6.7 Ícones

O termo ícone incorporou-se no elenco de termos técnicos utilizados no dicionário

da

computação.

São

elementos

comuns

nas

interfaces,

onde

normalmente correspondendo ao desenvolvimento de alguma ação por parte do usuário

43

Figura 9 - Sistema de ícones da Apple Computers 1983-1984.

Fonte: Caplin (2001, p.122)

Devido a sua importância como elementos de comunicação com o usuário os ícones devem ser projetados cuidadosamente a fim de serem práticos e de fácil compreensão. "Os ícones devem ser significativos, apropriados, coerentes, consistentes, claros, simples e definidos em pequeno número [...]". (CYBIS, 1994) Como estas, muitas outras imagens podem se criadas como elemento visual a partir de seu poder de comunicação, como metáfora, servindo de apoio nas ações pretendidas pelos usuários.

44 3

3.1

FASE ANALÍTICA

ANÁLISE DE DEMANDA

Por entender a crescente demanda por informação digital a biblioteca universitária da Unisul procurou atender às necessidade de seus usuários utilizando um ambiente virtual para catalogar e digitalizar seu acervo difundindo assim o conhecimento registrado nos materiais disponíveis aos usuários. [...] mesmo no caso de acervos cuja integra dos textos se encontra disponível em forma eletrônica, continua havendo a necessidade de um mecanismo que permita aos usuários identificar material de interesse, selecionar material que melhor atenda as suas necessidades, encontrar grupos de documentos similares, e localizar esse material. Como notado anteriormente, há uma função de síntese que só o catálogo pode desempenhar (PIZZORNO; MACHADO; BACK; KUESTER; MOREIRA; MOREIRA, 2005 apud DIAS, 2001).

Para que seja possível catalogar todo o acervo de publicações físicas e também de acervos cuja íntegra encontra-se em meio digital ou virtual, de maneira que haja uma recuperação eficiente dos dados, é necessária a criação de fichas catalográficas cujos dados fiquem cadastrados num banco de dados, já que as informações contidas nesta ficha não podem simplesmente ser digitadas no computador para produzir um catálogo automatizado.

O computador precisa de um meio para interpretar a informação encontrada no registro bibliográfico. Percebeu-se que para o cadastro destas informações poderia ser usado o formato MARC. MARC é a sigla para Machine Readable Cataloging que quer dizer catalogação legível por computador. A partir deste momento, foi criada uma parceria com o software de gerenciamento do acervo físico Pergamum.

45 3.2

ANÁLISE DO SISTEMA PERGAMUM

O Pergamum - Sistema Integrado de Bibliotecas - é um software de gestão de bibliotecas criado pela Divisão de Processamento de Dados da Pontifícia Universidade Católica do Paraná, sendo comercializado desde o ano 1997.

O objetivo do Sistema Pergamum é o de aproveitar as principais idéias de cada instituição a fim de mantê-lo atualizado e dinâmico, tornando-o capaz de gerenciar qualquer tipo de documento. Atualmente o Pergamum conta com uma rede de 145 instituições por todo o país, entre elas universidades, faculdades, centros de ensino de 1º e 2º grau, assim como empresas, órgãos públicos e governamentais. Estas instituições formam uma grande rede nacional de bibliotecas, compartilhando um catálogo onde o usuário pode pesquisar e recuperar registros on-line.

O sistema oferece um modelo de interface gráfica que é compartilhado entre os integrantes da rede, diferenciado apenas pela logomarca presente na parte superior da tela.

Figura 10-Interface do sistema Pergamum da UFSC. Fonte: Universidade Federal De Santa Catarina(2008)

46

Figura 11 - Interface do sistema Pergamum do SENAI/SC Fonte: SENAI/SC (2008)

Figura 12 - Interface do sistema Pergamum da UFSC. Fonte: Universidade Do Sul De Santa Catarina(2008)

As figuras apresentadas neste capítulo mostram o estado atual das interfaces de três instituições do estado de Santa Catarina, onde é possível contatar de que forma elas são diferenciadas.

47

3.2.1 Avaliação da usabilidade do sistema Pergamum

Segundo Santos (2002, p.61) podemos entender as avaliações como procedimentos para aquisição de informações sobre a usabilidade ou potencial usabilidade de um sistema a fim de, tanto aprimorar recursos numa interface em desenvolvimento e seu material de suporte, quanto avaliar uma interface já finalizada.

Para o autor um método de avaliação pode ser descrito como “um processo de coleta de dados relevantes, referentes à operação de uma interação homem-computador”. Dentro dos métodos existentes destacam-se: análise de tarefa, avaliação cooperativa, modelagem formal, abordagens walkthrought, testes de usabilidade e avaliação heurística.

3.2.1.1 Avaliação heurística

A avaliação heurística, conforme descreve Santos (2002, p.61), é um método informal de inspeção de interfaces onde especialistas de usabilidade julgam cada elemento da interface, tendo como referência princípios heurísticos de usabilidade comumente aceitos. O termo “avaliação heurística” em IHC foi introduzido por Jakob Nielsen e Rolf Molich no início da década de 1990, quando propuseram um método através do qual o projetista aplica um número de princípios, ou heurísticas, ao projeto.

Santos (1993 apud Nielsen, 2002, p. 62) propôs uma série de heurísticas que estão detalhadas abaixo: 1. Visibilidade do status do sistema – Em um web site as duas principais informações que o usuário deseja saber são onde ele se encontra e para

48 onde ele pode ir. Cada página deve conter uma indicação referente a seção a que ela pertence. Também devem estar em evidência links para outras páginas, pois o usuário pode estar vindo de qualquer outra parte do sistema.

2. Equivalência entre o sistema e o mundo real – Falar a mesma linguagem que todos os visitantes de um web site é praticamente impossível, tendo em vista que cada usuário tem vivências diferentes entre si. É preciso prestar atenção nesse fato, definir corretamente o público específico a ser atingido e adaptar a linguagem de acordo com essa informação 3. Controle do usuário e liberdade – Os sites devem permitir que o usuário sinta-se livre e com controle sobre suas ações, apesar dos navegadores já oferecerem saídas de emergência. Esse controle pode ser feito com a inclusão de um botão “Home” em cada página.

4. Consistência e padrões – O conteúdo e os botões devem usar palavras consistentes. Links, títulos e cabeçalhos devem ser analisados para não confundir o usuário. A contradição das informações encontradas nas páginas como o título ou cabeçalho, comparadas com o texto dos links que apontam para elas, pode fazer o usuário pensar que está no local errado. Nenhum site está isolado. Deve estar adequado ao resto da web, utilizando, por exemplo, cor de link padrão, que na internet significa linguagem HTML. Sair desse padrão pode tornar mais difícil a compreensão do site pelo usuário.

5.

Prevenção de erro – A linguagem HTML tem varias limitações, como inserção de formulários, usual fonte de erros. Uma maneira de evitar esses erros é utilizar a linguagem Java Script para geração desses formulários.

6. Reconhecer ao invés de relembrar – Reconhecer um determinado local em um web site apenas olhando a página em que se encontra, sem precisar lembrar seu caminho para a página principal faz com que o usuário se sinta menos perdido. Para isso é preciso desenvolver bons rótulos e links descritivos.

7. Flexibilidade e eficiência de uso – O site deve ser fácil de ser inserido na lista de favoritos (bookmarks). O caminho deve ser fácil para todas as partes do site. Evitar o uso de frames, pois dificultam o uso de bookmarks, assim como a geração de URLs temporárias. Páginas que têm o seu conteúdo alterado regularmente é outro fator que deve ser observado com cuidado.

49 Atualizar somente o conteúdo, com o mesmo link. Isso permite que o link seja usado em outros sites.

8. Estética e design minimalista – Uma maneira de ter certeza de que o usuário não está recebendo nem muita nem pouca informação é distribuindoa de forma hierárquica, usando um nível progressivo de detalhes. Assim o próprio usuário decide se quer se aprofundar no assunto. Assegurar que o conteúdo foi escrito especificamente para web e não apenas transcrito de algum material impresso.

9. Auxiliar usuários a reconhecer, diagnosticar e recuperar ações erradas – As mensagens de erro não devem apenas mostrar textos explicativos, devem sempre oferecer uma solução plausível para a situação.

10. Ajuda e documentação - Alguns sites necessitam de ajuda para realizar algumas tarefas. Havendo links nas seções principais para a ajuda ou integrála em cada página faz com que o usuário se sinta seguro, com o auxílio por perto.

Para a avaliação da interface do sistema de pesquisa atual sugere-se uma breve avaliação baseada na Heurísticas de Nielsen(1993), a fim de detectar aspectos críticos na usabilidade do sistema, relacionando com propriedades comuns de outras interfaces.

A técnica de avaliação heurística envolve um pequeno grupo de avaliadores que julgam características da interface a fim de fornecer evidências concretas de quais aspectos devem ser aperfeiçoados. Entretanto, para fins de pesquisa, será feita uma análise sucinta apenas dos itens mais críticos da interface.

50

Figura 13- Interface do sistema de pesquisa da Biblioteca Universitária Unisul Fonte: Universidade Do Sul De Santa Catarina (2008) Tabela 1 - Problemas encontrados na Interface do sistema de pesquisa da Biblioteca Universitária Unisul 1 Visibilidade do status do sistema O título da página contém apenas a palavra Unisul (a). A falta de informação adicional pode dificultar que o usuário encontre a ferramenta, caso insira em sua “lista de favoritos” (bookmarks). Apenas a logo (a) situada na parte superior, identifica o sistema como parte da Unisul, muito embora a identidade visual do restante da interface (g) não seja consistente com o portal da Unisul; 3 Controle do usuário e liberdade Existe recurso de retornar ao início ou a página anterior (c), embora estes itens estejam pouco visíveis; 4 Consistência e padrões Existe uma relação consistente em praticamente toda interface (g), com exceção da constante variação e estilos de botões (f) e diferentes formatos de links (b)(c)(d) (sublinhados ou não, negritos, tamanho de fonte). Logo acima dos campos de pesquisa encontramos um link “EMPRÉSTIMO ENTRE BIBLIOTECAS” (b), completamente inconsistente com o resto da interface e apontando para um formulário fora do sistema de pesquisa.

6 Reconhecer ao invés de relembrar Em nenhum momento é informado claramente que se trata da interface do sistema de pesquisa da biblioteca. Tampouco como a ferramenta pode ser útil ao usuário.

7 Flexibilidade e eficiência de uso O título da página contém apenas a palavra Unisul. A falta de informação adicional pode dificultar que o usuário encontre a ferramenta, caso insira em sua “lista de favoritos” (bookmarks).

8 Estética e design minimalista Excesso de elementos de pesquisa avançada (g) pode dificultar realização da tarefa; “A menos que sejam bibliotecários tecnicamente qualificados, os usuários não sabem usar a de pesquisa avançada.”

(NIELSEN; LORANGER,2007, p.150).

51

Figura 14 - Página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul.

Fonte: Universidade Do Sul De Santa Catarina (2008) Tabela 2 - Problemas encontrados na página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul.

3 Controle do usuário e liberdade O resultado da busca oferece uma paginação (b) muito extensa, sem possibilidade de configurar o número de itens por página.

4 Consistência e padrões O titulo do item encontrado(c) não parece ser link.

6 Reconhecer ao invés de relembrar O sistema informa qual o termo buscado e o total de registros encontrados (g), mas não informa de que forma o resultado está ordenado.

8 Estética e design minimalista Pouco destaque nos elementos de filtro de resultados (a) e detalhes do item (e).

9 Auxiliar usuários a reconhecer, diagnosticar e recuperar ações erradas Existe botão de ajuda. Ao clicar apresenta uma mensagem de erro “indisponível no momento!” (f).

10 Ajuda e documentação Não há ajuda ou documentação disponível.

52

Figura 15 - Página sem resultados do sistema de pesquisa da Biblioteca Universitária Unisul Fonte: Universidade Do Sul De Santa Catarina (2008) Tabela 3 - Problemas encontrados na página sem resultados do sistema de pesquisa da Biblioteca Universitária Unisul.

1 Visibilidade do status do sistema O sistema não informa que esta é uma página de resultado de pesquisa. Apenas informa uma mensagem de erro.

9 Auxiliar usuários a reconhecer, diagnosticar e recuperar ações erradas O sistema apresenta um feedback indicando que não foram encontrados resultados para os parâmetros digitados (a). A palavra Erro 1 pode causar a impressão que de o sistema apresentou uma falha. O sistema não solicita ao usuário a revisão dos parâmetros digitados, nem a possibilidade de entrar em contato com os administradores do site, assim como sugerem Rosenfeld e Morville (1998).

10 Ajuda e documentação Não há ajuda ou documentação disponível.

3.2.1.2 Avaliação com usuários

Para compreender melhor a interação dos usuários com a interface e coletar dados para subsidiar o trabalho de design, foram realizadas avaliações com usuários no campus Unisul norte da ilha (apêndice A). A atividade consistiu em uma avaliação qualitativa que para Amstel (2008), é um tipo de pesquisa que trabalha com descrições, comparações e interpretações ao invés de estatísticas, regras e

53 outras generalizações. Os testes contaram com nove participantes, embora Nielsen (2000) afirme que os melhores resultados provêm de não mais do que cinco usuários em testes rápidos, já que após o quinto teste os resultados começam a se repetir.

Na ocasião do teste foi pedido aos participantes que realizassem uma pesquisa no sistema de Pergamum da biblioteca universitária Unisul. A atividade consistia em encontrar o item O design do livro, verificar a disponibilidade do mesmo na unidade da biblioteca norte da ilha e retornar à página inicial. Os participantes foram orientados a verbalizar todo procedimento ignorando a presença do avaliador.

O avaliador, por sua vez, fazia anotações e cronometrava o procedimento. Em seguida foram feitas duas perguntas para avaliação da experiência: quais as dificuldades encontradas na execução da atividade (caso houvesse) e quais as sugestões para uma melhor experiência na realização da tarefa. Todos os testes seguiram o mesmo procedimento e foram feitos no mesmo local de trabalho.

Durante as atividades percebeu-se que a maior dificuldade encontrada pelos participantes foi a presença de diversas opções de pesquisa avançada que não sugeriam uma relação formal entre os elementos e ainda contrariavam as diretrizes levantadas na fundamentação deste trabalho.

A principal diretriz para uma busca avançada é esta: evite-a. Poucas pessoas utilizam a pesquisa avançada corretamente, e na maioria das vezes ela traz mais problemas que benefícios. (NIELSEN, 2007, p.150)

Figura 16 - Página de resultados da avaliação com usuários Fonte: Universidade Do Sul De Santa Catarina (2008)

O resultado da pesquisa por “o Design do livro” (figura 16) encontrou cento e quarenta e nove registros, divididos em oito páginas, cada página contendo vinte registros. O item em questão só seria encontrado na segunda página, sendo necessário o uso da paginação ou uma nova pesquisa utilizando algum dos filtros de

54 pesquisa avançada ou de ordenação. Apesar da existência de elementos de filtro dos resultados (figura 14-a), este recurso não foi encontrado por nenhum dos participantes. Durante a atividade, quando o resultado não aparecia nos primeiros registros os participantes realizavam uma pesquisa, utilizando outro filtro, numa média de quatro pesquisas por participante. A paginação foi utilizada por apenas um dos participantes.

A mensagem exibida na página sem resultados (Figura 15) “Erro 1: Não existe nenhum registro cadastrado!”, causou, em algumas situações, a idéia de que o item não estava cadastrado no sistema.

Figura 17 - Página de detalhes da avaliação com usuários Fonte: Universidade Do Sul De Santa Catarina (2008)

Outro ponto critico é o botão de “detalhes”(figura 17-a) que informa detalhes técnicos daquele item, enquanto que o link oferecido no título (figura 17-b) do item passou despercebido em vários momentos. Este foi um dos pontos cruciais do teste, causando bastante dificuldade para alguns participantes.

55

Figura 18 - Página de detalhes da avaliação com usuários Fonte: Universidade Do Sul De Santa Catarina (2008)

Na página referente ao item, os detalhes sobre disponibilidade/quantidade só aparecem com o uso da rolagem (figura 18-b), criando grande dificuldade aos participantes que muitas vezes retornavam à listagem para procurar aquela informação. A informação referente à disponibilidade daquele item na unidade da biblioteca (figura 18-a) foi outro elemento que passou despercebido o que poderia causar maiores problemas durante uma pesquisa física na biblioteca, caso o item estivesse emprestado. O link para retornar à página inicial causou dificuldade em todos os testes. Todos os participantes buscavam o clique na logo apresentada no topo esquerdo da ferramenta. Ao perceber que aquele elemento não oferece link, alguns utilizavam o botão “back” do navegador ou exploravam a ferramenta em busca do link. A experiência deixou alguns participantes bastante frustrados.

56

Tabela 4 - Problemas encontrados na página de resultados do sistema de pesquisa da Biblioteca Universitária Unisul.

Principais observações (por ordem de repetição) excesso de elementos de filtro dificuldade em encontrar o botão de pesquisa titulo do item não parecia clicável dificuldade em encontrar o link para página inicial pesquisa não aceitou o uso de aspas pouca cor aparência desorganizada informação sobre disponibilidade escondida pelo scroll resultado da pesquisa não é ordenado por relevância não existe filtro apenas para os resultados da pesquisa. não há possibilidade de ordenar resultados(existe este elemento, mas o mesmo não foi localizado) resultados não são listados por relevância falta de possibilidade de ordenação paginação longa demais baixa hierarquia visual, pregnância; titulo do item não parece clicável. localização do link que retorna ao início ruim.

Dificuldade em distinguir o botão “voltar” de “início”. localização do link que retorna ao início ruim. Parece apontar para o portal da Unisul. destacar o elemento que informa a quantidade de itens disponíveis na unidade Principais criticas (por ordem de repetição) reduzir a desorganização visual resultados apenas por itens disponíveis suprimir excesso de elementos de filtro possibilidade de refinar resultados destacar quantidade de itens disponíveis na unidade criar busca avançada numa nova página utilizar cores para destacar elementos criar categoria sobre área de conhecimento melhor utilização do botão “detalhes” relativo ao item

57 3.2.1.3 Avaliação dos princípios do design

Baseando-se nos princípios do design é possível analisar características visuais que podem tanto orientar o usuário, quanto confundi-lo durante suas atividades. Esta análise tem por objetivo determinar aspectos fundamentais no bom funcionamento da interface enquanto mecanismo de pesquisa.

A interface apresenta diferentes níveis de agrupamento em sua composição formal. Um topo contendo a marca da Unisul, seguido logo abaixo por uma barra de menu representada por elementos compostos de ícones e links em texto. Estes elementos apresentam semelhança visual entre si, mas as funções destinadas para cada elemento não possuem uma relação direta entre si. Portanto, observar uma nova relação de posicionamento entre si e com o restante da ferramenta facilitaria na busca do usuário.

No conteúdo principal onde há uma caixa de texto e outros elementos de filtro de pesquisa avançada não há uma boa relação de proximidade e alinhamento, tornando o que Radfarher (1999) considera “a impressão de uma bagunça”.

Abaixo da área destinada aos termos da pesquisa apresenta-se uma outra barra de itens, que em função de sua relação de contraste com o espaço em branco logo abaixo, parece tratar-se de títulos da tabulação de resultados. Onde ao executar uma pesquisa os elementos tornam-se clicáveis, demonstrando falta de consistência tanto visualmente quando na ação desempenhada por cada link; um abre janela; outro abre formulário em nova página; outro apresenta mensagem de erro; outro não executa nenhuma ação(sem feedback).

O resultado da pesquisa é apresentado em forma de repetição, onde cada registro é estruturado por um título reforçado em azul, referência na cor cinza e dois botões de cores complementares entre si, alinhados à direita. A relação entre os registros da listagem se dá através de uma linha e uma relação de contraste criada a partir de uma cor de fundo alternada. Apesar do contraste entre os registros, a legibilidade melhoraria sensivelmente com o uso de maior espaçamento entre linhas.

A interface em geral apresenta baixo contraste entre os elementos, alinhamentos pouco consistentes e um grande espaço em branco reforçado pelo contraste com outros elementos da interface.

58 Conforme esta análise é possível propor uma readequação visual de acordo com os princípios do design, cujo resultado deve não apenas ser em função do aspecto estético, mas principalmente como fator determinante na orientação visual do usuário, a fim de propor uma ferramenta fácil, eficiente e agradável.

3.3

ANÁLISE DE SIMILARES

Esta análise de similares tem como objetivo realizar um levantamento de algumas soluções utilizadas por interfaces para mecanismos de busca na web.

Para o levantamento foram consideradas duas interfaces de sistemas para bibliotecas que apresentam de forma consistente todas as diretrizes colocadas pela fundamentação teórica deste trabalho. A seguir estão alguns exemplos com comentários relacionados aos principais recursos de navegação e de interação oferecidos.

A Interface de pesquisa rápida da NCSU Libraries (Figura 19) oferece uma caixa de texto simples, objetiva e de largura satisfatória.

Figura 19 - Interface de pesquisa rápida da NCSU Libraries.

Fonte: NCSU Libraries Online Catalog (2008)

A Interface de pesquisa avançada da NCSU Libraries (Figura 20) fica oculta por um menu de aba, assim como recomenda Nielsen e Loranger (2007).

Neste tipo de pesquisa é possível utilizar uma serie de campos específicos a fim de sofisticar o resultado da pesquisa. Esta interface apresenta um recurso interessante de tutoria (hint), que auxilia o usuários com dificuldade na utilização dos recursos.

59

Figura 20 - Interface de pesquisa avançada da NCSU Libraries.

Fonte: NCSU Libraries Online Catalog (2008)

A página de resultados da NCSU Libraries (Figura 21) permite que o usuário filtre o resultado de suas pesquisas a partir de diversos recursos. É possível manipular resultados por itens disponíveis, recurso muito útil para bibliotecas. O sistema oferece sistema de navegação por área de interesse integrada com a busca, possibilidade de diferentes visualizações e classificação da listagem.

60

Figura 21 - Recursos para manipulação dos resultados da busca NCSU Libraries.

Fonte: NCSU Libraries Online Catalog (2008)

A página sem resultados da NCSU Libraries (Figura 22) apresenta claramente que nenhum resultado foi encontrado, e oferece sugestões e outros recursos para que o usuário tente uma nova pesquisa. O recurso de ajuda está sempre presente e bem destacado em todo momento da navegação.

Figura 22 - Página sem resultados da busca NCSU Libraries.

Fonte: NCSU Libraries Online Catalog (2008)

Toda interface do NCSU Libraries apresenta boa harmonia visual.

Elementos agrupados e alinhados de forma consistente. Hierarquia entre os elementos, bom contraste dos espaços e padrão de cores consistente, como no caso do azul apresentado em todos os links em texto.

61

Figura 23 - Interface do sistema de busca da Emerald.

Fonte: Emerald (2008)

A interface da pesquisa rápida (quick search) da Emerald (Figura 23) apresenta uma grande caixa de texto e algumas opções de filtros. Os elementos desta interface apresentam boa hierarquia e consistência, embora o botão de pesquisa não tenha recebido a ênfase devida. Um recurso muito interessante desta interface é o histórico detalhado das pesquisas realizadas pelo usuário.

62

Figura 24 - Recursos para manipulação dos resultados da busca Emerald.

Fonte: Emerald (2008)

A página de resultados da Emerald (Figura 24) também apresenta diversos filtros e recursos de manipulação de resultados de forma clara e precisa, conforme orientam os autores Rosenfeld e Morville (1999) na fundamentação teórica deste trabalho. Esta página de resultados apresenta recursos interessantes como um sistema de abas para classificar resultados, opções de pesquisar apenas nos resultados e salvar resultados da pesquisa. O link direto para HTML/PDF no caso de material on-line oferece um atalho interessante para usuários que buscam por esse tipo de material. a) Recomendações a partir da análise das interfaces da NCSU Libraries: a. Interface; – caixa de texto simples, clara, com largura que possibilita leitura eficaz; – pesquisa avançada e opção por diferentes conteúdos a partir de navegação por abas; – Dicas para utilização da pesquisa avançada; b. página de resultados; – navegação integrada com resultado da pesquisa oferecendo navegação por categorias, assuntos, etc;

63 – listar apenas itens disponíveis na biblioteca; – diferentes visualizações por item (resumida ou detalhada); – Possibilidade de classificar resultados, por relevância, autor, título, etc; c. página sem resultados; – oferecer sugestões e outros recursos para que o usuário tente uma nova pesquisa; – oferecer recurso de ajuda.

Recomendações a partir da análise das interfaces da Emerald: a. Interface; – área de pesquisa bem delimitada; – histórico detalhado das pesquisas realizadas; b. página de resultados; – recurso de pesquisar nos resultados; – salvar resultados da pesquisa; – selecionar quantidade de itens por página; – link direto para documentos online; A partir dessas recomendações foi realizado o desenvolvimento de uma nova proposta conceitual de interface para o sistema de pesquisa da biblioteca universitária Unisul.

64 4

4.1

FASE CONCEITUAL

CONCEITO DA INTERFACE

Dada a importância do sistema de pesquisa Pergamum da biblioteca universitária, é fundamental que a interface proposta para este sistema, seja capaz de adequar-se às necessidades de seus usuários, auxiliando na realização de suas atividades. As soluções a serem adotadas baseiam-se nas recomendações obtidas a partir da fundamentação teórica, avaliação da interface do sistema atual e de aspectos levantados a partir da análise de similares apresentada no capítulo anterior.

A interface deverá propor uma identidade clara e consistente, onde o usuário perceba que está no local certo, não apenas para realizar uma pesquisa mas para efetivamente encontrar o que está procurando. Deverá apresentar uma linguagem simples, mesmo para aqueles que não estejam habituados com pesquisas bibliográficas. As soluções a serem adotadas para os recursos e funcionalidades do sistema devem ser claros, consistentes e orientados para a realização da tarefa. A interface deve também estabelecer um espaço de comunicação (feedback) com o usuário, a fim de solucionar eventuais dúvidas que venham a surgir.

Observar os princípios do design, criando uma interface cuja linguagem possibilite uma boa superfície de comunicação entre o usuário e o sistema, fator determinante na orientação do usuário, a fim de propor uma ferramenta fácil, eficiente e agradável.

65 5

FASE PROJETUAL

5.1

DESENVOLVIMENTO DO MODELO CONCEITUAL

Para Santos (2006) os protótipos podem ser entendidos como modelos funcionais construídos a partir de requisitos determinados anteriormente a fim de simular a aparência e funcionalidade da interface a ser desenvolvida, ainda que de forma incompleta. Por meio deste protótipo, os futuros usuários, bem como aqueles que irão desenvolvê-lo, poderão interagir, avaliar, refinar e aprovar as características mais marcantes da interface e da funcionalidade da aplicação. “Um protótipo é uma representação da interface com a qual o usuário pode interagir e oferece informações para propor mudanças e melhorias.” (SANTOS, 2006, p.259).

A apresentação do modelo conceitual será feito em duas etapas, conforme proposto na metodologia; informacional, por meio de wireframes1 e visual, por meio do layout das telas, com tratamento visual dos elementos da interface.

Os layouts a serem apresentados foram selecionados (apêndice B) entre outras alternativas pela bibliotecária responsável pela unidade da Biblioteca Unisul do Campus Norte da Ilha.

1

“[...] É um esqueleto que organiza os elementos da interface, sem a interferência do projeto visual” (MEMÓRIA, 2005, p.36)

66 5.2

WIREFRAMES

5.2.1 Tela de busca simples

Figura 25 - Tela de Busca simples.

a. Campo de texto: Para digitação do termo de busca. Deve permitir a inserção de expressões booleanas; b. botão “Pesquisar em todo conteúdo”: Enviar os termos digitados para consulta no banco de dados; c. exibir opções avançadas: Exibe campos e filtros para refino da busca (Figura 26); d. balões de ajuda: Exibem dicas de pesquisa, aleatórias ou não.

67 5.2.2 Tela de busca avançada

Figura 26 - Tela de Busca avançada.

a. Campo de texto: Para digitação do termo de busca. Deve permitir a inserção de expressões lógicas booleanas; b. Campo de texto: Para digitação do termo de busca. Deve permitir a inserção de expressões lógicas booleanas; c. drop-down “Pesquisar em”: Exibe lista de campos onde será realizada a busca; d. drop-down “Operadores”: Exibe lista de conectores lógicos (OU, E, EXCETO) para processar a busca; e. drop-down Tipo de Obra”: Exibe lista de materiais (livro, periódico, DVD, CDROM etc.); f. drop-down “Selecione o campus”: Exibe lista de bibliotecas da universidade; g. check-box “Apenas itens disponíveis”: Quando selecionado limita os resultados a apenas itens disponíveis fisicamente na biblioteca.

68

Figura 1 – Tela de ajuda da Busca avançada.

a. Ícone Interrogação: Link para ajuda contextual. Mouse sobre ícone exibe janela com texto informativo. Mouse sai e oculta a janela. Em caso de clique a janela permanece fixa, independente da sobreposição do ponteiro do mouse. Clique fora da janela ou no ícone fechar, oculta a janela.

69 5.2.3 Página de resultados

Figura 27 - Tela de resultados.

a) Visualização da pesquisa atual: Caixas de texto que oferecem todos os termos da pesquisa atual de forma que o usuário possa refinar a pesquisa fechando ou incluindo nova categoria por meio dos resultados relacionados (figura 28); b) ordenação: Sumário interativo que oferece o número de materiais encontrados a partir dos termos selecionados acima, check-box para selecionar o tipo de

70 ordenação (alfabética, relevância, etc.) e check-box para selecionar quantidade de materiais a serem exibidos por página; c) lista de resultados: lista que apresenta detalhes básicos sobre cada material (figura 29); d) paginação: indica a quantidade de páginas e serve para navegação; e) campo de texto: Para digitação do termo de busca. Deve permitir a inserção de expressões lógicas booleanas. Pesquisa apenas nos resultados da pesquisa.

71

Figura 28 - Filtros da tela de resultados.

a. Filtro de pesquisa: Ao clicar nos termos relacionados o sistema inclui um novo filtro de pesquisa que é somado aos termos anteriores por meio de um conector booleano “E” (não visual), onde cada termo pode ser retirado independente da ordem de inclusão. Ao incluir ou retirar um filtro o sistema renova a página de resultados; b. resultados relacionados: Apresentados em forma de lista, organizados por categorias (assunto, autor, título, etc), onde cada categoria é ordenada por número de resultados relacionados.

72

Figura 29 - Listagem de resultados.

a. Lista de resultados: Apresenta título, referência, formato, número de chamada; b. título do material: Quando clicado, apresenta página de detalhes do material; c. detalhes: Indica disponibilidade do material na biblioteca ou oferece atalho para aplicações externas.

73 5.2.4 Página detalhes da obra

Figura 30 - Página de detalhes da obra.

a. Paginação: Exibe opções ”voltar para os resultados”, “Próxima” e “Anterior”; b. funcionalidades “Imprimir” e “E-mail”; c. exemplares: Informa detalhes sobre todos os materiais de cada obra, disponíveis ou não. Link para efetuar reserva.

74

Figura 31 - Janela de envio

a. Enviar: Ao enviar a obra é exibida uma janela modal que oferece um campo para inclusão de endereço de email do destinatário. Para ocultar a janela deve-se clicar no “X”.

75

Figura 32 - Janela de reserva

a. Reserva de Material: Ao solicitar uma reserva é exibida uma janela modal que oferece campos para login e Drop-down para selecionar de qual unidade da biblioteca o usuário deseja retirar sua reserva. Para ocultar a janela deve-se clicar no “X”.

76 5.2.5 Página sem resultados

Figura 33 - Página sem resultados.

a. Página sem resultados: Repete os termos da pesquisa, oferece sugestões para uma nova pesquisa e outros tipos de ajuda.

77 5.2.6 Notificações do sistema

Figura 34 - Notificações do sistema

•

Pesquisa incorreta: Exibida ao deixar o campo do texto vazio;

•

reserva efetuada com sucesso: confirmação da reserva (figura 32);

•

email incorreto: Exibida ao digitar email incorretamente (figura 31);

•

email enviado com sucesso: Confirmação do envio de email (figura 31);

•

identificação incorreta: Exibida ao digitar número de matrícula e/ou senha incorretamente (figura 32).

78 5.3

LAYOUTS DAS TELAS

A partir da criação (organização) dos elementos da interface conforme apresentado nos wireframes deu-se início ao desenvolvimento dos layouts, buscando aproximar-se ao máximo possível de uma proposta final. A partir do conceito da interface, buscou-se adotar uma linguagem simples e limpa, a fim de valorizar os elementos de interação. As imagens a seguir ilustram o aspecto visual do modelo conceitual.

Na interface de pesquisa (figura 35), optou-se por um grande campo de pesquisa, destacado dentre os outros elementos da interface possibilitando a inclusão de sentenças maiores. Não foram utilizados elementos de filtro na pesquisa básica. Esta característica é reforçada pela legenda presente no botão que procede a consulta. Ainda nesta tela apresentam-se balões de ajuda “tooltips” cuja função é auxiliar os usuários em pequenas dúvidas.

Figura 35 - Interface de busca simples

79 O recurso de pesquisa avançada (figura 36) pode ser exibida ou ocultada na mesma página, a partir de um botão discretamente posicionado ao lado do botão de pesquisa. Optou-se por criar um botão com pouco contraste, a fim de não confundir o usuário com o botão de pesquisa, sendo clicado apenas quando o usuário tem certeza do que se trata.

Figura 36 - Interface de busca avançada.

A pesquisa avançada apresenta um elemento de ajuda que exibe uma janela flutuante com texto explicativo sobre o recurso (figura 37). Esta foi a maneira de implementar a ajuda contextual na interface.

80

Figura 37 - Ajuda contextual na interface.

A página de resultado da pesquisa (figura 38) oferece funcionalidades da navegação pelos resultados e da possibilidade de escolher a forma de ordenação e a quantidade de registros a serem exibidos por página.

As obras são apresentadas resumidamente, embora se tenha optado por apresentar imediatamente a disponibilidade do exemplar.

Nesta tela ainda é apresentada uma lista de resultados relacionados, como assuntos, obras, títulos, tipos de obras e bibliotecas. Estas listas podem ser expandidas ou recolhidas permitindo a adição de palavras-chave por parte do usuário.

81

Figura 38 - Página de resultado da pesquisa.

A página de detalhes da obra (figura 39) exibe, além de titulo, referência bibliográfica e do resumo, as funcionalidades de envio do resultado por e-mail, impressão do resultado e solicitação de reserva. Ainda é possível visualizar o registro anterior, voltar à lista de resultados e visualizar o registro seguinte. Ainda nesta tela são exibidas as opções de busca e a funcionalidade de adição de palavras-chave por parte do usuário.

82

Figura 39 - Página de resultado da pesquisa.

Também foram implementadas as notificações e caixas de diálogo da interface. As imagens a seguir ilustram a exibição de algumas das mensagens aviso, de advertências e as caixas de diálogo da interface.

83

Figura 40 - Aviso de n達o preenchimento da caixa de busca.

84

Figura 41 - Caixa de diรกlogo para reserva

85

Figura 42 - Caixa de diรกlogo para envio por e-mail

86 5.4

RECOMENDAÇÕES PARA A IMPLEMENTAÇÃO

O trabalho apresentado trata de uma proposta conceitual de como seria a apresentação visual e de como se dariam as interações na interface de pesquisa e páginas relacionadas. Em virtude do escopo limitado e das delimitações do projeto, é possível que o mesmo seja implementado na prática. Para isto é necessário maior aprofundamento das etapas metodológicas, realização de protótipos a serem submetidos a testes de usabilidade a fim de validar o projeto diretamente com o usuário final.

Após implementada, a ferramenta deve receber acompanhamento constante, sendo realizados testes periódicos, para detectar eventuais problemas que não foram percebidos anteriormente. Também é possível adotar ferramentas de geração de estatísticas de acesso que irão detalhar o comportamento do usuário na ferramenta, sendo estas informações muito importantes para o acompanhamento e para justificar alguma eventual mudança na organização da ferramenta.

87 6

CONCLUSÃO

O tema deste trabalho - Design de interface para o sistema de pesquisa Pergamum da Biblioteca Universitária Unisul – surgiu da percepção da importância das aplicações da web na vida acadêmica. Devido ao crescente número de aplicações surgidas com a popularização dos meio digitais como web sites, blogs, wikis a quantidade de informação demonstra um ritmo sem precedentes na história da humanidade. Em meio ao crescente volume de dados disponíveis na web tornase cada vez mais difícil encontrar informações especificas. Em meio a esta situação as empresas já buscam formas de otimizar a busca por informação em seus sistemas e o relacionamento de suas informações com outros sistemas de pesquisa, como o Google, por exemplo. Desta forma, percebe-se que é importante não apenas projetar uma buscar especifica, mas projetar uma forma de encontrar informações.

Por observação pessoal, percebeu-se que as interfaces desenvolvidas para o sistema da biblioteca não cumprem seu papel fundamental de encontrar facilmente uma determinada informação. A partir disto vislumbrou-se a possibilidade de trabalhar uma proposta que pretende atender os requisitos dos usuários na realização de sua tarefa.

Ao iniciar o trabalho foram feitas pesquisas bibliográficas as quais demonstraram que apesar de o design de interface ser uma disciplina recente, já existem muitas informações consolidadas no meio científico sobre as características que envolvem o projeto. A partir deste aprofundamento teórico analisou-se a interface em seu estado atual. Foram feitos testes com usuários a fim de aproximarse ao máximo da situação real de utilização, juntamente com questionários qualitativos para medir o nível de satisfação do usuário. Estas análises foram fundamentais para a geração da proposta já que estabeleceram as características desejáveis e requisitos para a implementação da proposta.

A metodologia de projeto mostrou-se adequada ao prever a criação de protótipos de baixa fidelidade para detectar a relação dos elementos entre si e com o todo, orientando detalhadamente a criação dos layouts, reduzindo o tempo de desenvolvimento e prevendo eventuais erros.

Apesar da conclusão e validação da proposta fica como sugestão para futuros desdobramentos da pesquisa um teste com usuários utilizando protótipo

88 semi-funcional a fim de quantificar resultados, comparando com a interface em seu estado atual. Desta forma ainda é possível rever conceitos e refinar eventuais problemas não detectados na elaboração da proposta.

Cabe ainda ressaltar a motivação para a realização desta pesquisa e sobre o aprendizado adquirido ao longo do processo de elaboração e desenvolvimento. A motivação para esta pesquisa foi uma ótima possibilidade de obter conhecimento com aplicação tanto para a prática profissional quanto para a prática acadêmica.

89 REFERÊNCIAS

AMSTEL, Frederick van. Usabilidoido: Como fazer uma pesquisa qualitativa.

Disponível em <http://www.usabilidoido.com.br/como_fazer_uma_pesquisa_qualitativa.html>Acess o em: 29 nov. 2008.

BERNERS-LEE, Tim. Information management: a proposal. 1989. Disponível em <http://www.w3.org/History/1989/proposal.html>Acesso em: 15 set. 2008.

BONSIEPE, Gui. Design: Do Material ao Digital. Florianópolis: FIESC/iel, 1997.

BÜRDEK, Bernard E. Diseño: História, teoria y prática del diseño industrial.

Barcelona: Gustavo Gili, 2. Ed. 1999.

CAPLIN, Steve. Diseño de Iconos: Iconos Gráficos para el Diseño de Interfaces.

Barcelona: Gustavo Gili, 2001.

CYBIS, A. W. A Identificação dos Objetos de Interfaces Homem-Computador e de seus Atributos Ergonômicos. Florianópolis, 1994.

DONDIS, Donis. Sintaxe da Linguagem Visual. 2ª edição. São Paulo: Martins Fontes, 1991.

EMERALD. Disponível em <http://www.emeraldinsight.com/> Acesso em 03 Out. 2008.

FARINA, M. Psicodinâmica das cores em comunicação. São Paulo, Editora Edgard Brücher Ltda., 1990.

FLEMING, Jennifer. Web navigation: designing the user experience. Sebastopol, CA : O'Reilly, 1998.

FOX, Chiara. Making IA real. Disponível em: <www.infotoday.com/il2001/presentations/Fox.pps>. Acesso em: 15 set. 2008.

GARRETT, Jesse James. Os Elementos da Experiência do Usuário. Disponível em <http://www.jjg.net/ia/elements_pt.pdf>Acesso em: 15 set. 2008.

GOOGLE BOOKS. Pesquisa de Livros do Google. Disponível em <http://books.google.com/.> Acesso em: 03 Set. 2008.

GUIMARÃES, Luciano. A cor como informação: a construção biofísica, lingüísticae cultural da simbologia das cores. 2. ed. São Paulo: Annablume, 2000.

KRUG, Steve. Don't Make Me Think: A Common Sense Approach to Web Usability.

New Riders, 2000.

90 LEÃO, Lúcia. O Labirinto da hipermídia: arquitetura e navegação no ciberespaço.

São Paulo: Iluminuras, 1999.

LIVRARIA MARTINS FONTES PAULISTA. Disponível em: <http://www.martinsfontespaulista.com.br>. Acesso em 15 set 2008.

MEMÓRIA, Felipe. Design para internet:Projetando a experiência perfeita. Rio De Janeiro: Elsevier, 2005.

MERCADO LIVRE BRASIL. Disponível em: <http://www.mercadolivre.com.br>.

Acesso em 15 set 2008.

NCSU LIBRARIES ONLINE CATALOG. Disponível em <http://www.lib.ncsu.edu/catalog/> Acesso em 03 Out. 2008.

NIELSEN, Jacob. Alertbox: Jakob Nielsen's Newsletter on Web Usability. Disponível em: <http://www.useit.com/alertbox/>. Acesso em: 15 set. 2008.

NIELSEN, Jacob. Alertbox: Usability Testing With 5 Users. 2000. Disponível em: <http://www.useit.com/alertbox/20000319.html>. Acesso em: 29 nov. 2008.

NIELSEN, Jakob. Projetando Websites. Rio de Janeiro: Campus, 2000.

NIELSEN, Jakob; LORANGER, Hoa. Usabilidade na Web: Projetando WebSites com Qualidade. 1. ed. São Paulo: Editora Campus, 2007.

NIEMEYER, Lucy. Elementos de Semiótica Aplicados ao Design. Rio de Janeiro: 2AB, 2003.

NIEMEYER, Lucy. Tipografia: Uma apresentação. 4. ed. Rio de Janeiro: 2AB, 2006.

NETTO, Alvin Antônio de Oliveira. IHC - Interação Humano Computador: Modelagem e gerencia de interfaces com o usuário. Florianópolis: Visualbooks, 2004.

PIGNATARI, Décio. Informação Linguagem Comunicação. 10. ed. São Paulo: Cultrix, 1998.

PERAZZO, Luiz Fernando; VALENÇA, Maslova Teixeira. Elementos da Forma. Rio de Janeiro: Senac Nacional, 1997.

PREECE, Jennifer. Design de interação: Além da interação homem-computador.

Porto Alegre: Bookman, 2007.

RADFAHRER, Luli. Design/Web/Design. São Paulo: MarketPress, 2000.

REIS, G. Aula de AI na ECA: Sistema de Busca, 2004. Disponível em: <http://www.guilhermo.com/ai/apresentacoes/04-11-08_Aula_AI_ECA_Busca.pdf>.

Acesso em: 15 setembro 2008.

91 ROYO, Javier. Design Digital. São Paulo: Rosari, 2008 ROSENFELD, Louis; MORVILLE Peter. Information Architecture for the World Wide Web: Designing Large-Scale WebSites.1. ed. EUA: O'Reilly Media, 1998 SANTOS, Robson . Abordagem heurística para avaliação da usabilidade em Interfaces. In: Anamaria de Moraes. (Org.). Design e Avaliação de Interface. Rio de Janeiro: iUser, 2002, v. 1 , p. 59.

SANTOS, Robson Luís Gomes . Usabilidade de interfaces para sistemas de recuperação de informação na web: estudo de caso de bibliotecas on-line de universidades federais brasileiras. Orientadora: Anamaria de Moraes. Rio de Janeiro, 2006. 347 f.. Tese(Doutorado em Artes)-PUC-RJ. SENAI/SC. Disponível em:<http://biblioteca.sc.senai.br>. Acesso em 29nov 2008.

UNIVERSIDADE FEDERAL DE SANTA CATARINA. Disponível em: <http://aspro02.npd.ufsc.br>. Acesso em 29 nov 2008.

UNIVERSIDADE DO SUL DE SANTA CATARINA. Disponível em: <http://aplicacoes.unisul.br/pergamum/biblioteca/index.php >. Acesso em 29 nov 2008.

UNIVERSIDADE DO SUL DE SANTA CATARINA. Pró-Reitoria Acadêmica.

Programa de Bibliotecas. Trabalhos acadêmicos na Unisul: apresentação gráfica para Tcc, monografia, dissertação e tese. 2. ed. rev. e ampl. Tubarão: Editora.

Unisul, 2008.

92

APÊNDICE

93 APÊNDICE A - Roteiro de teste com usuários orientado à tarefas

Teste realizado no campus UNISUL norte da ilha no dia 29 de out. de 2008. Na ocasião foi pedido que os usuários executassem uma pesquisa no sistema de pergamum da biblioteca universitária UNISUL. A atividade consistia em encontrar o livro O design do livro, verificar a disponibilidade do mesmo na unidade da biblioteca norte da ilha e retornar à página inicial. Os participantes foram orientados a verbalizar todo o procedimento ignorando a presença do avaliador. O avaliador, por sua vez, fazia anotações e cronometrava toda atividade. Em seguida foram feitas duas perguntas para avaliação da experiência:quais as dificuldades encontradas na execução da atividade, se houvesse e quais as sugestões para uma melhor experiência na execução da tarefa. Todos os testes seguiram o mesmo procedimento e foram feitos no mesmo local de trabalho.

Dados recolhidos na atividade: Aluno 01 Curso: Design Tempo de conclusão da atividade: 1:39min.

Dificuldades: •

dificuldade em encontrar o botão de pesquisa;

•

excesso de elementos de filtro;

•

titulo do item não parecia clicável;

•

dificuldade em encontrar o link para página inicial.

Sugestões: •

aumentar o tamanho da caixa de texto da pesquisa.

Aluno 02

94 Curso: Design Tempo de conclusão da atividade: 5.38min.

Dificuldades: •

pesquisa não aceitou o uso de aspas;

•

excesso de elementos de filtro;

•

pouca cor;

•

aparência desorganizada.

•

informação sobre disponibilidade escondida pelo scroll.

Sugestões: •

reduzir a desorganização visual;

•

suprimir excesso de elementos de filtro.

Aluno 03 Curso: Design Tempo de conclusão da atividade: 1:55min.

Dificuldades: •

excesso de elementos de filtro;

•

resultado da pesquisa não é ordenado por relevância;

•

não existe filtro apenas para os resultados da pesquisa.

Sugestões: •

reduzir a desorganização visual;

•

suprimir excesso de elementos de filtro;

•

criar busca avançada numa nova página;

•

possibilidade de ordenar resultados apenas por itens disponíveis naquela unidade da biblioteca.

95

Aluno 04 Curso: Design Tempo de conclusão da atividade: 1:37min.

Dificuldades: •

excesso de elementos de filtro;

•

não há possibilidade de ordenar resultados(existe este elemento, mas o mesmo não foi localizado);

Sugestões: •

reduzir a desorganização visual;

•

destacar o elemento que informa a quantidade de itens disponíveis na unidade.

Aluno 05 Curso: Design Tempo de conclusão da atividade: 1:29min.

Dificuldades: •

resultados não são listados por relevância;

•

falta de possibilidade de ordenação;

•

paginação longa demais

Sugestões: •

reduzir a desorganização visual;

•

utilizar cores para destacar elementos;

•

possibilidade de refinar resultados.

Aluno: 06

96 Curso: Design Tempo de conclusão da atividade: 2:03min.

Dificuldades: •

excesso de elementos de filtro;

•

baixa hierarquia visual, pregnância;

•

titulo do item não parece clicável.

Sugestões: •

possibilidade de ordenar resultados apenas por itens disponíveis naquela unidade da biblioteca.

•

possibilidade de refinar resultados.

Aluno 07 Curso: Design Tempo de conclusão da atividade: 2:05min.

Dificuldades: •

excesso de elementos de filtro;

Sugestões: •

criar categoria sobre área de conhecimento.

•

possibilidade de ordenar resultados apenas por itens disponíveis naquela unidade da biblioteca.

Aluno 08 Curso: Design Tempo de conclusão da atividade: 2:02min.

Dificuldades: •

excesso de elementos de filtro;

97 •

titulo do item não parece clicável;

•

localização do link que retorna ao início ruim. Dificuldade em distinguir o botão “voltar” de “início”.

Sugestões: •

melhor utilização do botão “detalhes” relativo ao item;

•

possibilidade de ordenar resultados apenas por itens disponíveis naquela unidade da biblioteca.

Aluno 09 Curso: Design Tempo de conclusão da atividade: 1:27min.

Dificuldades: •

baixa hierarquia visual, pregnância;

•

localização do link que retorna ao início ruim. Parece apontar para o portal da UNISUL.

•

destacar o elemento que informa a quantidade de itens disponíveis na unidade.

Sugestões: •

destacar o elemento que informa a quantidade de itens disponíveis na unidade.

•

Reunir informações sobre o item num mesmo lugar, sem a necessidade de um segundo elemento (abas).

Comentários do avaliador:

98 Praticamente todos os participantes da pesquisa tiveram dificuldades com a utilização dos filtros de pesquisa e a falta da possibilidade de filtrar os resultados.

Embora este elemento de filtro exista, não foi encontrado por nenhum dos participantes. O resultado da pesquisa ofereceu uma ordenação por ordem alfabética e não por relevância das palavras pesquisadas. A paginação foi ignorada em quase todos os casos (dois utilizaram). Quando o resultado não aparecia nos primeiros registros o participante realizava nova pesquisa, utilizando outro filtro, muitas vezes reiniciando a pesquisa. Outro ponto critico é o botão de “detalhes” que informa detalhes técnicos daquele item, enquanto que o link oferecido no título do item

fica

subentendido.

Na

página

do

item,

os

detalhes

sobre

disponibilidade/quantidade só aparecem com o uso da rolagem, criando grande dificuldade aos participantes que muitas vezes retornavam à listagem para procurar aquela informação. O link para retornar à página inicial causou dificuldade em todos os testes. Todos os participantes buscavam o clique na logo apresentada no topo esquerdo da ferramenta, ao perceber que aquele elemento não oferece link alguns utilizavam o botão “back” do navegador ou exploravam a ferramenta em busca do link. A experiência pareceu bastante frustrante para alguns participantes.

99

APÊNDICE B – Layouts Propostos

Opção 1 (opção escolhida)

100

101

102

103 Opção 2

104

105

106

107

ANEXOS

108

ANEXO A - Diagrama os Elementos da Experiência do Usuário