Modelo Conceptual e Protótipos da Segunda Infografia – Parte II

Mantendo o plano de apresentação do storyboard anterior, recriámos o plano interior.
Sendo assim, a metáfora passou a centrar-se no próprio edifício de Assembleia como se entrássemos dentro dele e aí encontrássemos o hemiciclo.

Num protótipo Médium-Fi optámos por colocar a legenda do hemiciclo por baixo deste para lhe dar mais ênfase, já que é um nível de informação hierarquicamente superior. Mais tarde concluímos que uma legenda seria demasiado redundante já que o utilizador, por ajuste à realidade deverá identificar os diferentes partidos pela cor que lhes é associada. Dou outro lado do hemiciclo estariam três janelas, como se pode ver na imagem, uma com as características do partido, outra com a fotografia do líder parlamentar e outra com informações pessoais do líder.
A affordance do nome do líder seria o sublinhado.
Este modelo também foi abandonado, por várias razões, entre elas o facto de necessitarmos de mais espaço para as informações sobre o líder parlamentar.

PROTÓTIPO MEDIUM –FI

4

Seguimos para novo modelo conceptual.

PROTÓTIPO HI-FI – PRIMEIRO NÍVEL
5

O hemiciclo está dividido por cores na mesma lógica do modelo anterior mas acrescentámos a deputada independente com uma cor diferente das já utilizadas, nomeadamente, o amarelo. Ao lado do hemiciclo encontramos as nove janelas que estão na fachada da frame anterior, mantendo assim a metáfora. Estas janelas serão utilizadas mais tarde.

Cada área colorida do hemiciclo é um botão. On roll over, como feedback é-lhe aplicada uma transparência e aparece a indicação da sigla do partido ou a legenda correspondente.

PROTÓTIPO HI-FI – BOTÕES ON ROLL OVER

6

Com o clique do rato, o utilizador passa para uma frame com informações sobre o partido correspondente ou área correspondente (o nome do partido, o número de deputados e o nome do presidente do grupo). A Galeria, o lugar dos jornalistas e dos assessores do governo têm apenas interactividade on roll over e não ao clique do rato, já que não consideramos dar informação sobre tais, daí estarem com uma cor mais aproximada do fundo da infografia.

Nesta fase o botão do partido corresponde mantém-se com 40% de transparência indicando a visibilidade do estado do sistema.
Os outros botões continuam operacionais.

PROTÓTIPO HI-FI – BOTÕES ON MOUSE DOWN
7

O nome do presidente do grupo tem a mesma cor do botão do hemiciclo para mapear os conteúdos e manter o simbolismo da cor. Encontra-se a negrito para reforçar a affordance. On roll over é aplicada uma transparência ao botão, mantendo-se assim consistência do sistema. Com o clique do rato passamos para outro nível de informação. A última janela da fila mais acima e a primeira janela da segunda fila aumentam de tamanho para receber informação, posicionando-se no centro da área que todas as janelas ocupavam, enquanto as restantes vão ficando mais transparentes até se tornarem invisíveis.

A janela quadrada é depois preenchida por uma fotografia do líder do grupo, enquanto a outra janela de maiores dimensões leva a informação do mesmo. Apenas indicamos o nome completo, data de nascimento, profissão e habilitações literárias porque considerámos que estas são as características mais importantes e as que são comuns a todos os deputados, já que nem todos têm livros publicados ou ocupam cargos de relevo, por exemplo.

Neste nível o nome do presidente mantém a transparência, assim como o botão do hemiciclo, para se ter a visibilidade do estado do sistema.

PROTÓTIPO HI-FI – ÚLTIMO NÍVEL DE INFORMAÇÃO
8

O título da infografia mantém-se ao longo de todas as frames.

Janeiro 7, 2009 at 4:55 pm Deixe um comentário

Modelo Conceptual e Protótipos da Segunda Infografia

