Usabilidade Acessivel Metodologias Para a Avaliacao Qualitativa Da Usabilidade No Design Para a Web

USABILIDADE ACESSVEL:
Metodologias para a Avaliao Qualitativa da Usabilidade no Design para a Web
Hugo Ribeiro
Mestrado em Design da Imagem
Faculdade de Belas Artes da Universidade do Porto, 2012
USABILIDADE ACESSVEL:
Metodologias para a Avaliao Qualitativa da Usabilidade no Design para a Web
Hugo Norberto Flix Ribeiro Mestrado em Design da Imagem
Dissertao para a obteno do Grau de Mestre Orientador: Miguel Carvalhais
Faculdade de Belas Artes da Universidade do Porto, 2012
AGRADECIMENTOS
A realizao desta Dissertao de Mestrado s foi possvel graas colaborao e ao contributo, de forma directa ou indirecta, de vrias pessoas e instituies, s quais gostaria de exprimir algumas palavras de agradecimento e profundo reconhecimento, em particular: Ao Prof. Miguel Carvalhais, orientador desta Dissertao, pelo incansvel acompanhamento, pelo rigor e exigncia, pela cedncia de parte da bibliografia, e sobretudo pela enorme amizade demostrada nos perodos mais difceis da concluso desta investigao; Ao Prof. Adriano Rangel, Director do Mestrado em Design da Imagem, pela amizade e por todo o apoio dado ao longo da durao do referido Mestrado; Aos colegas e amigos Jorge Ribeiro e Roxanne Leito pela colaborao, amizade e esprito de entreajuda nos projectos conjuntos como o novo stio da Universidade do Porto e eLearning Caf, assim como em outros que no foram incluidos nesta Dissertao; Por fim, mas no menos importante, aos meus pais por todos os sacrificios por que tiveram de passar para que fosse possvel eu chegar a este ponto de progresso acadmico. Hugo Ribeiro
RESUMO
Num mundo onde a Web se tornou numa ferramenta praticamente indispensvel na vida nas pessoas, seja como espao de comunicao, de entretenimento ou de trabalho, importante que os utilizadores possam de facto tirar partido dessa ferramenta, que consigam utilizar os stios que a compem, que possam retirar a informao ou o servio que desejam. O Design Centrado no Utilizador preocupa-se com o utilizador e promove-o como o foco de qualquer design aplicado na Web. A Usabilidade avalia esse mesmo design perante o utilizador e orienta-o de forma a que este, independentemente das suas sensibilidades ou limitaes, possa de facto tirar partido da informao ou servio providnciado por determinado stio. Este projecto prope uma reflexo a designers com base nos princpios do Design Centrado no Utilizador e na Usabilidade de stios Web, demostrando um conjunto de metodologias de avaliao da usabilidade a que os designers podero recorrer independentemente da dimenso ou complexidade do trabalho em mos, e sublinhando a sua importncia como ferramenta de design to vlida como o conhecimento de linguagem de design, de programao ou do software especifico para a actividade profissional do designer. Palavras-Chave: Usabilidade, Webdesign, Interaco, Design Centrado no Utilizador
ABSTRACT
In a world where the Web has become a virtually indispensable tool in peoples life, either as a space for communication, entertainment or work, it is important that users can actually take advantage of this tool, that they can use the sites that form the Web, that they can access the information or service they desire. User-Centered Design is concerned with the users and promotes them to the focus of any design applied to the Web. Usability assesses this same design with users and guides it so that, regardless of the users sensitivities or limitations, they can actually take advantage of the information or service provided by a particular site. This project proposes a reflection based on the principles of User-Centered Design and the Usability of Web sites, demonstrating a set of usability evaluation methodologies that designers can use regardless of the size or complexity of the work at hand, and stresses its importance as a design tool as valid as any knowledge of language design, programming or software specific to the career of the designer. Keywords: Usability, Webdesign, Interaction, User Centered Design
NDICE
Introduo 1. Usabilidade 1.1. O que a Usabilidade? 1.1.1. A Usabilidade segundo Nielsen 1.1.2. Outros Autores 1.1.2.1. ISO 1.1.2.2. Ben Shneiderman 1.1.2.3. Dix, Abowd, Beale, e Finlay 1.1.3. Sntese 1.2. Heursticas 1.2.1. As Dez Heursticas de Nielsen 1.2.2. As oito Regras de Ouro do Design de Interfaces 1.2.3. Princpios do Design de Interaco 1.2.4. A viso do psiclogo sobre o design da experincia do utilizador 1.2.5 Sntese 1.3. Usabilidade e Acessibilidade 2. Metodologias 2.1. Personas 2.1.1. Tipologias 2.1.1.1. Primrias 2.1.1.2. Secundrias 2.1.1.3. Suplementares 2.1.1.4. Clientes 2.1.1.5. Personas Indirectas 2.1.1.6. Personas Negativas 2.1.2. Processo 2.1.3. Recursos 2.1.4. Prs e Contras 2.2. Card Sorting 2.2.1. Tipologias 2.2.1.1. Card Sorting Aberto 2.2.1.2. Card Sorting Fechado 2.2.1.3. Reverse Card Sorting 2.2.2. Processo
17 21 21 21 23 23 24 24 25 26 26 31 33 38 41 43 45 46 46 46 46 46 46 47 47 47 48 48 49 49 49 49 50 50
2.2.3. Nmero de Testes Recomendado 2.2.4. Recursos 2.2.5. Prs e Contras 2.3. Prototipagem 2.3.2. Tipologias 2.3.2.1. Prototipagem Horizontal 2.3.2.2. Prototipagem Vertical 2.3.2.3. Prototipagem de Baixa Fidelidade 2.3.2.4. Prototipagem de Alta Fidelidade 2.3.4. Processo 2.3.5. Nmero de Testes Recomendado 2.3.6. Recursos 2.3.7. Prs e Contras 2.4. Percurso Cognitivo 2.4.1. Processo 2.4.2. Nmero de Testes Recomendado 2.4.3. Recursos 2.4.4. Prs e Contras 2.5. Avaliao Heurstica 2.5.1. Tipologias 2.5.1.1. Percurso Heurstico 2.5.2. Processo 2.5.3. Nmero de Testes Recomendado 2.5.4. Recursos 2.5.5. Prs e Contras 2.6. Teste de Usabilidade 2.6.1. Tipologias 2.6.2. Processo 2.6.3. Nmero de Testes Recomendado 2.6.4. Recursos 2.6.5. Prs e Contras 3. Casos de Estudo 3.1. Novo Stio da Universidade do Porto 3.1.1. Cliente e contexto 3.1.2. Projecto 3.1.3. Calendarizao 3.1.4. Metodologias 3.1.4.1. Avaliao Heurstica 3.1.4.2. Personas e Cenrios de Utilizao 3.1.4.3. Card Sorting 3.1.4.4. Prototipagem 3.1.4.5. Testes de Usabilidade
50 51 51 52 52 52 52 52 53 53 53 53 54 54 54 55 55 55 55 56 56 56 57 57 57 58 58 59 61 61 61 63 63 63 63 64 65 65 66 66 68 69
3.1.5. Ponto de Situao 3.1.6. Concluso 3.2. Novo stio do eLearning Caf 3.2.1. Cliente e contexto 3.2.2. Projecto 3.2.3. Calendarizao 3.2.4. Metodologias 3.2.4.1. Teste de Usabilidade 3.2.5. Ponto de Situao 3.2.6. Concluso 3.3. Stio do CEDA 3.3.1. Cliente e contexto 3.3.2. Projecto 3.3.3. Calendarizao 3.3.4. Metodologias 3.3.4.1. Personas e Cenrios de Utilizao 3.3.4.2. Card Sorting 3.3.4.3. Teste de Usabilidade 3.3.5. Ponto de Situao 3.3.6. Concluso 3.4. escolinhas.pt 3.4.1. Cliente e contexto 3.4.2. Projecto 3.4.3. Calendarizao 3.4.4. Metodologias 3.4.4.1. Teste de Usabilidade 3.4.5. Ponto de Situao 3.4.6. Concluso Concluso Referncias Bibliogrficas Abreviaturas e Smbolos Anexo A: Avaliao Heurstica ao actual stio da UP Anexo B: Personas para o projecto do novo stio da UP Anexo C: Arquitectura de informao do novo stio da UP Anexo D: Prottipos de Layouts para o novo stio da UP Anexo E: Directivas de Usabilidade, ACeSSibilidade e mobile para o novo stio da UP
72 72 74 74 74 75 75 75 77 77 78 78 78 79 80 80 80 80 81 81 81 81 82 82 82 82 84 84 87 91 95 97 105 125 133 157
NDICE DE IMAGENS
Figura 1. Exemplo de um barra de progresso de descarregamento de um ficheiro Figura 2. Exemplo de navegao por separadores Figura 3. Exemplo de Breadcrumbs Figura 4. Exemplos de caixas de pesquisa Figura 5. Exemplo de um formulrio de compras com botes para remover item, actualizar lista de compras e finalizar compra Figura 6. Exemplo de um principio de reconhecimento em vez de lembrana Figura 7. Exemplo de mensagem de erro 404 Figura 8. Exemplo de ajuda e documentao durante o descarregamento de um programa Figura 9. Formulrio de concluso de compra de um stio de e-commerce Figura 10. As alteraes na percepo das cores nos principais tipos de daltonismo Figura 11. Valores por defeito num formulrio para reserva de bilhetes de avio Figura 12. Demonstrao da Lei de Fitts Figura 13. Uma das personas criadas para o projecto UP Figura 14. Still de uma sesso de card sorting realizada do mbito do projecto UP Figura 15. Prottipos de mdia fidelidade dos estudos preliminares do layout do novo stio da UP Figura 16. Video still de um dos testes de usabilidade da 1 sesso de testes (Proposta 2) Figura 17. Video still de um dos testes de usabilidade da 1 sesso de testes (Proposta 1) Figura 18. Video still de um Testes de Usabilidade que tiveram lugar durante a Mostra UP Figura 19. Video still da homepage do eLearning Caf nos Testes de Usabilidade Figura 20. Verses desktop, tablet e mobile do stio elearning caf
27 27 28 28 29 29 30 31 32 34 35 36 66 67 68 69 70 71 76 77
INTRODUO
Os estudos de usabilidade tm ganho maior relevncia desde o advento da Web 2.0, com o crescente recurso a contedos interactivos e aplicaes Web, que tm vindo a aumentar o grau de complexidade das interfaces grficos. Esta evoluo, assim como uma aposta cada vez maior nos contedos orientados para o utilizador, tornou ainda mais pertinente o recurso aos mtodos de avaliao qualitativa da usabilidade de forma a providenciar uma experincia satisfatria ao utilizador. Apesar de ser um tema debatido na comunidade desde 1990, a sua aplicao ainda hoje deficiente. As razes so diversas: Os custos destes estudos; a necessidade de pessoal especializado na rea; a pura e simples falta de tempo ou a errada assuno de que webdesigner ou o developer sabem o que melhor para o utilizador. Jared Spool (Net Magazine, 2012) afirma que a maioria dos webdesigners e dos developers no perdem tempo a tentar ver como as pessoas vem aquilo que desenham, comparando com um cozinheiro que confecciona novos pratos sem nunca os provar, nem ver as pessoas a deliciarem-se com eles.1 Os webdesigners e os developers tm a tendncia para se esquecerem que no so um utilizador tpico da Web, confiando na sua experincia e conhecimentos para as decises tomadas relativamente s interfaces que desenham. Ambos apresentam-se como utilizadores experientes, e as interaces que desenham e programam, por mais bvias ou evidentes que sejam para si, nem sempre so vistas da mesma forma por outros utilizadores. Da o conselho de Tidwell (2010): conhece os utilizadores, pois eles no so como tu.2 Em 1994, Jakob Nielsen falava j em Usabilidade com Desconto mais tarde Usabilidade de Guerrilha na tentativa de demonstrar que com recurso a um conjunto estrito de metodologias, um webdesigner ou um developer poderiam realizar os seus prprios testes de forma simples e eficaz, de encontro s expectativas dos utilizadores, mas ainda hoje evidente que muitos dos projectos de design para a Web no contemplam o estudo da sua usabilidade. Quando falamos de usabilidade, a melhor forma de a definir no contexto desta investigao nos dada por Steven Krug (2000) ao afirmar que significa apenas o assegurar que alguma coisa funciona bem:
1. Todas as tradues do ingls so da responsabilidade do autor: The average developer or designer doesnt spend any time ever watching people use the things they are designing, he complains. Its crazy. Imagine that you were a cook who came up with all sorts of new recipes, but you never tasted any of them, and you never ended up getting to see anybody enjoy them. How good a cook would you become? (Jared Spool, Net Magazine 2012) 2. Know thy users, for they are not you! (Tidwell, 2010) 17
USABILIDADE ACESSVEL: Metodologias para a Avaliao Qualitativa da Usabilidade no Design para a Web
que uma pessoa de mdia (ou mesmo abaixo da mdia) habilidade e experincia pode utilizar essa coisa (...) para o propsito desta, sem ficar irremediavelmente frustrado. 3 A Usabilidade com Desconto, tal como defendia por Nielsen, contempla trs metodologias: Cenrios e Prototipagem, Avaliao Heurstica, e Testes de Usabilidade. Neste projecto apresentaremos seis metodologias: Card Sorting, Personas (Cenrios), Prototipagem, Percurso Cognitivo, Avaliao Heurstica e Testes de Usabilidade; tendo em considerao que as metodologias acrescentadas podem ser utilizadas dentro do mesmo principio de custos reduzidos, facilidade e simplicidade de execuo o que chamamos de Usabilidade Acessvel, ou seja, algo que est ao alcance de todos. Existem vrias filosofias do design, cada uma delas defendendo um elemento diferente como tendo o papel central no respectivo processo. A inerente usabilidade, designa-se por Design Centrado no Utilizador, visto defender um processo que tem o utilizador como centro das decises. Um processo de design que se preocupa, em primeiro lugar, com o utilizador ser aquele que melhor poder criar um objecto final capaz de responder s necessidades e exigncias deste. Esta filosofia est em tudo relacionada com a experincia que o utilizador tem do produto e com o grau de satisfao e eficincia com que o usa para alcanar os seus objectivos. O objectivo do Design Centrado no Utilizador assim dar a conhecer os utilizadores e as suas necessidades, permitindo s empresas adequar as ofertas e identificar novas formas de ajudar o utilizador. Esta filosofia exige que o designer consiga aproximar ao mximo o utilizador da aplicao, devendo esta, por isso, seguir o processo mental do utilizador e no, como acontece noutras abordagens, do cliente, do webdesigner ou do developer. Um sistema realizado a pensar no utilizador e na sua forma de interagir servir melhor as suas necessidades, aumentando a compreenso, a eficincia e a eficcia e diminuindo a possibilidade de frustrao. Por seguir o processo mental do utilizador entende-se no desenhar a interface em funo do que o utilizador pretende especificamente, mas sim de forma a que este a consiga utilizar de forma eficaz , rpida e agradvel. Outras filosofias de design variam em funo do indivduo no centro do trabalho, de entre as quais o designado Design Centrado no Designer, tambm conhecido como Design Centrado no Ego, possivelmente uma das mais comuns entre os webesignerr de formao artstica. Nesta, o webesigner v-se a si prprio como o elemento mais bem preparado para tomar as decises necessrias para a construo de um bom stio Web, um stio usvel, quer do ponto vista tcnico quer, obviamente, do ponto de vista esttico. Podemos ainda referir o Design Centrado na Empresa, onde esta assume o papel central no processo de design sendo o stio organizado em funo da sua estrutura interna, o que mesmo fazendo sentido para os seus empregados, , na larga maioria das vezes, desconhecido do utilizador, embora se deva sublinhar que se trata de uma abordagem que poder fazer sentido na construo de uma intranet
3. Usability really just means that making sure that something works well: that a person of average (or even below average) ability and experience can use the thing (...) for its intended purpose without getting hopelessly frustrated. 18
Introduo
empresarial. Um bom exemplo tambm pode ser encontrado em stios onde a o cliente domina o processo de deciso a todos os nveis e o stio desenhado medida das suas expectativas e da sua opinio sobre as expectativas do utilizador. Os webdesigners de formao mais tcnica do ponto de vista da programao, ou os developers, inclinam-se para o que se pode chamar de Design Centrado na Tecnologia, em que esta invade o espao aos mais variados nveis resultando em stios mais pensados em funo de determinadas caractersticas media, como a animao Flash, o udio e o vdeo, assim como o excesso de funcionalidades construdas com base em JavaScript. Por fim, e talvez o menos comum, o designado Design Centrado no Contedo, onde uma determinado conjunto de informao pr-existente, nem sempre adaptado Web, se assume como elemento de organizao do stio. Aps quase seis anos de trabalho em webdesign no id:D, Investigao e Desenvolvimento em Design da Faculdade de Belas Artes da Universidade do Porto, foram muito poucas as ocasies onde os trabalhos a desenvolvidos foram submetidos a avaliaes de usabilidade. E embora tenha havido sempre, da nossa parte, um cuidado em praticar muitas das metodologias do Design Centrado no Utilizador, quer no faseamento do projecto, quer na estruturao da interface, o captulo da avaliao da sua usabilidade foi sendo descurado. A inexistncia de formao prvia, nessa rea, na frequncia da Licenciatura de Design de Comunicao, assim como a limitao oramental para a contratao de estudos de usabilidade a entidades externas, ou pura e simplesmente a falta de tempo, so factores a considerar, mas que de todo serviram para anular um sentimento crescente da necessidade de recorrer a avaliaes de usabilidade aos stios a desenhados, de forma a providenciar um melhor servio aos seus clientes. com base nessa premissa que surge este trabalho de investigao. Na necessidade de ns, webdesigners, no s conhecermos as metodologias de avaliao da usabilidade de um ponto de vista qualitativo, ou seja, que nos permita agir de forma que o trabalho que desenvolvemos possa no s responder s expectativas dos clientes, como (e sobretudo) s expectativas dos utilizadores. Este projecto teve assim como objectivos recolher e avaliar as principais metodologias e estratgias de avaliao qualitativa da usabilidade de interfaces para stios Web e colocar estas em prtica num conjunto de casos de estudo, de forma a verificar a existncia de mais valias para o processo de projecto, tendo em vista uma economia de custos e tempo. A metodologia passou por uma leitura analtica de diversas publicaes na rea do design interactivo, do design centrado do utilizador e da usabilidade para a web, recolhendo, seleccionando, analisando e cruzando metodologias de avaliao qualitativa da usabilidade. Seguiu-se a escolha de um conjunto de metodologias tidas como base para a avaliao qualitativa da usabilidade, que foram posteriormente colocas em prtica em quatro casos de estudo.
19
Alm do mais, outras perguntas foram surgindo ao longo da investigao: No haver uma ligao estreita entre os estudos de usabilidade e o design? No ser esta uma ferramenta to importante como qualquer outra ferramenta de design ou como um qualquer software de desenho vectorial ou tratamento de imagem? No ser esta uma rea que deva ser leccionada em ambiente acadmico, no seio de uma licenciatura em Design?
20
1. USABILIDADE
1.1. O que a Usabilidade?

Usability really just means that making sure that something works well: that a person of average (or even below average) ability and experience can use the thingwhether its a Web site, a fighter jet, or a revolving doorfor its intended purpose without getting hopelessly frustrated.
Steve Krug, Dont Make Me Think! A Common Sense Approach to Web Usability, 2000
Por usabilidade entende-se a capacidade de um dado objecto se adaptar convenientemente ao objectivo para o qual foi proposto de um ponto de vista da funcionalidade para o utilizador; um atributo qualitativo que avalia o quo fcil de utilizar um interface de utilizador4 (Nielsen, 2003); a medida pela qual um produto pode ser usado por utilizadores especficos para alcanar objectivos especficos com efectividade, eficincia e satisfao num contexto de uso especfico5 (ISO 1998); a capacidade de um artefacto, em termos de factores humanos, ser usado fcil, eficiente e satisfatoriamente por utilizadores especficos, desempenhado tarefas especificas, em ambientes especficos (Shackel 1991). A usabilidade estuda a relao entre as ferramentas e os seus utilizadores, sendo uma disciplina da rea da ergonomia e da interaco humano-computador (IHC). Para que seja eficaz, uma ferramenta deve permitir que os utilizadores realizem as tarefas desejadas e necessrias da melhor forma possvel. O estudo da usabilidade procura a utilizao fcil e o mapeamento claro das funcionalidades e dos contedos de um sistema interactivo.
1.1.1. A Usabilidade segundo Nielsen

Jakob Nielsen tido por muitos como a figura mais proeminente em termos de usabilidade, tendo mesmo sido apelidado de O Guru da Usabilidade Web pelo New York Times.6 Nielsen comea por definir usabilidade como uma factor a ter em conta num espectro mais alargado a que chama aceitabilidade do sistema7 que por sua vez caracterizada por duas dimenses: a aceitabilidade social e a
4. Usability is a quality attribute that assesses how easy user interfaces are to use (Nielsen, 2003) 5. extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use (ISO 1998) 6. Meet the guru of Web page usability, a man for whom Web design is not a matter of taste or aesthetics - its a matter of science. (New York Times, 1998) 7. To some extent, usability is a narrow concern compared to the larger issue of system acceptability, which 21
aceitabilidade prtica. Social, quando os utilizadores reconhecem a sua necessidade e relevncia social; Prtica, quando so respeitados critrios de custo, confiana, compatibilidade, flexibilidade e qualidade de uso, que se define pela sua utilidade e usabilidade.8 Falar de usabilidade assim tambm falar de qualidade de uso. Nielsen refere a qualidade de uso como factor chave da usabilidade dado que um sistema bem sucedido deve ser usvel e til simultaneamente, deve providenciar as ferramentas necessrias para que o utilizador cumpra uma determinada tarefa e o consiga fazer de forma rpida, eficiente e intuitiva. Sistemas que no sejam necessrios, que no providenciem claras mais valias para utilizador, no so assim usveis por natureza. Nielsen (1993) define usabilidade atravs de cinco atributos: 1. Capacidade de aprendizagem Qual o grau de facilidade na sua aprendizagem? Por capacidade de aprendizagem entende-se o grau de facilidade na aprendizagem de um determinado objecto, a facilidade com que uma dada pessoa passa de utilizador iniciante a utilizador experiente. Quanto mais rpida for a capacidade de aprendizagem, maior ser o grau de satisfao e confiana com o qual o utilizador interage com um dado objecto. Nielsen refere que a capacidade de aprendizagem , em certa medida, o atributo mais importante de usabilidade9, dado que todos os sistemas necessitam de um perodo de aprendizagem e esta ser a primeira experincia do utilizador com o sistema. Olhando para um stio Web, quanto mais fcil for a sua utilizao, maior ser a probabilidade de este ser usado mais vezes pelo utilizador. O sucesso de um stio no se mede pela quantidade de funcionalidades que contm, mas sim pela facilidade com que estas podem ser usadas para atingir os objectivos que lhes esto associados e as tarefas que os utilizadores pretendem executar. 2. Capacidade de memorizao Qual o grau de memorizao aps um perodo de inactividade do utilizador? Por capacidade de memorizao, entende-se a facilidade com que um dado objecto ou processo poder recordado por parte do utilizador ao fim de um determinado tempo sem este ter interagido com o objecto. Olhando para um stio Web, quanto menos complexo for a sua interface, maior ser a probabilidade de um utilizador o voltar a usar ao fim de algum tempo de inactividade sem necessidade de a reaprender como o usar. O utilizador procura sempre os stios com os quais se sente mais vontade na interaco e onde consegue cumprir as suas expectativas com sucesso. Stios Web com navegaes muito complexas ou que no recorrem a padres de interaco reconhecidos10 tendem a criar imensos obstculos ao utilizador, diminuindo assim no s a confiana que o utilizador deposita neste como o grau de
basically is the question of whether the system is good enough to satisfy all the needs and requirements of the users and other potential stakeholders, such as the users clients and managers. (Nielsen 1993) 8. Utility is the question of whether the functionality of the system in principle can do what is needed, and usability is the question of how well users can use that functionality. (Nielsen 2003) 9. Learnability is in some sense the most fundamental usability attribute (Nielsen 1993) 10. Existem vastas listas de Padres de Interaco reconhecidos como os referenciados por Tidell no seu livro Designing Interfaces, ou bibliotecas de padres na Web como a Yahoo! Design Pattern Library (http://developer. yahoo.com/ypatterns/).
1. Usabilidade
conforto na sua utilizao, levando o utilizador a procurar uma alternativa que lhe permita realizar as tarefas que pretende de forma mais eficiente e rpida, o que nos conduz ao terceiro atributo. 3. Eficincia na utilizao Qual a grau de eficincia na utilizao? Por eficincia na utilizao, entende-se o grau de rapidez e sucesso com que os utilizadores atingem os seus objectivos na interaco com um dado objecto. Um stio Web com uma curva de aprendizagem pouco acentuada ser necessariamente mais rpido de utilizar, e o utilizador ir realizar de forma eficiente as tarefas ou aces pretendidas, sejam estas comprar um produto ou consultar uma informao. 4. Fiabilidade da utilizao Qual o grau de fiabilidade nas tarefas propostas? Por fiabilidade de utilizao entende-se a quantidade de ocasies em que ocorrem erros e a facilidade que com que estes so resolvidos um factor muito importante para o grau de confiana do utilizador em relao ao sistema. Na Web, stios onde se observam elevadas ocorrncias de erros tendem a ser rapidamente trocados por outros que proporcionem ao utilizador a possibilidade de realizem a tarefa com maior sucesso e rapidez. 5. Satisfao do utilizador Qual o grau de satisfao do utilizador na interaco com a interface? Uma interface de sucesso aquela que os utilizadores utilizam com prazer e satisfao, embora a satisfao seja um factor bastante subjectivo. Nielsen (1993) referia-se inicialmente a este atributo como satisfao subjectiva, atribuindolhe particular importncia em sistemas orientados para o entretenimento e diverso. O grau de satisfao pode ter duas dimenses: uma funcional, baseada estritamente na capacidade do sistema em providenciar as ferramentas necessrias para que o utilizador cumpra com sucesso as tarefas; e outra visual, baseada na emoo positiva ou negativa criada pelo design da interface, independentemente da sua funcionalidade.
1.1.2. Outros Autores

Embora sejam os mais amplamente citados, os cinco atributos com que Nielsen define a usabilidade no so os nicos. Outros autores so amplamente citados com especial incidncia na Norma ISO 9241-11 (1998), Ben Shneiderman (1998) e Alan Dix, Janet Finlay, Gregory Abowd e Russell Beale (1998). Embora seja evidente que alguns pontos so comuns, no possvel afirmar que a definio de usabilidade, pelos seus atributos, seja assim universalmente aceite.
1.1.2.1. ISO
A International Organization for Standardization (ISO)11 uma entidade internacional reconhecida por 170 pases, que aprova, gere e implementa conjuntos de normas relacionadas com a tecnologia e indstria. A norma ISO 9241-11 (1998) estabelece a definio de usabilidade com recurso a trs
11. Organizao Internacional de Normalizao, na sua designao portuguesa, 23
atributos: efectividade, eficincia e satisfao. Por efectividade entende-se o grau de preciso com que um utilizador consegue completar na ntegra uma determinada tarefa; por eficincia entendese os recursos utilizados em relao ao grau de preciso e concluso do utilizador ao atingir os seus objectivos; por satisfao entende-se o nvel de conforto e aceitao que o sistema produz nos utilizadores e noutras pessoas afectadas por este. A norma ISO 9241-11 faz tambm referncia satisfao, definindo esta como a ausncia de desconforto e as atitudes positivas do utilizador perante a utilizao do sistema. Esta estabelecese como um ponto de partido terico, tendo poucas ou nenhumas informaes quanto sua aplicabilidade prtica, at porque define sistema como a relao entre utilizadores, equipamento (hardware, software e materiais), tarefas, o ambiente fsico e social, com o objectivo de atingir um determinado objectivo.
1.1.2.2. Ben Shneiderman
Ben Shneiderman (1998), outro autor vrias vezes citado, no difere do estabelecido por Norman excepto na semntica. Em vez de atributos, Shneiderman identifica cinco factores humanos centrais quantificveis para a avaliao dos objectivos dos factores humanos:12 Velocidade de performance, tempo de aprendizagem, reteno ao longo do tempo, rcio de erros pelos utilizadores e satisfao subjectiva; sendo estes equivalentes aos identificados por Nielsen e j atrs referidos.
1.1.2.3. Dix, Abowd, Beale, e Finlay
Dix, Abowd, Beale, e Finlay (1998) apresentam trs atributos principais para a definio da usabilidade: Capacidade de Aprendizagem, Flexibilidade e Robustez; mas expandem estes em vrios outros atributos complementares. e factores que influenciam estes atributos. A Capacidade de aprendizagem de um sistema influenciada pela sua consistncia visual, estrutura e funcionalidade, e se o layout e os seus diversos componentes so estveis ao longo das pginas de um stio; pela generalizao ou utilizao de padres de interaco reconhecveis pelo utilizador na interaco com outros sistemas; pela sua familiaridade ou capacidade do sistema ser adivinhado pelo utilizador sem recurso a manuais de utilizao; pela sua sintetizao ou capacidade de transmitir a imagem correcta do seu funcionamento de forma que os utilizadores possam construir modelos mentais deste, ou providenciar informao necessria que permita ao utilizador aferir se aco est a decorrer e qual a sua consequncia (como, p.ex., o envio de uma mensagem de email e a confirmao desse mesmo envio); e pela previsibilidade, ou seja, ao capacidade do sistema produzir, de facto, os resultados que o utilizador espera que produza em funo das suas aces, ou se as aces deste podem ser previstas com base em interaces passadas. Quanto Flexibilidade, esta influenciada pela customizao do sistema, pela possibilidade do utilizador alterar caractersticas do sistema de forma a aumentar a produtividade do mesmo (como,
12. five measurable human factors central to evaluation of human factors goals (Shneiderman 1998) 24
1. Usabilidade
p.ex., aumentar o tamanho do texto, ou utilizar atalhos do teclado); pela sua capacidade de apresentar alternativas, que num stio Web se pode traduzir na apresentao de contedo texto descritivo em alternativa a uma imagem; pela capacidade de migrar tarefas, ou possibilitar a alternncia da execuo da tarefa entre o utilizador e o sistema (como, p.ex., em caixas de pesquisa ou formulrios onde o sistema apresenta possveis solues com base nas primeiras palavras escritas); pela capacidade de realizar mltiplas tarefas definidas pelo utilizador em simultneo; e pelo dilogo, ou a capacidade de sistema e utilizador dialogarem, quer seja a comunicao ao sistema do que o utilizador pretende fazer, quer seja a informao providenciada pelo sistema sobre o que pode, no pode ou deve o utilizador fazer. Por fim, a Robustez, ou o nvel de informao providenciado ao utilizador sobre o estado do sistema, influenciada pela resposta, ou a capacidade do sistema informar o utilizador relativamente a uma aco (como o tempo de espera para o descarregamento de um ficheiro, abertura de uma imagem ou vdeo, etc.); pela capacidade de recuperao ou a possibilidade do utilizador poder voltar atrs na aco realizada, ou de recuperar de um erro, tendo o sistema neste caso de providenciar informao correcta sobre os passos a seguir para o efeito; pela visibilidade do estado, ou a capacidade do sistema providenciar informao til ao utilizador sobre o estado das suas aces; e pela conformidade com a tarefa, ou seja, se o sistema o adequado para o utilizador atingir os seus objectivos.
1.1.3. Sntese
Nielsen (1993) Shneiderman (1998) Dix, et al. (1998) Capacidade de Aprendizagem Efectividade Flexibilidade Eficincia Satisfao ISO (1998)
Capacidade de Aprendizagem Tempo de Aprendizagem Capacidade de Memorizao Reteno ao longo do tempo Eficincia na Utilizao Fiabilidade da Utilizao Satisfao do Utilizador Velocidade de Performance Satisfao Subjectiva
Rcio de erros pelos utilizadores Robustez
No essencial, os atributos de usabilidade definidos pelos trs autores referidos e a norma ISO, so coincidentes. A ISO no se refere capacidade de aprendizagem, nem faz referncia directa fiablidade do sitema, no entanto, ao falar de eficincia, indirectamente refere-se tambm fiabilidade. Dix, et al., tambm no fazem referncia directa fiabilidade, mas importa aqui sublinhar que os trs atributos por eles defenidos, so apenas o resultado na interligao de vrios outros sub-atributos que no geral cobrem um leque bem mais abrangente do que o proposto por Nielsen, Shneiderman ou a ISO, no entanto, a satisfao por parte do utilizador omitida.
25
1.2. Heursticas
There are basically four ways to evaluate a user interface: Formally by some analysis technique, automatically by a computerized procedure, empirically by experiments with test users, and heuristically by simply looking at the interface and passing judgement according to ones own opinion.
Jakob Nielsen e Rolf Molich, Heuristic Evaluation of User Interfaces, 1990.
Para alm da definio e dos atributos de usabilidade, existem outros conjuntos de princpios que sistematizam e detalham as principais questes de usabilidade como princpios de design ou heursticas. Heursticas so normas que se apresentam como solues ideais para um dado problema, neste caso, de usabilidade, afirmando-se como uma base para a produo de directivas de usabilidade mais detalhadas e adaptadas a um dado interface visual, seja ele um programa de computador ou um stio Web. Os pontos seguintes procuram abranger trs aspectos: uma viso mais geral definida pelas dez heursticas de usabilidade de Nielsen; uma viso orientada para o design de interfaces definida pelos Princpios do Design de Interaco de Bruce Tognazzini e pelas Oito Regras de Ouro do Design de Interfaces de Ben Shneirderman; e uma possvel aproximao compreenso da dimenso psicolgica do utilizador explorada em A Viso do Psiclogo sobre o Design da Experincia do Utilizador de Susan Weinschenk.
1.2.1. As Dez Heursticas de Nielsen

Desenvolvidas originalmente por Jakob Nielsen em conjunto com Rolf Molich (1990a, 1990b), as Dez Heursticas de Nielsen comearam por ser um conjunto de consideraes de usabilidade que serviam de alternativa a uma avaliao de usabilidade feita por especialistas, at ento realizada com base em directivas de usabilidade (Smith, et al. 1986). O objectivo de Nielsen e Molich passava por reduzir o grau de complexidade providenciado pelas directivas de usabilidade, reduzindo estas a nove heursticas: Dilogo simples e natural; Falar a lngua do utilizador; Minimizar o recurso memria; Ser consistente; Providenciar feedback; Providenciar sadas claramente assinaladas; Providenciar atalhos; Boas mensagens de erro; Prevenir erros. Inicialmente desenvolvidas para interfaces visuais de software, as directivas de usabilidade seriam mais tarde adaptadas por Nielsen para interfaces de stios Web, de acordo com a anlise de 249 problemas de usabilidade. Nielsen (1994) prope assim um conjunto de dez Heursticas de Usabilidade que so hoje entendidas como uma norma para o design de interfaces visuais para a Web.
26
1. Usabilidade
1. Visibilidade do estado do sistema O sistema deve manter sempre o utilizador informado do que se est a passar, providenciando informao apropriada num perodo de tempo razovel. Na utilizao de hiperligaes, o sistema deve providenciar informao visual de que uma aco foi espoletada, ou, em processos demorados, deve ser providenciada informao sobre a durao do processo, de forma que o utilizador no julgue que o sistema no est a responder sua aco. Um bom exemplo desta heurstica pode ser visto no processo de descarregamento de um ficheiro, onde uma janela de dilogo d conta do estado do mesmo, assim como o tempo estimado para a sua concluso. Outras indicaes podem ser dadas ao utilizador, como avisos para no refrescar a pgina ou para no fechar a janela de dilogo.
Figura 1. Exemplo de um barra de progresso de descarregamento de um ficheiro
Outro exemplo tpico ocorre durante o envio de um email, onde dada a indicao de que o envio est a ser efectuado, seguindo uma mensagem confirmando, ou no, se o envio foi processado com sucesso. 2. Compatibilidade do sistema com o mundo real O sistema deve recorrer a palavras, frases ou conceitos familiares ao utilizador, e no recorrer a termos prprios do sistema ou orientados para os seus programadores. A utilizao de convenes do mundo real, como a utilizao de separadores na navegao, fazendo a informao aparecer de forma natural e lgica permite uma melhor compreenso por parte do utilizador, garantindo que a experincia de utilizao decorre de forma rpida e sem sobressaltos.
Figura 2. Exemplo de navegao por separadores
A linguagem utilizada deve ser tambm ajustada ao pblico-alvo: utilizar linguagem vernacular, coloquial ou gria num stio empresarial ou institucional no ser a melhor maneira de comunicar com o utilizador, podendo mesmo afectar a credibilidade do mesmo. Em contrapartida, a utilizao de linguagem empresarial num stio dedicado ao grande pblico ou a segmentos especficos desse pblico acaba inevitavelmente por criar barreiras ao utilizador por desconhecimento da sua orgnica interior e termos especficos.
27
3. Controle e liberdade do utilizador Nem sempre os utilizadores seguem os percursos certos, e quando detectam algum erro iro procurar uma sada de emergncia, pelo que o sistema dever providenciar formas de recuperar desses erros. Os navegadores Web possuem botes para avanar e retroceder, que possibilitam regressar s pginas anteriormente visitadas antes do erro, mas outras solues so recomendadas, como sejam: hiperligaes para a pgina inicial atravs do logtipo do stio, ou breadcrumbs que indicam todo o percurso seguido desde a pgina inicial.
Figura 3. Exemplo de Breadcrumbs
Outros exemplos de controlo e liberdade do utilizador podem ser providenciados atravs de botes prprios para retroceder na pgina, botes para fechar janelas de dilogo como nas situaes em que um pop-up surge (situao tpica quando fornecida uma visualizao em maior escala de uma imagem), botes para cancelar o envio de emails, botes para cancelar uma encomenda ou remover um item em formulrios de compras online, etc. 4. Consistncia e uso de padres O sistema deve manter-se consistente no seu todo e utilizar normalizaes reconhecidas por todos, sejam estas expresses ou elementos visuais. A utilizao de padres de design de interfaces reconhecidos minimiza o esforo mental realizado pelo utilizador para completar uma determinada tarefa no sistema, visto que ir reconhecer esses mesmos padres em interaces anteriores com outros sistemas. Embora haja sempre espao para a criatividade, elementos como caixas de pesquisa, formulrios, barras de scroll, botes, etc., devem sempre parecer aquilo que so, independentemente do design utilizado na interface.
Figura 4. Exemplos de caixas de pesquisa
5. Preveno de erros Melhor do que um boa mensagem de erro, s um design cuidado que previna a ocorrncia desse mesmo erro.13 Deve-se eliminar a ocorrncia de erros bvios, ou nas situaes necessrias, providenciar opes de confirmao antes do utilizador terminar a aco, atravs de ajudas locais e/ou globais, ou mesmo atravs de exemplos de como proceder.
13. Even better than good error messages is a careful design which prevents a problem from occurring in the first place (Nielsen, 2005) 28
1. Usabilidade
Em formulrios de compras ou de email, a existncia de botes como cancelar, remover item, ou avisos sobre quais os campos de preenchimento obrigatrio e ou de concluso da aco como Deseja efectuar esta compra, ajudam o utilizador a cumprir a tarefa com sucesso sem necessidade de repetir todo o processo aps ter sido verificado um erro na aco.
Figura 5. Exemplo de um formulrio de compras com botes para remover item, actualizar lista de compras e finalizar compra
6. Reconhecimento em vez de lembrana O sistema no deve exigir que o utilizador se lembre da forma como interagiu com este na sua ltima utilizao. Objectos, aces e opes devem ser bem visveis e facilmente reconhecveis, devendo as interaces mais complexas ser sempre acompanhadas por instrues claras e de fcil acesso. Esta heurstica particularmente til na interaco com formulrios, seja estes de contacto ou um carrinho de compras num stio de e-commerce. Se o sistema necessita de uma confirmao por parte do utilizador para uma dada interaco, o mesmo dever apresentar os dados anteriormente inseridos pelo utilizador de forma a evitar que este no tenha de recorrer sua memria sobre os dados que inseriu.
Figura 6. Exemplo de um principio de reconhecimento em vez de lembrana
7. Flexibilidade e eficincia de utilizao Um stio Web deve sempre ser pensado para todos os utilizadores, incluindo os utilizadores mais experientes, de forma que estes possam executar determinadas tarefas da forma mais rpida e eficiente possvel. No caso dos utilizadores mais experientes, devem mesmo ser providenciados aceleradores, como atalhos no teclado, que permitam a realizao das aces sem a utilizao do rato.
29
A utilizao de atalhos de teclado permite uma rpida navegao para reas-chave do stio, assim como uma rpida utilizao de formulrios, seja na mudana de campo, seja na utilizao dos botes de enviar, apagar, salvar, etc. 8. Design e esttica minimalista As pginas de contedos no devem conter informaes no relevantes ou raramente utilizadas, visto que esta informao ir competir visualmente com a informao relevante, diminuindo a sua notoriedade e aumentando o tempo de compreenso do todo por parte do utilizador. Toda a composio dever ter uma organizao e uma hierarquia claras e bem definidas para o utilizador, utilizando para o efeito a escala, a tipografia, grafismos ou cor. Os elementos devero ser o suficientemente espaados de forma a evitar dificuldades de interpretao por parte do utilizador, separando de forma clara o que contedo principal de contedos secundrios e/ou complementares. 9. Ajudar o utilizador a reconhecer, diagnosticar e resolver problemas As mensagens de erro devem ser claras e utilizar uma linguagem simples e que possa ser facilmente interpretada pelos utilizadores, no recorrendo a cdigos e indicando sempre que aces devem seguidas para resolver o problema. Em casos de erro do stio, como por exemplo as pginas de erro 404 pgina no encontrada, deve ser indicada a razo para a ocorrncia do erro, assim como ajuda clara e sucinta sobre quais os passos a seguir para recuperar desse erro. Em formulrios, o mesmo principio deve ser respeitado, com eventual recurso auxiliar a um cor diferente.
Figura 7. Exemplo de mensagem de erro 404
10. Ajuda e Documentao Idealmente, deveria ser possvel utilizar qualquer sistema sem recurso a documentao explicativa, embora esta possa ser de facto necessria. Nesse caso, deve ser a mesma colocada num stio visvel, de fcil acesso e facilmente pesquisvel. A linguagem deve focar as tarefas do utilizador, mostrando exemplos e os passos necessrios para que este possa terminar com sucesso as tarefa pretendidas, devendo ainda ser simples e facilmente interpretada, e se for necessrio o uso de termos ou conceitos pouco comuns, estes devem conter uma hiperligao a um glossrio. Caso existam, os botes de ajuda devem estar devidamente identificados e contrastar com outros elementos de navegao de forma que no sejam confundidos com esta. Deve-se recorrer a smbolos e expresses facilmente reconhecidas, como pontos de interrogao ou com a expresso ajuda.
30
1. Usabilidade
Figura 8. Exemplo de ajuda e documentao durante o descarregamento de um programa de um stio
1.2.2. As oito Regras de Ouro do Design de Interfaces

As oito Regras de Ouro de Design de Interfaces so um dos conjuntos de heursticas estabelecidas por Ben Shneiderman (1998) para o design de interfaces visuais que apresentam bastantes semelhanas com as Dez Heursticas de Nielsen. A explicao de cada uma das regras procurou a sua aplicao a interfaces visuais de stios Web, a saber: 1. Consistncia O sistema deve to simples quanto possvel de forma a permitir que o utilizador com ele interaja intuitivamente. Aces idnticas devem ter resultados idnticos; a mesma terminologia deve ser usada em todos os menus, em janelas de dilogo e em ajudas contextuais. 2. Atalhos para utilizadores experientes Com a frequncia de utilizao de um sistema, os utilizadores mais experientes procuram formas de reduzir o nmero de interaces necessrias para cumprir as suas tarefas, aumentando assim a velocidade com que estas so cumpridas, pelo que o sistema deve providenciar aceleradores como atalhos de teclado, macros e abreviaturas que facilitem a interaco aos utilizadores. 3. Feedback informativo Todas as aces executadas no sistema devem ser acompanhadas de uma resposta por parte desse mesmo sistema, mais ou menos explicativa em funo da aco espoletada: um item de menu seleccionado deve indicar que o mesmo foi seleccionado; uma hiperligao visitada deve indicar que a mesma j foi visitada; o descarregamento de um ficheiro deve indicar o tempo estimado para a sua concluso e a progresso do mesmo; numa aco que resulte num erro, deve ser providenciada informao sobre o erro e quais os passos necessrios para a sua resoluo.
31
4. Dilogos de concluso As aces ou sequncias de aces devem ser estruturadas de forma que o utilizador tenha a percepo sobre os passos necessrios para a execuo das mesmas, e se estes foram ou no concludos como em formulrios de compras online, onde a informao requerida para a sua concluso dividida em vrias etapas, indicando o sistema quais os passos requeridos assim como o seu correcto, ou no, preenchimento.
Figura 9. Formulrio de concluso de compra de um stio de e-commerce
5. Preveno e tratamento de erros A ocorrncia de erros deve sempre ser evitada, mas para os casos em que estes ocorram, o sistema deve providenciar ao utilizador informao sobre como os resolver que seja simples e fcil de compreender, recorrendo a exemplos, se necessrio. 6. Aces reversveis As aces devem ser, sempre que possvel, reversveis, de forma a aumentar a confiana do utilizador no sistema e permitindo assim que aquele interaja com este sem receio de o danificar. Os eventuais erros que possam ocorrer devem ser devidamente identificados, devendo o sistema providenciar uma ou vrias resolues para os mesmos, como sugerir uma pesquisa, apontar para a pgina inicial ou sugerir tpicos relacionados na ocorrncia de um erro 404 pgina no encontrada. 7. Controlo conveniente providenciar aceleradores, como atalhos de teclado para os utilizadores mais experientes, de forma que estes sintam que controlam o sistema e no que este que os controla. O sistema deve ser desenhado de forma que seja o utilizador a iniciar as aces que pretende. 8. Reduo do recurso memria As limitaes do processamento humano na memria de curta-durao requere que as interfaces sejam simples e intuitivas, de forma a evitar o recurso memria por parte do utilizador.
32
1. Usabilidade
1.2.3. Princpios do Design de Interaco

Para alm das Dez Heursticas de Nielsen, existem ainda outros conjuntos de heursticas relevantes, sendo o mais vezes citado incluindo pelo prprio Nielsen os Princpios do Design de Interaco, ou Primeiros Princpios do Design de Interaco de Bruce Tognazzini (2003), um conjunto de dezasseis directivas orientadas para o design de interfaces visuais, como sejam: 1. Antecipao O sistema deve fornecer todas as ferramentas necessrias para que o utilizador possa cumprir com sucesso determinada tarefa. Ao longo desta, o sistema deve antecipar as necessidades do utilizador, providenciando sempre as ferramentas necessrias para que o utilizador possa voltar a trs, cumprir os passos necessrios e seguir em frente. A antecipao das necessidades do utilizador pode ser assegurada de diversas formas: em questes de navegao, o stio deve manter esta visvel em todas as pginas em conformidade com a hierarquia das mesmas na arquitectura de navegao, providenciando ainda acesso s subpginas, caso existam, ou seja, pginas de primeiro nvel devem assegurar a visibilidade da navegao de primeiro e segundo nveis; pginas de segundo nvel devem assegurar a visibilidade da navegao de primeiro, segundo e terceiro nveis; e assim consecutivamente. Outro exemplo em que este princpio particularmente til pode ser encontrado nos formulrios para a compra de produtos online. Os stios devem apresentar sempre os passos necessrios para a finalizao da tarefa, independentemente do ponto em que o utilizador se encontra na execuo da mesma, assim como a possibilidade de avanar ou retroceder nesse processo a qualquer momento. Desta forma, o utilizador pode antecipar mentalmente que dados podero ser requeridos ao longo do processo, podendo no s avanar com sucesso ao longo do mesmo, como retroceder para realizar qualquer alterao se e quando necessrio. 2. Autonomia O sistema deve passar a imagem de que o utilizador o controla, mesmo que na prtica no o faa de facto. Deve ser sempre fornecida informao sobre qual a aco que o utilizador est a executar, quer seja informao de carcter textual ou visual: atravs da alterao da cor de uma hiperligao quando aquele interage com o cursor do rato; uma nova cor para hiperligaes quando esta j foi visitada; ou uma janela a avisar o tempo de durao e o estado do processo de descarregamento de um ficheiro. Os utilizadores no devem ser obrigados a procurar informao sobre o estado do sistema, pelo que este deve manter essa informao sempre actualizada e em local visvel. Em stios de e-commerce, a presena do carrinho de compras com a indicao do nmero de itens que o mesmo contm mantem sempre informado o utilizador com os dados essenciais, sendo normalmente colocado num local suficientemente suficiente para no competir visualmente com informao mais importante, mas to visvel quanto possvel para o utilizador saber onde o encontrar rapidamente. medida que o utilizador acrescenta ou retira itens, o carrinho de compras vai actualizando o valor do respectivo contedo.
33
Autonomia e controlo so inseparveis, e este ltimo no pode ser exercido se o sistema no providenciar as informaes necessrias ao utilizador. Por sua vez, o utilizador aprende mais rapidamente e sente mais confiana na interaco com o sistema quando sente que o controla. 3. Daltonismo O daltonismo manifesta-se de diversas formas atinge cerca de 8% dos homens na populao mundial14, embora haja fontes que apontam para valores a rondar os 10 a 15%. A utilizao da cor em interfaces deve ter em conta a possibilidade do utilizador poder sofrer de um dos vrios tipos de daltonismo, pelo que deve ser sempre facultada uma alternativa em qualquer funcionalidade cuja interaco se baseie na cor. Estas alternativas podero basear-se na utilizao de diferentes gradaes da mesma cor, numa legenda associada cor ou numa forma grfica diferente. No aconselhada a utilizao de cor em textos, a menos que seja para representar uma hiperligao, devendo, neste caso, a hiperligao encontrar-se sublinhada.15
Figura 10. As alteraes na percepo das cores nos principais tipos de daltonismo
4. Consistncia A importncia da manuteno de valores de consistncia rgidos ao longo da interface varivel, podendo respeitar a seguinte ordem: Interpretao do comportamento do utilizador; Estruturas invisveis (objectos interactivos que no se parecem com padres reconhecidos); Estruturas visveis pequenas (como cones, caixas de seleco, etc.); Aspecto geral da interface; Uma suite de produtos; Consistncia in house; Consistncia do sistema. As inconsistncias devem ser utilizadas apenas quando os elementos tm comportamentos diferentes, como por exemplo os botes de enviar e cancelar num formulrio de contacto. 5. Valores por defeito Em formulrios, e quando necessrio, podem ser utilizados valores por defeito que indiquem a natureza do valor pretendido.16 Quando utilizados, os valores que vm por defeito devem poder ser
14. About 8% of the male population has some form of colorblindness (We Are Colorblind, 2012) 15. underlining is essential if you use link colors such as reds or greens, which cause problems for users with common forms of color-blindness (Nielsen, 2004) 16. Fields in data entry screens contain default values when appropriate (Userfocus) 34
1. Usabilidade
alterados de forma fcil e intuitiva e os campos onde estes sejam utilizados devem ser devidamente identificados.
Figura 11. Valores por defeito num formulrio para reserva de bilhetes de avio
Vrios stios Web utilizam por defeito valores em campos de formulrios, como caixas de pesquisa onde podem surgir as designaes Pesquisar ou Procurar, assim como em campos de seleco de datas, de palavras-chave, categorias, etc. Estes valores, quando utilizados, devero ser identificados de forma que o utilizador no os confunda com dados por si inseridos, seja atravs de uma cor diferente para o valor por defeito, ou atravs da alterao da cor de fundo da caixa. A utilizao de valores por defeito deve ser regrada pois os utilizadores tendem a no os alterar.17 6. Eficincia do utilizador O sistema deve preocupar-se com a eficincia do utilizador e no do computador, ou seja, deve ser criado de forma que permita ao utilizador poder cumprir as suas tarefas da forma o mais rpida e eficiente possvel. 7. Interfaces Explorveis Devem ser providenciados aos utilizadores pontos de referncia ao longo da interaco, sendo as breadcrumbs, a ttulo de exemplo, particularmente teis neste captulo. A navegao principal deve ser sempre visvel e permitir ao utilizador seguir outros caminhos se assim o desejar ou assim precisar. As aces devem ser reversveis, permitindo ao utilizador voltar atrs caso siga um caminho que no pretenda ou tenha seguido por engano, ou que estas possam ser canceladas, como num formulrio de contacto. A reversibilidade das aces liberta o utilizador de constrangimentos e permite que este se sinta mais confortvel na interaco. Deve ainda sempre manter-se presente uma sada de emergncia, como uma hiperligao para a pgina principal.
17. But use these with caution, because users tend to leave pre-selected fields as they are (Mifsud, 2011) 35
8. Lei de Fitts A Lei de Fitts (1954) afirma que o tempo para atingir um alvo uma funo da distncia para o alvo e o tamanho deste. Segundo este principio, quanto maior for o alvo, mais rpido este ser de utilizar, ou seja, um boto de dimenso generosa mais rpido de usar uma vez que o utilizador ter uma rea maior para onde apontar, o que permite maior preciso com menor margem de erro. Um dos exemplos mais evidentes da aplicao da Lei de Fitts so os formulrios de contacto. Ao colocar os botes de enviar e cancelar lado-a-lado e com a mesma dimenso, a probabilidade do utilizador seleccionar a opo errada maior do que se esses botes estiverem separados (ver figura.12). Desenhar o boto de enviar, aquele cuja aco termina com sucesso a realizao da tarefa, com uma escala superior, aumenta tambm a facilidade e rapidez com que este seleccionado. No se trata de dificultar a possibilidade do utilizador cancelar a mensagem, mas sim diminuir a possibilidade deste seleccionar essa opo por engano.
Figura 12. Demonstrao da Lei de Fitts
9. Objectos Interface-Humano Os objectos Interface-Humano podem ser vistos, ouvidos, tocados ou percepcionados de outra forma. Os que podem ser vistos so bastante familiares no interface grfico, enquanto os que se fazem anunciar noutros sentidos como a audio ou tacto so menos familiares. Um bom trabalho tem vindo a ser desenvolvido com cones audveis. Estes objectos Interface-Homem apresentam uma forma de interagir padronizada e resultados ao nvel do comportamento igualmente padronizados. Os objectos Interface-Homem devem ser perceptveis, auto-consistentes, e estveis. 10. Reduo de latncia O tempo de espera deve ser optimizado de forma a reduzir ao mnimo a frustrao do utilizador. Todos os botes devem providenciar uma resposta visual quando activos num espao de 50 milissegundos; um elemento visual animado como uma ampulheta, relgio ou Ajax loader deve ser exibido para aces cuja concluso dure entre meio segundo e dois segundos a animao indica ao utilizador que o sistema est a processar para aces superiores a dois segundos, deve ser exibida uma mensagem com o tempo estimado para a durao da aco; e no caso do utilizador estar a descarregar um ficheiro, o tamanho deste e uma barra de progresso. 11. Capacidade de Aprendizagem Idealmente, os stios Web no devem ter uma curva de aprendizagem, mas na prtica, por mais fceis que sejam de usar, estes necessitam sempre de um processo de aprendizagem. 12. Uso de Metforas A utilizao de metforas deve ser cautelosa: estas devem permitir ao utilizador compreender o modelo conceptual do sistema e criar uma imagem mental do mesmo boas metforas so boas histrias. Uma boa metfora , por exemplo, o carrinho de compras nos stios de e-commerce, pois este evoca
36
1. Usabilidade
mentalmente a imagem de do mesmo objecto num supermercado, onde o utilizador vai percorrendo os corredores de produtos e vai colocando os que pretende comprar dentro do carrinho. 13. Proteger o trabalho do utilizador essencial garantir que, em caso de erro do sistema, o utilizador nunca perde o trabalho realizado. Em stios Web, isso pode pode ser conseguido atravs do recurso a cookies que guardem os dados no preenchimento de formulrios, que memorizem hiperligaes j visitadas, etc. 14. Legibilidade Qualquer texto composto para ser lido deve ser formatado em alto contraste, privilegiando o uso da cor preta sobre fundo branco ou amarelo plido evitando os fundos cinza. Por outro lado, deve-se ser privilegiada a utilizao duma tipografia num tamanho que favorea a leitura em ecrs Nielsen recomenda 10pt no minimo, 12pt para seniores (2006). Legendas e instrues podem ser compostas em tamanhos mais pequenos de forma a no competirem com a informao mais relevante. Deve ser ainda mantida uma boa estrutura de escalas para hierarquizar os contedos, com o mais importante em tamanhos maiores e o acessrio em tamanhos mais pequenos. A viso humana tende a piorar a partir dos 45 anos, pelo que importante ter cuidado especial com os tamanhos utilizados. 15. Monitorizar o estado Os produtos baseados num navegador, como os stios Web, funcionam num ambiente sem estado,18 pelo que o sistema deve conseguir fornecer alguma informao neste sentido. 16. Navegao visvel A Internet composta por um espao de navegao invisvel19 e imperceptvel, pelo que os utilizadores tm dificuldades em criar um mapa mental das suas interaces. Os stios devem por isso reduzir a navegao ao mnimo, no diminuindo a dimenso de menus ou retirando outras formas de navegao, mas mantendo um layout consistente ao longo das pginas, de forma que o utilizador crie uma imagem mental de que, quando accionada uma hiperligao, o contedo que chega ao utilizar e no o utilizador que se desloca ao encontro do contedo. Desta forma, no s se elimina a necessidade do utilizador criar mapas mentais da interaco, como se proporciona uma maior sensao de domnio e autonomia do utilizador sobre o sistema.
18. browser-based products exist in a stateless environment 19. The World Wide Web, for all its pretty screens and fancy buttons, is, in effect, an invisible navigation space (Tognazzini, 2003) 37
1.2.4. A viso do psiclogo sobre o design da experincia do utilizador

Apesar de terem o utilizador como centro da preocupao, uma larga parte das heursticas de usabilidade so orientadas para aspectos tcnicos do design e desenvolvimento das interfaces visuais e no para a compreenso da forma como o utilizador pensa. No sendo o principal objectivo desta investigao um detalhado estudo psicolgico sobre os utilizadores, este um campo que no pode no entanto deixar de ser referido. Num artigo publicado no stio UX Magazine20, a psicloga Susan Weinschenk procurou estabelecer um conjunto de dez heursticas orientadas para a Experincia do Utilizador que providenciam um bom ponto de partida para uma melhor compreenso do utilizador. Este conjunto de heursticas, descritas por Weinschenk como A viso do psiclogo do design da experincia do utilizador, est dividido nos dez pontos que se seguem. 1. As pessoas no querem trabalhar ou pensar mais do que precisam As pessoas tendem a realizar o menor esforo possvel para a concluso de uma determinada tarefa, pelo que devem ser fornecidas todas as ferramentas necessrias para que essa tarefa possa ser executada da forma mais rpida e eficiente possvel, como o recurso a valores por defeito em formulrios que reduzam a necessidade do utilizador trabalhar para cumprir a tarefa. Por outro lado, deve-se assegurar apenas as funcionalidades que os utilizadores precisam, e no o que a equipa de desenvolvimento ou de design ou o cliente julgam que aqueles precisam o excesso de funcionalidades tornam a experincia, para o utilizador, mais confusa e mais sujeita a erros. Tudo o que for clicvel, deve parecer clicvel. Em pginas com muita informao, esta deve ser exibida de forma faseada, pois os utilizadores no lem os textos na ntegra, antes se limitam a l-los na diagonal, prestando ateno a certas palavras, ou em frases curtas.21 A informao deve ser dividida em vrias partes , dando a liberdade ao utilizador de optar por ver ou no mais detalhes. 2. As pessoas tm limitaes Existe um limite para a quantidade de texto que as pessoas conseguem ler num ecr sem perder o interesse,22 pelo que a informao deve ser fcil de ler na diagonal, e deve ser no s fornecida progressivamente, como deve ser tratada editorialmente de forma que seja composta por ttulos, subttulos, pargrafos, listas, etc. As pessoas tendem a preferir pargrafos curtos, mas lem
20. http://uxmag.com/articles/five-popular-web-strategies-that-dont-work 21. People rarely read Web pages word by word; instead, they scan the page, picking out individual words and sentences (Nielsen 1993) 22. On the average Web page, users have time to read at most 28% of the words during an average visit; 20% is more likely. (Nielsen 2008) 38
1. Usabilidade
melhor pargrafos mais longos. Estudos indicam ainda que so poucas as pessoas que conseguem desempenhar vrias tarefas em simultneo.23 3. As pessoas cometem erros Deve-se assumir que as pessoas cometem erros, devendo-se nesse sentido antecipar desde logo quais os erros possveis de ocorrer e por forma a tentar preveni-los, ou permitir que estes possam ser corrigidos. Deve ser sempre dada a possibilidade de desfazer qualquer aco, permitindo que o utilizador possa volta atrs a qualquer momento. Qualquer aco propcia a erros, como longos formulrios, deve ser dividida em vrios passos de forma permitir que o utilizador lide com pequenas quantidades de informao de cada vez. 4. A memria humana complicada O funcionamento da memria humana complexo e as pessoas tendem a reconstruir as suas memrias, sendo que estas no so sempre idnticas, sobre o mesmo evento, de indivduo para indivduo (efeito Rashomon)24, ou vo-se alterando ao longo do tempo no mesmo indivduo. A confiana que se deve assim depositar sobre a memria humana limitada. A memria frgil e degrada-se ao longo do tempo, sendo ainda susceptvel a erros. Norman (1998) e Shneiderman (1998) referem a regra 7 2,25 mas estudos recentes indicam que as pessoas s conseguem lembrar-se de entre 3 a 4 diferentes itens em simultneo.26 5. As pessoas so seres sociais As pessoas usam a tecnologia como forma de socializao; procuram conselhos de outras pessoas quando tm dvidas, do opinies, confrontam pontos de vista, etc. (factor conhecido como validao social), razes pelas quais ratings e reviews so importantes para os stios Web. A norma da reciprocidade indica que as pessoas que no retribuem favores so vistas de forma negativa pela sociedade. Este principio pode ser seguido em situaes em que pedido ao utilizador que preencha um formulrio, oferecendo-lhe algo em troca antes mesmo do pedido ser feito. Um exemplo deste principio pode ser verificado em stios noticiosos, onde, em troca de uma newsletter ou uma edio digital de uma revista ou jornal, pedido ao utilizador para se registar no respectivo stio.
23. http://bits.blogs.nytimes.com/2010/03/30/only-a-few-can-multi-task/ 24.Designao oriunda do filme Rashomon de Akira Kurosawa (1950), o efeito Rashomon, consiste do facto de para para um mesmo objecto de estudo, poderem existir verses diferentes e contraditrias, mas igualmente vlidas. 25. Teoria formulada por George Miller, que defende que uma pessoa apenas capaz de ter 7 (2) items na memria de curto prazo. http://www.musanim.com/miller1956/ 26. http://www.theteamw.com/2009/10/28/100-things-you-should-know-about-people-3-the-magic-number-3or-3-to-4/ 39
6. Ateno As pessoas esto biologicamente programadas para prestar ateno a tudo o que novo, pelo que um stio com um design novo ir naturalmente sobressair. No entanto, dependendo do nvel de ateno que concentremos numa outra aco, o nosso crebro pode ficar cego a alteraes bvias.27 A ateno pode ser atrada atravs da utilizao de cores fortes, tipografia de larga escala ou sons, devendo estes ser usados apenas se tiverem uma utilidade importante, pois as pessoas distraem-se tambm com facilidade e elementos como os descritos podem fazer com que o utilizador no esteja atento ao que importante. 7. As pessoas desejam informao As pessoas tendem a procurar mais informao do que aquela que realmente precisam ou conseguem processar. Ter acesso a uma grande quantidade de informao faz com que as pessoas sintam que tm vrias escolhas, o que, por sua vez, lhes d a sensao de deterem o comando da aco. Mais importante que o stio indicar que um ficheiro est a ser descarregado, o utilizador saber o que de facto se est a passar. 8. Processamento inconsciente A maior parte do processamento mental ocorre de forma inconsciente, sem que a pessoa perceba de facto que este est a acontecer. Convencer um utilizador a executar uma pequena aco, como subscrever uma verso gratuita de um determinado produto, aumenta a probabilidade deste mais tarde executar uma aco maior, como subscrever a verso paga desse mesmo produto. O crebro primitivo responsvel pela maiorias das nossas aces e pelos nossos instintos mais bsicos sobrevivncia e reproduo , razo pela qual so imagens relativas a comida, sexo e perigo que nos captam quase imediatamente a ateno. Por outro lado, o crebro emocional tem tambm grande peso nas nossas decises, e este afectado pelas imagens (principalmente imagens de pessoas) e por histrias. Ambos actuam inconscientemente, pelo que mesmo quando as pessoas caracterizam as suas decises sobre uma dada aco como consciente e racional, por diversas vezes a razo no faz parte da deciso. 9. As pessoas criam modelos mentais As pessoas criam modelos mentais sobre si mesmas, de como os objectos funcionam, os eventos acontecem, as pessoas se comportam, etc., com base no seu conhecimento e experincia (Norman 1998), sendo esses mesmos modelos mentais responsveis pela maior facilidade ou dificuldade em utilizar determinada interface visual. Um exemplo desses modelos mentais a forma como manipulamos um livro, folheando-o, principio que muitas aplicaes seguem como leitores de ebooks, feeds RSS, etc. Produtos cujo modelo mental no se aproxima do modelo mental do utilizador so por isso mais difceis de utilizar.
27. http://uxmag.com/articles/change-blindness 40
1. Usabilidade
10. Sistema Visual Pginas demasiadamente povoadas com texto e imagens fazem com que as pessoas no encontrem o que realmente pretendem. A informao deve ser estrutura e relacionada entre si, agrupando-se pelo seu grau de familiaridade. A cor uma importante ajuda para que o utilizador compreenda o que que est relacionado, mas deve ser usada como complemento a outras solues de forma a satisfazer utilizadores que sofram de daltonismo. Os estudos de eye tracking revelam dados interessantes sobre a forma como as pessoas olham para os ecrs, mas o facto de uma pessoa estar a olhar para um determinado local no significa que esteja realmente a prestar ateno ao que est a ver.28 A tipografia deve ser de uma dimenso generosa, devendo ser evitadas tipografias decorativas ler devido sua menor legibilidade.29 Importa ainda ter em ateno que as cores mais difceis de ler em conjunto (texto e cor de fundo) so o azul e o vermelho.
1.2.5 Sntese
Nielsen, et al. (1990) Visibilidade do estado do sistema Compatibilidade do sistema com o mundo real Controle e liberdade do Controlo; utilizador Aces reversveis Consistncia e uso de padres Preveno de erros Consistncia Shneiderman (1998) Feedback informativo; Dilogos de concluso Tognazzini (2003) Monitorizar o estado Objectos Interface-Humano; Uso de Metforas Autonomia Consistncia As pessoas criam modelos mentais Weinschenk (2011)
Preveno e tratamento Antecipao de erros Capacidade de Aprendizagem A memria humana complicada
Reconhecimento em vez Reduo do recurso de lembrana memria
Flexibilidade e eficincia Atalhos para Eficincia do utilizador de utilizao utilizadores experientes
28. the interpretation of eye tracking data must be done with an understanding that the eyes do not directly reflect attention (Gould 2010) 29. decorative typefaces have low legibility because they are primarily meant to be seen at a glance (Bonneville 2011) 41
Nielsen, et al. (1990) Design e esttica minimalista
Shneiderman (1998)
Tognazzini (2003)
Weinschenk (2011) As pessoas no querem trabalhar ou pensar mais do que precisam; As pessoas tm limitaes; As pessoas desejam informao As pessoas cometem erros
Ajudar o utilizador a Preveno e tratamento reconhecer, diagnosticar de erros e resolver problemas Ajuda e Documentao Aces reversveis Daltonismo Valores por defeito Interfaces Explorveis Lei de Fitts Reduo de latncia Proteger o trabalho do utilizador Legibilidade Navegao visvel
As pessoas so seres sociais Processamento inconsciente Os conjuntos de heursticas aqui apresentados so consistentes no que podemos identificar como os pontos mais relevantes, tendo o conjunto de heursticas mais citado na literatura, as Dez Heursticas de Nielsen, como referncia para comparao. Os conjuntos apresentado por Nielsen e Shneiderman so muito semelhantes entre s, e embora existam algumas diferenas pontuais, a sua interpretao subjacente praticamente idntica, A referncia de Nielsel aos princpios de interaco de Tognazinni fazem sentido visto que ambos parecem complementar-se. Tognazinni faz referncia a questes como o daltonismo, a lei de Fitts, legibilidade, etc, temas que Nielsen explora em pormenor em estudos paralelos, mas que no so identificados textualmente no conjunto de heursticas por s defenidos. Da a necessidade de que estes conjuntos sejam usados numa primeira abordagem avaliao da usabilidade de um stio, e posteriormente complementados com directivas de usabilidade especificas para os projectos em curso. Os principios de Tognazzini referem ainda pontos, como os objectos interface-humano, que apesar de poderem ser comparados ao princpio da compatibilidade do sistema com o mundo real referido por
42
1. Usabilidade
Nielsen, a sua aplicao est mais orientada para o universo das interfaces de software e no para os stios Web. Weinschenk traz uma viso muito diferente das de Nielsen, Schneiderman e Tognazinni apesar de existirem pontos em comum. Ao contrrio destes ltimos, Weinschenk foca-se mais no lado mental do utilizador, nos modelos mentais e comportamentais deste. Como conjunto de heursticas independente, no nos parece apresentar dados suficientes para uma avaliao completa, mas so um bom intrumento de interpretao do utilizador.
1.3. Usabilidade e Acessibilidade

While the primary focus of Web accessibility is on access by people with disabilities, for a broader business perspective, you can say that accessibility is about designing your website so that more people can use it effectively in more situations.
Shawn Lawton Henry, Understanding Web Accessibility, 2006
Falar de usabilidade tambm falar de acessibilidade, uma vez que esta ltima pode ser entendida como uma subcategoria da primeira: a usabilidade tem como preocupao central todos os potenciais utilizadores de um dado sistema interactivo, enquanto a acessibilidade estabelece-se como garantia de que esse mesmo sistema universal e passvel de ser utilizado por todos os utilizadores independentemente de eventuais limitaes motoras e/ou sensoriais, permanentes ou momentneas, como uma mo ou um brao lesionado. Com a esperana de vida a aumentar nas sociedades ocidentais, ou nos pases mais evoludos, prevendo-se um aumento exponencial at 2050 (ONU, 2002) existe um crescente nmero de pessoas com limitaes fsicas associadas ao envelhecimento, como sejam a diminuio das capacidades fsicas em termos de destreza ou a deteriorao da viso (Comisso Europeia, 2008), pelo que a acessibilidade constitui assim uma preocupao face s limitaes motoras e/ou sensoriais permanentes, momentneas e progressivas. Mas o conceito pode ser ainda mais abrangente, incluindo a circunstncia, o ambiente e o dispositivo utilizado para aceder Web. Vrios esforos tm sido realizados no sentido de alertar para a questo da acessibilidade em stios Web, quer por via legislativa , mbito em que o Estado portugus foi pioneiro(Assembleia da Repblica, 1999), quer atravs da aceitao de normas e princpios como as delineadas pelo World Wide Web Consortium30 atravs da Web Content Accessibility Guidelines. Esses princpios, actualmente na sua verso 2.0 (WCAG 2.0),31 so definidos em quatro pontos:
30. O World Wide Web Consortium, ou W3C, uma comunidade internacional liderada por Tim Bernard-Lee, inventor da web, e por Jeffrey Jaffe, que reune uma srie de organizaes pblicas e privadas desde os meios acadmicos passando pelo meio empresarial, que tem como objectivo desenvolver standards para as tecnologias web. 31. http://www.w3.org/TR/WCAG/ 43
1. Percepo A informao e a interface devem ser apresentadas de forma facilmente perceptvel para os utilizadores, ou seja, qualquer que seja a informao, esta no deve ser invisvel a todos os sentidos. 2. Operabilidade A interface e os seus elementos devem ser operveis pelo utilizador, ou seja, nenhum dos elementos interactivos deve requerer uma aco que no possa ser realizada pelo utilizador. 3. Compreenso A informao contida e as aces da interface devem ser compreensveis para o utilizador. 4. Robustez O contedo deve ser suficientemente robusto para que possa ser interpretado com fiabilidade por diversos agentes de utilizao, incluindo leitores de ecr ou braile.
44
2. METODOLOGIAS
Ao falarmos de uma usabilidade acessvel, falamos precisamente num conjunto de metodologias que possam ser colocadas em prtica sem recurso a especialistas na rea, abrangendo inclusivamente a necessidade de o prprio estudo de usabilidade ser tambm usvel. Jeff Sauro e Erika Kindlund (2005) sublinham esta necessidade dada a variedade e complexidade dos dados quantitativos, ou mtricas de usabilidade, fornecidos por diversas metodologias, afirmando a importncia de se estabelecer uma normalizao. Por outro lado, Nielsen (2004) aponta riscos nos estudos quantitativos, alertando para o que afirma ser um fetichismo pelos nmeros que leva a que os estudos de usabilidade se foquem nos dados estatsticos, muitas vezes enganadores, e no em dados qualitativos concretos obtidos pela observao e estudos dos utilizadores. Para Nielsen, a usabilidade uma questo contextual e a sua utilidade depende da compreenso do comportamento humano. Alm do mais, bons estudos quantitativos so caros e difceis de fazer, como refere ainda, devendo estes ser conduzidos por peritos na rea. O processo do Design Centrado no Utilizador apresenta um vasto conjunto de metodologias, de design de pesquisa e de avaliao, disponveis para o design de interfaces,32 em diversas etapas do projecto,33 sendo objectivo deste estudo focar as metodologias de avaliao, sobretudo as que permitem uma avaliao qualitativa, assim como a sua fcil aplicao por designers, observando ainda a manuteno de custos baixos. O stio Usability.gov sistematiza um conjunto mais compacto de metodologias que devem ser empregues num processo de Design Centrado no Utilizador, desde card sorting a entrevistas contextuais, passando por grupos de foco, avaliao heurstica, entrevistas individuais (presenciais e online), design paralelo, personas, prototipagem, anlise de tarefas, testes de usabilidade, casos de uso e escrita para a Web. Por sua vez, Nielsen (1994) introduz o que apelidou de Usabilidade de Guerrilha, um conjunto de trs metodologias de avaliao qualitativa, cenrios de utilizao, testes de usabilidade simplificados e avaliao heurstica. Krug (2006) vai ainda mais longe apostando unicamente em testes de usabilidade simplificados. A W3C, por sua vez, aponta para os percursos cognitivos, avaliao heurstica, reviso de directivas e teste de usabilidade com prottipos de alta e baixa fidelidade.
32. http://www.usabilitynet.org/tools/list.htm 33. http://www.usabilitynet.org/tools/methods.htm, 45
A lista que apresentamos uma sntese dessas metodologias, escolhidas com base nos princpios da Usabilidade de Guerrilha descritos por Nielsen mas a que juntamos outras que consideramos igualmente vlidas no sentido da avaliao da usabilidade de um stio Web, de forma directa, em diversas etapas do desenvolvimento de um stio Web.
2.1. Personas
Personas so arqutipos que representam os objectivos, comportamentos e necessidades dos mais diversos grupos de utilizadores de um determinado sistema (Cooper 1999). Criadas com base em inquritos junto dos utilizadores e stakeholders, as personas permitem conhecer os utilizadores de um dado stio, actuais ou potenciais, as suas diversas necessidades, objectivos, expectativas e tarefas, permitindo criar desde cedo uma abordagem estratgica interface com o utilizador em mente.
2.1.1. Tipologias
Cooper (2007) define seis categorias principais de personas:
2.1.1.1. Primrias
Uma persona primria representa o utilizador-alvo do sistema, seja este individual ou no. No caso dos stios Web, um determinado stio poder ter mais do que um utilizador-alvo, dependendo do tipo de informao ou servio que este providencia, que poder apelar a um vasto pblico e ao cumprimento de vrias e distintas tarefas.
2.1.1.2. Secundrias
Secundrias so as personas cujos objectivos podem ser largamente atingidos pela persona primria, mas que possuem necessidades especiais e/ou particulares que no so consideradas prioritrias, cuja integrao ou desenvolvimento no prejudica a experincia da persona primria.
2.1.1.3. Suplementares
Personas que no so nem primrias nem secundrias, so apelidadas de complementares. Os seus objectivos so atingidos na integra pela combinao das personas primrias e secundrias, e ficam satisfeitas com as solues apresentadas para estas. Por vezes, so personas politicas visto que so fruto da ideia que os stakeholders tm sobre os utilizadores-alvo da sua plataforma.
2.1.1.4. Clientes
As personas clientes so os prprios clientes do sistema, que em determinadas situaes (como a utilizao da administrao de um stio) podero ser os prprios utilizadores finais do sistema.
46
2. Metodologias
2.1.1.5. Personas Indirectas
Personas Indirectas no so utilizadores do sistema, mas podero ser afectados por este de forma directa. Num stio Web, poder ser um pessoa que recebe informao recolhida por uma pessoa que de facto consultou o stio, permitindo assim recolher informaes sobre as ramificaes causadas pela utilizao do stio.
2.1.1.6. Personas Negativas
Tal como as Indirectas, as Personas Negativas representam utilizadores para os quais a interface no est a ser desenvolvida, que no so utilizadores ou potenciais utilizadores, ou que possam ter uma atitude negativa perante esta. Neste ltimo caso, um bom exemplo de uma pessoa negativa poder ser um utilizador experiente da interface.
2.1.2. Processo
As personas tm a funo de representar os utilizadores-chave de um determinado sistema ao longo do processo de desenvolvimento deste, permitindo focar e priorizar os aspectos do design da interface a desenvolver. Apesar de serem personagens fictcias, devem ser criadas da forma o mais realista possvel uma vez que constituem representaes de pessoas reais. Tambm devem ser o menos ambguas possvel, visto ser sua funo criar objectivos concretos sobre os quais a equipa de desenvolvimento possa definir prioridades no desenvolvimento da interface. Criar personas credveis e teis implica conseguir uma anlise detalhada do utilizador, assim como uma capacidade de sntese criativa (Cooper 2007), procurando padres de comportamento e categorizando esses mesmo padres. Os principais passos so: 1. Identificar variveis comportamentais; 2. Mapear os utilizadores em funo dessas variveis; 3. Identificar padres de comportamento significativos; 4. Sintetizar caractersticas e objectivos relevantes; 5. Procurar redundncias; 6. Expandir a descrio de atributos e comportamentos; 7. Categorizar as personas. Aps este processo, segue-se a construo prtica da persona, que dever conter um perfil de carcter que inclua: 1. Dados demogrficos de base: nome, idade, profisso, passatempos, interesses, motivaes; 2. Categoria (relao da persona com o stio); 3. Descrio do seu dia tpico; 4. Questes e tarefas relacionadas com o stio; 5. Principais frustraes no cumprimentos das tarefas;
47
6. Habilidade na utilizao da Web e computadores; 7. Tempo disponvel para a tarefa; 8. Objectivos, atitude, necessidades, crenas, etc... Os objectivos das personas, segundo Cooper (1999), podem ser categorizados da seguinte forma: Individuais: objectivos universais e pessoais simples que passam pela obteno da informao pretendida de forma rpida e sem barreiras ou erros; Corporativos: os objectivos do cliente, como sejam, atrair mais utilizadores para o seu stio e mais clientes para os seus servios ou produtos; Prticos: onde os objectivos pessoais e cooperativos se fundem e se do resposta mtua; Falsos: objectivos irrelevantes para o utilizador e mais vocacionados para as questes tcnicas do prprio sistema, como sejam, a construo de stios compatveis com qualquer plataforma, a observao do uso de normas de linguagem de programao, etc. s personas podem ainda serem associados cenrios de utilizao, dado que as informaes recolhidas na elaborao do seu perfil permitem ter uma ideia de qual ou quais podero ser as principais interaces do utilizador com o stio, ou os seus padres comportamentais. Esses cenrios devero conter informao sobre o objectivo da tarefa que o utilizador pretende, o seu contexto e motivao.
2.1.3. Recursos
Para a realizao de personas, os recursos necessrios so de ordem metodolgica. Embora seja possvel criar personas com base em dados quantitativos personas hipotticas atravs da anlise do trfego de um stio (Mulder, 2006), o melhor recurso para a sua criao est na pesquisa e em inquritos junto dos utilizadores de forma a conhec-los e assim assegurar que a interface desenhada para utilizadores reais.
2.1.4. Prs e Contras

A utilizao de personas permite focar as equipas de trabalho nas necessidades, objectivos, expectativas e tarefas do utilizar (Usability.gov). Sempre presentes desde as etapas iniciais do projecto, as personas permitem confrontar a arquitectura de informao e inspeccionar a interface com base nessas mesmas necessidade e objectivos, orientando as opes de design tomadas no sentido de lhes dar resposta e evitando que o designer se assuma como o utilizar da plataforma e a desenhe com base nas suas expectativas (Spool, 2007). As personas tm ainda a vantagem de substituir os utilizadores reais quando estes no esto presentes no processo de desenvolvimento.
48
2. Metodologias
Mas embora permitam conhecer o utilizador, as personas, no entanto, no cumprem na totalidade a sua funo num processo de desenvolvimento, no substituindo os utilizadores reais na ntegra, pelo que as interfaces devem sempre ser testadas com utilizadores reais. So teis como ferramenta bsica de inspeco de usabilidade, permitindo compreender qual as necessidades do utilizador e o seu eventual percurso no stio, mas podendo eventualmente encontrar alguns problemas, no essa a sua principal funo, e uma interface criada unicamente com base em personas apenas garantir que o que o utilizador pretende se encontra presente, mas no que o utilizador de facto o conseguir encontrar.
2.2. Card Sorting

O card sorting uma tcnica que permite perceber como os utilizadores agrupam informao e como interpretam termos e conceitos. As tcnicas de card sorting so particularmente teis para a arquitectura de informao, permitindo compreender a forma como os utilizadores agrupam a informao, e tambm quais os melhores termos a empregar na navegao do contedo. Em determinados tipos de stios Web, como stios institucionais ou empresariais, a arquitectura de informao tende a seguir o modelo organizacional dessas entidades, mas quem visita esses stios pode no saber de que forma essa entidade est organizada, pelo que essa estrutura poder no fazer sentido para os utilizadores (Mathis, 2011). Empregando esta tcnica, possvel compreender de que forma o utilizador estrutura o contedo que lhe apresentado, ou seja, como as pessoas de facto o vem.
2.2.1. Tipologias
2.2.1.1. Card Sorting Aberto
Num card sorting aberto, providenciado ao utilizadores um conjunto de termos, inscritos em cartes individuais um por cada termo , e um conjunto de cartes em branco. ento pedido aos utilizadores que agrupem esses cartes por afinidade de termos e/ou conceitos, fornecendo uma descrio genrica para esse agrupamento a ser inscrita nos cartes em branco. Esta tipologia tem como objectivo compreender de que forma os utilizadores interpretam os termos iniciais que representam conceptualmente os contedos do stio Web, e que termos genricos julgam ser mais apropriados para agrupar esses mesmo contedos, estabelecendo uma base para o primeiro nvel na arquitectura de informao.
2.2.1.2. Card Sorting Fechado
Num card sorting fechado so fornecidos aos utilizadores dois conjuntos de termos, inscritos em cartes individuais um por cada termo. Com um dos grupos a servir de elemento agregador, os utilizadores devero distribuir os cartes do segundo grupo pelo primeiro por afinidade de termos e/ ou conceitos. O card sorting fechado til enquanto sistema de validao aps um teste de card sorting
49
aberto, pois permite que os termos sugeridos neste sejam testados de forma a comprovar a sua validade enquanto elementos de primeiro nvel na arquitectura de informao.
2.2.1.3. Reverse Card Sorting
Num reverse card sorting tambm conhecido por card-based classification so fornecidos vrios grupos de termos, inscritos em cartes individuais um por cada termo sem ordem prestabelecida, tendo o utilizador de criar um percurso de navegao com eles em funo de uma dada tarefa. Ao utilizador pedido que alinhe, num percurso linear, os cartes que representem os passos necessrios para cumprir essa mesma tarefa. O reverse card sorting til enquanto sistema de validao dos resultados obtidos pelos testes de card sorting aberto e fechado, pois permite no s revalidar o primeiro nvel da arquitectura de informao, como tambm aferir a profundidade desta para 2, 3 ou mais nveis de arquitectura de informao.
2.2.2. Processo
As sesses de card sorting sero mais eficientes se previamente forem realizadas: entrevistas com os utilizadores para compreender as suas necessidades, motivaes e objectivos num determinado stio Web; personas para sistematizar o utilizador tipo com base nessas entrevista; inventariao do contedo a ser utilizado pelo stio Web; e cenrios de utilizao que permitam entender quais os percursos que devero ser construdos para que o utilizador possa cumprir as tarefas que pretende. Estas sesses podem ser realizadas individualmente ou em grupo, segundo o seguinte modelo tipo: 1. Criar uma lista tpicos ou tipos de contedos, que devero ser inscritos individualmente em cartes; 2. Numa situao de card sorting aberto, providenciar tambm cartes em branco para que o utilizador possa escrever o termo genrico para os grupos criados, devendo os cartes ser numerados de forma que a compilao dos resultados se processe mais facilmente; 3. As sesses devem ser realizadas num espao sossegado, onde exista uma mesa que permita ao utilizador manipular os cartes sem dificuldade, ou um computador com software de card sorting; 4. Depois de explicado qual o objectivo do teste ao utilizador, fornecer os cartes pedindo-lhe que os agrupe de acordo com a tipologia utilizada providenciando cartes em branco, caso o utilizador considere necessria a incluso de novos termos; 5. Analisar os resultados.
2.2.3. Nmero de Testes Recomendado

Segundo Nielsen (2004), Tulis e Wood (2004), o card sorting deve ser realizado com, pelo menos, 15 utilizadores, nmero para o qual possvel obter um coeficiente de correlao de 0.9, ou seja, possvel confirmar com 90% de segurana que o resultado obtido representa o modelo mental formado pelos
50
2. Metodologias
utilizadores. De acordo com o que possvel interpretar do estudo de Tulis e Wood, com 5 utilizadores possvel obter uma correlao de 0.75, o que em projectos de pequena/mdia dimenso poder ser um valor aceitvel.
2.2.4. Recursos
O card sorting pode ainda ser realizado da forma mais simples, apenas com recurso a papel e caneta, mas existe software passvel de ser utilizado sem com isso acrescentar custos adicionais ao projecto, como o XSort34, para sistemas operativos Mac OS X, e o UXSort,35 para sistema operativos Windows. Existem ainda ferramentas de card sorting online, como o OptimalSort36 e o WebSort,37 para as quais necessrio o pagamento de uma licena de utilizao. Em ambos os casos, software e ferramentas online, possvel no s conduzir as sesses de card sorting como ainda obter tabelas de dados quantitativos relativamente s sesses realizadas.

O card sorting uma tcnica fcil e barata de realizar e que permite analisar a melhor forma de estruturar a informao e o vocabulrio utilizado (Rubin e Chisnell, 2008). Pode ser feita com eficincia sem a utilizao de qualquer tipo de software, embora este exista. Um dos principais problemas do card sorting, no entanto, est na leitura e interpretao dos resultados obtidos, habitualmente organizados em dendrogramas ou diagramas de afinidade, que exigem recurso a um analista experiente. De natureza quantitativa, as estatsticas apresentadas podem ser tendenciosas e enganadoras (Nielsen, 2004), e embora apresentem por vezes dados consistentes entre utilizadores, outras vezes, esses dados podem ser bastante dspares. assim aconselhada uma anlise qualitativa em paralelo, sendo pedido aos utilizadores para verbalizarem oralmente as suas decises, de forma a compreender as razes para as suas escolhas. Como tcnica orientada para a arquitectura de informao, e embora possa ser utilizado para encontrar problemas de usabilidade na navegao de um stio Web, o card sorting no se foca no cumprimento de tarefas, excepto nas situaes em que utilizada a tcnica de reverse card sorting. Tambm no til para encontrar problemas de usabilidade na interface grfica no seu todo, no devendo os seus resultados ser interpretados como uma verdade cientificamente correcta, mas sim como uma boa base de trabalho que posteriormente poder ser alterada em outras fases do projecto onde a interface no seu todo possa ser avaliada.
34. http://www.xsortapp.com/ 35. http://www.uxsort.com/home 36. http://www.optimalworkshop.com/optimalsort.htm 37. http://uxpunk.com/websort/ 51
2.3. Prototipagem
No caso especifico do design de interfaces, por prottipo entende-se a representao visual da interface do utilizador. Embora um prottipo no seja inerentemente interactivo (um esboo, p.ex.), este poder representar uma progresso espacial e fornecer um limitado grau de interaco entre o utilizador e o sistema. Um prottipo pode ser desenvolvido em diversas etapas, usando diversas ferramentas. Inicialmente, um prottipo pode ser desenvolvido em papel, onde apenas so indicados os respectivos elementos estruturais (wireframes), evoluindo subsequentemente para verses mais complexas com recurso a ferramentas de design, outros sistemas que clonem aquele em que o projecto ser produzido (como CMS)38 ou mesmo verses alfa do sistema final. Os prottipos no tm necessariamente de replicar todas as funcionalidades do sistema, mas devem replicar na ntegra o necessrio para a realizao de determinado teste.
2.3.2. Tipologias
2.3.2.1. Prototipagem Horizontal
Um prottipo horizontal representa apenas as funcionalidades de primeiro nvel. Serve sobretudo para testar e analisar a navegao principal e deve representar ainda o resultado inicial da interaco desse primeiro nvel.
2.3.2.2. Prototipagem Vertical
Um prottipo horizontal representa a progresso ao longo de um sistema para completar determinada tarefa, permitindo que o utilizador interaja com a estrutura hierrquica de determinada funcionalidade. Os prottipos podem ser de baixa ou alta fidelidade, com base nas seguintes dimenses: 1. Detalhe; 2. Funcionalidade; 3. Similaridade de interaco; 4. Aproximao esttica;
38. CMS, Content Managment System ou Sistema de Gesto de Contedos. 52
2. Metodologias
2.3.2.3. Prototipagem de Baixa Fidelidade
Os prottipos de baixa fidelidade so representaes simples da interface, com um nvel baixo de detalhe e num suporte diferente da verso final da interface. No mostram, necessariamente, o design final da interface, podendo mesmo por vezes mostrar apenas a estrutura geral em esboo.
2.3.2.4. Prototipagem de Alta Fidelidade
Os prottipos de alta fidelidade so representaes fieis da interface, com um alto nvel de detalhe e apresentado no mesmo suporte que a verso final (mas no necessariamente no mesmo software). Representam todas ou quase todas as funcionalidades do stio, assim como os respectivos contedos.
2.3.4. Processo
O processo de prototipagem comea com os primeiros esboos da interface, nomeadamente da sua estrutura, como o cabealho, menus, contedos, contedos suplementares, menus de apoios, posio de ttulos, texto, imagem, etc. A utilizao de esboos manuais, menos rigorosos, permite que vrias solues possveis possam ser idealizadas de forma rpida antes da passagem das solues mais bem sucedidas para etapas posteriores onde os detalhes vo sendo estruturados e afinados. Estes esboos rpidos tanto podem ser de pginas estticas, como j prever um progresso ao longo do stio, representando pginas de diferentes hierarquias na arquitectura de informao, seja por via da prototipagem horizontal, seja por prototipagem vertical. medida que o desenho vai sendo refinado, surge ento a necessidade de criar prottipos mais rigorosos e mais funcionais, quer atravs de software desktop que permita desenvolver prottipos estticos ou funcionais, quer mesmo, em fases mais avanadas, com a construo de prottipos que simulem o sistema, utilizando HTML e CSS.

Ao realizar testes de usabilidade com prottipos (de baixa ou alta fidelidade) deve ser usado o mesmo nmero de utilizadores referido no ponto 2.6.3., relativo aos testes de usabilidade.
2.3.6. Recursos
A prototipagem pode ser realizada de forma mais simples, apenas com recurso a papel e caneta, o que se designa por prottipos em papel. medida que o processo de trabalho requere prottipos mais fiis interface ou mais fiis sua funcionalidade, torna-se necessrio o recurso a ferramentas de design, como software que permita desenho vectorial, ou mesmo programas de tratamento de imagem.Outros
53
programas h ainda que, para alm de permitirem o desenho, permitem tambm algumas interaces simples que podem simular a utilizao de links , botes ou menus de um stio.

A utilizao de prottipos da interface permite recolher informao junto dos utilizadores sobre a usabilidade da interface que se encontra a ser desenvolvida. Nielsen (2003) salienta este facto, sublinhando que, atravs da prototipagem, possvel criar rapidamente uma representao da interface e test-la com utilizadores numa etapa do design onde as eventuais alteraes interface posam tambm ser realizadas rapidamente e de uma forma econmica para o projecto. Num estudo comparativo (Walker, et al., 2002), a questo do nvel de fidelidade dos prottipos face ao utilizador revelou-se de pouca importncia, j que ambos se revelam capazes de assegurar um bom feedback da parte do utilizador. Prottipos de alta fidelidade tm no entanto uma vantagem suplementar, uma vez que, ao garantirem uma representao o mais realista possvel da interface algo que os prottipos menos funcionais, ou de baixa fidelidade, no garantem -, no s permitem afinaes finais em termos de usabilidade, como uma defesa mais consistente das opes seguidas perante os stakeholders (Johansson, et al. 2007).
2.4. Percurso Cognitivo

O Percurso Cognitivo uma ferramenta de inspeco, com base nos cenrios de utilizao, onde a interface navegada com o objectivo de cumprir uma tarefa, anotando pelo caminho se todas as opes necessrias e ferramentas para o cumprimento dessa mesma tarefa esto visveis e so claras para o utilizador (Wharton, 1994) (Rieman, et al. 1995).
2.4.1. Processo
As tarefas a cumprir devero ser divididas em passos (num stio, podem ser as diferentes pginas necessrias para o cumprimento da tarefa) e em cada passo devero ser feitas as seguintes perguntas, a ttulo de exemplo (Wharton, 1994): 1. A aco executada respeita os objectivos do utilizador neste momento? 2. O utilizador vai ver a aco disponvel? 3. O utilizador ir reconhecer que a aco a que precisa? 4. Ir o utilizador perceber o feedback recebido? Ao dividir a tarefa em diferentes passos, possvel identificar em que momentos o interface falha no fornecimento da informao necessria para o utilizador cumprir a tarefa, quer atravs das
54
2. Metodologias
funcionalidade necessrias para cumprir essa mesma tarefa (menu, hiperligaes, botes, contedo, etc.), ou dos avisos imprescindveis em caso de erro.

A inspeco por Percurso Cognitivo no envolve necessariamente utilizadores, apresentando-se como uma metodologia que pode ser conduzida pela equipa de design de uma interface visual (Wharton, 1994).
2.4.3. Recursos
Para a realizao de uma inspeco por Percurso Cognitivo, os recursos necessrio, para alm das ferramentas e suportes consideradas necessrias para apontamentos e notas, so de ordem metodolgica. O Percurso Cognitivo inspecciona a interface por via da realizao de tarefas, pelo que necessria a existncia de um prottipo da interface com um bom nvel de detalhe e tarefas previamente estabelecidas e descritas (Lewis, 1994), que podem ser estabelecidas atravs dos cenrios de utilizao das personas.

O Percurso Cognitivo permite encontrar problemas de usabilidade relativos s tarefas do utilizador desde as primeiras etapas do desenvolvimento da interface, mas no permite encontrar todos os problemas, uma vez que as personas e os cenrios de utilizao abrangem sobretudo as tarefas mais espectveis, mas no todas as tarefas que so possveis de realizar. Para a sua realizao, necessria a existncia de tarefas pr-definidas e aconselhvel algum treino prvio nesta metodologia bem como ter em conta que esta procura apenas verificar a facilidade com que o sistema utilizado, deixando de fora outros princpios de usabilidade. Noutro aspecto, a no utilizao de utilizadores reais tambm no garante que os resultados obtidos sejam inteiramente vlidos, pelo que um teste de usabilidade posterior sempre aconselhado.
2.5. Avaliao Heurstica

Por Avaliao Heurstica entende-se uma avaliao, feita por peritos, baseada nas Heursticas de Usabilidade, que avaliam o sistema e elaboram um relatrio visando o cumprimento dos princpios que lhe esto associados. um dos mtodos mais informais, mas, ao mesmo tempo, tambm considerado como um dos principais relativamente ao equilbrio custo/benefcio (Nielsen, 1990). Comparativamente a outras metodologias, onde o avaliador deve interpretar as aces do utilizador, na Avaliao Heurstica no necessria a interpretao por parte de terceiros, porque as ideias, comentrios e informaes elaboradas pelos avaliadores est contida nos seus relatrios.
55
2.5.1. Tipologias
2.5.1.1. Percurso Heurstico
O Percurso Heurstico apresenta-se como um hbrido entre o Percurso Cognitivo e a Avaliao Heurstica (Sears, 1997). Num Percurso Heurstico, o avaliador confronta o sistema com um conjunto de Heursticas reconhecido, com base nos cenrios de utilizao previstos para esse sistema. Segundo Sears, este modelo hbrido permite encontrar mais problemas de usabilidade do que o Percurso Cognitivo, reduzindo a ocorrncia de falsos positivos que se verificam nas Avaliaes Heursticas, pois a avaliao foca-se exclusivamente na realizao das tarefas do utilizador no sistema.
2.5.2. Processo
Numa Avaliao Heurstica os avaliadores confrontam um dado sistema ou interface com um conjunto de heursticas reconhecido, de forma individual, providenciando um comentrio crtico sobre a observao ou no dos princpios estabelecidos por essas heursticas. Uma vez concluda, os avaliadores comparam os resultados obtidos individualmente e elaboram uma relatrio final com os problemas encontrados cruzando os seus dados com os dados obtidos por outros avaliadores. Os problemas encontrados no mbito de uma Avaliao Heurstica podem ser de diversa gravidade (Nielsen, 1992), sobretudo em etapas inicias do design, devendo ser enquadrados numa escala de severidade, de forma a permitir uma melhor viso sobre a influncia e urgncia de resoluo de um problema. Estas escalas podero ser de trs ou cinco nveis (Pierotti, 1996), a saber: Escala de severidade de trs nveis 1. Problema meramente cosmtico causador de dificuldades mnimas; 2. Problema ao nvel da realizao da tarefa, ou que confunde o utilizador, mas em que a recuperao possvel; 3. Problema que impede o utilizador de realizar determinada tarefa ou causa extremas dificuldades. Escala de severidade de cinco nveis 1. Problema meramente cosmtico que no afecta a usabilidade do sistema e cuja recuperao possvel; 2. Problema menor, passvel de ser facilmente contornado pelo utilizador, podendo ser a sua reparao de baixa prioridade; 3. Problema mdio, capaz de confundir o utilizador mas ao qual possvel que este se adapte, devendo a reparao ser de prioridade mdia; 4. Problema grave que faz com que o utilizador tenha extremas dificuldades na realizao do seu trabalho, sendo possvel contorn-lo mas exigindo que a sua reparao deva acontecer antes do sistema ser lanado - e no sendo possvel a reparao, a documentao dever mostrar claramente ao utilizador uma alternativa;
56
2. Metodologias
5. Problema catastrfico que impede o utilizador de realizar o seu trabalho e que exige uma reparao obrigatria e urgente.

Estudos mostram que um nmero de entre 3 a 5 avaliadores mais do que suficiente para a avaliao por critrios de um stio Web, (Nielsen, 1994) com mais de 75% de erros encontrados. Apesar da Avaliao Heurstica ser entendida como uma avaliao realizada por peritos, e ser recomendada a utilizao de avaliadores experientes (Nielsen, 1992), esta pode no entanto ser efectuada por utilizadores no especialistas, aconselhando-se neste caso que seja realizada por mais de 5 avaliadores (ij, 2001).
2.5.4. Recursos
Para a realizao de uma Avaliao Heurstica, os recursos necessrio so apenas as ferramentas e suportes consideradas necessrias para apontamentos e notas. A realizao destes no exige o recurso a prottipos do sistema ou da interface, podendo ser assim efectuada com esboos integrais ou parciais da interface, ou com wireframes.

A Avaliao Heurstica permite confrontar a interface com um conjunto de Heursticas de Usabilidade reconhecidas, procurando detectar os principais problemas de usabilidade. Sendo inspeco guiada pelos principais objectivos de usabilidade, a Avaliao Heurstica no uma metodologia eficaz para avaliar e sistematizar problemas de pormenor, que s com testes com utilizadores reais podero ser encontrados. No caso de um stio totalmente funcional, aconselhvel realizar a Avaliao Heurstica antes de a testar com os utilizadores. Um teste com utilizadores prvio s serviria para detectar problemas de usabilidade que, numa avaliao heurstica, teriam sido facilmente detectados pelos peritos a um custo muito mais reduzido. Devido a estes problemas, muitos utilizadores podem ficar bloqueados nas fases iniciais do processo a avaliar e muitos dos elementos importantes podero eventualmente no ser avaliados, a menos que os utilizadores sejam instrudos sobre como ultrapassar as dificuldades, o que anularia a validade do teste. Identificar primeiramente os problemas mais graves de usabilidade na avaliao por critrios heursticos permite realizar posteriormente testes com utilizadores com melhores resultados.
57
2.6. Teste de Usabilidade

Este o mtodo mais comum para a avaliao de usabilidade, designado tambm como Thinking Aloud Test ou Mtodo de Verbalizao do Pensamento. O Teste de Usabilidade pode ser realizado em diversas fazes do projecto e em conjunto com outras metodologias. Numa situao de redesenho de um stio Web existente, o teste servir para aferir quais os actuais problemas de usabilidade da interface e que pontos especficos devem ser resolvidos pela nova interface. Seguidamente, pode ser utilizado para testar os primeiros prottipos da interface na fase inicial do projecto, sejam esses prottipos em papel, digitais ou funcionais, de alta, mdia ou baixa fidelidade, seguindo os princpios do design iterativo design > prototipagem > teste > anlise > redesenho ou em fases mais avanadas do projecto em que a interface se encontre perto de ser implementada.
2.6.1. Tipologias
O Teste de Usabilidade pode ser dividido em duas tipologias, embora na sua essncia sejam o mesma. Esta distino entre Teste Tradicional e Teste Informal proposta por Krug (2006) vem no seguimento do que Nielsen (1989, 1997) j havia referido: a possibilidade de conduzir estes testes com elevados graus de custo/benefcio (1994), sem que com isso tenhamos de utilizar um laboratrio de usabilidade, com todo o equipamento necessrio, e a custos bem reduzidos.
Teste Tradicional Nmero de utilizadores Esforo de recrutamento Normalmente, oito ou mais para justificar o custo Seleccionados cuidadosamente de forma a representarem a audincia alvo Num laboratrio de usabilidade, com uma sala de observao e um espelho falso Um profissional de usabilidade experiente Tem de ser preparado com semanas de antecedncia para se reservar um laboratrio de usabilidade e haver tempo para recrutar Esboo, discusso e reviso do protocolo de teste A menos que se disponha de um oramento flexvel, testar o stio de uma vez s quando este estiver perto da concluso Elevado Teste Informal Trs ou quatro Qualquer pessoa que utilize a Web
Onde testar?
Num escritrio ou sala de conferncias
Quem faz o teste? Planeamento Antecipado
Uma pessoa paciente Pode ser efectuado praticamente em qualquer altura e com pouca antecedncia de marcao Decidir o que se pretende mostrar Desenvolver pequenos testes continuamente ao longo do processo de desenvolvimento Reduzido
Preparao Quando Testar?
Custo
58
2. Metodologias
O que acontece depois
Um relatrio de 20 pginas surge uma A equipa de desenvolvimento semana depois, e depois a equipa de (incluindo o cliente) pode reunir no desenvolvimento rene e decide quais prprio dia e tirar concluses imediatas as alteraes a fazer
2.6.2. Processo
Antes de se proceder realizao dos testes, necessrio estabelecer os objectivos do teste, as reas e os cenrios de utilizao a serem testados e quais as questes que se pretende ver respondidas ao longo da interaco com a plataforma, assim como num questionrio a ser respondido pelo utilizador no final da interaco. Nesse questionrio, devem ser evitadas perguntas genricas que respondam a questes globais da interaco, procurando sim respostas concretas por parte dos utilizadores para pormenores especficos dessa mesma interaco. Quanto s tarefas que devero ser cumpridas pelos utilizadores, as mesmas devero ter em conta os cenrios de utilizao pr-estabelecidos anteriormente, que so assim validados, ou no, por esses mesmos testes. Durante um teste de usabilidade temos a possibilidade de observar utilizadores reais a interagir com o stio e a executar tarefas que se aproximam dos seus objectivos. O principal objectivo da realizao de um teste tentar perceber quais as componentes da interface que dificultam a interaco, sendo, por isso, importante que o stio no seja discutido antecipadamente com os sujeitos, para que eles possam, desde o primeiro contacto, dizer se perceberam para que serve o stio e como que ele funciona. A realizao do teste deve ser acompanhada por um facilitador cuja funo impedir o sentimento de frustrao por parte do utilizador na utilizao do interface testado, orientando-o ao longo do teste da interface. Krug (2000) refere que a tarefa do facilitador dizer aos utilizadores quais as tarefas que eles devem executar, encoraj-los a pensar alto descrevendo as razes por detrs das escolhas efectuadas, ouvir cuidadosamente o que eles tm a dizer e proteg-los. Durante a realizao do teste, o mais importante ser que os utilizadores percebam que o objecto do teste a interface do stio, no eles prprios, e que, como refere Lukas Mathis (2008), cada erro que eles cometam ir ajudar a melhorar o stio. Para alm do facilitador, o teste deve contar ainda com um observador que, ao longo da interaco do utilizador com a interface , deve tirar notas extensivas do que est a acontecer, porque mais tarde alguns dados podero cair no esquecimento. Essas notas podem ser tiradas seguindo um formato livre ou preenchendo uma lista previamente elaborada com todos os pontos essenciais para responder s perguntas iniciais levantadas pelos cenrios de utilizao. A forma mais eficaz ser a combinao de ambos os mtodos, o que permite ao observador, por um lado, certificar-se que nenhum ponto importante esquecido e, por outro lado e ao mesmo tempo, adicionar qualquer informao que ache relevante.
59
Aps a realizao do teste aconselhvel fazer um pequeno questionrio aos utilizadores, perguntando o que gostaram e o que no gostaram, que funcionalidades esperariam de uma aplicao semelhante e se a iriam utilizar no futuro. Todo o teste registado em formato vdeo e udio, quer atravs da utilizao de equipamento externo ou de software prprio que registe o que se passa no ecr do computador. Quando a sesso registada em vdeo e/ou udio, o utilizador dever dar o seu consentimento para tal, se necessrio atravs de uma autorizao escrita, assegurando este que a sua privacidade ser respeitada e que os dados registados nunca sero divulgados publicamente. Numa situao em que o autor do design da interface tambm o facilitador do teste, o utilizador deve ser mantido alheio a este facto pois, se estiver consciente do mesmo, maior dificuldade ter em manter uma atitude crtica sobre a interface. O teste deve comear por apresentar a plataforma a cada utilizador, para que este possa, numa fase posterior, desempenhar as tarefas previamente definidas pelos cenrios de utilizao. Krug (2000) define dez pontos essenciais a ter em mente quando se pretende realizar um teste de usabilidade: 1. Testar o Teste. Antes de efectuar o teste com utilizadores, o teste em si deve ser testado na ntegra de forma a assegurar que as tarefas podem ser cumpridas, no tempo programado, e que todas as interaces esto disponveis ou providenciam informao concreta sobre o que fazer se estas no estiverem activas; deve-se ainda certificar que todo o equipamento para recolha dos dados est operacional. 2. Proteger o Utilizador. Caso o utilizador encontre dificuldades em cumprir determinada tarefa, deve-se evitar que o mesmo fique frustrado, ajudando-o voltar atrs, se necessrio, agradecendo sempre tudo o que o utilizador fez, e deixando bem claro que a sua participao no testes extremamente til, que todos os dados recolhidos so importantes e que qualquer problema se deve interface e no ao utilizador. 3. Ser simptico e paciente. Talvez o mais importante conselho para a realizao dos testes: uma atitude afvel e positiva muito importante de forma a deixar o utilizador o mais vontade possvel, pois um facilitador frustrado perante o teste a ser conduzido influencia negativamente a motivao do utilizador. 4. Perceber o pensamento do utilizador. O teste de usabilidade procura obter dados sobre o modelo mental do utilizador, pelo que importante que este v verbalizando o seu pensamento ao longo do teste, e, sempre que parea bloqueado e pensativo, pea-lhe que diga em que est a pensar. 5. No fornecer pistas. Se o utilizador encontrar obstculos na interaco e sentir-se frustrado, deve-se evitar dar-lhe pistas sobre que caminho a seguir, pois dessa forma ir viciar-se os resultados. 6. Dar instrues simples. As instrues dadas aos utilizadores devem ser o mais simples e claras possvel, evitando termos tcnicos que o utilizador possa desconhecer, e repetindo-as as vezes que forem necessrias.
60
2. Metodologias
7. Sondar o utilizador. Ao longo do teste, e sempre que o utilizador efectuar algum comentrio que se julgue pertinente, deve-se perguntar mais sobre esse comentrio de forma a obter o mximo possvel de dados. 8. Improvisar. Na mesma sesso e nos ltimos testes os utilizadores podero enfrentar problemas que os testes anteriores j diagnosticaram, devendo-se, nesse caso, explicar o que aconteceu e que o erro j est diagnosticado, encaminhando o utilizador para outro cenrio de utilizao. 9. No ficar desiludido com utilizadores inexperientes. Aprende-se mais com utilizadores inexperientes do que com utilizadores experientes. 10. Escrever notas no final de cada sesso. Mesmo que a sesso esteja a ser gravada, deve-se sempre escrever notas sobre o que mais de relevante se passou, de forma a evitar que estas sejam esquecidas.

Estudos mostram que a realizao de testes de usabilidade com cinco utilizadores suficiente para encontrar 75% dos potenciais erros. Para 100% dos erros encontrados, j se torna necessria a realizao de testes com quinze utilizadores (Nielsen, 2000).
2.6.4. Recursos
Um teste de usabilidade clssico, envolve meios amplos e dispendiosos, e geralmente efectuado por empresa especializada, em laboratrios construdos especificamente para o efeito, com vidros espelhados, cmaras para captar o rosto dos utilizadores e o ecr, e sistemas de gravao udio. Num teste informal, s necessrio equipamento de registo udio e vdeo externos quando so testados prottipos em papel, ou um computador equipado com um sistema de registo do ecr quando testados prottipos funcionais ou verso alfa do sistema, como o Quicktime39, para sistemas operativos Mac OS X e Windows ou o Silverback40, um software desktop especfico para a realizao de testes de usabilidade que implica o pagamento de uma licena de utilizao para sistemas operativos Mac OS X, ou ainda o Camtasia41, que disponibilizado para sistemas operativos Mac OS X e Windows.

O teste de usabilidade com utilizadores o teste por excelncia. O recurso a utilizadores reais permite recolher dados mais concretos em termos de usabilidade, e, como Nielsen refere (2000), permite identificar um largo espectro de erros de forma rpida e com recurso a poucos utilizadores. Alm do
39. http://www.apple.com/quicktime/download/ 40. http://silverbackapp.com/ 41. http://www.techsmith.com/camtasia.html 61
mais, a simplicidade como os testes podem ser conduzidos por no especialistas permite que possam ser efectuados por qualquer membro de uma equipa de trabalho, especialmente os designers, uma vez que os resultados destes testes tm implicao directa no design da interface (Nielsen, 2007). Como Nielsen sublinha ainda (2009), sempre prefervel um estudo com utilizador mal conduzido, a nenhum estudo. O teste no do todo infalvel, pois h sempre o perigo do prprio utilizador, que se encontra num ambiente artificial de utilizao, fornecer dados errados, seja por falta de motivao para o teste, ou por nervosismo, ou qualquer outra razo.
62
3. CASOS DE ESTUDO
Aps o levantamento das questes relacionadas com o estudo da usabilidade e principais metodologias para a avaliao qualitativa da usabilidade no design para a Web, seguiu-se a sua aplicao em casos reais com o objectivo de no s validar as suas vantagens e desvantagens anteriormente enumeradas, como verificar as suas mais valias para um projecto de desenvolvimento de um stio Web, quer, por um lado, numa perspectiva do design centrado no utilizador, quer, por outro, numa perspectiva de baixo custo. Os casos de estudo que se seguem foram todos realizados no mbito da nossa actividade profissional no id:D FBAUP, um grupo de investigao em design criado no seio da Faculdade de Belas Artes e que integra o respectivo Centro de Estudos, que presta servios em vrias reas do design para o exterior.
3.1. Novo Stio da Universidade do Porto

3.1.1. Cliente e contexto
A Universidade do Porto, doravante identificada pela sigla UP, a maior instituio de ensino e investigao cientfica em Portugal, com cerca de 31.000 estudantes, 2.300 professores e investigadores e 1.700 funcionrios no docentes espalhados por 15 escolas e 69 unidades de investigao, distribudas por trs polos universitrios localizados na cidade do Porto, aos quais se juntam mais de 2.000 estudantes estrangeiros ao abrigo dos mais variados programas de intercmbio que a UP mantm com escolas de vrios pontos do mundo. Na sua oferta curricular contam-se mais de 700 programas de formao (entre licenciaturas, mestrados e doutoramentos, passando pela educao contnua).42
3.1.2. Projecto
As metas a atingir pelo novo stio foram transmitidas pela Dra. Lgia Ribeiro, Pr-Reitora para as Tecnologias de Informao e Comunicao da UP numa reunio preparatria, consistindo as mesmas em: 1. Apresentar a UP comunidade em geral;
42. http://sigarra.up.pt/up/web_base.gera_pagina?P_pagina=122225 63
2. Cativar estudantes para os vrios ciclos de estudos oferecidos pela UP, incluindo a educao contnua; 3. Divulgar o trabalho de investigao realizado pela UP e captar parceiros para projectos e investigadores de referncia; 4. Fomentar a transferncia de tecnologia; 5. Fomentar a cooperao internacional; 6. Fomentar e manter uma relao de proximidade com os antigos estudantes da UP; 7. Contribuir para a construo e comunicao de uma imagem pblica de qualidade e dinamismo da UP, uma imagem que, apesar da organizao distribuda da UP possa ser interpretada como coesa, revele unidade na diversidade; 8. Permitir um conhecimento mais prximo da realidade de cada Faculdade da UP e do que cada uma se faz na comunidade acadmica. Entre diversos problemas levantados junto da equipa reitoral da UP, assim como junto dos utilizadores do stio da UP, esto referenciados problemas de usabilidade gerais e, de forma mais especfica, de arquitectura de informao e navegao, sendo este um dos pontos a melhor consideravelmente. Para a realizao do projecto foram estabelecidas trs equipas de trabalho: uma equipa de design e usabilidade constituda pelo grupo de colaboradores do id:D FBAUP e pelo seu coordenador; uma equipa de produo de contedos do Departamento de Comunicao e Imagem da UP; e uma equipa de programadores do Departamento de Informao e Comunicao da UP, responsvel pelo sistema SIGARRA, sobre o qual a plataforma dever ser implementada. Um conjunto abrangente de metodologias baseadas nas boas prticas do Design Centrado no Utilizador, incluindo metodologias de avaliao qualitativa da usabilidade, foi estabelecido previamente para este projecto. Essa metodologias so as que seguidamente se descrevem na calendarizao, podendo ainda nos anexos ser consultada documentao complementar sobre o projecto.
3.1.3. Calendarizao
Projecto de grande envergadura, este foi divido em cinco fases de trabalho com a durao total prevista de um ano, tendo por base as etapas estratgicas definidas pelo Design Centrado no Utilizador: Anlise, Design, Avaliao, Implementao. Constrangimentos vrios, sobretudo decorrentes de atrasos na disponibilizao, por parte da equipa de programao da Faculdade de Engenharia, de uma instalao limpa do sistema a utilizar, impediram o cumprimento do calendrio estabelecido inicialmente e que consistia no seguinte: Fase 1: Estudos Prvios (Novembro 2011 a Janeiro de 2012) 1. Reunies preparatrias com o cliente; 2. Estudos de utilizao do stio actual realizados em unidades orgnicas da UP com utilizadores representativos dos diferentes pblicos-alvo; 3. Inqurito online junto da comunidade acadmica da UP; 4. Relatrio analtico com as concluses do estudo prvio e do inqurito.
64
3. Casos de Estudo
Fase 2: Anteprojecto (Dezembro 2011 a Fevereiro de 2012) 1. Definio de personas e cenrios de utilizao; 2. Definio das reas de contedo do stio; 3. Inventrio de contedo; 4. Arquitectura de informao; 5. Mapa do stio; 6. Directivas de acessibilidade; 7. Directivas de usabilidade; 8. Wireframes, estruturas de navegao e estudos gerais de layout. Fase 3: Design (Fevereiro de 2012 a Abril de 2012) 1. Definio da arquitectura de informao final; 2. Mapa do stio final, incluindo designaes das seces e pginas do stio; 3. Testes arquitectura de contedos e terminologias finais; 4. Incio do desenvolvimento do livro de estilo do stio; 5. Projectos de layout finais; 6. Realizao de testes com utilizadores durante o desenvolvimento dos projectos de layout finais; 7. Plano de manuteno e reviso de contedos do stio; 8. Mapa de produtores de contedo; 9. Implementao do projecto. Fases 4 e 5: Implementao (Abril de 2012 a Julho de 2012) 1. Testes de usabilidade e acessibilidade verso alfa do stio; 2. Testes de usabilidade e acessibilidade verso beta do stio; 3. Desenvolvimento de directivas para os projectos de layout dos stios das diferentes unidades orgnicas.
3.1.4. Metodologias
3.1.4.1. Avaliao Heurstica
Ficou estabelecido desde o primeiro momento que o novo stio da UP continuaria a ter como base o sistema SIGARRA43 actualmente em uso, pelo que a equipa de design realizou uma avaliao heurstica ao actual stio da UP de forma a estabelecer uma lista de prioridades. Para esta avaliao, foram tidas em conta as Dez Heursticas de Usabilidade de Nielsen descritas anteriormente, mas sem recurso a escalas de severidade, tendo-se optado assim por uma avaliao qualitativa em vez de quantitativa. A anlise detectou vrias falhas no stio em todas as dez heursticas (ver Anexo A).
43. Sistema de Informao para Gesto Agregada dos Recursos e dos Registos Acadmicos. Plataforma utilizada na totalidade da UP como sistema de intranet, como tambm como sistema de gesto de contedos dos variados stios pblicos das diferentes unidades orgnicas 65
3.1.4.2. Personas e Cenrios de Utilizao
Com base nos resultado obtidos nos inquritos junto dos utilizadores do stio up.pt, foi elaborado um conjunto de personas primrias e secundrias que personalizassem os utilizadores dominantes com uma breve descrio biogrfica, interesses e motivaes e possveis cenrios de utilizao (ver Anexo B).
Figura 13. Uma das personas criadas para o projecto UP
A realizao das personas e cenrios de utilizao mostrou-se importante na definio da arquitectura de informao e como ferramenta de inspeco da interface na ptica do cumprimento de tarefas para os testes de usabilidade realizados mais tarde.
3.1.4.3. Card Sorting
As reunies preliminares com o cliente e com a equipa de produo de contedos, assim como as anlises de contedos do stio actual, permitiram criar um mapa do stio e um primeiro esboo da arquitectura de informao do mesmo (ver Anexo C). De forma a validar as designaes empregues na estrutura de navegao, foi conduzida uma sesso de card sorting com 10 utilizadores que teve lugar na Faculdade de Belas Artes. Optou-se por realizar esta sesso de forma informal, indo ao encontro aos utilizadores, de forma a obter ganhos de tempo, o que acabou por se concretizar. Ao optar-se por um modelo mais informal, baseado nos princpios da Usabilidade de Guerrilha, eliminou-se por completo a necessidade, no s de reservar um espao, com todos os constrangimentos de tempo e logstica, como de contactar previamente os utilizadores e programar datas especficas para que estes realizarem os testes. Os testes foram assim executados praticamente no momento em que se
66
3. Casos de Estudo
achou necessrio, tendo para isto bastado um reunio preparatria para reunir o material e preparar a moderao necessrios. Os 10 utilizadores foram seleccionados entre estudantes, professores e funcionrios da Faculdade de Belas Artes, com o cuidado de obter uma amostra representativa dos diferentes pblicos. A escolha de utilizadores oriundos do mesmo estabelecimento de ensino deveu-se ao facto de ser neste estabelecimento onde o id:D opera, e onde se poderia fazer rapidamente os testes pretendidos. Foram assim realizados testes junto de seis estudantes (incluindo um estudante estrangeiro), dois professores e dois funcionrios, tendo os resultados validado em boa parte a primeira proposta da arquitectura de informao. Os testes foram realizados com o recurso a software gratuito, tendo-se optado pelo modelo de card sorting fechado com 10 utilizadores, nmero que se considerou suficiente para recolher dados relevantes, apesar do nmero mnimo aconselhado ser de 15 utilizadores. Aos utilizadores foi apresentado um conjunto de grupos que identificavam as seces do primeiro nvel do menu e um conjunto vasto de cartes representando os restantes nveis. Os utilizadores, na esmagadora maioria, optaram por no criar trs nveis de organizao, mas admite-se aqui que o processo no tenha sido devidamente explicado, limitando-se a associar os cartes aos grupos que julgaram testar relacionados.
Figura 14. Still de uma sesso de card sorting realizada do mbito do projecto UP
Os resultados, excepto em algumas designaes genricas sem significado sem uma associao contextual, como Unidades ou Transferncia de Tecnologia, comprovaram a validade da primeira proposta de arquitectura de informao, tendo-se registado no entanto comentrios sublinhando a estranheza na diferenciao entre Inovao e Investigao, em ambos os grupos de primeiro nvel. Tambm foi sublinhado pela maioria dos utilizadores estudantes que a associao de primeiro Ciclo (Licenciatura), segundo Ciclo (Mestrado) e terceiro Ciclo (Doutoramento) a Estudar deveu-se unicamente ao reconhecimento destas designaes posterior sua entrada na Universidade, e que estas lhes eram totalmente desconhecidas enquanto alunos pr-universitrios. Sem excepo, os dois professores que participaram no teste associaram terceiro Ciclo ao grupo Investigao. Com base nestes resultados, foi apresentada uma segunda proposta que acabaria por sofrer alteraes por parte da equipa de contedos, ao arrepio dos resultados obtidos pelo card sorting, como a manuteno da separao de Inovao e Investigao e a aposta nas designaes primeiro Ciclo
67
(Licenciatura), segundo Ciclo (Mestrado) e terceiro Ciclo (Doutoramento), embora em reunies posteriores tenha sido possvel negociar este ltimo ponto.
3.1.4.4. Prototipagem
No decorrer deste projecto foram desenvolvidos dois prottipos do stio (ver Anexo D). A realizao de prottipos de importncia vital para a compreenso da progresso do utilizador ao longo do stio, permitindo uma ideia abrangente quanto a questes de consistncia de estrutura e layout, bem como confrontar as solues de design com os cenrios de utilizao, e testar estes mesmo cenrios. Para um primeiro teste de usabilidade, foi realizado um prottipo vertical da interface representativo do principal cenrio de utilizao: ver a oferta formativa da Universidade do Porto em termos de Licenciaturas, procurar a licenciatura e o seu plano de estudos, encontrar informaes relevantes como propinas, bolsas e alojamentos. O prottipo realizado foi de mdia fidelidade e funcional em ambiente Web, com um bom nvel de detalhe da interface excepto no comportamento das hiperligaes, que apenas eram visveis pela alterao do cursor.
Figura 15. Prottipos de mdia fidelidade dos estudos preliminares do layout do novo stio da UP
Um segundo prottipo foi realizado para uma segunda sesso de testes, dado que, ao contrrio do previsto, a equipa de programao no forneceu em tempo til uma instalao do sistema a utilizar. A equipa de design optou assim por utilizar um sistema alternativo que permitisse uma representao o mais realista possvel na ptica do utilizador, de forma a recolher o mximo de dados teis ao prosseguimento do trabalho. Um prottipo de alta fidelidade, com todas as funcionalidades previstas para o sistema, revelou-se imprescindvel, no s para evitar novos atrasos, como para sublinhar os resultado obtidos pela Avaliao Heurstica realizada ao sistema que ir ser utilizado na verso final do stio.
68
3. Casos de Estudo
3.1.4.5. Testes de Usabilidade
Foram realizadas at ao momento trs sesses de testes de usabilidade segundo o Mtodo de Verbalizao do Pensamento. As sesses decorreram em diferentes etapas do desenvolvimento do layout para o novo stio da UP no sentido de aferir o quanto este fcil e simples de utilizar. A primeira sesso decorreu durante a fase de prototipagem dos dois diferentes estudos de layout que se encontravam a ser desenvolvidos paralelamente (ver Anexo D), no sentido no s de verificar qual dos layouts apresentava a melhor estrutura de navegao do ponto de vista de facilidade de utilizao, maior clareza na sua hierarquia, melhor compreenso de um progresso ao longo desta e das diferentes seces estruturais do layout (pesquisa, navegao, contedo, contedo complementar, contactos, notcias, breadcrumbs). Apesar de um dos objectivos deste teste ser precisamente obter dados qualitativos sobre as duas propostas de layout para uma deciso final e informada sobre qual delas apresentava a melhor resposta em termos de usabilidade, no se tratou na totalidade de um teste comparativo, visto ter-se criado espao para a possibilidade de diferentes elementos de cada uma das propostas, elementos que proporcionassem a melhor resposta a problemas concretos de navegao, tomassem parte de um modelo final misto. Por outro lado, pretendia-se ainda verificar qual dos dois layouts proporcionava a melhor resposta emotiva por parte dos utilizadores. Foram realizados dez testes no total, todos com alunos da Faculdade de Belas Artes inscritos no primeiro ano de Licenciatura, dada a facilidade e rapidez com que os utilizadores poderiam ser encontrados, e os testes realizados. Por outro lado, a escolha de alunos do primeiro ano, deveu-se ao facto destes no estarem ainda totalmente integrados da estrutura da UP, podendo assim facilmente desempenhar simultaneamente o papel de alunos pr-universitrios, e alunos universitrios. Cada uma das propostas foi testada por cinco utilizadores. Foram realizados prottipos funcionais de mdia fidelidade em ambiente Web para uma das seces do stio, a seco ensino, e outras pginas que continham informaes relevantes mas integradas noutras seces.
Figura 16. Video still de um dos testes de usabilidade da 1 sesso de testes (Proposta 2)
69
Pretendia-se que o utilizador procurasse informaes relativas Licenciatura de Design de Comunicao da Faculdade de Belas Artes da Universidade do Porto, o respectivo plano de estudos (situado num pgina externa ao stio da UP) e informaes complementares como condies de acesso a Bolsas de Estudo, Alojamento e Propinas. Todas estas informaes estavam contidas ao longo das pginas da seco Ensino e respectivas subseces, ora no seu contedo texto, ora atravs de hiperligaes contidas em algumas das pginas que apontavam para outras pginas noutras seces do stio. Os testes foram conduzidos pelos elementos da equipa de design, tendo sido realizada no final dos mesmos uma pequena reunio para aferir os resultados e identificar as possveis alteraes a fazer. Antes da realizao do teste de usabilidade, foi realizado um pequeno exerccio preliminar, o Trunk Test (Krug 2006), com o objectivo de verificar se os utilizadores identificavam o stio em anlise, para quem este se destinava, as suas diferentes partes estruturais (pesquisa, navegao, contedo, contedo complementar, contactos) e a sua posio relativa na arquitectura de informao (breadcrumbs). Em ambos os layouts foram identificados problemas na identificao do breadcrumbs enquanto elemento que identifica a posio relativa de determinada pgina na arquitectura de informao, mas verificou-se que este problema decorria mais do desconhecimento da sua funo. Verificou-se tambm dificuldades na interpretao da seco de ltimas notcias, que continha imagens, com os utilizadores a referiremse a estas com destaques para eventos, um problema identificado como banner blindness (Nielsen 1997, 2007). Quanto ao teste de usabilidade, ambos os layouts tiveram uma boa resposta por parte dos utilizadores, sobretudo no que toca ao contedo que deveria ser identificado no texto de cada uma das pgina e na navegabilidade do menu nos primeiro e segundo nveis. No entanto, ambos revelaram problemas na interpretao das hiperligaes para contedos suplementares e na navegao de terceiro nvel, onde se encontravam as grandes diferenas entre as duas propostas: nas propostas 1 e 2, os dois primeiros nveis desenvolviam-se horizontalmente, enquanto o terceiro nvel se desenvolvia verticalmente direita do contedo na proposta 1, com as hiperligaes para contedos complementares a encontrarem-se por baixo da navegao de terceiro nvel; na proposta 2, a navegao de terceiro nvel era horizontal, dentro do contedo e por baixo na navegao principal, com as hiperligaes a desenvolverem-se direita do contedo.
Figura 17. Video still de um dos testes de usabilidade da 1 sesso de testes (Proposta 1)
70
3. Casos de Estudo
Os utilizadores revelaram grande dificuldade em encontrar o menu de terceiro nvel na proposta 2, mas maior facilidade em encontrar as hiperligaes para contedos suplementares. No final, a larga maioria considerou a proposta A mais intuitiva em termos de navegao e a mais agradvel em termos visuais, e os testes mostraram que os utilizadores que testaram a proposta 1 cumpriram com maior facilidade as tarefas propostas. No final, a equipa decidiu ento dar seguimento proposta A nas etapas subsequentes de desenvolvimento. Um segunda sesso foi marcada para o fim-de-semana da Mostra UP, Mostra de Cincia, Ensino e Inovao da Universidade do Porto, onde foi possvel testar a interface, com recurso a um prottipo totalmente funcional, junto de alunos pr-universitrios, professores, investigadores e funcionrios da UP. O objectivo do teste centrou-se no entanto nos testes com os alunos pr-universitrios, com um cenrio de utilizao idntico ao dos primeiros testes. Ao todo foram realizados trinta e sete testes, entre os quais dez com alunos do 12. ano de escolaridade, trs do 11., um do 10. ano e cinco do 9. ano. Os testes confirmaram, de uma forma geral, a validade da arquitectura de informao, com os alunos a conseguirem, na maioria dos casos, cumprir a tarefa proposta: procurar a licenciatura de Design de Comunicao e informaes relativas a propinas, bolsas de estudos e alojamento, informaes que podiam ser consultadas ou acedidas na seco Estudar.
Figura 18. Video still de um Testes de Usabilidade que tiveram lugar durante a Mostra UP
Os contedos acessveis na seco Estudar por via de hiperligaes para outras pginas como Bolsas e Alojamento foram sempre acedidos atravs dessa mesma seco. Em conversa, posterior ao teste, com os utilizadores, foi consensual que a presena destas pginas na seco Viver e na respectiva subseco Vida Acadmica causava estranheza, uma vez que Viver e Vida Acadmica so associados a questes de ordem cultural e ldica da vida de um estudante universitrio. A nova seco dedicada s notcias, que na primeira sesso de testes no era identificada como tal, foi reformulada atravs da aposta numa maior diferenciao da rea respectiva relativamente ao restante contedo, sem recurso a imagens e com um ttulo de contextualizao, de que resultou um melhor reconhecimento. Os estudos com os utilizadores mais novos (10 e 9 ano) revelaram inmeras dificuldades na interaco com o stio, algo que dever ser revisto, embora o cliente no o considere prioritrio, e apesar de ter sido notada falta de motivao por parte dos utilizadores para o cumprimento do teste.
71
Os testes com os restantes utilizadores no foram realizados com o nmero mnimo necessrio de utilizadores, tendo na sua maioria servido apenas de demonstrao do processo. O ambiente da Mostra UP, onde as diversas Unidades Orgnicas da Universidade do Porto mostram de uma forma ldica o propsito dos seus cursos, revelou-se no entanto um local pouco apropriado para a execuo destes testes, mostrando que estes no podem ser executados em qualquer ambiente, devendo-se observar um mnimo de condies que no foi a encontrado. O excesso de rudo prejudicou o registo udio das sesses e resultou na perda duma boa parte dos dados, visto que o teste depende em boa medida da verbalizao das aces e decises tomadas por parte do utilizador, assim como a presena de muitas pessoas em volta do local onde decorreram os testes originou muitas distraces por parte dos utilizadores que efectuavam os testes. Embora no seja imprescindvel efectuar estes testes em ambiente laboratorial, desnecessria, deve ser assegurada a ausncia de rudo e distraces que os possam influenciar negativamente.
3.1.5. Ponto de Situao

O projecto encontra-se actualmente na fase de implementao, a cargo da equipa de programao da FEUP, e prev-se a realizao de novos testes de usabilidade particularmente com dispositivos moveis com utilizadores assim que a verso beta esteja disponvel. Tendo a verso alfa sido realizada numa sistema diferente daquele que ser utilizado para o novo stio da UP, imperativo realizar vrias sesses de testes. Como vimos, a avaliao heurstica plataforma actual detectou debilidades que tero de ser resolvidas de forma que o produto final constitua, no s uma mais-valia em termos de design, de layout e de contedos, mas tambm que seja mais fcil de usar, no crie frustraes ao utilizador e se imponha como uma ferramenta de comunicao eficaz para a UP. Com os atrasos sucessivos, a ltima previso para a concluso do projecto aponta para que esta ocorra no incio de 2013.
3.1.6. Concluso
As metodologias empregues at ao momento no projecto do novo stio da UP mostram ser uma mais-valia no processo projectual do mesmo, sem que os atrasos at agora sentidos possam ser de forma alguma imputveis sua aplicao. Os inquritos realizados junto dos utilizadores, bem como a posterior elaborao de personas e cenrios de utilizao, permitiram que o desenvolvimento dos primeiros esboos da interface e da arquitectura de informao com esta ltima a ser complementada com a utilizao de card sorting com vista a encontrar o melhor modelo mental para a navegao fossem constantemente focados com base nessas mesmas personas e cenrios, e nas expectativas, necessidades e tarefas do utilizador. Os cenrios de utilizao mostraram-se tambm importantes para uma constante focagem nas tarefas do utilizador ao longo do desenvolvimento da interface. A diviso da equipa de design por trs propostas de layout permitiu o desenvolvimento de diferentes conceitos e diferentes opes que de forma alguma pode ser entendido como uma disperso de recursos. Os testes posteriores realizados com as duas propostas finais revelaram pontos fortes em
72
3. Casos de Estudo
cada uma das propostas, permitindo que o projecto evolusse mais rapidamente, dado que, em vrias situaes, para cada opo que se revelou pouco funcional, uma alternativa melhor havia j sido explorada. Parece-nos tambm clara a importncia do desenvolvimento de directivas de usabilidade, acessibilidade e mobile (ver Anexo E), pois permite que a equipa de design confronte as com os layouts desenvolvidos sempre que se julgue necessrio, tal como os cenrios de utilizao. Futuramente, com a primeira verso do sistema funcional, ser possvel fazer uma anlise deste em confronto com as directivas, de forma a apontar e priorizar as reas a serem melhoradas no mesmo. Na segunda sesso de testes, durante a Mostra UP, ao ser ampliado o segmento do pblico-alvo foi possvel encontrar novos problemas que os primeiros testes no haviam revelado, sublinhando assim a necessidade destes testes serem efectuados com o maior nmero de utilizadores possvel, e sobretudo com o maior nmero de sensibilidades possvel. A primeira sesso, realizada unicamente com alunos do primeiro ano de licenciatura, com idades entre os 18 e os 20 anos, revelaram utilizadores experientes, no s na utilizao da Web, como familiarizados com as tarefas, algo que na segunda sesso, com alunos pr-universitrios, entre os 15 e os 17 anos, no se verificou. Em projectos cujo espectro de pblico-alvo muito abrangente, testes com 5 utilizadores indiscriminados so suficientes para encontrar a maiorias dos problemas bvios de navegao e do cumprimento de tarefas, mas falham na necessidade de encontrar a melhor arquitectura de informao. Os testes decorreram com recurso a software de baixo custo, e em mdia, para cada dia de testes foi necessrio outro dia para a compilao dos resultados, mostrando a rapidez com que estes podem ser efectuados, sendo necessrio cerca de um tero do tempo necessrio quando os testes so realizados por profissionais da rea. Ao decorrerem num ambiente natural de utilizao do stio, no se sentiu a artificialidade gerada pelos laboratrios de usabilidade, com os utilizadores a demostrarem uma maior predisposio para a participao nos testes. Outra questo relevante tambm detectada durante este projecto, foi a relutncia por parte do cliente em alterar a arquitectura de informao com base nos estudos de utilizador, o que obriga a uma cuidada negociao final, entre a organizao interna do cliente e a forma como o utilizador a v. Neste caso, ambas so incompatveis em alguns pontos, e embora tenha sido possvel algumas alteraes importantes e nucleares (p.ex.: Licenciatura em vez de primeiro ciclo; Mestrado em vez de segundo ciclo; Doutoramento em vez de terceiro ciclo) h ainda algumas alteraes que se julga ser importante realizar. Curiosamente, mesmo que no tenham sido efectuados testes com um nmero de utilizadores considerado suficiente, observou-se tambm que os funcionrios da UP tiveram dificuldades em encontrar informaes relativas aos servios dos quais fazem parte no seio da UP. Por fim, a segunda sesso de testes de usabilidade foi, para os trs alunos finalistas estagirios, o primeiro contacto prtico com um teste de usabilidade, tendo sido evidente para ns que estes, no s foram capazes de o efectuar como pretendido, como foram tambm capazes de tirar as suas prpria concluses sobre os mesmo. Com uma reunio preparatria e a presena numa palestra dada sobre usabilidade no mbito desta investigao, todos mostraram um bom domnio conceptual da temtica,
73
explicando-a aos utilizadores de forma esclarecedora e conduzindo-a sem problemas maiores, excepto algum natural nervosismo. Da anlise dos vdeos das sesses, possvel comprovar que os estagirios seguiram as indicaes dadas, mostraram capacidade de improvisao quando necessrio e seguiram os conselhos fornecidos (Krug, 2000), embora, e no entanto, ao efectuar estes testes num ambiente com excesso de rudo e distraces, uma boa parte dos dados tenha sido perdida por impossibilidade de ouvir na ntegra os registos udio.
3.2. Novo stio do eLearning Caf

O eLearning Caf um espao um espao hbrido, de lazer, convvio e aprendizagem, com caractersticas inovadoras para favorecer a troca de saberes e de experincias em diferentes reas do conhecimento e a aprendizagem em grupo, promovendo a interdisciplinaridade e a inovao44. Desenvolvido pela Universidade Digital45 da Universidade do Porto, o eLearning Caf constituise como um espao onde os alunos da referida universidade podem no s encontrar um local de convvio, lazer, trabalho e estudo, como um espao onde podero usufruir de uma srie de equipamentos informticos, bem como assistir a conferncias de pequena dimenso, mesas redondas, apresentaes ou workshops. Actualmente, o eLeraning Caf constitudo por apenas um espao, situado no Polo da Asprela da Universidade do Porto, estando prevista a abertura de um segundo espao junto ao Jardim Botnico da cidade do Porto.
3.2.2. Projecto
O anterior stio do eLearning Caf havia sido desenvolvido no seio da equipa do id:D, em 2010, em colaborao com um programador indicado pela Universidade do Porto. O projecto de 2010 consistiu apenas na elaborao de uma folha de estilos CSS para o stio existente de forma a que este respeitasse a nova imagem corporativa desenvolvida paralelamente. Tratando-se apenas do que poderamos designar como operao de cosmtica, as falhas inicialmente encontradas acabariam por no ser devidamente corrigidas, pelo que os problemas que o stio j evidenciava se mantiveram. Passados dois anos, a equipa do id:D foi uma vez mais contactada para trabalhar sobre o stio do eLearning Caf com vista a uma reformulao total do mesmo. O anterior stio foi considerado muito complexo, com uma estrutura de navegao muito complexa e uma imagem geral demasiado pesada e pouco dinmica. Com uma estrutura que privilegiava as notcias e os eventos na pgina principal, o formato foi identificado pela equipa de gesto do stio como pouco eficaz, sendo, por outro lado, vontade do cliente imprimir uma maior aposta em imagens, com galerias dos espaos actual e futuro
44. http://elearningcafe.up.pt/index.php/pt/o-que-e/o-que-e.html 45. http://sigarra.up.pt/reitoria/unidades_geral.visualizar?p_unidade=5 74
3. Casos de Estudo
algo que j havia sido pedido no anterior projecto mas, porque o sistema em que assentava o stio no o permitia sem um investimento adicional em funcionalidades, o cliente optou por no realizar. O projecto de redesenho do stio do eLearning Caf pretendia assim colmatar as deficincias apontadas, quer a nvel de funcionalidade, quer a nvel de arquitectura de informao, quer ainda a nvel da transmisso da informao que o cliente apontou como prioritria: as notcias e os eventos do espao actual. Com uma calendarizao curta e um oramento limitado, o projecto do novo stio do elearning Caf constituiu-se assim como uma oportunidade de testar no terreno os princpios da usabilidade de guerrilha anteriormente descritos. Para alm dos projectos de layout, foram realizadas duas sesses de testes com utilizadores no prprio espao, recorrendo assim a utilizadores reais do mesmo, no mbito das quais, para alm da avaliao da usabilidade, foi ainda realizado um teste comparativo para a escolha dos dois layouts desenvolvidos paralelamente. As propostas apresentaram uma arquitectura de informao idntica, com uma pgina de abertura a apresentar o conceito eLearning Caf e contactos gerais, acompanhada de um menu de acesso a cada um dos espaos, e uma seco de notcias e eventos. As seces relativas a cada espao fsico, Asprela e Botnico, tinham o contedo desenvolvido numa nica pgina com um menu de segundo nvel a apontar para diferentes seces dessa pgina. A seco de notcias e eventos apresentava uma lista geral categorizada, com a possibilidade de filtragem desta lista pelas suas diversas categorias, com cada notcia ou evento a apontar para uma pgina individual com o texto integral. Ao longo de todas as pginas, um menu de apoio localizado no rodap providenciava acesso a outros contedos relevantes para o eLearning Caf, como sejam, os Regulamentos e a Poltica de Privacidade.
3.2.3. Calendarizao
No existiu uma calendarizao rgida para o projecto de redesenho do stio do eLearning Caf, tendo o cliente pedido apenas que o projecto fosse concludo at ao final de Setembro de 2012. Os testes de usabilidade foram realizados durante os meses de Abril e Maio de 2012.
3.2.4. Metodologias
3.2.4.1. Teste de Usabilidade
Foram realizadas duas sees de testes de usabilidade com utilizadores que decorreram no prprio espao do eLearning Caf. Dez utilizadores estiverem envolvidos em cada uma das sesses, com ambas as propostas a serem testadas na ntegra segundo os cenrios estabelecidos com cinco utilizadores cada, sendo pedido posteriormente a estes que navegassem livremente na segunda proposta e emitissem uma opinio sobre as preferncias pessoais quanto ao tratamento visual da interface.
75
Na segunda sesso, os utilizadores cumpriram os mesmo cenrios em ambas as propostas, sendo-lhes posteriormente tambm pedida uma opinio sobre a preferncia pessoal relativamente ao tratamento visual da interface. As sesses decorreram no interior do espao eLearning Asprela, em ambiente natural de utilizao, e na segunda sesso, para alm dos utilizadores do espao, foram conduzidos dois testes com dois colaboradores que gerem o dia-a-dia do espao. Os cenrios propostos passavam por encontrar informaes relativas ao servios prestados pelo eLearning Caf da Asprela, o seu horrio e localizao, bem como encontrar as ltima notcias e eventos sobre o espao e o respectivo contacto. Na primeira sesso, ambos os layouts tiveram bons comportamentos, no tendo o tratamento visual diferenciado mostrado qualquer relevncia nos resultados obtidos. Os utilizadores cumpriram com facilidade os cenrios propostos, encontrando toda a informao requerida, mas menos de metade o fizeram com recurso ao scroll, utilizando o menu para encontrar as seces de contedo onde julgaram poder encontrar essa mesma informao - facto verificado em ambas as propostas.
Figura 19. Video stills da homepage do eLearning Caf nos Testes de Usabilidade
O problema principal verificou-se na pgina de entrada e no menu de acesso aos espaos: o facto de actualmente apenas existir o espao do Polo da Asprela criou confuso junto dos utilizadores, com estes a no compreenderem as designaes Asprela e Botnico como forma de entrada em pginas correspondentes a espaos diferentes. Em conversa com os utilizadores, aps os testes, ficou claro que mais de metade dos utilizadores que participaram no teste desconheciam mesmo que o espao em que se encontravam era o eLearning Asprela. Na segunda sesso, alteraram-se as designaes para Espao Asprela e Espao Botnico, o que facilitou a compreenso por parte dos utilizadores, mas mesmo assim assistiu-se ao facto de 1/3 dos utilizadores continuarem a no compreender as diferenas. Apesar de apresentarem diferentes propostas visuais, as funcionalidades eram idnticas em ambos os layouts, no tendo os testes comparativos permitido obter resultados considerados relevantes. Na primeira sesso, onde os utilizadores cumpriam cenrios numa verso e navegavam livremente na segunda, apenas um utilizador optou pelo segundo layout. Na segunda sesso, com os cenrios a serem
76
3. Casos de Estudo
cumpridos em ambas as verses, dois utilizadores preferiram a segunda verso mostrada, o que levou a equipa a decidir assim deixar a opo pelas propostas para o cliente, dados os resultados inclusivos.

Concludos os testes de avaliao preliminares, o projecto est agora na fase de implementao que se prev estar concluda no fim do ms de Setembro de 2012, pese embora este ter estado parado durante o ms de agosto. Aps a implementao do sistema, sero efectuadas mais duas sesses de testes interface, quer na sua verso desktop, quer na sua verso para dispositivos mveis.
Figura 20. Verses desktop, tablet e mobile do stio elearning caf
3.2.6. Concluso
A realizao de testes comparativos tendo por base apenas a diferenciao por via do design da interface mostrou-se neste caso pouco til, no se verificando qualquer influncia do design na percepo da usabilidade do stio, embora possamos admitir que as propostas eram demasiado
77
idnticas para se verificarem influncias, o que poder ser um bom ponto de partida para investigaes futuras que entendemos pertinente fazer. Embora o objectivo destes testes fosse testar a usabilidade do stio, ficou patente para ns a necessidade de se efectuar estudos junto dos utilizadores de forma a compreender as suas necessidades e, sobretudo, a forma como percepcionam o que poderemos designar como o produto apresentado. Mais de metade dos utilizadores mostraram, no s desconhecimento sobre a designao do espao em que se encontravam, visto que actualmente apenas existe um e todos o conhecem pelo nome eLearning Caf, como tambm desconhecimento da existncia de um stio na Web sobre o eLearning Caf. Apesar da equipa do projecto, com base na sua experincia acumulada, poder afirmar com segurana que o conceito apresentado o ideal para o produto disponibilizado, estudos prvios realizados junto dos utilizadores do eLearning Caf teriam sido de uma mais-valia importante e alertado para o principal problema encontrado.
3.3. Stio do CEDA

O CEDA, Centro de Estudos do Design e das Artes um gabinete de prestao de servios ao exterior da Faculdade de Belas Artes da Universidade do Porto que opera nas reas do design e das artes plsticas. Desde a sua criao, em 2006, o CEDA tem realizado diversos projectos no mbito do design grfico, Web design, design editorial, concepo de trofus, arte pblica, instalao, etc., cujo desenvolvimento tem sido efectuado em diversos nveis organizacionais, atravs do estabelecimento de ncleos de trabalho permanentes - como foi o caso do id:D - Investigao e Desenvolvimento em Design, Projectos Vivos (ncleo entretanto extinto) - ou grupos de trabalho no-permanentes criados especificamente para dar resposta a determinadas solicitaes. O id:D possui actualmente um stio que rene o respectivo porteflio de trabalhos em idd.fba.up.pt, mas no existe um stio que agrupe todos os trabalhos realizados pelos diversos ncleos e grupos de trabalho.
3.3.2. Projecto
O projecto do stio do CEDA foi desenvolvido no seio do id:D pela equipa de estagirios curriculares, alunos finalistas da Licenciatura de Design de Comunicao da Faculdade de Belas Artes da Universidade do Porto. O objectivo do projecto passava pela construo de uma plataforma de comunicao na Web que permita apresentar o trabalho desenvolvido no CEDA, as suas reas de actuao, estrutura e contactos. Trs estagirios ficaram responsveis por toda a concepo desde as primeiras abordagens com o cliente e outros stakeholders, passando pelas vrias fases de design e testes com utilizadores. Neste caso de estudo, pretendeu-se analisar a forma como estes alunos estagirios se comportavam
78
3. Casos de Estudo
perante a necessidade de efectuar estudos de usabilidade com utilizadores, tendo em conta a sua pouca experincia na temtica, com total autonomia na anlise dos resultados por eles obtidos. Ambos tiveram uma primeira abordagem ao tema durante as aulas da cadeira de Web Design, tendo posteriormente participado numa palestra sobre usabilidade dada no mbito desta investigao, assim como em algumas das sesses de teste de usabilidade levados a efeito no mbito do projecto UP e escolinhas.pt.
3.3.3. Calendarizao
O projecto teve incio em Maro de 2012 e tinha como data prevista de concluso Junho de 2012, tendo sido dividido em trs fases: Fase 1: Estudos Prvios (Abril de 2012) 1. Reunies preparatrias com o cliente; 2. Inqurito junto dos coordenadores dos vrios ncleos de trabalho do CEDA, colaboradores e funcionrios afectos; 3. Definio de personas e cenrios de utilizao; 4. Definio das reas de contedos do stio; 5. Inventrio de contedos; 6. Arquitectura de informao; 7. Wireframes, estruturas de navegao e estudos gerais de layout. Fase 2: Design (Maio - Junho de 2012) 1. Definio da arquitectura de informao final; 2. Mapa do stio final, incluindo designaes das seces e pginas do stio; 3. Testes arquitectura de contedos e terminologias finais; 4. Realizao de testes com utilizadores durante o desenvolvimento de prottipos em papel; 5. Projecto de layout final; 6. Implementao do projecto. Fase 3: Implementao (Junho de 2012) 1. Testes de usabilidade. Inteiramente desenvolvido por trs estagirios finalistas da Licenciatura de Design de Comunicao da Faculdade de Belas Artes da Universidade do Porto, a calendarizao do projecto foi sofrendo alguns atrasos a meio da Fase 2, sobretudo aps a sada de um dos elementos do grupo, no tendo sido possvel terminar o projecto.
79
3.3.4. Metodologias
3.3.4.1. Personas e Cenrios de Utilizao
Com base nos inquritos realizados, os alunos estagirios realizaram um conjunto de personas primrias que personalizassem os objectivos e necessidades dos utilizadores dominantes do stio. Apesar das personas apresentadas fornecerem poucos dados, considerou-se no entanto que os objectivos-chave desta metodologia tinham sido minimamente alcanados. Ficou no entanto por associar a estas personas um ou mais cenrios de utilizao para uma melhor compreenso das tarefas que motivam o utilizador.
3.3.4.2. Card Sorting
Os alunos estagirios realizaram em conjunto uma sesso de card sorting fechado para testar a primeira proposta para a arquitectura de informao. Os alunos mostraram bom domnio do processo de execuo da metodologia, mas algumas falhas na interpretao dos resultados, pese embora as evidentes melhorias na proposta final, bem mais simplificada que a testada. Foram realizados 10 testes no total, nmero que foi considerado suficiente para a obteno de dados satisfatrios para a elaborao da arquitectura de informao do stio, com a sesso a durar um dia, incluindo compilao e analise dos resultados. No foram utilizados quaisquer recursos digitais, com o card sorting a ser efectuado com recurso a cartes de papel escritos. Ficou evidente alguma dificuldade em interpretar os resultados e, sobretudo, faltou alguma ateno aos comentrios dados pelos utilizadores durante o teste: os resultados finais ficarem refns dos dados estatsticos e a equipa limitou-se a retirar as categorias consideradas desnecessrias, ora pela redundncia, ora pelo desconhecimento do seu significado - situaes que, com uma boa anlise dos inquritos realizados e uma posterior correcta estruturao da arquitectura de informao, cedo teriam sido resolvidas no projecto.
Duas sesses de teste de usabilidade estavam programadas para este projecto mas, at ao momento, apenas uma foi realizada. O teste decorreu com prottipos em papel da interface visual, tendo os alunos estagirios desenvolvido duas propostas distintas, das quais uma seguiria para a fase seguinte aps a apresentao dos resultados. Os alunos envolvidos j haviam anteriormente realizado testes no mbito do projecto do novo stio da UP e escolinhas.pt. O registo foi efectuado com recurso a uma mquina fotogrfica com capacidade de gravao vdeo. Foi concedida total liberdade aos alunos, tendo os testes decorrido sem superviso e com a equipa de orientao a limitar-se observao da sua execuo. As experincias em testes anteriores mostraramse bastante benficas, com os alunos a observarem o processo de forma considerada satisfatria, mas com resultados dspares no que toca apresentao de resultados, com um dos relatrios a no
80
3. Casos de Estudo
apresentar dados suficientes para uma opinio esclarecida sobre os problemas, indicando apenas, numa escala de cor, a existncia de problemas de mdia ou alta gravidade.

O projecto encontra-se na sua fase de implementao, mas com os atrasos sofridos durante a Fase 2, aps a sada de um dos elementos do grupo, a calendarizao foi sendo sucessivamente atrasada, no existindo no momento um data prevista para a concluso do projecto.
3.3.6. Concluso
A Faculdade de Belas Artes apresenta actualmente no currculo da sua Licenciatura de Design de Comunicao duas disciplinas dedicadas ao Web Design, disciplinas optativas semestrais para os alunos do terceiro ano (Web Design I) e 4 ano (Web Design II). Na disciplina de Web Design II so abordadas as temticas do Design Centrado no Utilizador e da Usabilidade. claro que os alunos nem sempre aprendem a matria da mesma forma, por inmeras razes, desde a motivao para o assunto falta de ateno durante as aulas, pelo que alguma dificuldade sempre esperada quando estes se vem envolvidos num projecto real. Neste pequeno exerccio, ficou assim patente a necessidade de uma maior aposta nestas temticas no ambiente acadmico e na importncia que estas tm para uma futura carreira ligada ao design. Aprender e dominar as metodologias relacionadas com o Design Centrado no Utilizador ou com a Usabilidade, hoje em dia, para um designer, to importante como dominar outras ferramentas de Design ou metodologias de Design. Em vrias situaes, estas at so comuns com outras reas do design. Esboos, wireframes e prototipagem no so metodologias especficas do Web Design, embora o ambiente Web seja evidentemente diferente dos ambientes editorial, tipogrfico, etc. Dominar algumas metodologias de usabilidade, sobretudo as que afectam o design de um stio Web , na nossa opinio, imperativo para a formao de qualquer aluno de Design que se pretenda no futuro especializar nesta rea.
3.4. escolinhas.pt
O escolinhas.pt uma aplicao Web desenvolvida pela Tecla Colorida Software Educativo, Lda, que visa proporcionar um primeiro contacto com as Tecnologias de Informao e Comunicao a alunos do ensino bsico tendo posteriormente alargado o seu pblico-alvo aos alunos do ensino secundrio , proporcionando ferramentas de ensino formal que podem ser utilizadas na escola ou em casa. O
81
sistema permite que os alunos possam criar e partilhar trabalhos, de mbito acadmico ou meramente ldico, jogar jogos didcticos, enviar mensagens a colegas, amigos, professores ou encarregados de educao. Na ptica do professor, possvel criar trabalhos de casa para alunos, bem como fornecer fichas de trabalho ou o mais variado contedo acadmico. Aquele pode ainda corrigir, comentar e avaliar trabalhos enviados pelos alunos, comunicar com eles, com os colegas ou com os encarregados de educao por mensagem, bem como criar e gerir turmas.
3.4.2. Projecto
O id:D tem estado envolvido em diversas reas do projecto escolinhas.pt atravs de equipas de design, tendo o cliente pedido nova colaborao para a realizao de testes de usabilidade ao sistema, na ptica do professor, de forma a inventariar eventuais problemas na interface a serem resolvidos na prxima verso do sistema. Para alm dos testes, foi tambm pedida a apresentao de recomendaes em termos de metodologias de avaliao da usabilidade a serem observadas em futuros desenvolvimentos.
3.4.3. Calendarizao
Um relatrio de usabilidade do sistema na ptica do professor e um conjunto de recomendaes em termos de metodologias de avaliao da usabilidade dever ser apresentado at ao final do ms de Setembro de 2012. Os testes de usabilidade tiveram lugar durante os meses de Maio e Junho de 2012.
3.4.4. Metodologias
Foram realizadas duas sesses de testes de usabilidade com os utilizadores do sistema, na ptica indicada pelo cliente - uma sesso com dez professores do ensino secundrio e outra com quatro professores do ensino primrio - sesses essas das quais se efectuou um registo vdeo (do ecr) e udio utilizando software gratuito. Os cenrios de utilizao testados foram os mesmos em ambas as sesses, sendo pedida, a cada utilizador, a realizao de trs tarefas que abrangiam genericamente as funcionalidades do sistema. A saber: Cenrio 1: Editor de trabalhos e workflow de partilha/publicao. Criar um documento, com um texto e uma imagem; mover a imagem para a frente do texto; publicar o documento no Wall de uma turma; partilh-lo com colegas de trabalho; apagar o documento. Cenrio 2: Funcionalidades de Gesto de turma. Criar nova Turma e adicionar professores e alunos; editar turma, apagar alunos e acrescentar outros alunos; apagar a turma.
82
3. Casos de Estudo
Cenrio 3: Mensagens com anexos. Criar mensagem; adicionar ficheiro guardado no computador; enviar mensagem a um elemento da lista de contactos. O sistema revelou vrias deficincias que poderiam ter sido detectadas em fases iniciais do projecto caso tivessem sido realizados testes de usabilidade com utilizadores, ou mesmo percursos cognitivos. No editor de trabalhos e no workflow de partilha, todas as ferramentas necessrias para o cumprimento da tarefa estavam presentes, no entanto, o editor de trabalhos foi considerado pouco intuitivo, sobretudo no que toca confirmao da edio. Um vez criado um tipo de contedo no editor, o contedo s se torna definitivo aps ter sido seleccionada a opo pr-visualizar. Para o editar posteriormente, o utilizador deve colocar o cursor sobre o contedo, surgindo as opes disponveis mover, editar e apagar com recurso a cones, cujo pouco contraste e dimenses muito reduzidas os tornavam pouco bvios ao utilizador, a que acrescia o facto de no possurem uma verso em texto ou outra ajuda contextual sobre a sua utilidade ou funcionalidade. As opes finais do documento, como publicar, enviar, apagar e partilhar, encontram-se todas ao mesmo nvel e com o mesmo comportamento visual, o que causa alguma confuso nos utilizadores e exige ateno extra na sua utilizao. Os utilizadores mostraram tambm alguma dificuldade na edio de turmas, com, uma vez mais, a maioria das opes de edio a ter tratamento idntico a outras opes. A ttulo de exemplo, refira-se que as hiperligaes para edio de turmas, edio de membros e cancelamento de turmas tinham o mesmo tratamento visual que as hiperligaes para a pgina da directora de turma, ou para a pgina da turma, na pgina onde eram apresentadas todas as turmas, o que criava confuso junto do utilizador. Nesta seco foram tambm encontradas algumas opes que apenas deveriam estar visveis ao administrador do sistema, podendo qualquer utilizador com acesso de professor apagar uma turma da qual no fosse director, opo que s deveria estar visvel ao director de turma e ao administrador. No envio de mensagens, detectou-se a inexistncia de um boto de carregamento de ficheiros, obrigando o utilizador a anexar s mensagens que pretendia enviar apenas ficheiros pr-existentes ou pr-carregados, o que obrigava o utilizador a preocupar-se, em primeiro lugar, em fazer o carregamento do ficheiro numa rea distinta antes de criar a mensagem propriamente dita. No final das sesses foi realizado um pequeno questionrio sobre a opinio do utilizador sobre a plataforma e funcionalidades que gostaria de ver implementadas em verses futuras. No geral, os utilizadores apontaram um interface pouco intuitivo e a ausncia de ajuda contextual que, quando presente, no suficientemente contrastante ou suficientemente identificvel para ser entendida como tal. Foram tambm apontadas crticas ao tratamento visual da interface, desenhada inicialmente para o ensino primrio, tendo sido caracterizado como infantil, provocando assim pouca empatia com o utilizador. Ficou ainda evidente, tendo em considerao que a maioria dos utilizadores testados no havia interagido com o sistema por um longo perodo antes do teste, que este obrigava o utilizador a recorrer constantemente memria da sua ltima interaco
83

Os resultados preliminares foram apresentados durante um encontro de stakeholders promovido pela Tecla Colorida e brevemente ser apresentado um conjunto de boas prticas de usabilidade a serem includas nos processos de desenvolvimento do sistema conforme requerido.
3.4.6. Concluso
Os problemas encontrados no teste de usabilidade sublinham, no s a necessidade da usabilidade ser uma preocupao desde as primeiras etapas do desenvolvimento de qualquer sistema para a Web, como as mais-valias da realizao destes testes desde cedo. Alguns problemas encontrados nos menus na ptica do professor, apesar de no terem sido entendidos como graves, poderiam ter sido perfeitamente detectados com a realizao de card sorting durante a concepo da arquitectura de informao e imediatamente resolvidos. A falta de algumas das funcionalidades necessrias ao cumprimento das tarefas propostas, como as encontradas no envio de mensagens, tambm poderiam ter sido detectadas bem cedo no processo de desenvolvimento do sistema, quer atravs da inspeco da interface com recurso aos percursos cognitivos, quer atravs de testes de usabilidade durante o perodo de prototipagem. Tal como nos projectos anteriores, os testes de usabilidades realizados no mbito deste projecto, foram realizados com recurso a software gratuito de registo udio e vdeo (do ecr) e num espao que simulou a utilizao natural do sistema. Os testes, que englobaram 14 utilizadores em duas sesses distintas, duram um dia em acumulado, ao qual se acrescenta dois dias para a analise e compilao dos resultados dos testes. O objectivo deste projecto passava por elaborar um conjunto de boas prticas de usabilidade a serem futuramente includos no processo de desenvolvimento do sistema, que apesar de abranger um conjunto de metodologias de Design Centrado no Utilizador, carece de metodologias que inspeccionem e avaliem a usabilidade da interface, em particular e do sistema, em geral. Sublinhe-se que o ltimo teste de usabilidade realizado datava j de Janeiro de 2011. Embora o relatrio final no tenha sido ainda entregue ao cliente, com segurana que podemos indicar que o projecto dever conter as seguintes etapas, com vista a uma maior incluso das preocupaes da usabilidade no processo de desenvolvimento. Realizao de sesses de card sorting para o estabelecimento de uma boa arquitectura de informao. A realizao de uma sesso de card sorting com 15 utilizadores, com recurso a cartes escritos ou impressos, no demorar mais do que trs dias desde a sua preparao sua realizao e anlise de resultados; com recurso a software de utilizao livre, o tempo poder ser reduzido a dois dias em ambas as situaes, no existem custos acrescidos relevantes para alm do tempo gasto na sua realizao.
84
3. Casos de Estudo
Realizao de inspeces utilizando o mtodo de percurso cognitivos de forma a garantir que todas as funcionalidades necessrias para o cumprimento de tarefas se encontram visveis e/ou disponveis no existem custos acrescidos relevantes para alm do tempo gasto na sua realizao. Inspeces regulares da interface com recurso a directivas de usabilidade, directivas essas que permitem previamente identificar todas as necessidades da interface de um ponto de vista tcnico. Realizao de testes de usabilidade com utilizadores, pelo menos, antes da implementao final de novas verses do sistema ou de melhorias ao mesmo. Os testes devero ser realizados pelo menos com 5 utilizadores, prevendo-se pelo menos dois dias desde a sua preparao sua realizao e anlise de resultados- recurso a software para o registo vdeo do ecr e udio poder acarretar custos acrescidos, mas o investimento residual.
85
86
CONCLUSO
Os estudos de usabilidade tm ganho maior relevncia com o crescente recurso a contedos interactivos e aplicaes Web, que no s tm aumentado o grau de complexidade das interfaces grficas, como tambm exigem novas formas de visualizar informao. Com uma aposta cada vez maior nos contedos orientados para o utilizador, torna-se ainda mais pertinente o recurso aos mtodos de avaliao qualitativa da usabilidade de forma a conseguir desenvolver uma experincia satisfatria. O presente trabalho teve como objectivos recolher e avaliar as principais metodologias e estratgias de avaliao qualitativa da usabilidade de interfaces para stios Web e colocar estas metodologias em prtica num conjunto de casos de estudo de forma a verificar a existncia de mais-valias para o processo projectual. A metodologia seguida passou por uma leitura atenta e analtica de diversas publicaes, impressas e online, na rea do design interactivo, do design centrado do utilizador e da usabilidade para a Web, recolhendo, seleccionando, analisando e cruzando metodologias de avaliao qualitativa da usabilidade. Seguiu-se a escolha de um conjunto de metodologias tidas como base para a avaliao qualitativa da usabilidade em stios Web, metodologias essas que foram posteriormente colocas em prtica em projectos prticos. A principal estratgia de usabilidade -nos fornecida pelos princpios do Design Centrado no Utilizador. Estes defendem um processo que tem o utilizador como centro das decises, e um processo de design que se preocupa em primeiro lugar com o utilizador ser aquele que melhor poder criar um objecto final que responda s necessidades e exigncias desse mesmo utilizador. Esta filosofia est em tudo relacionada com a experincia que o utilizador tem do produto e com o grau de satisfao e eficincia com que o usa para alcanar os seus objectivos, em suma, com a usabilidade de um stio Web. O Design Centrado no Utilizador identifica um conjunto de metodologias que, quando aplicadas em diferentes etapas de um projecto Web e com diferentes fins, mantm sempre o foco do designer no utilizador, seja na etapa de anlise, na etapa de projecto, ou na avaliao. No entanto, a realidade mostra-nos que a usabilidade ainda um extra a ter em considerao em projectos de interfaces para a Web, ora por manifesta falta de tempo, ora por manifesta insuficincia oramental, ora por esta ser vista como uma ferramenta altamente especializada que exige profissionais experientes para a sua colocao em prtica. Nielsen (1994, 1997, 2007) e Krug (2006) defendem, no entanto, que os estudos de usabilidade podem ser conduzidos sem necessidade de conhecimentos prvios especializados e que, utilizando um conjunto reduzido de mtodos de avaliao, podero ser executados sem necessidade de avultados investimentos. E mesmo um estudo mal conduzido pode desde logo detectar um quarto dos problemas de usabilidade mais graves (Nielsen, 2007, 2009).
87
No nosso objectivo colocar em causa o papel da engenharia de usabilidade enquanto profisso estabelecida e autnoma dentro de uma equipa de desenvolvimento de um stio Web, mas antes mostrar pela sua mais valia num projecto, que os estudos de usabilidade no s podem ser conduzidos dentro de um oramento muito restrito, como tambm recorrendo aos prprios webdesigners ou developers para a sua realizao. Alis, ficou patente que uma primeira linha de ataque usabilidade deve mesmo ser constituda por estes, dado que so os resultados recolhidos tm implicaes directas no desenho das interfaces. Quanto mais depressa webdesigners e developers tiverem acesso a estes dados, mais depressa possvel fazer as alteraes necessrias. A existncia de um intermedirio, o especialista em usabilidade, poder tornar esses dados abstractos, dificultando a compreenso real das razes que levam os utilizadores a terem determinadas atitudes. Embora se possa afirmar que as metodologias mais orientadas para o design so em certa medida bvias no que toca s suas mais-valias, preciso referir que nem sempre a pessoa que realiza o design de um stio a mesma que implementa esse design para HTML e/ou CSS, ou a mesma que programa as interaces do mesmo. Um webdesigner assim mais completo enquanto profissional quando consciente das diversas necessidades inerentes a um projecto de um stio para a Web com interveno directa no design do mesmo: no necessita de ser um perito nas diferenas reas, mas deve conhecer as especificidades de cada uma. Existe assim uma estreita ligao entre usabilidade e esttica (Lawrence, et al. 2007) mesmo que duas diferentes solues estticas para um mesmo projecto possam ser vlidas em termos de usabilidade, como foi possvel apurar num dos casos de estudo. Esta afirmao tornou-se-nos bastante clara: o estudo e a avaliao de usabilidade de uma interface grfica de um stio tm implicaes directas no desenvolvimento da sua esttica, pois as opes quanto a forma, cor, tipografia, podero ser influenciadas pelos estudos realizados. No existe muita investigao nesta rea, que se afigura como um campo que merece ser explorado no futuro. Alm do mais, as implicaes so claras em termos de economia de tempo e de pessoal (Nielsen, 2007). Um webdesigner consciente relativamente s questes de usabilidade, e sobretudo capaz de rapidamente colocar em prtica uma avaliao de usabilidade de um projecto em que esteja envolvido, consegue, de uma forma clere, resolver problemas imediatos que surjam, principalmente durante as primeiras etapas de design e durante a prototipagem, que geralmente teriam de esperar por uma avaliao especializada que poder demorar vrios dias a ser marcada, vrios dias a ser conduzida e uma semana para ser analisada e apresentada (Krug, 2006). Por outro lado, nem todos os projectos so de grande envergadura ou complexidade. Nem sempre h tempo, oramento ou disponibilidade para realizar estudos etnogrficos junto dos utilizadores ou elaborar personas, e nem sempre a equipa de design constituda por vrios Web designers que permita troca de experincias, opinies e explorao de diferentes conceitos e diferentes respostas a determinados problemas. Segundo um estudo de 2011 (A List Apart, 2011) sobre o universo de pessoas que fazem stios46, 29.3% dos profissionais assumem-se como trabalhadores por contra
46. The survey for people who make websites (A List Apart, 2011) 88
Concluso
prpria e/ou freelancers, no contabilizando estudantes, pessoas que o fazem como hobby ou voluntrios.47 O trabalho por conta prpria, ou em regime de freelance, por vezes um trabalho solitrio, e todas as ferramentas que possibilitem um trabalho de qualidade so indispensveis quando uma nica pessoa responsvel por todas as etapas do projecto. Com os projectos a desenvolverem-se num ambiente acadmico, e com o envolvimento de estudantes finalistas de design nos mesmos, ficou tambm patente a importncia dos princpios da usabilidade fazerem parte do currculo de um curso de design (Nielsen 1997), seja como disciplina autnoma, seja como parte de uma disciplina vocacionada para o Web Design. Spool afirma mesmo que vital que ns observemos os utilizadores, pois s assim temos a plena conscincia dos problemas que surgem, conscincia que no criada por um relatrio na terceira pessoa48. Limitaes Os constrangimentos de tempo surgidos ao longo dos diferentes casos de estudo impossibilitaram um estudo mais completo sobre a utilizao prtica das metodologias definidas pelos princpios do Design Centrado no Utilizador, visto que todos os projectos esto ainda em fase de concluso. A anlise de todo o processo, desde as suas etapas preliminares at sua implementao final, ser necessria para uma concluso mais fundamentada e mais abrangente, bem como para a apresentao final de um conjunto de boas prticas em termos processuais que possam ser aplicadas em projectos para stios Web, sobretudo de pequena e mdia dimenso. Noutro aspecto, ficou tambm por testar na prtica as metodologias de avaliao qualitativa junto de utilizadores com limitaes visuais e motoras, assim como a avaliao dos stios em dispositivos mveis. Pensar no utilizador pensar em todos os utilizadores independentemente da sua habilidade ou dispositivo que utiliza para aceder Web (Clark, 2007), e por habilidade entende-se no s a experincia acumulada na utilizao na Web, como as limitaes fsicas do utilizador, assim como por dispositivo entende-se no s smartphones, tablets e desktops, como leitores de ecr ou leitores braile. Mais-valias Este trabalho de investigao pretende constituir-se como uma matriz metodolgica de orientao para a prtica profissional, mas tambm como um conjunto de princpios e experincias que possam servir de base para novos estudos ou para a sua aplicao em currculos de mbito acadmico. Em termos profissionais, as metodologias e as experincias aqui descritas fornecero um conjunto de ferramentas indispensveis a uma maior especializao no mbito profissional do webdesign, seja em trabalho de equipa, individualmente, em estdio ou em regime freelance. A conscincia dos princpios do Design
47. In 2011, freelancers made up 29.3% of careerists (e.g., all groups except students/hobbyists/volunteers) (A List Apart, 2011) 48. Its vital that you observe your users yourself, Spool argues. If you just get this error report that says The user tried to do this, your first reaction is: Well, why would anyone try to do that? But when you actually sit there and you meet the guy and interact with him, you think: Ah! This guys pretty sharp. And then you watch him, and you see behaviours you didnt expect to see. (Jared Spool, Net Magazine 2012.) 89
Centrado no Utilizador permitir uma melhor resposta a projectos futuros e uma maior compreenso sobre o desenho de stios que so usados por inmeras pessoas, das mais diversas e diferenciadas sensibilidades culturais e sociais. Esta abordagem usabilidade acessvel carece tambm de estudo aprofundado, pelo que este estudo mais uma porta que se abre com vista a investigaes futuras que procurem estabelecer uma ligao umbilical entre o Web designer e o estudo da usabilidade, dada a relao intrnseca entre ambos, sobretudo na influncia que os estudos de usabilidade tm sobre o design de interfaces visuais. Acreditando nesta ligao umbilical, julgamos tambm que este estudo poder ainda alertar professores e alunos para as questes da usabilidade e da sua importncia enquanto matria necessria nos currculos dos cursos de Design, nomeadamente nos da Universidade do Porto. Futuro H ainda inmeras reas a explorar: a relao entre usabilidade e esttica, j referida, e tambm a sua aplicao em dispositivos mveis como smartphones e tablets. O crescente recurso a estes dipositivos, com ecrs de dimenses bem mais pequenas que os dispositivos desktop, uma realidade incontornvel, prevendo-se que em 2014 o nmero de utilizadores que recorram a dispositivos mveis para aceder Internet ultrapasse os que utilizam desktops (Morgan Stanley, 2010). A aposta em interfaces flexveis que respondam de forma consistente a qualquer plataforma fornecendo os mesmos contedos (Marcotte, 2010) lana novos desafios em termos de usabilidade, assim como a mudana de paradigma na construo de stios Web, com uma passagem de desktop first, para mobile first, que implica a construo de um stio Web com base na sua utilizao em dispositivos mveis, sendo progressivamente adaptado a tablets e desktops (Wroblewski, 2009). Este um tema que ainda este ano criou alguma polmica (Clark, 2012; Lawson, 2012), aps Nielsen ter publicado um conjunto de directivas onde defendia a construo de stios diferentes para desktop e dispositivos mveis como soluo ideal em termos de usabilidade, defendendo ainda que os stios para dispositivos mveis deveriam ter menos contedo que a sua verso para desktop (Nielsen, 2012). Tanto o projecto do novo stio da UP como do eLearning Caf fazem uso de interfaces flexveis, disponibilizando em ambas as verses o mesmo contedo, pelo que o seu estudo ir certamente levantar novos desafios. With more mobile phones being sold than PCs, with a growing number of people using phones as their exclusive Web client, the idea that we should treat the desktop as the real website is simply becoming quaint. Josh Clark, Nielsen is wrong on mobile, Smashing Magazine, 2012 Our 100-year mission is this: we want to get rid of all of the bad design in the world Jared Spool, Net Magazine, 2012
90
REFERNCIAS BIBLIOGRFICAS
IJ, Raila; MANTERE, Jussi; (2001). Are Non-Expert Usability Evaluations Valuable? In 18th International Symposium on Human Factors in Telecommunications (HfT01). Bergen, Norway. BONNEVILLE, Douglas; (2011). How to Choose a Typeface. Disponvel em WWW: <http:// www. smashingmagazine.com/2011/03/24/how-to-choose-a-typeface/>. [Consultado em 2012.08.13] COOPER, Alan; (1999). AThe Inmates Are Running the Asylum: Why High Tech Products Drive Us Crazy and How to Restore the Sanity. Sams - Pearson Education. COOPER, Alan; REIMANN, Robert; CRONIN, David; (2007). About Face 3: The Essentials of Interaction Design. 3rd Ed. Indianapolis, Indiana: Wiley Publishing. DIX, et al. (1998). Human-Computer Interaction, 2nd Ed. Prentice Hall. FITTS, Paul M.; (1954). The information capacity of the human motor system in controlling the amplitude of movement. In Journal of Experimental Psychology, vol.47, no.6, Junho 1954, pp. 381391. GOULD, Nick; ZOLNA, Jesse; (2010). Eye Tracking and Web Usability: A Good Fit? Disponvel em WWW: <http://uxmag.com/articles/eye-tracking-and-web-usability-a-good-fit>. [Consultado em 2012.08.13] HENRY, Shawn L; (2006). Understanding Web Accessibility. Disponvel em WWW: <http:// uiaccess. com/understanding.html>. [Consultado em 2012.08.09] HENRY, Shawn L; (2007). Just Ask: Integrating Accessibility Throughout Design. Disponvel em WWW: <http://www.uiaccess.com/accessucd/> . [Consultado em 2012.08.09] ISO 9241-11; (1998). Ergonomic requirements for office work with visual display terminals (VDTs) Part 11: Guidance on usability. KRUG, Steve; (2000). Usability testing on 10 cents a day, Keeping testing simpleso you do enough of it. In Dont Make Me Think! A Common Sense Approach to Web Usability. Berkeley, California: New Riders. KRUG Steve; (2006). Dont Make Me Think! A Common Sense Approach to Web Usability. Berkeley, California: New Riders.
91
KRUG, Steve; (2010). Rocket Surgery Made Easy - The Do-it-yourself Guide to Finding and Fixing Usability Problems. Berkeley, California: New Riders. LAWRENCE, Dave; TAVACOL, Soheyla (2007). Balanced Website Design - Optimising Aesthetics Usability and Purpose. London: Springer. MIFSUD, Justin; (2011). An Extensive Guide to Web Form Usability. Disponvel em WWW: <http:// uxdesign.smashingmagazine.com/2011/11/08/extensive-guide-web-form-usability/ >. [Consultado em 2012.08.02] MOLICH, Rolf, et al; (1990). Improving a human-computer dialogue. Communications of the ACM 33, 3, Maro 1990, pp.338-348. NIELSEN, Jakob, et al; (1990). Heuristic evaluation of user interfaces. Proc. ACM CHI90 Conf., Abril 1990, pp.249-256. NIELSEN, Jakob; (1992). Finding usability problems through heuristic evaluation. Proc. ACM CHI92, Monterey, Maio 1992, pp.373-380. NIELSEN, Jakob; (1993). Usability Engineering. Academic Press, San Diego. NIELSEN, Jakob; (1994). Heuristic Evaluation, in Nielsen, J. e Mack, R. L. (Eds.), Usability Inspection Methods. John Wiley and Sons, New York. NIELSEN, Jakob; (1994). Guerrilla HCI: Using discount usability engineering to penetrate the intimidation barrier. Academic Press, USA. NIELSEN, Jakob; (1997). How Users Read on The Web. Disponvel em WWW: <http:// www.useit. com/alertbox/9710a.html>. [Consultado em 2012.08.08] NIELSEN, Jakob; (2003). Usability 101: Introduction to Usability. Disponvel em WWW: <http://www. useit.com/alertbox/20030825.html>. [Consultado em 2012.04.09] NIELSEN, Jakob; (2004). Card Sorting: How Many Users to Test, 2004. Disponvel em www: http:// www.useit.com/alertbox/20040719.html. [Consultado em 2012.07.08] NIELSEN, Jakob; (2004) Risks of Quantitative Studies. Disponvel em www: http:// www.useit.com/ alertbox/20040301.html. [Consultado em 2012.07.11] NIELSEN, Jakob; (2005). Ten Usability Heuristics. Disponvel em WWW: <http:// www.useit.com/ papers/heuristic/heuristic_list.html>. [Consultado em 2012.04.10]
92
Referncias Bibliogrficas
NIELSEN, Jakob; LORANGER, Loa; (2006). Prioritizing Web Usability. Berkeley, California: New Riders. NIELSEN, Jakob; (2007). Fast, Cheap, and Good: Yes, You Can Have It All. Disponvel em WWW: <http://www.useit.com/alertbox/fast-methods.html> [Consultado em 2012.06.25] NIELSEN, Jakob; (2008). How Little Do Users Read? Disponvel em WWW: <http:// www.useit.com/ alertbox/percent-text-read.html>. [Consultado em 2012.08.08] NIELSEN, Jakob; (2012). How Many Test Users in a Usability Study?, 2012. Disponvel em www: <http://www.useit.com/alertbox/20040719.html> [Consultado em 2012.06.22] NORMAN, Donald; (1998). The Design of Everyday Things. MIT Press MATHIS, Lukas; (2011). Designed for Use: Create Usable Interfaces for Applications and Web. Pragmatic Programmers. MAY, Tom; (2012). Jared Spool on usability and intuitive Design, 2012. Disponvel em WWW: <http:// www.netmagazine.com/interviews/jared-spool-usability-and-intuitive-design> [Consultado em 2012.08.10] PIEROTTI, Denise; (1996). Heuristic Evaluation Activities. Disponvel em WWW: <http:// www.stcsig. org/usability/topics/articles/he-activities.html> [Consultado em 2012.08.10] RUBIN, Jeffrey; CHISNELL, Dana; (2008). Handbook of Usability Testing : How to Plan, Design, and Conduct Effective Tests, 2nd Edition. New York: John Wiley. SHACKEL, Brian; (1991). Usability Context, framework, definition, design and evaluation. Shackel, B. e Richardson, S., (Eds.) Human Factors for Informatics Usability. Cambridge, UK, Cambridge University Press, pp.21-37. SHNEIDERMAN, Ben (1998). Designing the User Interface: Strategies for Effective Human - Computer Interaction, 3rd Edition. Addison Wesley. SMITH, S.L., et al, (1986). Guidelines for Designing User Interface Software. Disponvel em WWW: <http://hcibib.org/sam/>. [Consultado em 2012.08.01] SPOOL Jared M.; (2007). Three Important Benefits of Personas Disponvel em WWW: <http://www. uie.com/articles/benefits_of_personas/> [Consultado em 2012.08.23] TIDWELL, Jenifer; (2005). Designing Interfaces, Patterns for Effective Interaction Design. Sebastopol, California: OReilly.
93
TOGNAZZINI, Bruce; (2003). First Principles of Interaction Design. Disponvel em WWW: <http:// www.asktog.com/basics/firstPrinciples.html>. [Consultado em 2012.06.11] TULLIS, Tom; WOOD, Larry; (2004). How Many Users Are Enough for a Card-Sorting Study? Proceedings UPA2004, Minneapolis, Junho 2004. USERFOCUS. 23 Forms and Data Entry Usability Guidelines. Disponvel em WWW: <http://www. userfocus.co.uk/resources/formschecklist.html>. [Consultado em 2012.07.28] WE ARE COLORBLIND, (2012). A Quick Introduction to Colorblindness. <http:// wearecolorblind. com/article/a-quick-introduction-to-color-blindness/>. [Consultado em 2012.08.04] WEISCHENK, Susan (2010). The Psychologists View of UX Design. Disponvel em WWW: <http:// uxmag.com/articles/the-psychologists-view-of-ux-design>. [Consultado em 2012.08.10]
94
ABREVIATURAS E SMBOLOS
CSS Cascading Style Sheets, ou Folha de estilo em cascata em portugus FBAUP Faculdade de Belas Artes da Universidade do Porto HTML HyperText Markup Language, ou Linguagem de Marcao de Hipertexto em portugus IHC Interaco Humano-Computador, do ingls Human-Computer Interaction ISO International Organization for Standardization, ou Organizao Internacional de Normalizao em portugus SIGARRA Sistema de Informao para Gesto Agregada dos Recursos e dos Registos Acadmicos UP Universidade do Porto
95
ANEXO A
AVALIAO HEURSTICA AO ACTUAL STIO DA UP
97
RELATRIO USABILIDADE SIGARRA.UP.PT

Foram considerados os resultados do inqurito como base para conduzir uma anlise usabilidade do sigarra.up.pt. As pginas ou seces analisadas foram seleccionadas a partir das respostas dadas s perguntas Que informao procurou? / What kind of information were you looking for?: 1) 2) 3) 4) 5) 6) 7) 8) 9) Bibliotecas e Museus Doutoramentos Educao continua Histria Investigao Licenciaturas Mapas e Localizao Mestrados Publicaes
A anlise ser feita segundo as 10 Heursticas de Nielsen. 1) VISIBILIDADE DO ESTADO DO SISTEMA. ONDE ESTOU? Uma vez seleccionada uma seco no menu de navegao principal, esse mesmo indicador substituindo por uma imagem aleatria relacionada com a U.Porto, fazendo com que o utilizador perca alguma noo de onde est. Deixa de ser claramente assinalado no menu a posio do utilizador mas colocado o ttulo da seco na coluna central, por cima dos menus horizontais de navegao. De forma a tornar o sistema mais intuitivo o ideal seria manter o ttulo e o indicador no menu principal. O sistema de navegao secundrio corresponde a um menu e um submenu que se dispem horizontalmente acima do contedo principal da pgina. A localizao do utilizador dada atravs da diferenciao cromtica entre a seco e subseco seleccionadas em contraste com as restantes no activas. Tal como foi referido no estudo de acessibilidade, a diferenciao cromtica insuficiente para alguns utilizadores, no caso especfico do primeiro menu horizontal. PARA ONDE POSSO IR? Homepage: atravs do logtipo no canto superior esquerdo da janela; Todas as restantes seces do site atravs do menu de navegao principal; Outras subseces da rea onde me encontro actualmente atravs dos submenus. Tenho ainda outras opes relacionadas com o contedo principal de cada pgina que se encontram na barra complementar direita. Esta coluna pouco intuitiva uma vez que parece no existir um critrio muito forte em relao a contedo apresentado. Algumas vez tenho apenas links para as notcias mais recentes enquanto que noutros casos tem mesmo informao essencial que parece pertencer na coluna central do contedo principal. Ex: Lista de cursos http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina=1001601. Esta distribuio irregular de contedos leva a que o utilizador navegue com incerteza
e obriga-o a analisar a pgina toda com cuidado para no lhe escapar a informao que procura. Causa desconforto e uma experincia pouco intuitiva. 2) COMPATIBILIDADE DO SISTEMA COM O MUNDO REAL O sistema deve usar a linguagem do utilizador, com palavras, frases e conceitos familiares ao utilizador, em vez de termos orientados ao sistema. Deve seguir convenes do mundo real de forma a apresentar a informao de uma forma natural e lgica. A linguagem utilizada no sigarra.up.pt parece estar adequada ao pblico alvo. A utilizao de siglas mais especficas feita dentro de reas dedicadas a grupos de utilizadores mais restritos. Ex: http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina=1001459. 3) CONTROLO E LIBERDADE DO UTILIZADOR O utilizador deve sentir que tem sempre controlo sobre o sistema. Se seleccionar uma funo errada dever ter a possibilidade de termin-la ou se escolher um caminho errado deve conseguir voltar atrs e seleccionar outro. No sigarra.up.pt apresentado, em todas as pginas, uma forma de regresso homepage (logtipo no canto superior esquerdo acompanhado de um cone home), assim como a possibilidade de escolher outra seco do website atravs do menu principal de navegao sempre presente esquerda. O utilizador sente-se seguro a navegar por saber que a qualquer momento pode voltar ao incio da seco ou subseco sem grandes dificuldades. 4) CONSISTNCIA E PADRES Utilizadores no deveriam ter de adivinhar se diferentes palavras, situaes, ou aces significam a mesma coisa. Deve seguir-se um padro implementado no sistema. Ao comparar as designaes utilizadas, por exemplo, nas licenciaturas, mestrados e doutoramentos em relao aquelas usadas nos cursos de formao contnua verificamos que para o mesmo conjunto de informao (uma listagem de cursos disponveis) existem duas designaes distintas: Lista de Cursos e Catlogo de cursos. Isto confunde o utilizador na medida em que parece existir uma diferena no gnero de informao apresentada, quando na verdade no h. A repetio de ttulos iguais para contedos ligeiramente diferentes em seces e espaos com hierarquias diferentes provoca no utilizador confuso e desconfiana em relao informao absorvida, uma vez que surge a suspeita de poder ainda faltar outro pedao de informao escondido noutra seco. Ex: Mobilidade em http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina =122311 e Mobilidade em http://sigarra.up.pt/up/web_base.gera_pagina? p_pagina=1001545. Existem pginas em que os menus horizontais de navegao desaparecem sem justificao e por isso fogem norma de navegao implementada no site. Ex: http://sigarra.up.pt/up/web_base.gera_pagina?P_pagina=122 498, http://sigarra.up.pt/up/conteudos_geral.conteudos_ver?pct_pag_id=1223
50&pct_parametros=p_pagina=122350&pct_disciplina=&pct_grupo=885&pct_g rupo=886&pct_grupo=887&pct_grupo=889&pct_grupo=1137&pct_grupo=132 1#1321
5) PREVENO DE ERROS FORMULRIOS Ex: http://sigarra.up.pt/up/u_funcionarios_geral.formquery?pa_onde=web_base. gera_pagina?P_pagina=1001651 Se o formulrio submetido sem nenhum campo preenchido aparece toda a informao passvel ser pesquisada, por ordem alfabtica. No existe uma mensagem de erro ou alguma forma de alertar o utilizador para o facto dos campos de preenchimento estarem vazios. Se os campos so mal preenchidos (por exemplo o de categoria) feita a pesquisa e devolvida uma pgina com um cone e o erro No foram encontrados resultados. Esta mensagem insuficiente uma vez que no alerta o utilizador para a razo pela qual no foram encontrados resultados compatveis com a pesquisa. PGINAS DE ERRO As pginas de erro no so consistentes. No caso comum de faltar a ltima letra de um URL, por ser mal copiada e colada por exemplo, so diversos os tipos de erro devolvidos pelo sistema: - http://sigarra.up.pt/up/u_funcionarios_geral.formquery?pa_onde=web_base. gera_pagina?P_pagina=100165 a pgina construda sem os menus de navegao horizontal (URL original: http://sigarra.up.pt/up/u_funcionarios _geral.formquery?pa_onde=web_base.gera_pagina?P_pagina=1001651) - http://sigarra.up.pt/up/web_base.gera_pagina?P_pagina=12249 o ecr fica em branco sem pgina e sem mensagem de erro (URL original: http://sigarra .up.pt/up/web_base.gera_pagina?P_pagina=122498) - http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina=244 o utilizador redireccionado para uma pgina onde lhe pedido para efectuar uma autenticao no sistema (URL original: http://sigarra.up.pt /up/web_base.gera_pagina?p_pagina=2444) - https://sigarra.up.pt/up/web_page.inicia pgina de Erro 404 (URL original: https://sigarra.up.pt/up/web_page.inicial) ERRO 404 Ex: http://sigarra.up.pt/up/web_base.gera_pagina?p_pagia=1001691 So fornecidas explicao, instrues e opes suficientemente bem estruturadas para orientar o utilizador de volta ao site, de uma forma mais satisfatrio possvel. 6) RECONHECIMENTO AO INVS DE LEMBRANA O utilizador deve conseguir reconhecer onde est sem ter que se lembrar dos passos todos que deu at chegar ali. Para alm do problema do menu principal j acima referido (falta de indicador da posio actual do utilizador), na maioria das pginas o utilizador tem alguma facilidade em situar-se no interior da estrutura do site.
Os maiores problemas surgem quando o utilizador segue um link interno que o levo a uma pgina onde os menus horizontais de navegao desaparecem. Quando isto acontece o utilizador lanado para uma pgina sem contexto, sendo obrigado a utilizar o boto back do browser ou a navegar para a homepage e comear o processo de procura da informao de novo. Ex: se nesta pgina http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina= 1001561 seguirmos o link Documentos, presente na coluna da direita, somos enviados para http://sigarra.up.pt/up/conteudos_geral.conteudos_ver?pct_pag _id=1001561&pct_parametros=p_pagina=1001561 7) FLEXIBILIDADE E EFICINCIA DE USO OS LINKS LEVAM O UTILIZADOR ONDE ERA ESPERADO? Salvo raras excepes o texto dos links suficientemente explcito. No so dados nomes de ornamento s seces ou subseces. No caso de novas janelas ou novas tabs, existe um aviso dado atravs do atributo title da hiperligao. ESTRUTURA A ESTRUTURA DO LAYOUT EXPLCITA NA MEDIDA EM QUE PROPORCIONA UMA ORGANIZAO EFICIENTE E LGICA DO CONTEDOS? O site est divido em 3 colunas: navegao principal, contedo principal, informao complementar. Um dos maiores problemas detectados a ineficincia na articulao de contedos entre a coluna central e a coluna complementar. Muitas vezes informaes ou links que deveriam ser apresentados como fazendo parte do contedo principal, so enviados para a coluna complementar. Fenmeno que obriga o utilizador a procurar minuciosamente pela informao que pretende. Ex: http://sigarra.up.pt/up/web_base.gera_pagina?p_pagina=1001601 Neste exemplo, uma pgina dedicada s Licenciaturas, apresentado ao utilizador um link para uma listagem das diversas unidades orgnicas no interior do contedo principal, enquanto que a listagem de cursos disponveis (que ser potencialmente o que mais procurado nesta pgina) est remetida para a coluna complementar. O CARREGAMENTO DAS IMAGENS E DOS CONTEDOS EFICIENTE? No foram detectados problemas nesta rea. 8) ESTTICA E DESIGN MINIMALISTA So utilizadas demasiadas seces e subseces. o contedo organizado segundo trs nveis: menu principal, submenu horizontal, submenu do submenu horizontal. Cada uma destas seces contem toda a informao que lhe diz respeito directamente ou que lhe est de alguma forma relacionada. O que acontece na prtica que existem contedos muito semelhantes repetidos ao longo do site. Trata-se de uma abordagem confusa, onde a arquitectura da informao no foi bem estruturada e que obriga o utilizador a procurar pedaos do mesmo tema em partes diferentes do site. O utilizador ao encontrar informao semelhante repetida levado a questionar a qualidade e integridade da informao que
tinha lido anteriormente, talvez seja impulsionado a ler duas vezes contedos quase iguais ou ento a desistir de procurar por a experincia se revelar como demasiado desorganizada. As imagens aleatrias, que surgem no contexto do menu principal, so rudo visual desnecessrio e confundem o utilizador porque ocupam o lugar daquilo que deveria ser um indicador visual da seco onde actualmente se encontra. No contexto da homepage, a rea central quase toda (foco de ateno do utilizador) ocupada por imagens aleatrias que em nada contribuem para melhor esclarecer o utilizador acerca da instituio da Universidade do Porto. Chegado homepage o utilizador no fica a saber mais do que j sabia anteriormente. 9) AJUDAR OS USURIOS A RECONHECER, DIAGNOSTICAR E CORRIGIR ERROS Mensagens de Erro devem ser apresentadas em linguagem simples, sem cdigo, indicar claramente o problema e sugerir uma soluo. Como j foi visto, existe uma grande inconsistncia nas pginas de erro do sigarra.up.pt, assim como a inexistncia de mensagens de erro de submisso de formulrios ou sugestes de preenchimento. A nica mensagem de erro passvel de ser considerada como tal a do Erro 404. Esta ltima explicita claramente o problema A pgina pode ter sido removida, estar temporariamente indisponvel ou o seu endereo ter sido alterado e sugere quatro possveis solues: 1) hiperligao para voltar pgina anterior, 2) Certifique-se de que o endereo introduzido est correcto, 3) Faa Reload/Refresh no seu programa de navegao (browser), ou 4) hiperligao para aceder pgina inicial. 10) AJUDAS E DOCUMENTAO Sem links para ajuda. Existe um ndice de A a Z de toda a informao disponvel no site.
ANEXO B
PERSONAS PARA O PROJECTO DO NOVO STIO DA UP
105
PERSONAS
Joo Magalhes
Estudante do Ensino Secundrio
Frequenta o 12 na Escola Secundria Alexandre Herculano no Porto. Encontra-se na rea de Cincias e Tecnologias e pretende ingressar num curso relacionado com a engenharia informtica. Tem 17 anos e j usa o computador desde os 6 e a Internet regularmente desde os 10. Interesses
Cursos oferecidos pela universidade nas reas cientcas e tecnolgicas Sadas prossionais dos diferentes cursos ou reas cientcas Como a universidade? (Vida acadmica, localizao das faculdades, transportes) Contacto com grupos de alunos e/ou associaes de estudantes
Cenrio 1: Apesar de saber a rea de estudos que quer prosseguir, o Joo ainda est com dvidas sobre que curso tirar. De forma a esclarecer as dvidas vai tentar comparar os planos de estudo dos cursos que lhe parecem mais interessantes. Cenrio 2: De forma a conhecer a melhor o ambiente, o Joo pondera fazer uma visita faculdade. Para isso, vai ao site procurar a morada da faculdade e instrues de como l chegar ou sobre com quem pode falar nessa visita.
PERSONAS
Filipa Fernandes
Estudante do Ensino Secundrio
Tem 17 anos e frequenta a Escola Secundria de Vieira do Minho na rea de Cincias Socioeconmicas. Sempre viveu em Vieira do Minho e no conhece ningum no Porto. Interesses
Cursos oferecidos pela Universidade Como a Universidade Contactos Alojamento Como a cidade do Porto
Cenrio 1: Como no conhece a universidade, nem a cidade do Porto, a Filipa vai tentar encontrar informao sobre o ambiente da cidade e da universidade. Cenrio 2: Depois de ter decidido a que curso se candidatar, a Filipa procura informaes sobre alojamento. Vai ao site ver se universidade disponibiliza residncias de estudantes. E se sim, o que tem que fazer para se candidatar.
PERSONAS
Susana Santos
Estudante de 1 Ciclo
Tem 22 anos e encontra-se a frequentar o 3 ano da licenciatura em Histria de Arte da Faculdade de Letras da U.Porto. Ainda se encontra indecisa entre continuar a estudar ou procurar trabalho. Caso continue a estudar, pondera entre continuar na U.Porto ou tentar outra universidade. Interesses
Mestrados Mobilidade Emprego Formao contnua Investigao
Cenrio 1: Agora que se encontra a nalizar o curso, a Susana vai procurar quais so as opes de mestrados oferecidos pela Universidade dentro da rea. Alm dos cursos na sua faculdade que ela j conhece mais ou menos procura sobretudo encontrar cursos oferecidos por outras faculdades dentro da sua rea de interesse. Interessam-lhe tambm eventuais ofertas de emprego (em part- ou full-time) que a ajudem a suportar os custos com um eventual curso de mestrado.
PERSONAS
Fernando Ferreira
O Fernando tem 25 anos. Encontra-se na recta nal do Mestrado em Finanas e Fiscalidade. Quer prosseguir a via acadmica mas ter de encontrar um emprego ou bolsa que permita manter-se a si prprio ao longo do Doutoramento. Interesses
Doutoramento Emprego Investigao
Cenrio 1: Ainda se encontra procura de um Doutoramento logo, vai rever o leque de ofertas disponveis. Cenrio 2: O Fernando no tem em vista nenhuma universidade em particular, no descarta a possibilidade de sair do Porto mas gostou particularmente da sua experincia enquanto aluno da FEP. Cenrio 3: Uma vez que o primeiro ano ser curricular ter de ter em especial considerao a compatibilidade do horrio em que o doutoramento se desenrola com o seu novo horrio de trabalho, assim ser fundamental o acesso a esse gnero de informao. Cenrio 4: Aps um desentendimento na secretria, o Fernando pretende claricar quais so os seus direitos e para isso vai procurar informaes junto do provedor.
PERSONAS
Mrio Mendes
Estudante de Formao Contnua
O Mrio actualmente professor de Desenho no ensino secundrio e foi incentivado pela prpria instituio a ingressar num Curso de Formao Contnua. A situao actual do Mrio no lhe deixa muito tempo disponvel mas sempre gostou de aprender e est motivado para escolher um curso. Interesses
Formao Contnua
Cenrio 1: O Mrio tem liberdade de escolha de um curso no interior de duas grandes reas de estudo: Artes ou Cincias da Educao, assim ter de ltrar o catlogo de cursos segundo estas duas opes, percebendo tambm quais so os cursos oferecidos em regime pslaboral. Cenrio 2: Tendo em conta que mora e trabalha na periferia da cidade, ser particularmente til a consulta de mapas e possibilidades de transporte para chegar s diversas faculdades.
PERSONAS
Lus Lopes
Tem 30 anos. ABD no curso de doutoramento em Arquitectura. Pondera prosseguir carreira acadmica ou prossional fora da Universidade. Interesses
Investigao (post-docs, etc. na U.Porto ou outras universidades) Concursos docentes (U.Porto ou outras, Portugal ou estrangeiro) Call for papers ou publicaes cientcas Normas e regulamentos para apresentao de teses e defesa das mesmas
Cenrio 1: Agora que se encontra a preparar a defesa da tese, o Lus vai procurar as normas de apresentao denidas pela universiadade.
PERSONAS
Susan Spencer
A Susan actualmente aluna de Mestrado na rea de jornalismo no estrangeiro. No domina o portugus mas est interessada em completar um semestre curricular em Portugal. No conhece ningum que a possa ajudar com questes de alojamento e transporte. Interesses
Mobilidade Cursos na rea do jornalismo e cincias da comunicao Vida no Porto
Cenrio 1: Procura cursos ou cadeiras da rea do jornalismo, fotograa e video e por isso ltrar a informao segundo estes trs grupos e no apenas por unidade orgnica ou cursos. Cenrio 2: Precisa de guias de orientao acerca da vida no Porto, alojamento, transportes e localizao das instituies de ensino. Cenrio 3: Procura um curso de Portugus. Cenrio 4: Gostaria de entrar em contacto com outros alunos de mobilidade que j tenham feito um percurso semelhante ao dela.
PERSONAS
10
Maria Monteiro
Alumni
Tem 31 anos e licenciou-se em Qumica pela Faculdade de Cincias. Desde o m do curso que se encontra a trabalhar na rea. Apesar de razoavelmente satisfeita com a actual situao, no pe de parte outras alternativas de futuro. Interesses
Alumni Notcias Eventos Formao Contnua Cursos de 2 e 3 ciclos Emprego
Cenrio 1: Apesar de j ter acabado o curso h alguns anos, a Maria gosta de estar a par das iniciativas da universidade. Como tal, gosta de ir ao site procurar eventos nos quais possa participar assim como notcias sobre a Universidade. Cenrio 2: A Maria gosta se manter actualizada na sua rea de formao. Gosta regularmente de ir ao site da U.Porto ver se existem novos cursos de formao contnua na sua rea.
PERSONAS
11
Ctia Carvalho
Me
A Ctia me da Filipa Oliveira que est agora a ponderar ingressar no Ensino Superior. Pretende auxiliar a lha na escolha de um curso e instituio de ensino uma vez que a Filipa parece estar mais motivada pela vida no Porto do que propriamente pelo curso a que se vai candidatar. Interesses
Cursos Vida acadmica Propinas Alojamento Mostra U.Porto
Cenrio 1: Procurar cursos de licenciatura a que o agrupamento de Cincias Socioeconmicas d acesso e quais so as sadas prossionais de cada um e/ou quais so as ofertas de formao ao nvel de 2 ciclo. Cenrio 2: Consultar o valor das propinas anuais, condies de pagamento, etc. Cenrio 3: Encontrar alojamento universitrio. Cenrio 4: Procurar contacto directo com outros pais de alunos universitrios e/ou com responsveis pelas faculdades que leccionam os cursos a que a lha se ir candidatar.
PERSONAS
12
Ana Arajo
Docente Ensino Superior
A Ana actualmente professora na Faculdade de Desporto da U.Porto. Tem 32 anos. A sua carga horria no muito extensa pelo que decidiu enveredar por um ramo de investigao que j tinha em vista muitos anos. Ainda se encontra numa fase de recolha de informao e procedimentos. Interesses
Investigao
Cenrio 1: Vai fazer uma ltragem dos contedos por rea de investigao: Cincias da Sade. Cenrio 2: Tem interesse em rever projectos de investigao semelhantes ao seu. Cenrio 3: Requer acesso a informao acerca de regulamentos e procedimentos regulares de acesso/ candidatura.
PERSONAS
13
Antnio Fonseca
Poltico Local
Tem 61 anos, assessor do Presidente da Cmara Municipal do Porto e desde os 22 que est envolvido na politica. Trabalha diariamente num computador, mas no algo que se sinta vontade a fazer. Usa-o sobretudo para responder e escrever emails e consultar um ou outro site. O Antnio sofre de degenerao muscular relacionada com a idade, que no seu caso faz com a viso central, no olho esquerdo, seja desfocada. Tem diculdade em ler informao online formatada numa fonte demasiado pequena ou com pouco contraste sobre o fundo e ca frustrado quando tenta fazer zoom de um site e este ca completamente desformatado e ilegvel. Interesses:
Factos e Nmeros Eventos Contactos Parcerias
Cenrio 1: O Antnio encontra-se a preparar uma nova proposta de legislao para apresentar na prxima Assembleia Municipal; como tal, vai procurar no site da U.Porto dados que sustentem a sua proposta.
PERSONAS
14
Paula Pires
Empresria
A Paula tem 40 anos e gerente de uma seguradora e foi-lhe pedido para encontrar cursos de formao contnua para o departamento de contabilidade. Interesses
Formao Contnua
Cenrio 1: Encontrar cursos que se adequem necessidades de formao do departamento de contabilidade. Cenrio 2: Apresentar aos superiores um oramento que inclui propinas e transportes. Cenrio 3: Apresentar igualmente os objectivos e competncias adquiridas para cada um dos possveis cursos. Cenrio 4: Consultar datas de incio e m dos cursos, assim como os seus horrios.
PERSONAS
15
Joana Junqueira
Jornalista
Tem 38 anos e na trabalha na redaco do Jornal de Notcias. Actualmente encontra-se a fazer uma reportagem sobre um projecto de investigao da U.Porto que recentemente ganhou um prmio. A Joana tem um ligeiro tremor na mo direita que no a impossibilita de fazer a maioria das tarefas como escrever ou usar o rato com alguma eccia. No entanto, quando os botes ou links so demasiado pequenos torna-se frustrante acertar na sua rea clicvel. Interesses
Factos e Nmeros Histria Projectos de Investigao Pesquisar pessoas
Cenrio 1: De forma a completar a completar o seu artigo, a Joana vai procurar dados sobre o trabalho efectuado pelos centros de investigao na U.Porto. Cenrio 2: A Joana sabe que o prmio foi ganho pelo investigador da Faculdade de Medicina Francisco Gonalves, para recolher mais informao sobre a pessoa vai pesquisar o nome dele no site.
PERSONAS
16
Jos Santos
Turista
Tem 42 anos e trabalha na rea da educao. Est com a famlia a prepara uma vista ao Porto para as prximas semanas. No conhece muito da cidade e pareceu-lhe interessante explorar tambm o que a U.Porto tem para oferecer. Interesses
Bibliotecas Museus e Arquivo Histria Loja
Cenrio 1: De forma a planear a sua visita, o Jos quer saber que museus a Universidade tem disponveis a visitantes. Consequentemente tambm procura saber a morada e horrios de funcionamento dos mesmos.
PERSONAS
17
Allegra del Sarto