De entre os temas propostos, a nossa escolha foi a Assembleia da República.
Depois de uma pesquisa pela Internet pudemos observar um pouco do que já existe a nível infográfico sobre este tema ou temas semelhantes. O nosso objectivo foi tentar transmitir a informação da melhor maneira, mas com o máximo de criatividade possível.
Uma vez que um dos principais objectivos deste tema era a organização espacial dos partidos, compreendemos que seria muito difícil fugir à metáfora do hemiciclo. Esta é, na nossa opinião, a melhor forma de expor a informação.

Em primeiro lugar, definimos a informação que iríamos tratar para não cairmos no mesmo erro da primeira infografia. Optamos, assim, por mostrar os partidos e o número de deputados que têm voz no parlamento português, bem como apresentar os representantes dos partidos.

Bem definida a informação a tratar, tornou-se mais fácil organizá-la no espaço.
O passo seguinte consistiu em desenhar um storyboard da infografia, para uma primeira abordagem.

PROTÓTIPO LO-FI

1222

A infografia teria dois planos de informação.
O primeiro plano, de apresentação, contém o título e o lead, explicativos do que podemos encontrar na infografia, bem como a fonte de informação. Ao centro podemos ver a estrutura em wireframe da fachada do edifício da Assembleia da República que funciona como botão de entrada para o interior da infografia. Este botão está a cinzento (enquanto tudo o resto está a negro) de modo a dar a affordance de que ali há interactividade. Como feedback, on roll over a fachada torna-se mais nítida.

PROTÓTIPO HI-FI – PRIMEIRO PLANO – APRESENTAÇÃO

3

No segundo plano, o interior, encontraríamos quatro níveis de informação, dentro de uma metáfora de uma secretária de escritório para aumentar a familiaridade do sistema com o ajuste ao mundo real.
Na parte superior esquerda teríamos o hemiciclo como maqueta que estaria dividido por cores segundo os grupos parlamentares que o ocupam. Mais uma vez num ajuste ao mundo real as cores são simbólicas do partido que representam. O PS a rosa, o PSD a laranja, O CDS-PP a azul, o PCP e o BE a vermelho (para os distinguir utilizaríamos diferentes tonalidades de vermelho) e o BEV a verde. A bancada do Governo também a rosa, por ser a cor do partido eleito e a Mesa da Assembleia a preto por ser uma cor neutra. Para as galerias, jornalistas e assessores do governo foi utilizado o cinzento, já que não necessitam de chamar a atenção visto não terem informação extra na nossa infografia. A proporção em que estão distribuídos os partidos é relativa ao número de deputados que cada partido tem com representação no Parlamento.

Na parte superior direita encontrar-se-ia representada uma folha de papel com o segundo nível de informação. Na metade inferior esquerda estaria representado um bloco de notas com um terceiro nível de informação e ao lado um quarto nível de informação que apareceria num post-it.

Cada área colorida da maqueta do hemiciclo é um botão, a cor dá a affordance. On roll over, a cada botão é aplicada uma transparência de 40%. Com o clique do rato o segundo nível de informação (folha de papel) é preenchido com o nome do partido, o símbolo do partido, o número de deputados e o nome do presidente do grupo parlamentar. A palavra deputados e o nome do presidente estão sublinhados, porque o utilizador está familiarizado com essa affordance para link. On roll over as palavras ficam da cor do partido (feedback com mapeamento por cor) e ao clique, no caso dos deputados o terceiro nível de informação é preenchido, no caso do presidente aparece o quarto nível de informação.
No terceiro nível de informação (bloco de notas) apareceria um gráfico, em estilo de pictograma, com pontos a representar o número de deputados que cada partido tem no parlamento. Mais uma vez, aqui seria utilizado o mapeamento por cor. Quando este gráfico é acedido, por exemplo através do link do PS, os pontos relativos aos deputados do PS estariam com opacidade 100% e os pontos relativos aos restantes partidos ficariam com transparência, para visibilidade do estado do sistema.