Turista Estrangeira
A Allegra estudante universitria em Itlia. Vem a Portugal, no pela primeira vez, visitar a av. No percebe portugus. Procura actividades ou espaos universitrios que possa frequentar e talvez at conhecer outros estudantes da sua idade. Interesses
Bibliotecas Museus Actividades (conferncias, exposies)
Cenrio 1: Acesso a informao traduzida para ingls. Cenrio 2: Informao relativa a bibliotecas, museus, exposies, actividades, conferncias, ect. (horrios, localizao, transportes).
PERSONAS
18
Alexandra Antunes
Estudante do 8 ano de escolaridade
A Alexandra pensa ingressar no Ensino Superior depois de completar o 12 ano. Trata-se de um projecto a longo prazo visto ainda se encontrar no ensino bsico. Ouviu falar, atravs de uma amiga, acerca da Universidade Jnior e est agora interessada em explorar este gnero de activadades que a U.Porto oferece a pessoas da sua idade. Tem vontade com o computador e com Web e por isso vai procurar a informao de que precisa online. Interesses
Universidade Jnior Dias Abertos Bibliotecas Museus
Cenrio 1: Escolher de entre as vrias actividades oferecidas na U.Jnior. Cenrio 2: Manter-se a par das datas dos dias abertos da U.Porto. Cenrio 3: Descobrir e localizar bibliotecas e museus. Cenrio 4: Aceder a informao relativa a inscries, datas e horrios.
PERSONAS
19
Manuel Maia
Professor de Secundrio
Tem 54 anos. Professor do secundrio da provncia que quer visitar uma Faculdade ou a Universidade com os seus alunos. Ou convidar um representante da U.Porto ou de uma das U.O. para participar num dia aberto (ou dia de carreira) na sua escola. Interesses
Dias abertos Contactos das diversas U.O Localizao das vrias U.O
Cenrio 1: Dias abertos, Contactos das diversas U.O, Localizao das vrias U.O. Cenrio 2: Entrar em contacto que algum responsvel na U.O. Cenrio 3: Localizar a U.O a ser visitada.
PERSONAS
20
ConstruNorte
Empresa de Construo
Empresa de construo civil procura colaborao com a U.Porto para desenvolvimento de determinada tecnologia. a primeira vez que fazem nada do gnero por isso no sabem com quem falar ou quais os procedimentos normais para iniciar contacto com a Universidade. Interesses
Contactos Procedimentos e Regulamentos relativos a colaboraes
Cenrio 1: Consultar a informao dsponvel online na procura de alguma orientao no sentido de como apresentar uma proposta de colaborao a determinada U.O. (regulamentos, procedimentos, candidaturas). Cenrio 2: Procurar algum responsvel com quem comunicar pessoalmente. Cenrio 3: Ver exemplos de cooperaes anteriores.
ANEXO C
ARQUITECTURA DE INFORMAO DO NOVO STIO DA UP
125
about
faculdades
a universidade
histria
bibliotecas e arquivos
museus
edifcios
links destacados: loja, editorial
faculdade prestao de contas factos e nmeros antigos alunos ilustres repositrios professores emritos arquivo
organizao
funcionamento
doutores h.c.
biblioteca
museu
edifcio
rgos de governo
relatrios
prmios
reitor
PDF
prmios
notcias > concursos
vice-reitor + etc
rgo de governo
estudar
1 ciclo alojamento, bolsas, propinas, mobilidade, acesso e ingresso
2 ciclo
3 ciclo
alojamento, bolsas, propinas, mobilidade, acesso e ingresso
alojamento, bolsas, propinas, mobilidade, acesso e ingresso
formao contnua
especializao
estudos avanados
outros cursos
faculdade
reas (+ cursos)
cooperao > relaes internacionais
viver > alojamento
reas (+ cursos)
faculdade
u. vero u. jnior reas (+ cursos) estudos sniores
cursos
curso
curso
investigao como investigar (nanciamento, alojamento, etc.)
centros de investigao
bolsas
nanciamento
viver > alojamento
UPIN I&D+i UPTEC
centro de investigao (id.up)
viver/visitar
turismo / cidade
alojamento
cantinas
informaes para alunos de mobilidade
actividades extra-curriculares
vida acadmica
mostra up
e-learning cafs sade na U.Porto
about > bibliotecas e arquivos in cooperao > relaes internacionais
SASUP
out
voluntariado
about > museus
about > edifcios
alumni como colaborar; contactos
cooperao
notcias/eventos
gabinete do antigo estudante
benefcios
participadas/ empresas participadas actualidade, mobilidade e cooperao, recortes de imprensa, repositrio, TIC, UPIN, I&D, ensino e formao bolsas, candidaturas, concursos e prmios, recrutamentos, bolsas de emprego
relaes internacionais
eventos
notcias gerais
concursos
calls
reas cientcas/ temas
tv.up noticias.up jpr jpn
rodap
contactos
mapas
associaes de estudantes
redes sociais
termos de uso / privacidade
provedor estudante
campus
transportes
provedor funcionrios
provedor docentes
about > edifcios
ANEXO D
PROTTIPOS DE LAYOUTS PARA O NOVO STIO DA UP
133
ndice
Layout 1 Pgina da seco Estudar, 5 Pgina da seco Licenciaturas, 7 Pgina da seco Licenciaturas por reas Cinticas, 9 Pgina da seco Cincias da Educao (site up), 11 Pgina da seco Cincias da Educao (site faculdade), 13 Layout 2 Pgina da seco Estudar, 15 Pgina da seco Licenciaturas, 17 Pgina da seco Licenciaturas por reas Cinticas, 19 Pgina da seco Cincias da Educao (site up), 21 Pgina da seco Cincias da Educao (site faculdade), 23
11
13
15
17
19
21
23
ANEXO E
DIRECTIVAS DE USABILIDADE, ACESSIBILIDADE E MOBILE PARA O NOVO STIO DA UP
157
DIRECTIVAS DE ACESSIBILIDADE, USABILIDADE E MOBILE
Porto, Outubro 2011
ndice
Directivas de Acessibilidade, 3 Directivas de Usabilidade, 15 Directivas Mibile, 19
Directivas de Acessibilidade
1. 1.1. 1.2. 1.3. 1.4.
Consideraes Gerais Limitar ao essencial os passos necessrios para chegar ao contedo. Evitar splash screens ou pginas de apresentao sem informao. Fornecer todo o contedo em pelo menos duas lnguas (portugus e ingls). Manter consistncia de layout e mecanismos de navegao ao longo de todas as pginas.
2. 2.1. 2.1.1.
HTML markup Geral Assegurar sempre uma correcta estrutura semntica do HTML. Sem essa segurana as tecnologias assistivas tero mais diculdade em interpretar correctamente uma pgina Web.
2.1.2. 2.2. 2.2.1. 2.2.2. 2.2.3.
Utilizar folhas de estilo (CSS) para separar o contedo da sua formatao visual. Imagens Utilizar o atributo alt para descrever de forma textual a informao contida numa imagem ou grco. No caso da descrio textual da imagem ser demasiado extensa (no caso de imagens ou grcos muito complexos) fazer uso do atributo longdesc em vez do alt. Ter ateno ao texto preenchido no alt, vericar se realmente se constitui como uma aju da e no algo que contribua para diculdades de utilizao. Devem testar-se os atributos alt com um leitor de ecr enquanto o ecr se encontra desligado, de forma a vericar se o texto faz ou no sentido no contexto em que est inserido. Consideraes especcas em relao ao texto alt:
2.2.3.1. Deve apresentar o contedo e a funo da imagem. Por exemplo, se a imagem se tratar de um link ento o texto alternativo para alm do contedo da imagem dever tambm explicitar a pgina de destino (funo). ex: No caso especco do logtipo da U.Porto, que funcionar como uma hiperligao para a homepage (colocado no canto superior esquerdo do website), o texto alt dever ser composto Link homepage Universidade Porto e no apenas Homepage. Neste ltimo caso e uma vez que este ser um dos primeiros links a ser lido pelas tecnologias assistivas em todas as pginas, poder induzir os utilizadores em erro levando-os a acreditar que se encontram sempre na homepage. 2.2.3.2. No deve ser redundante, ou seja, repetir informao j mencionada no texto da pgina. O texto alternativo dever expor de forma sucinta a informao contida na imagem sem repetir informao j includa no corpo de texto. 2.2.3.3. No utilizar expresses como Imagem de... ou Grco de.... As tecnologias assistivas j possuem mecanismos que alertam os utilizadores acerca da presena de imagens e grficos, sendo que repetir estas palavras no texto alt torna-se extremamente maador. 2.2.3.4. No caso de uma imagem ser meramente decorativa ento o atributo alt dever ser preenchido da seguinte forma alt=. 2.3. 2.3.1. 2.3.2. Tabelas Nunca utilizar tabelas apenas por questes de formatao grca (criar um layout com vrias colunas por exemplo). Fazer uso de tabelas apenas quando o contedo as justica. Garantir que a todas as tabelas est associado um <summary> adequado, que deve incluir uma breve descrio da forma como a informao est estruturada no interior da tabela, assim como uma breve explicao de como navegar essa informao de forma ecaz. 2.3.3. 2.3.4. Assegurar o correcto markup das tabelas, com cabealhos <th> sucientemente descriti vos. Evitar tabelas demasiado extensas. Se possvel dividir essas tabelas de forma lgica em vrias tabelas mais pequenas. Cada uma delas correctamente estruturada com cabealhos e um sumrio da estrutura da informao. 2.4. 2.4.1. 2.5. Listas Listas devem ser marcadas como tal recorrendo aos respectivos elementos HTML dispo nveis: <ul>, <ol>, <dl>. Hiperligaes
2.5.1.
Evitar um nmero muito elevado de links numa nica pgina. Isto poder tornar-se inc modo para utilizadores de leitores de ecr uma vez que estes, em muitos casos, navegam uma determinada pgina saltando de link em link de forma a construir uma ideia geral dos contedos da pgina.
2.5.2. 2.5.3.
As hiperligaes textuais devem ser sempre sublinhadas. Os links textuais devero ser sucientemente descritivos de forma a no dependerem demasiado de informao contextual. Se pensarmos em utilizadores de leitores ou magnicadores de ecr conseguiremos perceber as diculdades que se apresentam quando o destino do link depende apenas da informao textual e grca em seu redor, fenmeno que obriga este grupo de utilizadores a ouvir ou a procurar por entre enormes quantidades de texto que so, por vezes, inteis. Por exemplo, em vez de compor um link com o texto mais informao deveramos ter algo mais como mais informao sobre licenciaturas.
2.5.4. 2.5.5.
No caso de imagens utilizadas como hiperligaes, dever fazer-se recurso do atributo alt para melhor denir o seu destino. Deixar espao entre hiperligaes de modo a facilitar a seleco. Isto torna-se especialmente importante em casos de mobilidade reduzida ou comprometida em que poder ser difcil acertar no link desejado se este estiver muito prximo de outros links.
2.5.6.
Nunca recorrer a links textuais ou botes demasiado reduzidos. Devem sempre assumir uma proporo confortvel, tanto para utilizadores com acuidade visual reduzida ou mobilidade/destreza comprometidas.
2.6. 2.6.1.
Formulrios Limitar sempre a quantidade de informao pedida ao necessrio. Formulrios demasiado extensos mostram-se frustrantes do ponto de vista do utilizador. No caso de se pedir informao adicional, colocar em primeiro lugar os campos de preenchimento obrigatrio e depois os campos facultativos.
2.6.2. 2.6.3.
Agrupar campos relacionados do formulrios em elementos <eldset> com ttulos informativos <legend>. Fazer corresponder os elementos <label> aos seus respectivos campos de edio. Existem duas formas de o fazer sendo que a seguinte a mais correcta: <label for=nome>Nome: </label> <input type=text name=nome id=nome />
2.6.4.
Em situaes em que no possvel recorrer ao elemento <LABEL> deve acrescentar-se o atributo title aos campos de input. Por exemplo, caixas de pesquisa normalmente no so acompanhadas de um rtulo, por isso, nestes casos importante incluir o atributo title=search.
2.6.5.
Colocar os rtulos bem prximos dos campos de formulrio correspondentes. O rtulo deve encontrar-se sempre esquerda, com excepo dos botes rdio e checkboxes onde dever situar-se direita.
2.6.6.
Instrues de preenchimento devem estar sempre antes do campo de edio na estrutura do DOM. S deste modo que os leitores de ecr lem as instrues antes do campo de edio, o que faz mais sentido do que se fosse ao contrrio.
2.6.7. 2.6.8.
No caso de ocorrerem erros de preenchimento, a pgina retornada deve incluir, no topo, uma lista de todos os erros assim como hiperligaes para o campo correspondente. Ao retornar erros ao utilizador, no recorrer apenas ao asterisco para assinalar campos que precisam da sua ateno. Nem todas as tecnologias assistivas sabem interpretar esta conveno, pelo que apenas lem estrela seguido do rtulo do campo de input.
2.6.9.
No assinalar os campos com erro apenas cromaticamente. ca como tal <label for=nome>Nome Completo: (Preenchimento obrigatrio)</label> <input type=text id=nome name=nome />
2.6.10. Aos campos de preenchimento obrigatrio deve estar associado um rtulo que os identi-
2.6.11. Vericar se a ordem dos campos e do tabindex mantm a ordem lgica apresentada visualmente. 2.6.12. No caso de utilizar imagens como botes garantir a existncia do texto alt, que deve ser preenchido com o mesmo texto presente na imagem. 2.6.13. Garantir que o boto para submeter o formulrio encontra-se sempre prximo do ltimo campo do formulrio. 2.6.14. Garantir que ao carregar na tecla Enter o formulrio realmente submetido 2.7. 2.7.1. Tabindex Garantir que a ordem dos elementos navegveis por teclado (tabindex) corresponde ordem hierrquica representada visualmente na pgina.
2.7.2.
O breadcrumb dever ser o primeiro elemento no tabindex, uma vez que contem logo partida a identicao da instituio, e os diversos passos seguidos at pgina onde o utilizador se encontra actualmente (ex: U.Porto > Estudar > Licenciaturas). Desta forma utilizadores de leitores de ecr so imediatamente informados da sua posio no interior do site. Recomenda-se a seguinte ordem: Breadcrumb; Link para a homepage; Caixa de pesquisa; Menu principal; Menu secundrio (se disponvel); Menu complementar (se disponvel); O ttulo da pgina; Contedos do sidebar.
2.7.3.
Colocar hiperligaes cuja funo ser permitir aos utilizadores contornar certos tipos de contedo. Por exemplo, colocar uma hiperligao ignorar menu antes do menu de navegao que permite aos utilizadores de tecnologias assistivas avanar directamente para o contedo principal da pgina. O mesmo dever ser considerado no que diz respeito s colunas laterais de informao complementar e ao rodap.
2.8. 2.8.1.
<TITLE> O elemento <TITLE> dever ser correctamente preenchido e utilizado em todas as p ginas, fornecendo aos utilizadores informao objectiva acerca do ttulo e dos possveis contedos daquela pgina.
2.9. 2.9.1.
Cabealhos Devem sempre ser utilizados os elementos <H1, H2 ,... > de forma a respeitar a ordem hierrquica do contedo.
2.9.1.1. Estudos recentes demonstram que os utilizadores de leitores de ecr preferem a utilizao de dois <H1> em cada pgina: sendo que o primeiro a identicao da instituio e o segundo o ttulo do contedo principal da pgina. Todos os outros ttulos devem ser correctamente assinalados consoante a sua ordem na hierarquia do documento e no apenas os <H1>.
2.9.1.2. Estatsticas de 2010 referem ainda que o principal mecanismo de navegao, por parte dos utilizadores de leitores de ecr, consiste em percorrer todos os cabealhos da pgina, de modo a extrair uma ideia do contedo e da estrutura da pgina. 2.9.2. 2.9.3. 2.10. Garantir que os cabealhos so sempre gracamente destacados do restante contedo. Sobretudo atravs de um tamanho de fonte substancialmente maior. Evitar sublinhar cabealhos uma vez que podem ser confundidos com hiperligaes. Abreviaturas e acrnimos acrnimos de forma correcta, o que resulta na maioria dos casos em palavras/sons incompreensveis para o utilizador. Assim, todos os acrnimos e abreviaturas ao longo da pgina devem ser adequadamente assinalados fazendo recurso ao elemento <ABBR>. 2.11. <LANG> pronunciar todas a palavras de acordo com essa lngua, o que pode resultar em sons mais ou menos compreensveis. De forma a evitar que isto acontea, todas as alteraes lngua natural do documento devem ser assinaladas atravs do elemento <LANG>. 2.11.2. Garantir que a lngua natural do documento correctamente denida no elemento <html>. 2.12. <EM> e <B> estes elementos. Colocar apenas um itlico ou um negrito, atravs do CSS, numa frase ou palavra que de alguma forma deve estar enfatizada no o suciente para que a mensagem seja correctamente comunicada a alguns grupos de utilizadores. ento necessrio utilizar o correcto markup HTML para assinalar este gnero de enfatizaes. 2.12.1. Dependendo do software, alguns leitores de ecr alteram o tom da voz de acordo com 2.11.1. Tal como no caso anterior, uma voz sintetizada a ler em portugus, por exemplo, vai tentar
2.10.1. Vozes sintetizadas por vezes tm diculdade em pronunciar algumas abreviaturas ou
3. 3.1.
Mecanismos de navegao Colocar hiperligaes cuja funo ser permitir aos utilizadores contornar certos tipos de contedo. Por exemplo, colocar um link ignorar menu antes do menu de navegao que permite aos utilizadores de tecnologias assistivas avanar directamente para o contedo principal da pgina. O mesmo dever ser considerado no que diz respeito s colunas laterais de informao complementar.
3.2.
Garantir que o breadcrumb o primeiro item no tabindex de uma pgina.
3.3. 3.4. 3.5. 3.6. 3.7. 3.8. 3.9. 3.9.1.
Fazer recurso tecnologia WAI-ARIA na implementao dos menus de navegao (ver seco 11). Evitar a utilizao de imagens como botes nos menus de navegao. Garantir um adequado destaque visual dos menus de navegao. Fazer uso das convenes relativas ao posicionamento dos menus. Garantir a consistncia de mecanismos de navegao ao longo de todas as pginas (posicionamento, formatao grca, comportamento). Evitar contedos redundantes ao longo das opes dos menus. Access Keys O atributo accesskey til para atribuir atalhos de teclado a algumas aces frequentes ou importantes na interaco do utilizador com o site. No entanto, no existe nenhuma uniformizao ocial desses atalhos, pelo que variam imensamente de um site para o outro. Tambm como consequncia dessa heterogeneidade, na maioria das vezes os utilizadores chegam a determinado site e no sabem que teclas de atalho utilizar ou se de facto elas realmente existem. Para alm destes ltimos dois problemas, igualmente importante referir que as combinaes de teclas que accionam os atalhos de teclado variam de browser para browser e entre sistemas operativos. Como forma de contornar esse problema existem algumas sugestes que passamos a mencionar:
3.9.2.
Incluir um descrio das teclas de atalho na seco de ajuda do site. Isto obriga criao de mais um link em todas as pginas. Para alm de ser um pgina complexa por ter de incluir todos os atalhos em diferentes browsers e sistemas operativos.
3.9.3.
Como forma alternativa primeira soluo pode realizar-se um deteco do browser atravs de script e adicionar dinamicamente a combinao correcta de teclas ao atributo title de cada elemento.
10
3.9.4.
Adoptar o modelo sugerido pelo Governo do Reino Unido para uniformizar a implementao desses atalhos. Este modelo o mais largamente adoptado: S contornar menus de navegao 1 homepage 2 notcias/novidades 3 mapa do site 4 pesquisa 5 FAQ/perguntas frequentes 6 ajuda 7 reclamaes 8 termos e condies 9 formulrio para sugestes/feedback 0 informao sobre atalhos de teclado
Os elementos passveis de incluir o atributo accesskey so os seguintes (todos suportam o atributo title anteriormente referido): <a> <area> <button> <input> <object> <select> <textarea>
4. 4.1. 4.2.
CSS No devem ser conduzidas alteraes ao layout de forma inline no documento HTML. Devem ser utilizadas folhas de estilo parte para toda e qualquer formatao visual. Utilizar sempre medidas relativas (%) na construo dos layouts. Isto beneciar no apenas o utilizadores com reduzida acuidade visual mas tambm os utilizadores de dipositivos mveis e ecrs de dimenses reduzidas.
4.3.
Garantir que determinado elemento quando focado, atravs do teclado, recebe o apropriado destaque grco.
11
4.4. 4.5.
Estabelecer um adequado contraste cromtico entre elementos textuais e o fundo. Utilizar tamanhos de fonte entre os 12pt e 14pt no mnimo para texto corrido.
5. 5.1.
Novas janelas e pop-ups Evitar a ocorrncia de novas janelas e/ou pop-ups. Se necessrio, ento evitar a abertura de novas janelas e/ou pop-ups sem avisar o utilizador previamente. Este gnero de alteraes abruptas tornam-se especialmente difceis em ambientes no grficos em que a alterao de contexto no imediatamente perceptvel.
5.2.
Se determinado link abrir uma nova janela isto poder ser referenciado no atributo title. ex: <a href=... title=abre numa nova janela />
6. 6.1. 6.2. 6.3.
Pesquisa Oferecer sempre a opo de pesquisa em todas as pginas. Dever ser sempre um dos primeiros elementos no tabindex. Colocar a caixa de pesquisa num local convencional, assim por exemplo, um utilizador de um magnicador de ecr no precisar de procurar a pgina toda aqueles locais onde mais frequentemente se encontram estes mecanismos.
6.4.
No caso do campo de uma pesquisa ser submetida sem a introduo de dados para pesquisar, a pgina de retorno dever noticar o utilizador de que deixou o campo em branco. Por vezes utilizadores com acuidades visual reduzida ou ento sem viso nenhuma podero no se aperceber de que no preencheram o campo.
6.5.
O motor de pesquisa dever ser tolerante quanto a possveis erros ortogrcos. Isto torna-se especialmente importante quando consideramos utilizadores com decincias cognitivas ou utilizadores cegos que no tm contacto visual com a lngua escrita e por isso esto mais sujeitos a erros ortogrcos relacionados com a sonoridade das palavras.
6.6.
Os resultados no devem ser apresentados com recurso a tabelas HTML. Devero antes ser uma listagem. Este tipo de estrutura muito mais fcil de navegar atravs do uso de tecnologias assistivas do que as tabelas.
12
7. 7.1. 7.1.1. 7.1.2. 7.1.3.
Multimdia Assegurar formas alternativas de aceder a contedos vdeo ou udio Fornecer sempre legendas no caso de vdeo com udio. S vdeo: Assegurar uma transcrio textual ou uma descrio auditiva daquilo que no vdeo. S udio: Assegurar uma transcrio textual do udio.
8. 8.1.
URL Uma das primeiras coisas que um utilizador de um leitor de ecr ouve a URL da pgina, assim estas deveriam ser o mais simples e directas possvel, de forma fornecer ao utilizador de modo imediato alguma informao sobre a sua localizao.
9. 9.1. 9.2. 9.3. 9.4.
Scripts Assegurar que os atalhos de teclado default continuam a funcionar. Evitar alteraes dinmicas na pgina sem que o utilizador seja previamente noticado. Vericar a estrutura da pgina com os scripts desligados. Assegurar que todas as aces programadas com recurso a scripts so acessveis tanto atravs do rato como atravs do teclado.
10. 10.1. 10.2. 10.3.
Erros No caso de um erro de input ser detectado este deve ser comunicado ao utilizador de forma textual e no apenas atravs de um destaque grco. Devem ser providenciados rtulos e instrues quando input por parte do utilizador necessrio. No caso de acontecer um erro e sugestes para o corrigir serem conhecidas ento devem ser sugeridas ao utilizador.
13
11. 11.1. 11.2.
WAI-ARIA Landmark Roles utilizados para denir as grandes seces estruturantes da pgina (navigation, main, banner, complementary, search, form) Propriedades itens do menu. ex: Quando um item do menu principal selecionado aparece ento o menu secundrio, o item de primeiro nvel selecionado dever ser dinamicamente alterado de forma a incluir a propriedade aria-owns, cujo valor dever ser o ID do menu secundrio. Desta forma o utilizador de tecnologia assistiva informado acerca da relao entre o item selecionado do primeiro menu e o segundo menu de navegao. O mesmo aplica-se para o segundo e terceiro menus.
11.2.1. aria-owns: utilizado para comunicar s tecnologias assistivas a relao entre os vrios
11.2.2. Widget Roles utilizados para identicar alguns elementos de utilizao mais complexa. No caso especco do site up.pt so utilizados poucos sistemas complexos sendo que o nico identicado at agora a estrutura de navegao em rvore e o menu j anteriormente referido: Menu Menuitem Tree Treeitem
14
Directivas de Usabilidade
1. 1.1.
Consideraes Gerais O ttulo do site (texto e logotipo), menu de navegao principal (1 e 2 nveis) e a caixa de pesquisa (search box) devem ser reconhecidos visualmente de forma rpida, segundo padres estabelecidos para web:
1.1.1. 1.1.2. 1.1.3. 1.1.4. 1.2. 1.2.1. 1.2.2. 1.2.3.
O logotipo deve localizar-se no canto superior esquerdo. O menu de navegao deve situar-se imediatamente abaixo do cabealho. O formulrio de pesquisa deve situar-se direita , numa posio superior. Na homepage, deve ser clara a funo do site, e que tipo de recursos podero ser encontrados. As diferentes seces do site (cabealho, navegao, contedo central, sidebar, rodap) devem ser claras e distintas, e a sua relao deve ser consistente. O menu principal (1 e 2 nveis) deve estabelecer uma relao visual forte com a rea de contedo. O contedo central e a navegao contextual devem estabelecer uma relao de proximi dade visual. Os destaques (sidebar) devem ser visualmente diferenciados do conted o central.
2. 2.1. 2.1.1. 2.1.2. 2.2. 2.2.1. 2.2.2. 2.2.3. 2.2.4.
Mecanismos de Navegao A estrutura de navegao principal, secundria e breadcrumbs devem ser persistentes e consistentes visualmente em todas as pginas, excepto: O 2 e 3 nveis da navegao principal deve ser visveis apenas quando solicitado ou ne cessrio. O breadcrumb no deve ser visvel na homepage. A hierarquia dos diferentes nveis da navegao principal deve ser clara visualmente. Uma vez seleccionado, deve ser claro qual o item de 1 nvel seleccionado. Uma vez seleccionado, deve ser claro qual o item de 2 nvel seleccionado e qual o de 1 nvel correspondente. Uma vez seleccionado, deve ser claro qual o item de 3 nvel seleccionado e qual os de 2 e 3 nveis correspondentes. Fornecer uma referencia visual sempre que o cursor estiver sobre um item de menu (pseudo classe :hover).
15
2.3. 2.4. 2.5. 2.5.1. 2.6.
As designaes dos itens da navegao principal devem ser claras recorrendo a expres ses facilmente reconhecidas e/ou padronizadas. ex.: Sobre em vez de Quem Somos Deve ser fornecida a localizao da pagina da estrutura ao site com recurso ao bredacrumb. Todos os itens da navegao principal, navegao contextual e hiperligaes devem ter caractersticas nicas que os destingam entre si. A distino pode ser cromtica, tipogrca, grca ou ambos. Deve existir um mapa do site com o resumo de toda a estrutura do site acessvel em todas as pginas.
3. 3.1. 3.1.1. 3.1.2.
Contedo Ttulos Todos os ttulos devem ser o mais curtos possveis e objectivos, reectindo o contedo da pgina ou da seco. Os ttulos devem ser nicos. Deve-se evitar a existncia de pginas com ttulos idnticos ou semelhantes.
3.1.2.1. Quando necessrio a utilizao da mesma designao, esta deve reectir o seu contexto 3.1.3. Deve-se recorrer a uma estrutura hierrquica de ttulos visualmente distinta (<h1>, <h2>, <h3>,) (ver ponto 2.9 em Directivas de Acessibilidade) 3.1.3.2. O atributo title deve descrever o contedo da pgina 3.2. 3.2.1. 3.2.2. 3.2.3. 3.2.4. Textos Todos os textos devem ser escritos propositadamente para uma lgica de leitura em web. (ver NIELSEN, Jakob: Designing Web Usability, New Riders, 2000. pp.100-115) O texto deve ser composto num tamanho mnimo para leitura em monitores (12px), con siderando diferentes resolues, e ter um bom contraste com o fundo. O texto devem ser o mais sucinto e objectivo possvel, composto em curtos pargrafos que permitam uma leitura rpida e transversal. O texto deve ser nica e exclusivamente referente seco indicada. Se necessrio incluir textos de outra seces prefervel criar uma hiperligao contextual para a pgina correspondente.
16
3.2.5. 3.2.6.
O primeiro pargrafo deve providenciar uma rpida contextualizao de todo o contedo da pgina. Em situaes em que sejam necessrios textos extensos, o ritmo de leitura deve ser quebrado por diferentes nveis de ttulos, listas, etc. (ver NIELSEN, Jakob: Designing Web
Usability, New Riders, 2000. pp.100-115).
3.2.7. 3.2.8. 3.2.9.
Blocos muito extensos de texto devem ainda ser divididos por pginas, com hiperligaes compostas numa tabela de contedos. Em textos paginados, deve ser indicado o n de pginas totais e qual o n da actual pgina. Deve-se evitar texto composto em caixa alta. Se for necessrio destacar uma palavra, frase ou pargrafo, deve-se compor o destaque com recurso a negrito ou outro contraste visual.
3.2.10. Deve-se evitar a existncia de textos idnticos ou semelhantes em diferentes seces do site. 3.2.11. Pginas que no tenham qualquer contedo devem ser omitidas. 3.2.12. Deve-se evitar a existncia de contedo desactualizado. Em alternativa, deve-se indicar a ltima actualizao. 3.2.13. Acrnimos e abreviaturas, quando usados, devem ser denidos inicialmente no texto, ou com recurso ao atributo title. 3.2.14. A linguagem deve ser clara e normalizada ao longo do site, e facilmente interpretada sem conhecimento prvio do assunto da pgina. 3.3. 3.3.1. 3.3.2. 3.3.3. Links As hiperligaes devem ser claras e distintas quando compostas no texto, providenciar feedback visual (pseudo classe :hover) e indicar qual a aco a seguir (atributo rel). As hiperligaes para pginas j visitadas devem diferenciar-se visualmente dos links para pginas ainda no visitadas (pseudo classe :visited). Os links para o download de cheiros devem ser claros e distintos dos restantes, assim como indicar o tipo de cheiro e o seu tamanho.
4. 4.1.
Pesquisa A caixa de pesquisa deve estar claramente identicada, situada numa posio padroni zada e persistente ao longo do site.
17
4.2.
A pgina dos resultados de pesquisa deve:

Indicar o nmero total de resultados. Listar estes por ordem de relevncia. Apresentar o ttulo e resumo da pgina. A presentar a sua posio na estrutura de navegao (breadcrumb)
4.3.
Quando necessria a utilizao de pesquisas especicas, deve ser indicado claramente em que seco ir ser efectuada a pesquisa ex: Pesquisar Cursos, Pesquisar Professores, etc.
4.4.
Os botes de aco dos formulrios de pesquisa devem ter designaes comuns e facilmente identicveis ex: Submeter, Cancelar, Pesquisar,...
5. 5.1. 5.2. 5.3. 5.4.
Multimedia Recorrer a contedos video e audio apenas em situaes em que estes criem mais valia para a compreenso do contedo. Assegurar formas alternativas de aceder a este contedos (ver ponto 7 em Directivas de Acessibilidade). As imagens devem ter um texto descritivo da prpria imagem (atributo alt) (ver ponto 7 em Directivas de Acessibilidade). As imagens devem ser formatada exclusivamente para web, obedecendo aos tamanhos mximo e mnimo assim como aos formatos indicados.
6. 6.1. 6.2.
Erros Devem ser compostas pginas de erro, especica para os mais comuns (404,500) e uma genrica para os restantes. A pgina de erro deve apresentar possveis solues para a situao e/ou links para voltar atrs ou ao incio da pgina.
18
7. 7.1.
Impresso O site deve ter uma folha de estilos CSS que permita uma correcta impresso das pginas.
8. 8.1. 8.2.
URLs O site deve ser acessvel com ou sem a utilizao de www. no endereo A URL de cada pgina deve ser nica e descritiva, e compreensiva para humanos.
19
Directivas Mobile
1. 1.1. 1.2.
Preparar o contedo tendo em conta as caractersticas destes dispositivos Evitar pginas com textos demasiado longos. Optimizar as imagens para dimenses mais reduzidas, ou em alternativa, servir imagens diferentes dependendo da resoluo do dispositivo; parte dos acessos mobile so feitos a partir de ligaes 3G com largura de banda limitada.
1.3. 1.4. 1.5. 1.6.
Minimizar o uso de tabelas, caso seja possvel, optar pelo uso de listas; tabelas, sobretudo se tiveram vrias colunas, obrigam o utilizador a fazer scroll horizontal. Minimizar o uso de dropdowns, caso sejam indispensveis, disponibilizar formas de acesso ao contedo alternativas. Procurar que o texto dos links seja o mais descritivo possvel (por regra geral mas em especial neste tipo de dispositivos pois no possvel usar tooltips). Prestar ateno ao uso de scipt para apresentar contedo principal (ex: navegao) e vericar em particular o seu funcionamento em dispositivos com suporte limitado de script, (ex: Opera Mini).
1.7.
Procurar no usar tecnologias no suportadas, ou suportadas de forma limitada, por todos os browsers (ex: Flash); caso seja realmente indispensveis o seu uso, disponibilizar paralelamente alternativas mais acessveis.
2. 2.1.
Adaptar a navegao De forma a o utilizador no ter que fazer constantemente scroll para aceder ao contedo, disponibilizar apenas uma navegao bsica no topo da pgina, caso necessrio, apresentar a navegao completa no nal do contedo.
2.2. 2.3.
Disponibilizar a navegao completa apenas na homepage. Caso o espao no seja um problema, fornecer a possibilidade de voltar pgina imediatamente anterior, assim como pgina principal; apesar de algumas plataformas fornecerem algum tipo de mecanismo de voltar atrs, a sua apresentao no consistente.
20
3. 3.1.
Minimizar e facilitar a entrada de texto em formulrios. Fornecer forma de completar automaticamente o texto digitado pelo utilizador (autocomplete), p.ex: na pesquisa de um curso, preencher automaticamente (restringindo s opes possveis) o nome do curso; ou o completar automaticamente um campo de pesquisa com as palavras mais pesquisadas.
3.2.
Sempre que possvel, fornecer valores predenidos que faam sentido ao utilizador; procurar valores que sirvam o maior nmero de utilizadores, p.ex: se num campo de pesquisa possvel pesquisar por professores ou por cursos mas a maioria dos utilizadores pesquisa por cursos, prefervel preencher seleccionar por defeito a pesquisa por curso.
3.3. 3.4.
Caso se justique, oferecer opes de escolha mltipla em vez de obrigar entrada manual de texto. No caso da funcionalidade esteja disponvel e o seu uso seja pertinente, aproveitar a informao disponibilizada pelo dispositivo quanto localizao actual do utilizador (geolocation), p.ex: para completar formulrios relativos morada.
3.5.
Aproveitar, quando aplicvel, o histrico de utilizao para preencher automaticamente (ou apresentar como opo de escolha) formulrios com informao fornecida anteriormente (excepto para informao sensvel, p.ex: passwords).
3.6.
Disponibilizar um boto, nos campos de entrada de texto livre, para facilitar a remoo completa do texto fornecido.
Adaptar os campos de entrada de texto para o tipo contedo; denir atravs do HMTL o tipo de input do formulrio, sejam eles: Alfanumrico Numrico Telefone Email Data Etc.
4. 4.1.
Aproveitar funcionalidades especcas deste tipo de dispositivos Possibilidade de fazer directamente uma chamada clicando num nmero de telefone click-to-call. p.ex: pgina de contactos.
21
4.2. 4.3.
Ligar moradas directamente ao mapa nativo. Ligar endereos de email directamente aplicao nativa de email.
5. 5.1. 5.2. 5.3.
Layout Possibilitar alternar entre as diferentes verses do site, p.ex. utilizar o layout normal na verso mobile. Procurar que o layout das vrias verses seja o mais consistente possvel; o aspecto grco e contedo no devem variar consideravelmente entre verses mobile e desktop. Formatar todos os elementos clicveis com dimenses mnimas necessrias a poderem ser usados pela ponta dos dedos (aproximadamente: 1cm x 1cm [Saer]; 44px/pt [iPhone Human Interface Guidelines]).
5.4. 5.5. 5.6. 5.7. 5.8. 5.9.
Espaar razoavelmente listas de elementos clicveis de forma a minimizar possveis erros do utilizador ao clicar. Optar por usar um layout de uma coluna devido ao tamanho reduzido. Optar preferencialmente por organizar o contedo verticalmente e assim aproveitar a facilidade em fazer scroll. Formatar todos os elementos, sejam eles texto ou imagem de forma que o utilizador no tenha que fazer scroll horizontal. Optar preferencialmente por navegao vertical, devido ao espao limitado. Preparar o layout de forma que seja igualmente acessvel e usvel nas duas orientaes possveis.

Molto più che documenti.

Usabilidade Acessivel Metodologias Para a Avaliacao Qualitativa Da Usabilidade No Design Para a Web

Caricato da

Informazioni sul documento

Descrizione:

Descrizione:

Copyright:

Formati disponibili

Usabilidade Acessivel Metodologias Para a Avaliacao Qualitativa Da Usabilidade No Design Para a Web

Caricato da

Descrizione:

Copyright:

Formati disponibili

Titoli correlati

USABILIDADE ACESSVEL:

Metodologias para a Avaliao Qualitativa da Usabilidade no Design para a Web

Mestrado em Design da Imagem

Faculdade de Belas Artes da Universidade do Porto, 2012

Hugo Norberto Flix Ribeiro Mestrado em Design da Imagem

Dissertao para a obteno do Grau de Mestre Orientador: Miguel Carvalhais

Faculdade de Belas Artes da Universidade do Porto, 2012

72 72 74 74 74 75 75 75 77 77 78 78 78 79 80 80 80 80 81 81 81 81 82 82 82 82 84 84 87 91 95 97 105 125 133 157

1.1. O que a Usabilidade?

1.1.1. A Usabilidade segundo Nielsen

1.1.2. Outros Autores

11. Organizao Internacional de Normalizao, na sua designao portuguesa, 23