O quarto nível de informação, o post-it portanto, seria preenchido com alguns dados pessoais do presidente em questão.

Depois do clique num botão do hemiciclo esse botão permanece com transparência enquanto o utilizador continuar em níveis de informação relativos ao partido em questão para assinalar a visibilidade do estado do sistema. Os botões no segundo nível de informação permaneceriam com a cor relativa ao partido.

Este modelo conceptual tem um problema bastante óbvio, o ruído na informação que é causado por todos os acessórios dispensáveis, como o bloco de notas, o post –it ou a folha de papel, não indo, assim, de encontro ao design minimalista que defende Jacob Nielson. Concluímos também que o terceiro nível de informação era redundante e desnecessário já que a divisão por cores no hemiciclo permite ao utilizador perceber a proporção de deputados de cada partido com voz na Assembleia.
Depois da experiência em Freehand, num protótipo Medium-Fi, abandonámos o segundo plano deste modelo conceptual e criámos outro.

Janeiro 7, 2009 at 4:49 pm Deixe um comentário

Website da Direcção-geral de Saúde: um exemplo de boas práticas?

A internet é (…) uma ferramenta de melhoria, capaz de suportar ou de contribuir de forma decisiva para uma estratégia de modernização e de uma maior sintonia para com a sociedade. Não se pode esquecer que o cidadão concentra em si a razão de ser do estado, a razão de ser dos seus organismos, quer estes tenham contacto directo ou não com o cidadão.

O Guia de Boas Práticas na Construção de Websites da Administração Directa e Indirecta do Estado procura ser um documento de orientação para a construção de interfaces que sirvam os cidadãos com um serviço de qualidade reconhecida, a custos operacionais menores, contribuindo para a contínua modernização da Administração Directa e Indirecta do Estado.

São trinta e oito recomendações que formam este documento, divididas por nove secções: conteúdos, acessibilidade, navegabilidade, facilidades para cidadãos com necessidades especiais; serviços; gestão, privacidade e protecção de dados individuais; autenticação e segurança; e, por último, infraestrutura.

Tendo como referência este documento, pretende-se avaliar o website da Direcção Geral da Saúde.
Para começar, saliento as recomendações 19 e 20, que se inserem na secção de Facilidades para Cidadãos com Necessidades Especiais* . Esta secção zela pela inclusão de cidadãos com necessidades especiais na sociedade, que, no contexto actual, passa obrigatoriamente pelo acesso à informação.

* | Neste documento, existe uma secção denominada Acessibilidade, mas o termo é usado com uma acepção diferente da que tem sido abordada até agora no âmbito da cadeira de EAM. No GBP, Acessibilidade é definida como a capacidade de encontrar o website no universo WWW, normalmente a página de acolhimento no web site, ou homepage. |

A recomendação 19 diz respeito à concepção de páginas, que deve zelar por dois princípios básicos: simplicidade e compatibilidade. O Guia de Boas Práticas (GBP) chama a atenção para o facto de que um conjunto de conselhos deverão ser observados na concepção e desenvolvimento das páginas para que o acesso por cidadãos com necessidades especiais não possa ficar vedado.

O site da Direcção Geral da Saúde está em conformidade com a maior parte das recomendações relacionadas com a concepção das páginas, mas não todas.

O site evita o uso supérfluo de gráficos, imagens e sons. Quando são utilizados elementos não textuais, são também apresentados equivalentes textuais. Por exemplo, ao lado da imagem do mosquito portador da dengue, está a legenda “Febre da Dengue”. Contudo, encontramos logo uma excepção na primeira página do site: uma grelha posicionada no canto superior esquerdo que utiliza ícones para direccionar o utilizador para opções como Contactos, Mapa do Site, entre outros.

A referida legendagem das imagens fica muito aquém do que é exigido de um site acessível. É de lamentar o facto de não existirem alt-tags no código html do site.

Na página inicial, vemos que é apresentado no canto inferior direito o símbolo da acessibilidade, que on mouse down, nos permite navegar numa página alternativa. Esta opção vai contra as recomendações do GBP: De acordo com o princípio do “Desenho Universal”, princípio esse promovido pela Iniciativa Nacional para os Cidadãos com Necessidades Especiais na Sociedade da Informação (…) não deve ser realizado nenhum tipo de discriminação como, por exemplo, conceber web sites para invisuais em paralelo com uma versão desses web sites para não invisuais. (…) Não se trata de conceber web sites específicos para cidadãos com necessidades especiais, versões simplificadas do web site normal, mas fazer um web site apropriado para todos. Basicamente, as características que facilitam o acesso para um invisual facilitam de igual forma o  mesmo acesso por um cidadão comum.

Se navegarmos na página sem formatações CSS, acedendo portanto apenas ao conteúdo HTML, constatamos que o acesso não é facilitado para um utilizador com necessidades especiais.

Apesar disso, esta versão alternativa encontra-se muito bem construída, com vários atalhos para opções básicas (ex: ALT+P – Caixa de pesquisa; ALT+N – área de navegação principal) e com informação simplificada e bem estruturada, sem utilização de tabelas ou hierarquização/organização de informação através da cor, que é apresentada sempre que possível em formato texto para que possa ser lida por leitores de ecrã.

Como salienta o GBP, não existe nenhum sistema de avaliação ou instituição que atribua o símbolo da acessibilidade, mas os sites que o usam demonstram, não que sejam sites 100% acessíveis, mas a preocupação em construir um site acessível.

Como foi dito, o GBP apresenta outra recomendação enquadrada na secção de Facilidades para Cidadãos com Necessidades Especiais: testes de acessibilidade específicos (recomendação 20). É recomendada a utilização do Bobby, que já não se encontra disponível na web. Por isso,  para proceder à avaliação do website utilizei o Hera. Esta ferramenta aponta apenas três erros de prioridade 2  e um erro de prioridade 3 .

| Erros de prioridade 2 apontados pelo Hera: não se usam cabeçalhos; utiliza-se uma versão antiga de HTML; não existe nenhum cabeçalho, nem parágrafos ou listas que permitam criar uma estrutura mínima na página.
Erro de prioridade 3 apontado pelo Hera: não se proporcionam atalhos de teclado. |

Das restantes recomendações, saliento ainda algumas relacionadas com os conteúdos. A 1ª recomendação define a informação mínima publicada no website, que se relaciona também com a recomendação nº 15 – Ligações na primeira página – , inserida na secção da Navegabilidade.

| Informação mínima publicada no website (1ª recomendação):

  • Identificação e descrição do organismo que tutela o web site (com a missão, descrição das actividades e serviços prestados, a descrição da estrutura organizacional, com eventual recurso a diagramas)
  • Lista de contactos (Correio postal, telefones, faxs e endereço de correio electrónico), pessoais, funcionais e/ou institucionais;
  • Lista com todas as publicações do organismo e respectivos documentos;
  • Legislação pertinente para a actividade da entidade;
  • Eventos programados ou em curso;
  • Relatório de contas;
  • Plano de actividades e orçamento;
  • FAQ (Perguntas mais frequentes);
  • Novidades;
  • Formulários para download;
  • Política de privacidade e segurança. |

De entre as várias informações que deveriam ser publicadas no website, são apresentadas a identificação e descrição do organismo que tutela o website, lista de contactos, publicações, entre outras, mas são esquecidas informações como relatório de contas, FAQ e política de privacidade e segurança.

Relativamente à recomendação nº 16 que diz respeito às barras de navegação, também inserida na secção da Navegabilidade, o website respeita as ligações necessárias (contactos, mapa do site, motor de busca), à excepção da ligação para a homepage do governo.

Ainda no que diz respeito aos conteúdos, o GBP aconselha o uso de CSS na apresentação de informação, o que significa separar o conteúdo (estruturado em html) da formatação gráfica (conseguida através de CSS). Como já foi referido, este ponto não é respeitado, já que se optou por fazer uma versão alternativa.