Rcio de erros pelos utilizadores Robustez

1.2.1. As Dez Heursticas de Nielsen

Figura 1. Exemplo de um barra de progresso de descarregamento de um ficheiro

Figura 2. Exemplo de navegao por separadores

Figura 3. Exemplo de Breadcrumbs

Figura 4. Exemplos de caixas de pesquisa

Figura 6. Exemplo de um principio de reconhecimento em vez de lembrana

Figura 7. Exemplo de mensagem de erro 404

Figura 8. Exemplo de ajuda e documentao durante o descarregamento de um programa de um stio

1.2.2. As oito Regras de Ouro do Design de Interfaces

Figura 9. Formulrio de concluso de compra de um stio de e-commerce

1.2.3. Princpios do Design de Interaco

Figura 12. Demonstrao da Lei de Fitts

1.2.4. A viso do psiclogo sobre o design da experincia do utilizador

Preveno e tratamento Antecipao de erros Capacidade de Aprendizagem A memria humana complicada

Reconhecimento em vez Reduo do recurso de lembrana memria

Flexibilidade e eficincia Atalhos para Eficincia do utilizador de utilizao utilizadores experientes

Nielsen, et al. (1990) Design e esttica minimalista

1.3. Usabilidade e Acessibilidade

32. http://www.usabilitynet.org/tools/list.htm 33. http://www.usabilitynet.org/tools/methods.htm, 45