No que diz respeito à compatibilidade HTML (recomendação nº12) , o website foi reprovado pelo Markup Validation Service do W3C, com 5 erros.

Janeiro 7, 2009 at 4:23 pm Deixe um comentário

BAES: Construir acessos para derrubar barreiras

As preocupações com a info-exclusão são cada vez maiores, já que, no contexto actual, afastamento da informação é sinónimo de afastamento da sociedade.

O Guia de Boas Práticas na Construção de Websites da Administração Directa e Indirecta do Estado evidencia essa preocupação: A Sociedade da Informação, tal como foi concebida, não deverá excluir ninguém, nomeadamente todo e qualquer cidadão com necessidades especiais. Os conteúdos e as ferramentas criados devem permitir que estes cidadãos possam pertencer a essa sociedade e não o contrário, pelo que os obstáculos erguidos no formato de barreiras tecnológicas devem ser eliminados ou diminuídos.

Também no GBP, é realçada a resolução de Conselho de Ministros nº 96/99: as preocupações com acesso à Sociedade da Informação e do Conhecimento por cidadãos com necessidades especiais são uma obrigatoriedade para quem tem responsabilidades na concepção e na produção dos suportes tecnológicos e dos próprios conteúdos.

Informação disponível não é, infelizmente, sinónimo de informação acessível. Ora, a Biblioteca Aberta do Ensino Superior surgiu exactamente com o intuito de criar formatos alternativos para informação que se encontra disponível para partilha, mas que não respeita critérios de acessibilidade. A BAES predispõe-se a tapar esse fosso existente entre informação existente e informação acessível, um fosso que não deveria existir numa sociedade democrática e igualitária.

baes

Resultado da colaboração entre várias instituições portuguesas do ensino superior, a BAES atende às necessidades de estudantes portadores de deficiências, a quem o acesso à informação esteve, até agora, se não vedado, pelo menos dificultado.

A digitalização de conteúdos é uma mais valia para a acessibilidade, já que permite que a informação seja acedida através de leitores de ecrã, como o Jaws ou o Firevox. Assim, a BAES define algumas regras para a produção de documentos em suporte digital, de forma a que a transformação da informação se dê de forma correcta, precisa e coerente, respeitando regras de acessibilidade.

Este projecto evidencia realmente um esforço em construir acessos para derrubar barreiras, um objectivo potenciado por uma parceria entre várias instituições do ensino superior que só poderá significar a partilha de variados saberes e a criação de acessos mais vastos.

Janeiro 7, 2009 at 4:10 pm Deixe um comentário

Portal do Cidadão com Deficiência: Reprovado

Ao navegar na Internet, descobri, por acaso, que existe um Portal do Cidadão com Deficiência. Ao testar a sua acessibilidade obtive resultados insólitos.

De um website que se intitula Portal do Cidadão com Deficiência e que se dirige, como é óbvio, a um público portador de deficiências, esperar-se-ia que exibisse boas regras de acessibilidade. Não é o caso.

O website é reprovado pelo Examinator e pelo Hera, uma vez que desrespeita o ponto 1.1 (prioridade 1): existem três imagens sem textos alternativos e dois elementos <embed>, sem que exista nenhum elemento <noembed>.

Da prioridade 2, são desrespeitados dez pontos de verificação, enquanto que da prioridade 3, são desrespeitados dois pontos.

Novembro 4, 2008 at 10:24 pm 2 comentários

Avaliação da Acessibilidade do Portal do Cidadão | Análise Automática e Manual

Para a avaliação da acessibilidade do website do Portal do Cidadão foram seguidas as directivas para a acessibilidade do conteúdo da Web 1.0, recomendadas pelo W3C, em 1999.

Das 14 directrizes definidas, constituídas por 65 pontos de verificação, ressaltam 3 níveis de prioridade:

* o nível 1 integra pontos que, se não respeitados, alguns utilizadores poderão ficar impossibilitados de aceder aos conteúdos da página;

* o nível 2 diz respeito aos pontos de verificação que, se não respeitados, poderão criar dificuldades de acesso aos conteúdos para alguns utilizadores;

* o nível 3 refere-se a pontos que, se respeitados, podem criar mais-valias no interface e, se não respeitados, podem criar algumas dificuldades de acesso.

Em primeiro lugar, faremos uma análise automática do website, utilizando o Hera, ferramenta de análise da acessibilidade das páginas Web. As avaliações automática e manual devem complementar-se, pelo que é necessário uma análise mais “personalizada”, que será feita mais adiante.

As directrizes de acessibilidade são definidas pelo W3C da seguinte forma:

As presentes directivas explicam como tornar o conteúdo Web acessível a pessoas com deficiências. Destinam-se a todos os criadores de conteúdo Web (autores de páginas e criadores de sítios) e aos programadores de ferramentas para criação de conteúdo. O principal objectivo destas directivas é promover a acessibilidade.

Avaliação Automática do Portal do Cidadão feita com o Hera

Da prioridade 1, foram encontrados dois pontos com erros:

*Ponto 1.1: “Forneça um equivalente textual para todo o elemento não textual. Pode ser feito através do atributo “alt”, ou “longdesc” ou no conteúdo do elemento. Isto abrange: imagens, representações gráficas de texto, incluindo símbolos, regiões de mapas de imagem, animações (…)”. Neste site, há uma imagem sem textos alternativos. Também há dez imagens que contêm o atributo “alt”.

*Ponto 8.1: “Faça com que os elementos programáveis tais como scripts e applets sejam directamente acessíveis ou compatíveis com tecnologias de apoio.” Neste site, utilizam-se eventos dependentes do dispositivo e não existem eventos redundantes.

Da prioridade 2, foram encontrados quatro pontos com erros (relacionados com a utilização de eventos dependentes dos dispositivos e com erros nos códigos CSS) e dois pontos correctos (relacionados com o uso de cabeçalhos no HTML e com a não utilização de elementos HTML obsoletos).

Da prioridade 3, foram encontrados quatro ponto com erros, dos quais se destacam:

*Ponto 4.3: “Identifique o idioma principal do documento”. Não se indica o idioma principal do documento.

*Ponto 9.5: “Defina teclas de atalho para links importantes”. Não se proporcionam atalhos de teclado.

Avaliação Manual do Portal do Cidadão

As Directivas para a acessibilidade do conteúdo da Web – 1.0 do W3C esclarecem que a validação da acessibilidade deve ser feita por meio de ferramentas automáticas e da revisão directa. Os métodos automáticos são geralmente rápidos, mas não são capazes de identificar todas as vertentes da acessibilidade. A avaliação humana pode ajudar a garantir a clareza da linguagem e a facilidade da navegação.

O principal objectivo da análise manual deve ser garantir que o website está em conformidade com o nível A das Directrizes para a acessibilidade do conteúdo da Web – 1.0 do W3C e, assim, corrigir algumas lacunas da avaliação automática.
Para isso, podemos recorrer a ferramentas como os leitores de ecrã (Jaws, Opera, Firevox, entre outros).

De seguida, expõe-se a análise manual ao Portal do Cidadão de acordo com alguns dos 16 pontos de verificação da prioridade 1:

1.1    Fornecer um equivalente textual a cada elemento não textual
No website do Portal do Cidadão, tal como acusa o Hera, existe uma imagem gif não legendada com o atributo ALT. À excepção dessa imagem, todas possuem o atributo.

Também em elementos como o INPUT foram encontrados o atributo alt. Por exemplo:
<input name=”mainBanner:LoginUser1:txtPassword” type=”password” maxlength=”20″ id=”mainBanner_LoginUser1_txtPassword” title=”Introduza a sua palavra-chave” class=”loginCss” Alt=”Introduza a sua palavra-chave” />

4.1 Identificar claramente quaisquer mudanças de língua no texto de um documento, bem como quaisquer equivalentes textuais.
É utilizado o atributo LANG para assinalar a mudança de língua. Por exemplo:
<span lang=”en”>email</span>

5.1 Em tabelas de dados, identificar os cabeçalhos de linha e de coluna.
São identificados cabeçalhos de linha e de coluna, através das tags TR e TD. Por exemplo:
<table cellpadding=”0″ cellspacing=”0″ class=”tableCidRight Rightbar” >
<tr>
<td class=”RightNavSeparator”></td>
</tr>

6.1 Organizar os documentos de modo a que possam ser lidos sem recurso a folhas de estilo. Por exemplo, se um documento em HTML for reproduzido sem as folhas de estilo que lhe estão associadas, deve continuar a ser possível lê-lo.
O HTML é possível ser lido sem as folhas de estilo, mas com dificuldades. Sem o HTML, a página não apresenta uma organização lógica. A estrutura visual do documento não corresponde à estrutura explicitamente codificada.

6.3 Assegurar que todas as páginas possam ser utilizadas mesmo que os programas interpretáveis, os applets ou outros objectos programados tenham sido desactivados ou não sejam suportados. Se isto não for possível, fornecer informações equivalentes numa página alternativa, acessível.

São usadas construções alternativas para objectos programados. Por exemplo:

<noscript>
<div class=”NoScriptWarning”>
<a href=”/PORTAL/pt/LojaCidadao/”>Se não tem o javascript activado clique aqui para ver a lista de Lojas</a>
<br>
</div>
</noscript>

12.1 Dar, a cada frame, um titulo que facilite a identificação das frames e a navegação nelas.
Não são utilizadas frames nesta página.

Novembro 2, 2008 at 10:47 pm Deixe um comentário

Usabilidade: Avaliação Heurística do site da Adidas

Depois da análise empírica e experimental, será então realizada uma análise heurística. Esta análise é feita de acordo com os princípios de Nielsen e Molich, sistematizados por Darryn Lavery, Gilbert Cockton e Malcolm Atkinson em Heuristic Evaluation: Usability Evaluation Materials.

1.Visibilidade do estado do sistema

Conformance Question: O interface satisfaz o princípio. O utilizador é constantemente informado sobre o estado do sistema, quer dizer, em que página se encontra, quanto tempo leva o loading da página, etc.

Evidence of Conformance: Existem vários grafismos que informam sobre o loading da página, como barras, gráficos circulares, entre outros.

Motivation: Sendo este um website suportado essencialmente por flash, é importante que se mantenha o utilizador informado sobre quanto tempo leva até que a página seja completamente carregada. Se o utilizador não fosse informado do estado do sistema, provavelmente desistiria de ver a página. Além disso, tendo várias ramificações, é importante que o utilizador seja também informado sobre a página do website em que se encontra.

2.Ligação entre o sistema e o mundo real

Conformance Question: O interface não utiliza conceitos e linguagem familiar para o utilizador, salvo algumas excepções.

Evidence of Conformance: Uma das poucas situações em que o interface utiliza conceitos familiares é ao utilizar etiquetas para indicar o modelo das sapatilhas. Apesar disso, nos testes empíricos parece ter havido uma falha na percepção dos modelos, o que pode indicar que as etiquetas não são tão eficazes quanto se esperava.

Motivation: O estabelecimento de uma ligação entre o sistema e o mundo real facilita a compreensão do sistema por parte do utilizador e dimininui a necessidade de conhecimentos extra. A utilização de conceitos familiares pode ajudar, por exemplo, a perceber para que serve um determinado botão.

3.Liberdade do utilizador

Conformance Question: O utilizador tem a liberdade de escolher os conteúdos que quer ver, no momento que quiser. Contudo, as animações flash podem tornar a experiência do utilizador um pouco cansativa, já que o obriga a esperar que seja feito o loading para poder ver esse conteúdo.