2.1.1.5. Personas Indirectas

2.1.4. Prs e Contras

2.2. Card Sorting

2.2.3. Nmero de Testes Recomendado

2.2.5. Prs e Contras

34. http://www.xsortapp.com/ 35. http://www.uxsort.com/home 36. http://www.optimalworkshop.com/optimalsort.htm 37. http://uxpunk.com/websort/ 51

38. CMS, Content Managment System ou Sistema de Gesto de Contedos. 52

2.3.2.3. Prototipagem de Baixa Fidelidade

2.3.5. Nmero de Testes Recomendado

2.3.7. Prs e Contras

2.4. Percurso Cognitivo

2.4.2. Nmero de Testes Recomendado

2.4.4. Prs e Contras

2.5. Avaliao Heurstica

2.5.3. Nmero de Testes Recomendado

2.5.5. Prs e Contras

2.6. Teste de Usabilidade

Num escritrio ou sala de conferncias

Quem faz o teste? Planeamento Antecipado

Preparao Quando Testar?

O que acontece depois

2.6.3. Nmero de Testes Recomendado

2.6.5. Prs e Contras

3.1. Novo Stio da Universidade do Porto

3.1.4.2. Personas e Cenrios de Utilizao

Figura 13. Uma das personas criadas para o projecto UP

3.1.4.5. Testes de Usabilidade

3.1.5. Ponto de Situao

3.2. Novo stio do eLearning Caf

44. http://elearningcafe.up.pt/index.php/pt/o-que-e/o-que-e.html 45. http://sigarra.up.pt/reitoria/unidades_geral.visualizar?p_unidade=5 74

3.2.5. Ponto de Situao

Figura 20. Verses desktop, tablet e mobile do stio elearning caf

3.3. Stio do CEDA

3.3.5. Ponto de Situao