Evidence of Conformance: Quando surgem vídeos ou animações, o utilizador tem a possibilidade de passar para o passo seguinte. As opções de sair e retroceder estão bem assinaladas.

Motivation: Permitir ao utilizador liberdade na navegação facilita que se chegue mais facilmente à informação pretendida e se proporcione uma experiência mais agradável.

4.Consistência e standards

Conformance Question: O site da Adidas não possui qualquer consistência. Cada vez que se muda de página, toda a estrutura e design das páginas se alteram. O site da Adidas pretende responder às necessidades de cada nicho do mercado e adaptar o site ao perfil do comprador.

Evidence of Conformance: Cada colecção tem um design distinto e as tarefas são executadas através de procedimentos bem distintos.

Motivation: Cada vez que o utilizador muda de página, tem que iniciar um novo processo de aprendizagem, o que dificulta a navegação e a consecução da informação pretendida para um utilizador que pretenda ver todas as colecções.

5.Prevenção de erros

Conformance Question: Este princípio não é respeitado. O utilizador é levado a cometer erros que poderiam ser evitados.

Evidence of Conformance: Na página inicial, existem botões sem utilidade. Uma vez que eles aumentam de tamanho e mudam de forma on roll over, o utilizador é levado a pensar que será reencaminhado para outra página, levando-o a insistir no erro.

Motivation: Os erros geram no utilizador frustração e ansiedade. Neste caso, os botões deviam ter uma função prática, ao invés de servirem apenas para cansar o utilizador de tanta animação desnecessária.

6.Reconhecimento em vez de lembrança

Conformance Question: Uma vez que o site não possui consistência, o sistema funciona à base de reconhecimento e não de lembrança.

7.Flexibilidade e eficiência do uso

Conformance Question: As tarefas não são, na maior parte das vezes, realizadas de forma eficiente. O utilizador tem que explorar antes de chegar à informação que pretende, quando a informação deveria ser imediatamente perceptível.

Evidence of Conformance: Apesar de, por vezes, se verificar que não existe eficiência na consecução de informação, as montras de roupa apresentam bastante flexibilidade e eficiência de uso. O utilizador pode rodar, ampliar, reduzir, partilhar com outros utilizadores, etc. Os botões possuem boas affordances.

Motivation: Se as tarefas não são conseguidas com eficiência, o utilizador tende a desistir e procurar a informação por outros métodos (caixas de pesquisa, por exemplo).

8.Design minimalista

Conformance Question: O interface possui conteúdos desnecessários e que constituem apenas ruído na comunicação.

Evidence of Conformance: Na página da organização humanitária “Right to Play”, são apresentados dois quadrados, semelhantes a botões: o primeiro diz Adidas, o segundo “Right to Play”. Estes conteúdos induzem o utilizador em erro.

9.Ajudar os utilizadores a reconhecer, diagnosticar e recuperar de erros

Não se aplica.

10. Ajuda e documentação

Conformance Question: O princípio é respeitado: o website da Adidas disponibiliza ajuda para obter informações mais facilmente.

Evidence of Conformance: No interface é apresentada a seguinte opção: Ajuda/ Contacte-nos.

Motivation: Ajuda e documentação podem responder mais rapidamente a dúvidas do utilizador, ainda que fosse preferível que não fosse necessária ajuda.

Como se verifica, o website da Adidas não está em conformidade com a maior parte dos princípios. A análise heurística veio, portanto, confirmar as conclusões retiradas dos resultados da análise empírica.

A presença de elementos que apenas distraem o utilizador do seu objectivo e o induzem em erro, bem como a ausência de consistência ao longo do website são os principais factores que comprometem a sua usabilidade.

Outubro 10, 2008 at 9:16 pm 1 comentário

Artigos Mais Antigos


Categorias

  • Blogroll

  • Feeds