SlideShare uma empresa Scribd logo
1 de 14
Baixar para ler offline
Thais Campas – A.I. Sr./ UX expert




        Arquitetura da Informação e Usabilidade



                                                 Módulo III



                                                       "O arquiteto de informação é o indivíduo capaz de organizar padrões
                                                      inerentes aos dados, tornado clara sua complexidade, e capaz de criar
                                                      estruturas ou planejamento de informações que permitam aos outros
                                                               encontrarem seus caminhos pessoais para o conhecimento."

                                                                                                             Richard Wurman




Thais Campas
Arquiteta de Informação e Designer de Interação Sênior
Consultora em Usabilidade e Projetos Centrados no Usuário




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                    *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




Módulo III
III- Usabilidade na fase de execução da solução

3.1 - Usabilidade + Design

Até bem pouco atrás, quando se falava de usabilidade com designers e diretores de arte, a reação não era lá muito positiva. Usabilidade era um
conceito jakobiano, bem antagônico aos movimentos esteticamente inovadores nas mídias digitais. Hoje, a situação evoluiu bastante. Podemos
perceber em listas e portais segmentados que o tema é visto com importância, respeito e até bastante esclarecimento pelos profissionais que
trabalham com interfaces digitais. Mesmo assim, é importante abordarmos o assunto e mostrar que esse antagonismo realmente não existe. A
usabilidade não é, em absoluto, um obstáculo ao potencial criativo e inovador dos designers.

Quando passamos à fase de execução de um projeto, devemos obedecer a alguns conceitos e básicos básicos sobre a produção de interfaces. Ë
exatamente sobre isso que vamos falar agora.

     3.1.1 - Natureza das Interfaces – IHC e IS
     3.1.2 - Propriedade básica das interfaces – convergência e interatividade
     3.1.3 - A importância e o peso das cores
     3.1.4 - Posição dos Menus e Comandos
     3.1.5 - Legibilidade
     3.1.6 - Experimentação e Experiência Estética

3.1.1- Sobre a natureza das interfaces

                –     A interface homem/máquina ou IHC é a interface software, hardware ou ambas entre o hardware/sistema e o usuário. A
                      IHC suporta recursos de interatividade e comunicação entre o sistema e o usuário.

Pessoal, o conceito de IHC é anterior ao desabrochar da Internet. Portanto, IHC é um conceito amplo e genér ico. Se você abre o seu word*,
estará diante de uma IHC, se você abre uma página da Web também estará diante de uma IHC.

A IHC faz com que você possa dialogar com a máquina - faz com que ela se torne usável.

                –     A interface social ou IS é a interface entre usuários que é mediada ou suportada pela IHC. A IS é a interface colaborativa,
                      formadora de comunidades e existe num nível mais abstrato como uma qualificação quase sociológica da IHC.

Podemos dizer que a IS é uma instância ou uma qualidade da IHC. Exemplos de IS? Vamos citar dois imbatíveis: Orkut e ferramentas de blog em
geral. São interfaces construídas com o objetivo de gerar comunicação e troca entre usuários. Outro exemplo são os famosos chats e fóruns tão
comuns na WWW. MSN, Yahoo Messenger, programas de email e celulares também são interfaces sócias.

Analisar a perspectiva da IS é fundamental quando queremos formar comunidades, porque a comunidade, por sua vez, é fundamenta l para
os processos de fidelização do usuário.

Aqui vai uma dica, ou até conselho: reflita sempre sobre o grau de comunicação que deseja estabelecer entre os usuários. Essa reflexão será a
chave para analisar se você atingiu metas de usabilidade ou não.

Para fechar o assunto, vamos analisar os preceitos de usabilidade sob a perspectiva de interfaces IHC e IS:
      Preceitos de usabilidade em IHC:

                      Eficiência: a IHC deve ser adequada ao modelo mental do usuário.
                      Eficácia: a IHC deve proporcionar o resultado desejado pelo usuário com um índice mínimo de erros ou desvios.
                      Satisfação e Conforto: a IHC deve ser desenvolvida de acordo com a ergonomia cognitiva adequada ao perfil e limitações
                      do usuário.
                      Segurança: a IHC deve não apenas reduzir riscos para o usuário (vazamento de informações, operações irreversíveis com
                      efeitos indesejáveis, por exemplo), mas também fazer com que este mesmo usuário confie plenamente no sistema.
                       Flexibilidade: a IHC deve responder a cada interação do usuário com o sistema. Também deve oferecer atalhos e
                      caminhos alternativos de navegação e operação, além de permitir que o usuário se “arrependa” e possa desfazer a
                      operação anterior.


     Preceitos de usabilidade em IS:
UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                     *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




                           Eficiência: a IS deve obedecer a processos culturalmente consagrados.
                           Eficácia: a IS deve proporcionar resultados provenientes dos processos de colaboração e atingir metas coletivas
                           (para grupos de usuários e comunidades).
                           Satisfação e Conforto: a IS deve atender desejos e padrões de conforto coletivos.
                           Segurança: a IS deve preservar a individualidade do usuário, bem como sua privacidade, reforçando a identidade de
                           grupo.
                           Flexibilidade: a IS deve oferecer várias formas de comunicação e convergência de funcionalidades e tecnologias.


3.1.2 - Propriedade básica das interfaces – convergência e interatividade

Convergência não é sinônimo de interatividade

                –     Convergência é a confluência e a sinergia entre tecnologias e ambientes tecnológicos para um único objetivo. A
                      convergência também pode ser definida como conteúdos e interfaces que originalmente seriam provenientes de mídias
                      diferentes:
                            •     Exemplo: convergência entre TV e Internet, entre rádio e Internet, o Voip, o celular e o Voip via redes Wifi.

                –     Interatividade é o diálogo entre sistema e usuário através de uma única interface.
                            •    Exemplo: interatividade no comércio eletrônico, com o usuário buscando, selecionando produtos e pagando.
                                 Mecanismos de busca na Internet, como Google e Yahoo. O computador é - mesmo sem recursos de rede - um
                                 hardware intrinsecamente interativo. Ele “dialoga” com o usuário dentro de uma mesma interface.


Lembram-se da tão falada convergência de mídias? É exatamente a convergência de mídias totalmente diferentes como a impressa e o rádio,
por exemplo, para a Internet (protocolos e infra-estrutura). Atualmente nós escutamos rádio, assistimos TV e acessamos as principais mídias
impressas e grandes portais horizontais no computador, através da Internet. Isso é convergência. Já a interatividade, nós permite passar de
meros expectadores a atores dentro de uma mesma interface ou meio de comunicação. A mídia “pede” a minha participação e “responde” às
minhas ações.

Interatividade e convergência são conceitos que vão provocar profundas mudanças na comunicação de massa. Eles permitem que as práticas
de usabilidade – altamente ligado à caracterização das personas (indivíduos) evoluam ao extremo. Muita gente não sabe, mas o binômio
Interatividade&Convergência é uma busca antiga nas tecnologias de informação e comunicação. O rádio e a televisão nasceram com o
propósito de se tornarem interativos.

Hoje, o debate da TV Digital, gira em torno de 3 sistemas (japonês, europeu e americano) que oferecem possibilidades de interatividade e
convergência. A transmissão do conteúdo de TV via celular é uma delas.

Vejam que é uma discussão importante e gera muita polêmica até nos meios políticos. A interatividade e a convergência vão afetar
profundamente a forma como recebemos e armazenamos a informação que sempre nos chegou através das mídias tradicionais.

Outro aspecto crítico é que o indivíduo passa, ele próprio, a ser um broadcaster de informação e não mais um agente passivo que recebe e
decodifica mensagens. Percebem? Eu recebo informação, codifico, envio, recebo feedbacks e publico novamente mais informação.

Hoje, vivemos sob a perspectiva de uma overdose de informação, o que não significa que obtemos conhecimento em profundidade sobre os
assuntos, mas sim passamos superficialmente sobre uma variedade infinita de assuntos, ou seja, navegamos.

Isso, sem dúvida, é um desafio para o arquiteto de informação e para os projetistas de interface que devem levar o usuário a um resultado final
sem que sua atenção se perca. Resumindo, alguns aspectos que vocês devem manter em mente:

Uma interface pode ser ao mesmo tempo interativa e convergente.

                –     A mídia e os mecanismos de comunicação caminham para um mesmo ambiente tecnológico: a Internet.
                –     A interface interativa e convergente propiciada pela Internet irá “canibalizar” interfaces não convergentes e sem
                      interatividade.

                –     As interfaces do futuro próximo serão criadas com o conceito de mobilidade, funcionando como “avatares” e se
                      adaptando a diferentes tipos de hardware que por sua vez utilizarão protocolos e sistemas baseados em Web. Um
                      exemplo claro disso são webmails e programas de mensagens instantâneas.

UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                   *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




3.1.3 - A importância e o peso das cores no design de interfaces.


Pense que a cor é uma informação percebida pelo usuário, que provoca a sua cognição e uma resposta emocional, cultural e até instintiva. Do
ponto de vista biológico a percepção da cor se dá através de células especializadas da retina, é a percepção da longitude de onda da radiação
eletromagnética.

E do ponto de vista da comunicação e da cognição humana, toda informação é potencialmente uma mensagem enviada por alguém a alguém.
Ora, se eu dependo do processo cognitivo de comunicação para imprimir eficiência, eficácia e conforto à interface que estou projetando, devo
escolher as cores com muito critério.

Portanto, aqui o principal é que vocês tratem a cor não como um elemento ou componente da informação, mas como uma entidade completa,
uma informação, em si mesma. Ou seja, algo que contem um significado intrínseco e independente.

Estudos do Institute for Color Research mostram que as pessoas produzem julgamentos subconscientes sobre um indivíduo, objeto ou até um
ambiente nos primeiros 90 segundos de observação. Nesse lapso de tempo, entre 62% e 90% da informação conclusiva produzida pelo
indivíduo é baseada unicamente na cor".

E não precisamos refletir muito para concluir que nas interfaces, a cor funciona como componente fundamental. A cor comunica a o usuário
uma infinidade de informações, mas também proporciona conforto ou total inadequação em sua utilização.

Vou dar um exemplo básico, porém conclusivo: as cores dos links e dos menus, bem como sua combinação com a cor de fundo: letra verde e
fundo azul, fundo laranja e letra vermelha e assim vai. Lembre-se também: letras brancas em fundo escuro: você tem um monitor que irradia
luz própria, a interface não é projetada sobre uma superfície, mas é, em si mesma, uma fonte de luz.

A conseqüência é o “estouro” dos traços mais finos da letra na tela do computador que aparece borrada e pouco definida. O cérebro humano
percebe isso como um “ruído”, um elemento intruso e incômodo, criando posteriormente barreiras à assimilação da informação.

Sim, pessoal. O cérebro humano descarta aquilo que o incomoda, cria defesas como se fosse uma reação imunológica à mensagem que então é
mais assimilada e, após, algum tempo sequer percebida ou decodificada.




Guardem esse princípio e o utilizem como argumento: quanto menos ruído eu criar na minha comunicação visual - e isso diz respeito tanto à
quantidade de elementos quanto às cores – mais direta e precisa será a percepção e decodificação da mensagem. Ok? Usem e abusem deste
argumento quando o seu cliente (gestor do projeto) insistir na utilização de cores baseado unicamente no fato de que é uma cor institucional,
que combina com o logo, que deve ser aplicado o mesmo padrão de cores de outras mídias e outros enganos que podem comprometer
irremediavelmente as metas de usabilidade.

Conclusão: de acordo com a fisiologia do mecanismo de percepção da cor, contextos culturais e princípios cognitivos que acaba mos de citar,
mantenha em mente algumas regras básicas:


           Utilize a menor quantidade possível de cores na interface e para o “fundo” onde se encontra a informações e os comandos básicos e
           principais. Quanto mais cores, maior o esforço de harmonização e padronização. Isso vale para todos os usuários (primário,
           secundário e terciário).
           Cuidado com os contrastes, cuidado com as cores de fundo e com as fontes (legibilidade)
           A percepção da cor é afetada pela luminosidade do ambiente. Considere as fontes de iluminação - naturais e artificiais.
           Cuidado com as imagens de fundo, elas podem tornar os comandos ilegíveis, além de afetarem o carregamento das telas.




3.1.4 - Posição dos Menus e Comandos

UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                    *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




Nielsen descreve, em um de seus livros, as áreas nobres que concentram a atenção do usuário. Para definir áreas nobres, onde colocamos
informações importantes para o usuário e para os processos de interação, pense o seguinte:

Como você lê? Da esquerda para a direita e de cima para baixo. Então, temos aqui a primeira heurística que determinará a disposição de menus
e comandos críticos. Observe que o canto superior esquerdo da tela do seu computador concentra funções e informações essenciais a
operação dos programas. Com relação aos sites, a situação se repete.

Você tem alguns segundos para captar a atenção do usuário.

A figura abaixo mostra em tons fortes (vermelho) as áreas mais nobres, na medida em que o tom vai ficando mais fraco até o cinza claro, o nível
de atenção do usuário vai diminuindo. Isso quer dizer que as áreas em cinza tem pouca probabilidade de prender a atenção do usuário. Os
autores vão divergir sobre as áreas-limite, por exemplo. Mas a regra básica é mantida. Lembre-se de que o nível de atenção tende a diminuir ao
longo da leitura. A atenção do começo nunca será a mesma após alguns minutos ou até segundos.




Faça um benchmark e você poderá aferir a hierarquia dos comandos dispostos na interface. Verá também que leituras longas (lei a-se menus
longos, com muitas opções e nomenclaturas gigantescas) acabam por “perder” a atenção do usuário. Isso se deve ao posicionamento do menu
(comprido e fora da área nobre) e a quantidade de informação dentro de uma mesma tela.

A interatividade dos botões e links também é importante e merece alguns comentários. Há vários recursos disponíveis para construção de
menus e botões. Tenha em mente que, clicando ou não, você deve dosar o nível de informações relacionadas até o objetivo final. Não force seu
usuário além de três passos até obter o resultado. Todo mundo conhece os famosos menus “escadinha”. Você abre uma caixa que abre outra e
uma terceira. (tem gente que planeja até cinco opções!)



Opção1
          Opção2
                     Opção3.

Eu pergunto a vocês: se a opção “2” não é clicável, por que não eliminá-la? Além de exigir certo controle motor por parte do usuário, existe
uma questão cognitiva que é a exigência de que o usuário monte um pequeno quebra-cabeças para chegar à tela ou clique desejado.

Ou seja, ele tem que lembrar o “caminho” para resultado final. Se você anda construindo menus desse tipo, você não fez o dever de casa, ou
seja, não aplicou o Card Sorting que é um excelente antídoto para essa verdadeira “síndrome do menu escadinha”.

Se nesse ponto, constatar este tipo de problema metodológico, aplique um Card Sorting fechado.


     3.1.5 – Legibilidade

UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                   *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




O que é legibilidade no contexto da usabilidade e design? Em poucas palavras: tornar a leitura clara, precisa e confortável para o usuário.
Pessoal, prestem atenção: isso se refere aos símbolos gráficos que sinalizam comandos também!!!

Eu poderia falar para vocês de fontes (letras) mais legíveis ou menos legíveis. Dar uma receita de bolo, pescar o peixe e servir uma receita
maravilhosa. Prefiro seguir o que tenho feito até agora, porque para dar o peixe pronto, teria que desconsiderar os novos tamanhos de tela
disponíveis, tecnologia dos monitores LCD e por aí vai.

Isso quer dizer que o que é dito agora, pode não valer daqui a algum tempo. A receita de hoje pode não funcionar amanhã. Como a tecnologia
não pára, vocês terão que avaliar o impacto das heurísticas de acordo com a evolução da tecnologia que melhora ou modifica vários aspectos
que dizem respeito ao conforto e ao padrão de uso e acesso dos dispositivos eletrônicos.

Eu tenho cada vez mais telas de tamanhos diferentes, assim como recursos e padrão de luminosidade e contraste variados. Então, vamos ao
bom senso:

                           Evite fontes e letras muito diferentes em tipos, tamanhos e cores. Escolha um tipo e trabalhe com ele sem muita
                           variação.
                           Evite fontes e letras com serifa, a luminosidade “borra” as letras, tornando a leitura cansativa e imprecisa.
                           Cinza e preto em fundo claro são combinações vencedoras para textos.
                           Delimite assuntos e textos por elementos gráficos intuitivos. Respeite os espaços em branco que delimitam os
                           blocos de texto.
                           Evite fontes muito pequenas.
                           Evite negritar textos inteiros. Negrito é informação central, serve principalmente para títulos destaques, em alguns
                           casos para links.
                           Pense na paginação, nem muito, nem pouco. Saiba dosar.
                           Evite excesso de hyperlinks dentro dos textos. O usuário se perde, abrindo muitos links.

                           Evite blocos de texto muito longos, sem parágrafo. Um grande texto blocado se assemelha a um emaranhado de
                           palavras. O usuário facilmente perderá o fio da meada e precisará recomeçar do zero.

     3.1.6 - Experimentação e Experiência Estética

Pessoal, nesse ponto, você pode imaginar que estamos podando as possibilidades de inovação ao criarmos interfaces. Isso não verdade. Se
você observar, quando um designer cria, por exemplo, um carro conceito, ele cria a partir de princípios da física, da engenharia. Um carro não
pode ser simplesmente bonito, tem que ser seguro, confiável, ter uma boa mecânica, aerodinâmica.

Quando criar uma interface, você deve encarar da mesma maneira. Estude o usuário, entenda seus hábitos, suas necessidades e até seus
desejos. Entenda primeiramente, a UTILIDADE da interface e depois procure a sua definição de usabilidade para o que vai planejar e criar.

A interface é também uma experiência estética, mas não pode ser apenas isso.

Assim, toda vez que se deparar com a pressão ou o desejo irresistível de implementar uma nova tecnologia multimídia, por exemplo, analise o
impacto cuidadosamente.

O conceito de inovação passa também pela usabilidade, já que ela é uma medida do sucesso do seu trabalho no desenvolvimento d e
interfaces.


3.2- Usabilidade + Webwriting

Bom, aqui vou pegar meus amigos arquitetos de informação na veia. Notem que eu sempre vou bater na mesma tecla:

     3.2.1      Hierarquia de conteúdo;
     3.2.2      Taxonomia;
     3.2.3      Volume de informação em cada tela;
     3.2.4      Clareza e pertinência da informação apresentada.

E aí estão as variáveis da usabilidade na arte do webwriting.



UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                   *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




Vamos falar sobre cada uma delas. Antes, claro, uma pequena e rápida introdução. Sob o ponto de vista, digamos de um redator, vamos dizer
que a primeira preocupação com o texto online é o fato de que ele é um hipertexto. Um hipertexto é por definição um texto que contem links,
janelas, aberturas para outros textos.

É um texto composto por outros textos.

O que se pode aprender a partir dessa primeira reflexão é simples e básico. Nas mídias tradicionais, o texto é basicamente linear. Na Internet,
esse paradigma é quebrado. Eu posso navegar pela malha de informação da forma como eu desejar. Posso literalmente “ler” um texto a partir
de sua conclusão.

Com o recurso de um banco de dados, por exemplo, eu posso resgatar uma informação ou reconstituir um fato de forma não linear, através da
busca por palavra-chave ou pela data de publicação.

Portanto, de cara, fica claro que estamos afetando a eficácia e eficiência da informação quando redigimos o hipertexto. Ok? Não é a toa que
muitos redatores se tornam arquitetos de informação e especialistas em usabilidade.

A questão agora é: quais seriam os pontos, as variáveis da técnica de webwriting (que nada mais é do que “escrever para Web”) que afetam a
usabilidade do texto na Internet? São exatamente os pontos que citamos acima, quatro aspectos que você deve ter mente, durante o
planejamento e a produção de um conteúdo online.

     3.2.1 Hierarquia de conteúdo

Em termos de redação, eu devo oferecer uma lógica de navegação ao usuário. O que seria essa lógica? Seriam os conteúdos de primeiro,
segundo, terceiro nível e etc. Os usuários devem partir da sua “sugestão” de menu ou da sua ordem de importância dos conteúdos.

Como uma lógica possível, posso propor a vocês que partam do mais genérico ao mais detalhado. E vou um pouco mais além: construam
estruturas lineares e engessadas para os conteúdos online e “quebrem” essas estruturas da mesma forma que um escultor molda e talha sua os
detalhes de sua obra. Vocês verão que aos poucos é possível flexibilizar a navegação e o hipertexto até que ele chegue num formato ideal.

O que seria esse “formato ideal”? Um formato com instâncias de informação bem estruturadas, intuitivas e lógicas. A informação fundamental
e urgente em primeiro plano, a informação por interesse em segundo plano e detalhes sobre cada interesse em terceiro plano.

Difícil? Não, pessoal, basta olhar para um site institucional básico e você verá que a fórmula é consagrada.

Ex: Observe um site institucional qualquer que mantenha a seguinte estrutura, com cinco primeiros níveis:

Conteúdos de primeiro nível:

1-Empresa; 2-Produtos; 3-Serviços; 4-Fale Conosco; 5-RH

Conteúdos de segundo nível:

1-Empresa                                 2-Produtos
  1-1-História; 1-2-Missão; 1.3-Executivos    2-1-Notebooks; 2.2-Servidores; 2.3-Roteadores 2.4-Desktops

3-Serviços                                                        4-Fale Conosco (telefone e email)
  3.1-Manutenção; 3.2-Redes Wifi; 3.3-Rede cabeadas

5-RH
  5.1-Seu currículo; 5.2-Oportunidades

Repare que eu estou detalhando a informação de acordo com o nível e especificidade do interesse do usuário. Repare que no ter ceiro nível, eu
tenho diversas opções em produtos, por exemplo. Posso separar os equipamentos por marca, posso estabelecer uma busca por alguma
particularidade do equipamento e até pelo preço.

A técnica para se criar hierarquias de conteúdo mais eficazes, vocês já conhecem: é o CARD SORTING.

Ao criar as hierarquias de conteúdo, não se dispersem: engessem e posteriormente flexibilizem a navegação, criando atalhos, c onteúdos de
reforço e etc.


UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                      *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




Bom, o que eu quero deixar claro para vocês é que as hierarquias de conteúdo não existem só nos menus. Elas existem também dentro do
texto, e como estratégia de chamadas para a Home Page, que é a página de abertura de um site. As técnicas de titulação, de criação de
chamadas e leads obedecem também a uma hierarquia da informação que eu estabeleço para o site como um todo.

Se vocês seguirem regras básicas, verão que isso evita “derramar” na cabeça do usuário informação repetida e confusa. Vamos, lá, para colar na
geladeira e ler todos os dias:

             Construa parágrafos pequenos, com idéias centrais completas, ou seja, apenas um bloco de informação por parágrafo;

             Basicamente pouca informação por parágrafo

             Não exagere nos hiperlinks dentro do texto.


             Evite colocar hiperlinks e links para informações adjacentes logo no início do texto ou em momentos em que o seu objetivo é
             justamente manter a atenção do usuário até o final do texto.

             Tenha em mente que navegar na Internet é como ler um livro ou uma biblioteca inteira de forma NÃO linear. O sentido da leitura é
             construído pelo usuário.

             A tipografia tem que se harmonizar com a hierarquização da informação. Construa e mantenha normas de publicação tais como:
             destaques para a home, menus, hiperlinks dentro e fora do texto, leads, posicionamento das imagens e legendas.

             Lembre-se também de que o texto é antes de tudo uma imagem que será decodificada pelo usuário. Esta imagem deve ser clara e
             coerente com seu significado. Preste atenção nas cores das fontes e na pontuação.

             Não utilize linguagem coloquial, gírias e abreviações somente porque escreve para Internet: respeite as normas gramaticais.
             Recursos de linguagem somente para objetivos muito específicos e em contextos que justifiquem tal uso.


     3.2.2        Taxonomia

     Taxonomia, em poucas palavras, é a nomenclatura ou regra para criação da nomenclatura de menus, links, botões.

     Simples e direto: os nomes que você dá aos links e botões de um site, por exemplo. Se você entendeu e aplicou uma boa metodol ogia de
     Card Sorting, não é preciso estender o assunto.

     Se não aplicou o Card Sorting, talvez seja a última chance de fazê-lo antes de sofrer as conseqüências de um possível deslize quanto à
     usabilidade das interfaces que planejou e que agora já estão em fase de produção.

     Não há muito mistério, vamos colocar a técnicas básicas e algumas recomendações para uma taxonomia correta, sem risco para suas
     metas de usabilidade:

                  A nomenclatura de links, botões, comandos e menus deve obedecer ao contexto do projeto e à sua identidade e finalidade;
                  Cuidado com jargões técnicos, nem todo mundo tem o mesmo nível ;
                  Cuidado com regionalismos e gírias, vivemos num mundo globalizado, você pode restringir o alcance de seu projeto, sem que
                  haja uma intenção explícita de fazê-lo.

                  A nomenclatura deve fazer parte do repertório lingüístico e cultural do grupo de usuários para quem estou planejando a
                  interface;
                  A nomenclatura deve ser pertinente e intuitiva, principalmente se indica ações ou comandos a serem executados.
                  Evite redundâncias de nomes em uma mesma hierarquia de botões, como por exemplo: >Agenda e >Cronograma. Ou
                  >Calendário e >Agenda. Você pode achar que são coisas distintas, mas alguns usuários usam a denominação de um com a
                  identidade e funções do outro.

Esse tipo de “percepção” e sensibilidade você pode ter quando aplica o Card Sorting. Lembre-se de que a mente do usuário busca semelhanças
para encontrar familiaridades e, portanto, certo conforto cognitivo nas interfaces.




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                  *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




A taxonomia é imprescindível na criação de comunidades (diga-se de maneira geral para as INTERFACES SOCIAIS) porque ela própria é, digamos
um produto cultural da comunidade de usuários em questão.

E lembre-se: a mente humana é preguiçosa, ela busca aquilo que é conhecido, se não for conhecido há dois caminhos: (a) ignorar/desprezar OU
(b) estranhar/pesquisar. A maioria das pessoas, infelizmente opta por (a).


Para pregar na geladeira: Em taxonomia, vale a lei do menor esforço.

     3.2.3      Volume de Informação em cada tela

Muito simples: cuidado com a poluição visual em cada tela que cria. Não faça o usuário sofrer para encontrar o que deseja. Algumas vez es, criar
mais tópicos é preferível à concentração de um grande volume de informação e comandos em uma única tela.

Se você planejou um formulário, que exige que o usuário cumpra várias etapas de preenchimento, por exemplo, atenha-se à sua análise de
tarefas. Cada tarefa deve ser executada preferencialmente em uma tela.

Nem sempre isso é possível, mas de uma maneira geral, o número de tarefas deve ser pertinente com o número de telas.

Também é uma boa hora para definir o que realmente deve estar presente na interface, na tela, em determinado momento.

Fiquem atentos para o fato de que flexibilizar excessivamente as opções de navegação, logo no começo da produção das interfac es, pode poluir
e confundir a seqüência de comandos.

No caso da Web, fiquem atentos ao tamanho das fontes x resolução da tela e à barra de rolagem vertical no navegador.

Teste as interfaces em várias resoluções, mantenha espaços entre os blocos de informação e os hierarquize intuitivamente pela posição na
página.

Já mostramos antes, mas vale relembrar:




Também evitem o excesso de banners e não confundam propaganda com informação jornalística ou pertinente ao site. Lembrem-se de que
cores e fundos também são informação e vocês devem utilizá-las estrategicamente em favor dos objetivos do projeto.

Por vezes, oferecemos muito mais do que o usuário gostaria como primeiro passo de navegação e acabamos perdendo o foco da abordagem do
conteúdo.

Aqui, o principal é evitar estressar o usuário e desviar sua atenção. Muitos problemas de usabilidade são gerados por essa “miopia” da equipe
de manutenção e desenvolvimento. Nunca vejam na interface produzida uma reprodução de seus próprios modelos de organização mental.
Digamos que na “infância da Internet” essa falta de sensibilidade era o grande fator crítico para a falta de usabilidade nos sites.

Essa era e digamos que ainda é a grande armadilha para os projetistas de interfaces e sistemas.


UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                    *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




E para não dizer que não mencionei as chamadas interfaces “duras”, quantos comandos do controle remoto da televisão e do DVD vocês
realmente usam? Os comandos estratégicos estão corretamente posicionados por hierarquia visual, como indica o quadro acima? Pois é....

Pois bem, pessoal, aí está nosso pequeno check list, para saber se vocês andam abusando do volume de informação no planejamento de sites
ou aplicativos:

             Você tem barras de rolagem horizontais? Elimine.
             Você tem barras de rolagem verticais muito extensas logo na primeira página? Elimine ou diminua bastante, editando o conteúdo.
             Você criou blocos de informação? Se não criou, crie e delimite graficamente.
             Não varie cores e fontes indiscriminadamente e sem que haja uma razão lógica para isso.
             Delimite áreas de propaganda e outros tipos de conteúdo.
             Teste as resoluções de tela.

Esse check list é muitíssimo básico e curto, mas igualmente importante. Façam dele uma rotina em todos os seus trabalhos.


     3.2.4        – Clareza e pertinência da informação apresentada

Esse item é na verdade um resumo de tudo o que explicamos logo acima. Se vocês seguiram todas as etapas, vocês estão com 90% da missão
cumprida. Agora, estamos fazendo um ajuste fino de tudo o que já produzimos. Chegou a hora de olhar o conjunto e verificar a coerência da
navegação, da apresentação da informação e se nos mantivemos focados no projeto e no escopo original.

Clareza e pertinência da informação apresentada significam:

             Correta padronização do leiaute e da tipografia (fontes – cores e tamanhas);
             Hierarquização correta da informação;
             Taxonomia adequada aos objetivos do projeto, ao tipo de interface e contexto, bem como repertório do usuário;
             Volume ideal e priorização da informação apresentada;
             Correta delimitação de espaços entre os tipos de informação: banner, informação jornalística, institucional ou comercial e etc.
             Linguagem adequada à comunidade de usuários prevista para o projeto.

Com tudo isso, vocês serão claros e pertinentes na mensagem que desejam passar e, sobretudo, nas solicitações ao usuário.

É hora de conferir novamente 2 aspectos:

Se a análise de tarefas continua pertinente com o número de telas produzidas;
Se as mensagens de erro e confirmação do sistema estão coerentes, são suficientes ou até se estão em excesso.

Feito isso, vocês têm o ajuste fino do seu projeto.


3.3 - Usabilidade + Interface

Se você chegou até aqui, pouco há a acrescentar. Fez um bom planejamento, possui uma estratégia de usabilidade com metas estabelecidas?
Pois chegou o momento de “validar” tudo isso com um pequeno, porém estratégico:

             Verifique a coerência da linguagem e da direção de arte. Você está transmitindo as “mensagens” que realmente deseja?

             A direção de arte está coerente com o wireframe e com a documentação de A.I.? Se houve alteração, você deve documentar no
             wireframe e nos mapas!


             Os recursos de interface (imagens, áudio, vídeo) podem ser suportados pela infra-estrutura tecnológica alocada e planejada para o
             projeto?

             Assim que possível, execute as “key-features” em análises heurísticas e testes com usuários.




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                      *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




           E finalmente: evite mudanças em pontos estratégicas sem uma justificativa razoável. Mudanças durante a execução do projeto de
           interface normalmente são solicitadas pelos futuros gestores e causam um descontrole crítico no cronograma e em todo o
           planejamento de usabilidade.


3.4 - Usabilidade + Infra-estrutura tecnológica

Que seja fácil de usar e... funcione!

O maior desafio hoje, para as empresas cujo core business esta na oferta de tecnologia, é justamente “entregar o que promete” . Embora
existam inúmeros testes, metodologias e plataformas que permitem projetar a infra-estrutura e apontar gargalos, ainda assim muitos sites,
sistemas e aplicativos naufragam neste último desafio.

Para que vocês entendam melhor, aí vai uma analogia bem simples:

Quando um engenheiro projeta uma ponte, precisará fazer uma série de cálculos e ter certeza de que a estrutura suportará o impacto de seu
uso ao longo do tempo. Há neste caso, uma série de variáveis implícitas em situações que serão levadas em conta.

Com o desenvolvimento de sites, softwares e sistemas, a situação é semelhante. Também devemos chegar às variáveis que definem o impacto
de uso na infra-estrutura alocada, que é composta neste caso por outros sistemas, máquinas e serviços de conectividade e hospedagem
fornecidos por terceiros, sendo bem sintético.

“Os recursos que eu disponibilizo para o meu usuário devem ser compatíveis com a infra-estrutura que eu calculei. Isso significa garantir que
eu vou entregar o que prometi.”

O quesito infra-estrutura é particularmente importante quando oferecemos serviços convergentes tais como: acesso a conteúdos e operações
via celular, streaming de vídeo/ áudio e etc.

Aqui vale uma observação que muitos gestores de projetos ignoram ou esquecem: incluam nos seus testes de usabilidade as operações
necessárias para que o usuário acesse este tipo de recurso mais avançado e que exija familiaridade com mais de um tipo de interface. Um
exemplo bem atual: serviços de conteúdo online e de internet banking para celulares e computadores de mão.

Também é interessante “estressar” o sistema, simulando número de acessos simultâneos a um site, por exemplo. Operações críticas como a
finalização de compras online durante uma promoção de vendas seria uma situação interessante para um teste de stress.

Quais as respostas a um teste deste tipo, citando as mais importantes?

                      Tempo de resposta do sistema ao usuário;
                      Operações não completadas;
                      Número e tipo de erros;
                      Impacto em toda a infra-estrutura que suporta o site.

Simples, e bem assertivo. Você vai saber até quando e até quanto sua infra-estrutura é capaz de “entregar o prometido”.

Problemas que afetam o usuário podem sim ser previstos. Posso dimensionar promoções, lançamento de novos serviços e recursos. Posso
inclusive, planejar a expansão de um projeto.

As metodologias e certificações, hoje praticamente obrigatórias nas empresas de T.I. são impulsionadas por essa necessidade: a garantia de
fornecimento do serviço contratado. Gerentes de T.I. estão familiarizados como o termo S.L.A. (Service Level Agreement) que determina o
compromisso de manter entregas mínimas para manter a qualidade do serviço contratado entre, por exemplo, um data center e o
Departamento de TI de uma corporação.

Complicado? Nem tanto. Se refletirmos o quanto a Usabilidade da Interface depende de forma intrínseca da Qualidade da infra-estrutura,
concluímos que o correto dimensionamento tecnológico do projeto vai garantir a EFICÁCIA e até mesmo a SEGURANÇA das operações do
usuário.




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                  *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




Vou sugerir um check list bem genérico, mas com aspectos que muitas vezes são esquecidos pelos gestores de projetos online:

               a)    Quais os recursos disponíveis para cada tipo de usuário? (vídeo, transações em ambiente seguro...)
               b)    Qual o ambiente de acesso dos meus usuários? (PC, notebook, celular, conexão rápida, discada...)
               c)    Ofereço recursos de mobilidade?
               d)    Prevendo a implantação de recursos mais avançados, meu sistema suportará a adição de tecnologias de acesso
                     emergentes?
               e)    Estou atendendo a segmentos horizontais ou verticais?
               f)    Vou utilizar recursos avançados de busca e banco de dados?
               g)    Volume de acesso - possuo uma previsão? Qual?
               h)    Discriminar operações críticas: necessito de alta disponibilidade, espelhamento de servidores ou recursos de segurança
                     da informação tais como criptografia de dados?
               i)    Devo investir em recursos especiais e equipe para administração e manutenção dos serviços ao usuário?
               j)    Meu sistema exige suporte técnico, simples ao usuário final ou avançado?


Este check list pode ficar bem maior e variado. Com certeza, vai interferir nas metas de usabilidade para todos os usuários. Entendam o
seguinte: o que a interface promete, o sistema tem que entregar.

Seguindo esta norma, vocês podem validar e homologar suas escolhas em termos de investimento em infra-estrutura.

É claro que o processo inverso também ocorre quando criamos interfaces para sistemas já concebidos. Em ambientes corporativos isso é bem
comum, pois frequentemente vemos que os softwares impõem novas metodologias de trabalho aos usuários corporativos.

Ou seja, sistemas se impõem à cultura organizacional. E é bem fácil verificar o quanto este fato afeta sua usabilidade. Estamos na era dos
sistemas customizáveis, dos web applications que oferecem recursos e interfaces sob medida.

Com certeza, é uma vitória do usuário que entra como variável imprescindível ao planejamento, por exemplo, dos grandes sistemas
corporativos.




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                 *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




PERGUNTAS - MÓDULO III (teste seus conhecimentos!)

1- Assinale a alternativa falsa:

     1.    Uma interface social (IS) tem que necessariamente ser mediada por uma IHC.
     2.    O windows (sistema operacional da MS) possui várias interfaces sociais.
     3.    Convergência é uma característica ou propriedade exclusiva das interfaces sociais.
     4.    A IHC deve ser eficiente, ou seja, ser adequada ao modelo mental do usuário.
     5.    Recursos de interatividade e convergência são conceitos há muito tempo buscados pelos meios de comunicação tradicionais, como o
           rádio, por exemplo.
     6.    Os navegadores de internet são uma das primeiras interfaces sociais dos computadores pessoais.
     7.    A interface do iPOD é interativa e convergente.

2- Assinale a alternativa verdadeira:

     1.    Toda a informação conclusiva produzida pelo indivíduo é unicamente baseada na cor.
     2.    O site deve utilizar exclusivamente as cores do logo da empresa sob pena de perder a identidade perante os usuários.
     3.    O benchmark pode, na grande maioria dos casos, substituir o Card Sorting na definição da hierarquia dos menus.
     4.    É possível flexibilizar o hipertexto logo de primeira, criando várias alternativas de navegação que não necessitam serem testadas ou
           validadas.
     5.    As pessoas levam exatamente 1 minuto e 30 segundos para produzir julgamentos pertinentes e racionais, de acordo com seus
           padrões culturais e nível social, sobre algo que está sendo por elas observado.
     6.    Nosso cérebro possui a capacidade de “barrar” informações que atuam como “ruídos” de comunicação como um processo quase
           consciente. Com isso, muitas vezes durante um teste de usabilidade, nem sempre os usuários são objetivos em apontar aquilo que
           os incomoda.
     7.    Na internet, é possível ler uma história de forma não-linear, por isso não devemos nos preocupar excessivamente com a coesão de
           todo o conteúdo, pois os usuários já se acostumaram a reconstruir a informação, a partir da quebra do paradigma da linearidade.



3- Quais dos seguintes produtos apresentam atualmente a característica de “convergência” (união de recursos de mídia e comunicação até
então separados):

     1.    High Definition TV
     2.    Aparelho de DVD portátil
     3.    Celular.
     4.    Tablet(s)
     5.    GPS
     6.    Smart Phone
     7.    iPod



4- Dentre os elementos de design abaixo, qual deles perturba mais o usuário?

     1.    Barra de rolagem horizontal.
     2.    Letras brancas em fundo escuro.
     3.    Excesso de hiperlinks.
     4.    Cores mal aplicadas no layout.
     5.    Informação central “dispersa” em várias janelas e links.
     6.    Informação linear, concentrada em uma única página.
     7.    Links quebrados.




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                    *todos os direitos reservados
Thais Campas – A.I. Sr./ UX expert




5- Assinale as frases em que há uma correta relação entre causa e efeito.

     1.   Você não deve planejar mais que três níveis de associação para chegar à informação central que deseja passar ao usuário, pois os
          menus “escadinha” geram fadiga ocular no usuário.
     2.   O conceito de inovação está intrinsecamente relacionado à usabilidade, pois atende as metas do plano de negócios e estratégias de
          marketing.
     3.   Uma IHC é considerada uma interface social se e somente se possuir recursos de comunicação interpessoal instantânea.
     4.   Se a primeira conclusão sobre um objeto ou indivíduo é produzida no subconsciente do usuário, nem sempre a análise heurística
          feita por um especialista será suficiente para levantar problemas de usabilidade de um projeto a ser lançado.
     5.   Como entre 62% e 90% da informação conclusiva é produzida pelo indivíduo a partir da cor, então a legibilidade de uma página de
          internet é um fator de importância reduzida na primeira visita do usuário a um site.
     6.   A IS deve obedecer a padrões culturalmente e coletivamente aceitos pelo grupo de usuários a que se destina, pois ela deve ser
          suficientemente flexível para todos.
     7.   A IHC deve ser altamente flexível, pois deve ser adequada ao modelo mental do usuário (persona)




UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803                                 *todos os direitos reservados

Mais conteúdo relacionado

Mais procurados

Interface Homem Computador - IHC
Interface Homem Computador - IHCInterface Homem Computador - IHC
Interface Homem Computador - IHCNeilda Costa
 
Interação Humano Computador 1
Interação Humano Computador 1Interação Humano Computador 1
Interação Humano Computador 1Robson Santos
 
Interação humano computador (introdução )
Interação humano computador (introdução )Interação humano computador (introdução )
Interação humano computador (introdução )Jesse Teixeira
 
Aula 01 - Conceitos de IHC - Prof.ª Cristiane Fidelix
Aula 01 - Conceitos de IHC - Prof.ª Cristiane FidelixAula 01 - Conceitos de IHC - Prof.ª Cristiane Fidelix
Aula 01 - Conceitos de IHC - Prof.ª Cristiane FidelixCris Fidelix
 
A importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareA importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareFlavia Negrao
 
Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)Wellington Oliveira
 
O que é Interação Humano-Computador?
O que é Interação Humano-Computador?O que é Interação Humano-Computador?
O que é Interação Humano-Computador?Sidney Roberto
 
Aula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHCAula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHCSilvia Dotta
 
Interação Humano-Computador - História, Conceitos e Heurísticas de Nielsen
Interação Humano-Computador - História, Conceitos e Heurísticas de NielsenInteração Humano-Computador - História, Conceitos e Heurísticas de Nielsen
Interação Humano-Computador - História, Conceitos e Heurísticas de NielsenRos Galabo, PhD
 
Aula 9 interfaces- graduação Design
Aula 9 interfaces- graduação DesignAula 9 interfaces- graduação Design
Aula 9 interfaces- graduação DesignGustavo Fischer
 
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...Claudio Diniz - Designer Gráfico
 
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINA
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINAIHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINA
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINADiego BBahia
 
Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Mauro Pinheiro
 

Mais procurados (20)

USABILIDADE DA WEB MÓVEL
USABILIDADE DA WEB MÓVELUSABILIDADE DA WEB MÓVEL
USABILIDADE DA WEB MÓVEL
 
Interface Homem Computador - IHC
Interface Homem Computador - IHCInterface Homem Computador - IHC
Interface Homem Computador - IHC
 
Interação Humano Computador 1
Interação Humano Computador 1Interação Humano Computador 1
Interação Humano Computador 1
 
Interação humano computador (introdução )
Interação humano computador (introdução )Interação humano computador (introdução )
Interação humano computador (introdução )
 
Aula 01 - Conceitos de IHC - Prof.ª Cristiane Fidelix
Aula 01 - Conceitos de IHC - Prof.ª Cristiane FidelixAula 01 - Conceitos de IHC - Prof.ª Cristiane Fidelix
Aula 01 - Conceitos de IHC - Prof.ª Cristiane Fidelix
 
IHC - Slide 2 - Usabilidade e Princípios de Design
IHC - Slide 2 - Usabilidade e Princípios de DesignIHC - Slide 2 - Usabilidade e Princípios de Design
IHC - Slide 2 - Usabilidade e Princípios de Design
 
A importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareA importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de software
 
Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)
 
O que é Interação Humano-Computador?
O que é Interação Humano-Computador?O que é Interação Humano-Computador?
O que é Interação Humano-Computador?
 
Aula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHCAula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHC
 
Interação Humano-Computador - História, Conceitos e Heurísticas de Nielsen
Interação Humano-Computador - História, Conceitos e Heurísticas de NielsenInteração Humano-Computador - História, Conceitos e Heurísticas de Nielsen
Interação Humano-Computador - História, Conceitos e Heurísticas de Nielsen
 
Aula 9 interfaces- graduação Design
Aula 9 interfaces- graduação DesignAula 9 interfaces- graduação Design
Aula 9 interfaces- graduação Design
 
Interação Humano-Computador (IHC)
Interação Humano-Computador (IHC)Interação Humano-Computador (IHC)
Interação Humano-Computador (IHC)
 
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...
APRESENTAÇÃO: ARQUITETURA DE INFORMAÇÃO E ACESSIBILIDADE WEB: USABILIDADE COM...
 
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINA
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINAIHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINA
IHM x IHM – INTERFACE x INTERAçÃO HOMEM-MÁQUINA
 
Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...
 
O retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuárioO retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuário
 
Aula5 ihm
Aula5 ihmAula5 ihm
Aula5 ihm
 
Paradigmas da comunicação IHC
Paradigmas da comunicação IHCParadigmas da comunicação IHC
Paradigmas da comunicação IHC
 
Design de Interação 2008
Design de Interação 2008Design de Interação 2008
Design de Interação 2008
 

Semelhante a Arquitetura da Informação e Usabilidade na execução de soluções

Infografia multimídia para apresentação de resultados de testes de usabilidade
Infografia multimídia para apresentação de resultados de testes de usabilidadeInfografia multimídia para apresentação de resultados de testes de usabilidade
Infografia multimídia para apresentação de resultados de testes de usabilidadeFran Maciel
 
Modulo ii arquiteturainformacaousabilidade_thaiscampas
Modulo ii arquiteturainformacaousabilidade_thaiscampasModulo ii arquiteturainformacaousabilidade_thaiscampas
Modulo ii arquiteturainformacaousabilidade_thaiscampasThais Campas
 
Design Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalDesign Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalMarconi Pacheco
 
Palestra UX e AI
Palestra UX e AIPalestra UX e AI
Palestra UX e AIklaibert
 
Proposta de Trabalho DCA - M5.doc
Proposta de Trabalho DCA - M5.docProposta de Trabalho DCA - M5.doc
Proposta de Trabalho DCA - M5.docSusana Martins
 
Introdução a Internet
Introdução a InternetIntrodução a Internet
Introdução a InternetMarcio Duarte
 
Arquitetura da Informação e Experiência do Usuário
Arquitetura da Informação e Experiência do UsuárioArquitetura da Informação e Experiência do Usuário
Arquitetura da Informação e Experiência do UsuárioThais Campas
 
Design de informação e de interação
Design de informação e de interaçãoDesign de informação e de interação
Design de informação e de interaçãoPaula Faria
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Impacta Eventos
 
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Impacta Eventos
 
29/09/2011 - 9h às 12h30 - oficina - arquitetura da informação em sistemas 2...
29/09/2011 -  9h às 12h30 - oficina - arquitetura da informação em sistemas 2...29/09/2011 -  9h às 12h30 - oficina - arquitetura da informação em sistemas 2...
29/09/2011 - 9h às 12h30 - oficina - arquitetura da informação em sistemas 2...Rio Info
 
Arquitetura da Informação - O Arquiteto da Informação
Arquitetura da Informação - O Arquiteto da InformaçãoArquitetura da Informação - O Arquiteto da Informação
Arquitetura da Informação - O Arquiteto da Informaçãoaiadufmg
 
Arquitetura de Informação e Usabilidade
Arquitetura de Informação e UsabilidadeArquitetura de Informação e Usabilidade
Arquitetura de Informação e UsabilidadeScriptutex
 

Semelhante a Arquitetura da Informação e Usabilidade na execução de soluções (20)

Artigo ihc1
Artigo ihc1Artigo ihc1
Artigo ihc1
 
Infografia multimídia para apresentação de resultados de testes de usabilidade
Infografia multimídia para apresentação de resultados de testes de usabilidadeInfografia multimídia para apresentação de resultados de testes de usabilidade
Infografia multimídia para apresentação de resultados de testes de usabilidade
 
O Arquiteto da Informação
O Arquiteto da InformaçãoO Arquiteto da Informação
O Arquiteto da Informação
 
Arquitetura da Informação - Origem e Desenvolvimento
Arquitetura da Informação - Origem e DesenvolvimentoArquitetura da Informação - Origem e Desenvolvimento
Arquitetura da Informação - Origem e Desenvolvimento
 
Modulo ii arquiteturainformacaousabilidade_thaiscampas
Modulo ii arquiteturainformacaousabilidade_thaiscampasModulo ii arquiteturainformacaousabilidade_thaiscampas
Modulo ii arquiteturainformacaousabilidade_thaiscampas
 
Design Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalDesign Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface Digital
 
Aula 3 – A áera de IHC
Aula 3 – A áera de IHCAula 3 – A áera de IHC
Aula 3 – A áera de IHC
 
Uma introducao ai
Uma introducao aiUma introducao ai
Uma introducao ai
 
Palestra UX e AI
Palestra UX e AIPalestra UX e AI
Palestra UX e AI
 
Proposta de Trabalho DCA - M5.doc
Proposta de Trabalho DCA - M5.docProposta de Trabalho DCA - M5.doc
Proposta de Trabalho DCA - M5.doc
 
Inov Aula2
Inov Aula2Inov Aula2
Inov Aula2
 
Introdução a Internet
Introdução a InternetIntrodução a Internet
Introdução a Internet
 
Arquitetura da Informação e Experiência do Usuário
Arquitetura da Informação e Experiência do UsuárioArquitetura da Informação e Experiência do Usuário
Arquitetura da Informação e Experiência do Usuário
 
Design de informação e de interação
Design de informação e de interaçãoDesign de informação e de interação
Design de informação e de interação
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
 
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
 
Aula 2 - A área de IHC
Aula 2 - A área de IHCAula 2 - A área de IHC
Aula 2 - A área de IHC
 
29/09/2011 - 9h às 12h30 - oficina - arquitetura da informação em sistemas 2...
29/09/2011 -  9h às 12h30 - oficina - arquitetura da informação em sistemas 2...29/09/2011 -  9h às 12h30 - oficina - arquitetura da informação em sistemas 2...
29/09/2011 - 9h às 12h30 - oficina - arquitetura da informação em sistemas 2...
 
Arquitetura da Informação - O Arquiteto da Informação
Arquitetura da Informação - O Arquiteto da InformaçãoArquitetura da Informação - O Arquiteto da Informação
Arquitetura da Informação - O Arquiteto da Informação
 
Arquitetura de Informação e Usabilidade
Arquitetura de Informação e UsabilidadeArquitetura de Informação e Usabilidade
Arquitetura de Informação e Usabilidade
 

Arquitetura da Informação e Usabilidade na execução de soluções

  • 1. Thais Campas – A.I. Sr./ UX expert Arquitetura da Informação e Usabilidade Módulo III "O arquiteto de informação é o indivíduo capaz de organizar padrões inerentes aos dados, tornado clara sua complexidade, e capaz de criar estruturas ou planejamento de informações que permitam aos outros encontrarem seus caminhos pessoais para o conhecimento." Richard Wurman Thais Campas Arquiteta de Informação e Designer de Interação Sênior Consultora em Usabilidade e Projetos Centrados no Usuário UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 2. Thais Campas – A.I. Sr./ UX expert Módulo III III- Usabilidade na fase de execução da solução 3.1 - Usabilidade + Design Até bem pouco atrás, quando se falava de usabilidade com designers e diretores de arte, a reação não era lá muito positiva. Usabilidade era um conceito jakobiano, bem antagônico aos movimentos esteticamente inovadores nas mídias digitais. Hoje, a situação evoluiu bastante. Podemos perceber em listas e portais segmentados que o tema é visto com importância, respeito e até bastante esclarecimento pelos profissionais que trabalham com interfaces digitais. Mesmo assim, é importante abordarmos o assunto e mostrar que esse antagonismo realmente não existe. A usabilidade não é, em absoluto, um obstáculo ao potencial criativo e inovador dos designers. Quando passamos à fase de execução de um projeto, devemos obedecer a alguns conceitos e básicos básicos sobre a produção de interfaces. Ë exatamente sobre isso que vamos falar agora. 3.1.1 - Natureza das Interfaces – IHC e IS 3.1.2 - Propriedade básica das interfaces – convergência e interatividade 3.1.3 - A importância e o peso das cores 3.1.4 - Posição dos Menus e Comandos 3.1.5 - Legibilidade 3.1.6 - Experimentação e Experiência Estética 3.1.1- Sobre a natureza das interfaces – A interface homem/máquina ou IHC é a interface software, hardware ou ambas entre o hardware/sistema e o usuário. A IHC suporta recursos de interatividade e comunicação entre o sistema e o usuário. Pessoal, o conceito de IHC é anterior ao desabrochar da Internet. Portanto, IHC é um conceito amplo e genér ico. Se você abre o seu word*, estará diante de uma IHC, se você abre uma página da Web também estará diante de uma IHC. A IHC faz com que você possa dialogar com a máquina - faz com que ela se torne usável. – A interface social ou IS é a interface entre usuários que é mediada ou suportada pela IHC. A IS é a interface colaborativa, formadora de comunidades e existe num nível mais abstrato como uma qualificação quase sociológica da IHC. Podemos dizer que a IS é uma instância ou uma qualidade da IHC. Exemplos de IS? Vamos citar dois imbatíveis: Orkut e ferramentas de blog em geral. São interfaces construídas com o objetivo de gerar comunicação e troca entre usuários. Outro exemplo são os famosos chats e fóruns tão comuns na WWW. MSN, Yahoo Messenger, programas de email e celulares também são interfaces sócias. Analisar a perspectiva da IS é fundamental quando queremos formar comunidades, porque a comunidade, por sua vez, é fundamenta l para os processos de fidelização do usuário. Aqui vai uma dica, ou até conselho: reflita sempre sobre o grau de comunicação que deseja estabelecer entre os usuários. Essa reflexão será a chave para analisar se você atingiu metas de usabilidade ou não. Para fechar o assunto, vamos analisar os preceitos de usabilidade sob a perspectiva de interfaces IHC e IS: Preceitos de usabilidade em IHC: Eficiência: a IHC deve ser adequada ao modelo mental do usuário. Eficácia: a IHC deve proporcionar o resultado desejado pelo usuário com um índice mínimo de erros ou desvios. Satisfação e Conforto: a IHC deve ser desenvolvida de acordo com a ergonomia cognitiva adequada ao perfil e limitações do usuário. Segurança: a IHC deve não apenas reduzir riscos para o usuário (vazamento de informações, operações irreversíveis com efeitos indesejáveis, por exemplo), mas também fazer com que este mesmo usuário confie plenamente no sistema. Flexibilidade: a IHC deve responder a cada interação do usuário com o sistema. Também deve oferecer atalhos e caminhos alternativos de navegação e operação, além de permitir que o usuário se “arrependa” e possa desfazer a operação anterior. Preceitos de usabilidade em IS: UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 3. Thais Campas – A.I. Sr./ UX expert Eficiência: a IS deve obedecer a processos culturalmente consagrados. Eficácia: a IS deve proporcionar resultados provenientes dos processos de colaboração e atingir metas coletivas (para grupos de usuários e comunidades). Satisfação e Conforto: a IS deve atender desejos e padrões de conforto coletivos. Segurança: a IS deve preservar a individualidade do usuário, bem como sua privacidade, reforçando a identidade de grupo. Flexibilidade: a IS deve oferecer várias formas de comunicação e convergência de funcionalidades e tecnologias. 3.1.2 - Propriedade básica das interfaces – convergência e interatividade Convergência não é sinônimo de interatividade – Convergência é a confluência e a sinergia entre tecnologias e ambientes tecnológicos para um único objetivo. A convergência também pode ser definida como conteúdos e interfaces que originalmente seriam provenientes de mídias diferentes: • Exemplo: convergência entre TV e Internet, entre rádio e Internet, o Voip, o celular e o Voip via redes Wifi. – Interatividade é o diálogo entre sistema e usuário através de uma única interface. • Exemplo: interatividade no comércio eletrônico, com o usuário buscando, selecionando produtos e pagando. Mecanismos de busca na Internet, como Google e Yahoo. O computador é - mesmo sem recursos de rede - um hardware intrinsecamente interativo. Ele “dialoga” com o usuário dentro de uma mesma interface. Lembram-se da tão falada convergência de mídias? É exatamente a convergência de mídias totalmente diferentes como a impressa e o rádio, por exemplo, para a Internet (protocolos e infra-estrutura). Atualmente nós escutamos rádio, assistimos TV e acessamos as principais mídias impressas e grandes portais horizontais no computador, através da Internet. Isso é convergência. Já a interatividade, nós permite passar de meros expectadores a atores dentro de uma mesma interface ou meio de comunicação. A mídia “pede” a minha participação e “responde” às minhas ações. Interatividade e convergência são conceitos que vão provocar profundas mudanças na comunicação de massa. Eles permitem que as práticas de usabilidade – altamente ligado à caracterização das personas (indivíduos) evoluam ao extremo. Muita gente não sabe, mas o binômio Interatividade&Convergência é uma busca antiga nas tecnologias de informação e comunicação. O rádio e a televisão nasceram com o propósito de se tornarem interativos. Hoje, o debate da TV Digital, gira em torno de 3 sistemas (japonês, europeu e americano) que oferecem possibilidades de interatividade e convergência. A transmissão do conteúdo de TV via celular é uma delas. Vejam que é uma discussão importante e gera muita polêmica até nos meios políticos. A interatividade e a convergência vão afetar profundamente a forma como recebemos e armazenamos a informação que sempre nos chegou através das mídias tradicionais. Outro aspecto crítico é que o indivíduo passa, ele próprio, a ser um broadcaster de informação e não mais um agente passivo que recebe e decodifica mensagens. Percebem? Eu recebo informação, codifico, envio, recebo feedbacks e publico novamente mais informação. Hoje, vivemos sob a perspectiva de uma overdose de informação, o que não significa que obtemos conhecimento em profundidade sobre os assuntos, mas sim passamos superficialmente sobre uma variedade infinita de assuntos, ou seja, navegamos. Isso, sem dúvida, é um desafio para o arquiteto de informação e para os projetistas de interface que devem levar o usuário a um resultado final sem que sua atenção se perca. Resumindo, alguns aspectos que vocês devem manter em mente: Uma interface pode ser ao mesmo tempo interativa e convergente. – A mídia e os mecanismos de comunicação caminham para um mesmo ambiente tecnológico: a Internet. – A interface interativa e convergente propiciada pela Internet irá “canibalizar” interfaces não convergentes e sem interatividade. – As interfaces do futuro próximo serão criadas com o conceito de mobilidade, funcionando como “avatares” e se adaptando a diferentes tipos de hardware que por sua vez utilizarão protocolos e sistemas baseados em Web. Um exemplo claro disso são webmails e programas de mensagens instantâneas. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 4. Thais Campas – A.I. Sr./ UX expert 3.1.3 - A importância e o peso das cores no design de interfaces. Pense que a cor é uma informação percebida pelo usuário, que provoca a sua cognição e uma resposta emocional, cultural e até instintiva. Do ponto de vista biológico a percepção da cor se dá através de células especializadas da retina, é a percepção da longitude de onda da radiação eletromagnética. E do ponto de vista da comunicação e da cognição humana, toda informação é potencialmente uma mensagem enviada por alguém a alguém. Ora, se eu dependo do processo cognitivo de comunicação para imprimir eficiência, eficácia e conforto à interface que estou projetando, devo escolher as cores com muito critério. Portanto, aqui o principal é que vocês tratem a cor não como um elemento ou componente da informação, mas como uma entidade completa, uma informação, em si mesma. Ou seja, algo que contem um significado intrínseco e independente. Estudos do Institute for Color Research mostram que as pessoas produzem julgamentos subconscientes sobre um indivíduo, objeto ou até um ambiente nos primeiros 90 segundos de observação. Nesse lapso de tempo, entre 62% e 90% da informação conclusiva produzida pelo indivíduo é baseada unicamente na cor". E não precisamos refletir muito para concluir que nas interfaces, a cor funciona como componente fundamental. A cor comunica a o usuário uma infinidade de informações, mas também proporciona conforto ou total inadequação em sua utilização. Vou dar um exemplo básico, porém conclusivo: as cores dos links e dos menus, bem como sua combinação com a cor de fundo: letra verde e fundo azul, fundo laranja e letra vermelha e assim vai. Lembre-se também: letras brancas em fundo escuro: você tem um monitor que irradia luz própria, a interface não é projetada sobre uma superfície, mas é, em si mesma, uma fonte de luz. A conseqüência é o “estouro” dos traços mais finos da letra na tela do computador que aparece borrada e pouco definida. O cérebro humano percebe isso como um “ruído”, um elemento intruso e incômodo, criando posteriormente barreiras à assimilação da informação. Sim, pessoal. O cérebro humano descarta aquilo que o incomoda, cria defesas como se fosse uma reação imunológica à mensagem que então é mais assimilada e, após, algum tempo sequer percebida ou decodificada. Guardem esse princípio e o utilizem como argumento: quanto menos ruído eu criar na minha comunicação visual - e isso diz respeito tanto à quantidade de elementos quanto às cores – mais direta e precisa será a percepção e decodificação da mensagem. Ok? Usem e abusem deste argumento quando o seu cliente (gestor do projeto) insistir na utilização de cores baseado unicamente no fato de que é uma cor institucional, que combina com o logo, que deve ser aplicado o mesmo padrão de cores de outras mídias e outros enganos que podem comprometer irremediavelmente as metas de usabilidade. Conclusão: de acordo com a fisiologia do mecanismo de percepção da cor, contextos culturais e princípios cognitivos que acaba mos de citar, mantenha em mente algumas regras básicas: Utilize a menor quantidade possível de cores na interface e para o “fundo” onde se encontra a informações e os comandos básicos e principais. Quanto mais cores, maior o esforço de harmonização e padronização. Isso vale para todos os usuários (primário, secundário e terciário). Cuidado com os contrastes, cuidado com as cores de fundo e com as fontes (legibilidade) A percepção da cor é afetada pela luminosidade do ambiente. Considere as fontes de iluminação - naturais e artificiais. Cuidado com as imagens de fundo, elas podem tornar os comandos ilegíveis, além de afetarem o carregamento das telas. 3.1.4 - Posição dos Menus e Comandos UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 5. Thais Campas – A.I. Sr./ UX expert Nielsen descreve, em um de seus livros, as áreas nobres que concentram a atenção do usuário. Para definir áreas nobres, onde colocamos informações importantes para o usuário e para os processos de interação, pense o seguinte: Como você lê? Da esquerda para a direita e de cima para baixo. Então, temos aqui a primeira heurística que determinará a disposição de menus e comandos críticos. Observe que o canto superior esquerdo da tela do seu computador concentra funções e informações essenciais a operação dos programas. Com relação aos sites, a situação se repete. Você tem alguns segundos para captar a atenção do usuário. A figura abaixo mostra em tons fortes (vermelho) as áreas mais nobres, na medida em que o tom vai ficando mais fraco até o cinza claro, o nível de atenção do usuário vai diminuindo. Isso quer dizer que as áreas em cinza tem pouca probabilidade de prender a atenção do usuário. Os autores vão divergir sobre as áreas-limite, por exemplo. Mas a regra básica é mantida. Lembre-se de que o nível de atenção tende a diminuir ao longo da leitura. A atenção do começo nunca será a mesma após alguns minutos ou até segundos. Faça um benchmark e você poderá aferir a hierarquia dos comandos dispostos na interface. Verá também que leituras longas (lei a-se menus longos, com muitas opções e nomenclaturas gigantescas) acabam por “perder” a atenção do usuário. Isso se deve ao posicionamento do menu (comprido e fora da área nobre) e a quantidade de informação dentro de uma mesma tela. A interatividade dos botões e links também é importante e merece alguns comentários. Há vários recursos disponíveis para construção de menus e botões. Tenha em mente que, clicando ou não, você deve dosar o nível de informações relacionadas até o objetivo final. Não force seu usuário além de três passos até obter o resultado. Todo mundo conhece os famosos menus “escadinha”. Você abre uma caixa que abre outra e uma terceira. (tem gente que planeja até cinco opções!) Opção1 Opção2 Opção3. Eu pergunto a vocês: se a opção “2” não é clicável, por que não eliminá-la? Além de exigir certo controle motor por parte do usuário, existe uma questão cognitiva que é a exigência de que o usuário monte um pequeno quebra-cabeças para chegar à tela ou clique desejado. Ou seja, ele tem que lembrar o “caminho” para resultado final. Se você anda construindo menus desse tipo, você não fez o dever de casa, ou seja, não aplicou o Card Sorting que é um excelente antídoto para essa verdadeira “síndrome do menu escadinha”. Se nesse ponto, constatar este tipo de problema metodológico, aplique um Card Sorting fechado. 3.1.5 – Legibilidade UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 6. Thais Campas – A.I. Sr./ UX expert O que é legibilidade no contexto da usabilidade e design? Em poucas palavras: tornar a leitura clara, precisa e confortável para o usuário. Pessoal, prestem atenção: isso se refere aos símbolos gráficos que sinalizam comandos também!!! Eu poderia falar para vocês de fontes (letras) mais legíveis ou menos legíveis. Dar uma receita de bolo, pescar o peixe e servir uma receita maravilhosa. Prefiro seguir o que tenho feito até agora, porque para dar o peixe pronto, teria que desconsiderar os novos tamanhos de tela disponíveis, tecnologia dos monitores LCD e por aí vai. Isso quer dizer que o que é dito agora, pode não valer daqui a algum tempo. A receita de hoje pode não funcionar amanhã. Como a tecnologia não pára, vocês terão que avaliar o impacto das heurísticas de acordo com a evolução da tecnologia que melhora ou modifica vários aspectos que dizem respeito ao conforto e ao padrão de uso e acesso dos dispositivos eletrônicos. Eu tenho cada vez mais telas de tamanhos diferentes, assim como recursos e padrão de luminosidade e contraste variados. Então, vamos ao bom senso: Evite fontes e letras muito diferentes em tipos, tamanhos e cores. Escolha um tipo e trabalhe com ele sem muita variação. Evite fontes e letras com serifa, a luminosidade “borra” as letras, tornando a leitura cansativa e imprecisa. Cinza e preto em fundo claro são combinações vencedoras para textos. Delimite assuntos e textos por elementos gráficos intuitivos. Respeite os espaços em branco que delimitam os blocos de texto. Evite fontes muito pequenas. Evite negritar textos inteiros. Negrito é informação central, serve principalmente para títulos destaques, em alguns casos para links. Pense na paginação, nem muito, nem pouco. Saiba dosar. Evite excesso de hyperlinks dentro dos textos. O usuário se perde, abrindo muitos links. Evite blocos de texto muito longos, sem parágrafo. Um grande texto blocado se assemelha a um emaranhado de palavras. O usuário facilmente perderá o fio da meada e precisará recomeçar do zero. 3.1.6 - Experimentação e Experiência Estética Pessoal, nesse ponto, você pode imaginar que estamos podando as possibilidades de inovação ao criarmos interfaces. Isso não verdade. Se você observar, quando um designer cria, por exemplo, um carro conceito, ele cria a partir de princípios da física, da engenharia. Um carro não pode ser simplesmente bonito, tem que ser seguro, confiável, ter uma boa mecânica, aerodinâmica. Quando criar uma interface, você deve encarar da mesma maneira. Estude o usuário, entenda seus hábitos, suas necessidades e até seus desejos. Entenda primeiramente, a UTILIDADE da interface e depois procure a sua definição de usabilidade para o que vai planejar e criar. A interface é também uma experiência estética, mas não pode ser apenas isso. Assim, toda vez que se deparar com a pressão ou o desejo irresistível de implementar uma nova tecnologia multimídia, por exemplo, analise o impacto cuidadosamente. O conceito de inovação passa também pela usabilidade, já que ela é uma medida do sucesso do seu trabalho no desenvolvimento d e interfaces. 3.2- Usabilidade + Webwriting Bom, aqui vou pegar meus amigos arquitetos de informação na veia. Notem que eu sempre vou bater na mesma tecla: 3.2.1 Hierarquia de conteúdo; 3.2.2 Taxonomia; 3.2.3 Volume de informação em cada tela; 3.2.4 Clareza e pertinência da informação apresentada. E aí estão as variáveis da usabilidade na arte do webwriting. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 7. Thais Campas – A.I. Sr./ UX expert Vamos falar sobre cada uma delas. Antes, claro, uma pequena e rápida introdução. Sob o ponto de vista, digamos de um redator, vamos dizer que a primeira preocupação com o texto online é o fato de que ele é um hipertexto. Um hipertexto é por definição um texto que contem links, janelas, aberturas para outros textos. É um texto composto por outros textos. O que se pode aprender a partir dessa primeira reflexão é simples e básico. Nas mídias tradicionais, o texto é basicamente linear. Na Internet, esse paradigma é quebrado. Eu posso navegar pela malha de informação da forma como eu desejar. Posso literalmente “ler” um texto a partir de sua conclusão. Com o recurso de um banco de dados, por exemplo, eu posso resgatar uma informação ou reconstituir um fato de forma não linear, através da busca por palavra-chave ou pela data de publicação. Portanto, de cara, fica claro que estamos afetando a eficácia e eficiência da informação quando redigimos o hipertexto. Ok? Não é a toa que muitos redatores se tornam arquitetos de informação e especialistas em usabilidade. A questão agora é: quais seriam os pontos, as variáveis da técnica de webwriting (que nada mais é do que “escrever para Web”) que afetam a usabilidade do texto na Internet? São exatamente os pontos que citamos acima, quatro aspectos que você deve ter mente, durante o planejamento e a produção de um conteúdo online. 3.2.1 Hierarquia de conteúdo Em termos de redação, eu devo oferecer uma lógica de navegação ao usuário. O que seria essa lógica? Seriam os conteúdos de primeiro, segundo, terceiro nível e etc. Os usuários devem partir da sua “sugestão” de menu ou da sua ordem de importância dos conteúdos. Como uma lógica possível, posso propor a vocês que partam do mais genérico ao mais detalhado. E vou um pouco mais além: construam estruturas lineares e engessadas para os conteúdos online e “quebrem” essas estruturas da mesma forma que um escultor molda e talha sua os detalhes de sua obra. Vocês verão que aos poucos é possível flexibilizar a navegação e o hipertexto até que ele chegue num formato ideal. O que seria esse “formato ideal”? Um formato com instâncias de informação bem estruturadas, intuitivas e lógicas. A informação fundamental e urgente em primeiro plano, a informação por interesse em segundo plano e detalhes sobre cada interesse em terceiro plano. Difícil? Não, pessoal, basta olhar para um site institucional básico e você verá que a fórmula é consagrada. Ex: Observe um site institucional qualquer que mantenha a seguinte estrutura, com cinco primeiros níveis: Conteúdos de primeiro nível: 1-Empresa; 2-Produtos; 3-Serviços; 4-Fale Conosco; 5-RH Conteúdos de segundo nível: 1-Empresa 2-Produtos 1-1-História; 1-2-Missão; 1.3-Executivos 2-1-Notebooks; 2.2-Servidores; 2.3-Roteadores 2.4-Desktops 3-Serviços 4-Fale Conosco (telefone e email) 3.1-Manutenção; 3.2-Redes Wifi; 3.3-Rede cabeadas 5-RH 5.1-Seu currículo; 5.2-Oportunidades Repare que eu estou detalhando a informação de acordo com o nível e especificidade do interesse do usuário. Repare que no ter ceiro nível, eu tenho diversas opções em produtos, por exemplo. Posso separar os equipamentos por marca, posso estabelecer uma busca por alguma particularidade do equipamento e até pelo preço. A técnica para se criar hierarquias de conteúdo mais eficazes, vocês já conhecem: é o CARD SORTING. Ao criar as hierarquias de conteúdo, não se dispersem: engessem e posteriormente flexibilizem a navegação, criando atalhos, c onteúdos de reforço e etc. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 8. Thais Campas – A.I. Sr./ UX expert Bom, o que eu quero deixar claro para vocês é que as hierarquias de conteúdo não existem só nos menus. Elas existem também dentro do texto, e como estratégia de chamadas para a Home Page, que é a página de abertura de um site. As técnicas de titulação, de criação de chamadas e leads obedecem também a uma hierarquia da informação que eu estabeleço para o site como um todo. Se vocês seguirem regras básicas, verão que isso evita “derramar” na cabeça do usuário informação repetida e confusa. Vamos, lá, para colar na geladeira e ler todos os dias: Construa parágrafos pequenos, com idéias centrais completas, ou seja, apenas um bloco de informação por parágrafo; Basicamente pouca informação por parágrafo Não exagere nos hiperlinks dentro do texto. Evite colocar hiperlinks e links para informações adjacentes logo no início do texto ou em momentos em que o seu objetivo é justamente manter a atenção do usuário até o final do texto. Tenha em mente que navegar na Internet é como ler um livro ou uma biblioteca inteira de forma NÃO linear. O sentido da leitura é construído pelo usuário. A tipografia tem que se harmonizar com a hierarquização da informação. Construa e mantenha normas de publicação tais como: destaques para a home, menus, hiperlinks dentro e fora do texto, leads, posicionamento das imagens e legendas. Lembre-se também de que o texto é antes de tudo uma imagem que será decodificada pelo usuário. Esta imagem deve ser clara e coerente com seu significado. Preste atenção nas cores das fontes e na pontuação. Não utilize linguagem coloquial, gírias e abreviações somente porque escreve para Internet: respeite as normas gramaticais. Recursos de linguagem somente para objetivos muito específicos e em contextos que justifiquem tal uso. 3.2.2 Taxonomia Taxonomia, em poucas palavras, é a nomenclatura ou regra para criação da nomenclatura de menus, links, botões. Simples e direto: os nomes que você dá aos links e botões de um site, por exemplo. Se você entendeu e aplicou uma boa metodol ogia de Card Sorting, não é preciso estender o assunto. Se não aplicou o Card Sorting, talvez seja a última chance de fazê-lo antes de sofrer as conseqüências de um possível deslize quanto à usabilidade das interfaces que planejou e que agora já estão em fase de produção. Não há muito mistério, vamos colocar a técnicas básicas e algumas recomendações para uma taxonomia correta, sem risco para suas metas de usabilidade: A nomenclatura de links, botões, comandos e menus deve obedecer ao contexto do projeto e à sua identidade e finalidade; Cuidado com jargões técnicos, nem todo mundo tem o mesmo nível ; Cuidado com regionalismos e gírias, vivemos num mundo globalizado, você pode restringir o alcance de seu projeto, sem que haja uma intenção explícita de fazê-lo. A nomenclatura deve fazer parte do repertório lingüístico e cultural do grupo de usuários para quem estou planejando a interface; A nomenclatura deve ser pertinente e intuitiva, principalmente se indica ações ou comandos a serem executados. Evite redundâncias de nomes em uma mesma hierarquia de botões, como por exemplo: >Agenda e >Cronograma. Ou >Calendário e >Agenda. Você pode achar que são coisas distintas, mas alguns usuários usam a denominação de um com a identidade e funções do outro. Esse tipo de “percepção” e sensibilidade você pode ter quando aplica o Card Sorting. Lembre-se de que a mente do usuário busca semelhanças para encontrar familiaridades e, portanto, certo conforto cognitivo nas interfaces. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 9. Thais Campas – A.I. Sr./ UX expert A taxonomia é imprescindível na criação de comunidades (diga-se de maneira geral para as INTERFACES SOCIAIS) porque ela própria é, digamos um produto cultural da comunidade de usuários em questão. E lembre-se: a mente humana é preguiçosa, ela busca aquilo que é conhecido, se não for conhecido há dois caminhos: (a) ignorar/desprezar OU (b) estranhar/pesquisar. A maioria das pessoas, infelizmente opta por (a). Para pregar na geladeira: Em taxonomia, vale a lei do menor esforço. 3.2.3 Volume de Informação em cada tela Muito simples: cuidado com a poluição visual em cada tela que cria. Não faça o usuário sofrer para encontrar o que deseja. Algumas vez es, criar mais tópicos é preferível à concentração de um grande volume de informação e comandos em uma única tela. Se você planejou um formulário, que exige que o usuário cumpra várias etapas de preenchimento, por exemplo, atenha-se à sua análise de tarefas. Cada tarefa deve ser executada preferencialmente em uma tela. Nem sempre isso é possível, mas de uma maneira geral, o número de tarefas deve ser pertinente com o número de telas. Também é uma boa hora para definir o que realmente deve estar presente na interface, na tela, em determinado momento. Fiquem atentos para o fato de que flexibilizar excessivamente as opções de navegação, logo no começo da produção das interfac es, pode poluir e confundir a seqüência de comandos. No caso da Web, fiquem atentos ao tamanho das fontes x resolução da tela e à barra de rolagem vertical no navegador. Teste as interfaces em várias resoluções, mantenha espaços entre os blocos de informação e os hierarquize intuitivamente pela posição na página. Já mostramos antes, mas vale relembrar: Também evitem o excesso de banners e não confundam propaganda com informação jornalística ou pertinente ao site. Lembrem-se de que cores e fundos também são informação e vocês devem utilizá-las estrategicamente em favor dos objetivos do projeto. Por vezes, oferecemos muito mais do que o usuário gostaria como primeiro passo de navegação e acabamos perdendo o foco da abordagem do conteúdo. Aqui, o principal é evitar estressar o usuário e desviar sua atenção. Muitos problemas de usabilidade são gerados por essa “miopia” da equipe de manutenção e desenvolvimento. Nunca vejam na interface produzida uma reprodução de seus próprios modelos de organização mental. Digamos que na “infância da Internet” essa falta de sensibilidade era o grande fator crítico para a falta de usabilidade nos sites. Essa era e digamos que ainda é a grande armadilha para os projetistas de interfaces e sistemas. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 10. Thais Campas – A.I. Sr./ UX expert E para não dizer que não mencionei as chamadas interfaces “duras”, quantos comandos do controle remoto da televisão e do DVD vocês realmente usam? Os comandos estratégicos estão corretamente posicionados por hierarquia visual, como indica o quadro acima? Pois é.... Pois bem, pessoal, aí está nosso pequeno check list, para saber se vocês andam abusando do volume de informação no planejamento de sites ou aplicativos: Você tem barras de rolagem horizontais? Elimine. Você tem barras de rolagem verticais muito extensas logo na primeira página? Elimine ou diminua bastante, editando o conteúdo. Você criou blocos de informação? Se não criou, crie e delimite graficamente. Não varie cores e fontes indiscriminadamente e sem que haja uma razão lógica para isso. Delimite áreas de propaganda e outros tipos de conteúdo. Teste as resoluções de tela. Esse check list é muitíssimo básico e curto, mas igualmente importante. Façam dele uma rotina em todos os seus trabalhos. 3.2.4 – Clareza e pertinência da informação apresentada Esse item é na verdade um resumo de tudo o que explicamos logo acima. Se vocês seguiram todas as etapas, vocês estão com 90% da missão cumprida. Agora, estamos fazendo um ajuste fino de tudo o que já produzimos. Chegou a hora de olhar o conjunto e verificar a coerência da navegação, da apresentação da informação e se nos mantivemos focados no projeto e no escopo original. Clareza e pertinência da informação apresentada significam: Correta padronização do leiaute e da tipografia (fontes – cores e tamanhas); Hierarquização correta da informação; Taxonomia adequada aos objetivos do projeto, ao tipo de interface e contexto, bem como repertório do usuário; Volume ideal e priorização da informação apresentada; Correta delimitação de espaços entre os tipos de informação: banner, informação jornalística, institucional ou comercial e etc. Linguagem adequada à comunidade de usuários prevista para o projeto. Com tudo isso, vocês serão claros e pertinentes na mensagem que desejam passar e, sobretudo, nas solicitações ao usuário. É hora de conferir novamente 2 aspectos: Se a análise de tarefas continua pertinente com o número de telas produzidas; Se as mensagens de erro e confirmação do sistema estão coerentes, são suficientes ou até se estão em excesso. Feito isso, vocês têm o ajuste fino do seu projeto. 3.3 - Usabilidade + Interface Se você chegou até aqui, pouco há a acrescentar. Fez um bom planejamento, possui uma estratégia de usabilidade com metas estabelecidas? Pois chegou o momento de “validar” tudo isso com um pequeno, porém estratégico: Verifique a coerência da linguagem e da direção de arte. Você está transmitindo as “mensagens” que realmente deseja? A direção de arte está coerente com o wireframe e com a documentação de A.I.? Se houve alteração, você deve documentar no wireframe e nos mapas! Os recursos de interface (imagens, áudio, vídeo) podem ser suportados pela infra-estrutura tecnológica alocada e planejada para o projeto? Assim que possível, execute as “key-features” em análises heurísticas e testes com usuários. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 11. Thais Campas – A.I. Sr./ UX expert E finalmente: evite mudanças em pontos estratégicas sem uma justificativa razoável. Mudanças durante a execução do projeto de interface normalmente são solicitadas pelos futuros gestores e causam um descontrole crítico no cronograma e em todo o planejamento de usabilidade. 3.4 - Usabilidade + Infra-estrutura tecnológica Que seja fácil de usar e... funcione! O maior desafio hoje, para as empresas cujo core business esta na oferta de tecnologia, é justamente “entregar o que promete” . Embora existam inúmeros testes, metodologias e plataformas que permitem projetar a infra-estrutura e apontar gargalos, ainda assim muitos sites, sistemas e aplicativos naufragam neste último desafio. Para que vocês entendam melhor, aí vai uma analogia bem simples: Quando um engenheiro projeta uma ponte, precisará fazer uma série de cálculos e ter certeza de que a estrutura suportará o impacto de seu uso ao longo do tempo. Há neste caso, uma série de variáveis implícitas em situações que serão levadas em conta. Com o desenvolvimento de sites, softwares e sistemas, a situação é semelhante. Também devemos chegar às variáveis que definem o impacto de uso na infra-estrutura alocada, que é composta neste caso por outros sistemas, máquinas e serviços de conectividade e hospedagem fornecidos por terceiros, sendo bem sintético. “Os recursos que eu disponibilizo para o meu usuário devem ser compatíveis com a infra-estrutura que eu calculei. Isso significa garantir que eu vou entregar o que prometi.” O quesito infra-estrutura é particularmente importante quando oferecemos serviços convergentes tais como: acesso a conteúdos e operações via celular, streaming de vídeo/ áudio e etc. Aqui vale uma observação que muitos gestores de projetos ignoram ou esquecem: incluam nos seus testes de usabilidade as operações necessárias para que o usuário acesse este tipo de recurso mais avançado e que exija familiaridade com mais de um tipo de interface. Um exemplo bem atual: serviços de conteúdo online e de internet banking para celulares e computadores de mão. Também é interessante “estressar” o sistema, simulando número de acessos simultâneos a um site, por exemplo. Operações críticas como a finalização de compras online durante uma promoção de vendas seria uma situação interessante para um teste de stress. Quais as respostas a um teste deste tipo, citando as mais importantes? Tempo de resposta do sistema ao usuário; Operações não completadas; Número e tipo de erros; Impacto em toda a infra-estrutura que suporta o site. Simples, e bem assertivo. Você vai saber até quando e até quanto sua infra-estrutura é capaz de “entregar o prometido”. Problemas que afetam o usuário podem sim ser previstos. Posso dimensionar promoções, lançamento de novos serviços e recursos. Posso inclusive, planejar a expansão de um projeto. As metodologias e certificações, hoje praticamente obrigatórias nas empresas de T.I. são impulsionadas por essa necessidade: a garantia de fornecimento do serviço contratado. Gerentes de T.I. estão familiarizados como o termo S.L.A. (Service Level Agreement) que determina o compromisso de manter entregas mínimas para manter a qualidade do serviço contratado entre, por exemplo, um data center e o Departamento de TI de uma corporação. Complicado? Nem tanto. Se refletirmos o quanto a Usabilidade da Interface depende de forma intrínseca da Qualidade da infra-estrutura, concluímos que o correto dimensionamento tecnológico do projeto vai garantir a EFICÁCIA e até mesmo a SEGURANÇA das operações do usuário. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 12. Thais Campas – A.I. Sr./ UX expert Vou sugerir um check list bem genérico, mas com aspectos que muitas vezes são esquecidos pelos gestores de projetos online: a) Quais os recursos disponíveis para cada tipo de usuário? (vídeo, transações em ambiente seguro...) b) Qual o ambiente de acesso dos meus usuários? (PC, notebook, celular, conexão rápida, discada...) c) Ofereço recursos de mobilidade? d) Prevendo a implantação de recursos mais avançados, meu sistema suportará a adição de tecnologias de acesso emergentes? e) Estou atendendo a segmentos horizontais ou verticais? f) Vou utilizar recursos avançados de busca e banco de dados? g) Volume de acesso - possuo uma previsão? Qual? h) Discriminar operações críticas: necessito de alta disponibilidade, espelhamento de servidores ou recursos de segurança da informação tais como criptografia de dados? i) Devo investir em recursos especiais e equipe para administração e manutenção dos serviços ao usuário? j) Meu sistema exige suporte técnico, simples ao usuário final ou avançado? Este check list pode ficar bem maior e variado. Com certeza, vai interferir nas metas de usabilidade para todos os usuários. Entendam o seguinte: o que a interface promete, o sistema tem que entregar. Seguindo esta norma, vocês podem validar e homologar suas escolhas em termos de investimento em infra-estrutura. É claro que o processo inverso também ocorre quando criamos interfaces para sistemas já concebidos. Em ambientes corporativos isso é bem comum, pois frequentemente vemos que os softwares impõem novas metodologias de trabalho aos usuários corporativos. Ou seja, sistemas se impõem à cultura organizacional. E é bem fácil verificar o quanto este fato afeta sua usabilidade. Estamos na era dos sistemas customizáveis, dos web applications que oferecem recursos e interfaces sob medida. Com certeza, é uma vitória do usuário que entra como variável imprescindível ao planejamento, por exemplo, dos grandes sistemas corporativos. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 13. Thais Campas – A.I. Sr./ UX expert PERGUNTAS - MÓDULO III (teste seus conhecimentos!) 1- Assinale a alternativa falsa: 1. Uma interface social (IS) tem que necessariamente ser mediada por uma IHC. 2. O windows (sistema operacional da MS) possui várias interfaces sociais. 3. Convergência é uma característica ou propriedade exclusiva das interfaces sociais. 4. A IHC deve ser eficiente, ou seja, ser adequada ao modelo mental do usuário. 5. Recursos de interatividade e convergência são conceitos há muito tempo buscados pelos meios de comunicação tradicionais, como o rádio, por exemplo. 6. Os navegadores de internet são uma das primeiras interfaces sociais dos computadores pessoais. 7. A interface do iPOD é interativa e convergente. 2- Assinale a alternativa verdadeira: 1. Toda a informação conclusiva produzida pelo indivíduo é unicamente baseada na cor. 2. O site deve utilizar exclusivamente as cores do logo da empresa sob pena de perder a identidade perante os usuários. 3. O benchmark pode, na grande maioria dos casos, substituir o Card Sorting na definição da hierarquia dos menus. 4. É possível flexibilizar o hipertexto logo de primeira, criando várias alternativas de navegação que não necessitam serem testadas ou validadas. 5. As pessoas levam exatamente 1 minuto e 30 segundos para produzir julgamentos pertinentes e racionais, de acordo com seus padrões culturais e nível social, sobre algo que está sendo por elas observado. 6. Nosso cérebro possui a capacidade de “barrar” informações que atuam como “ruídos” de comunicação como um processo quase consciente. Com isso, muitas vezes durante um teste de usabilidade, nem sempre os usuários são objetivos em apontar aquilo que os incomoda. 7. Na internet, é possível ler uma história de forma não-linear, por isso não devemos nos preocupar excessivamente com a coesão de todo o conteúdo, pois os usuários já se acostumaram a reconstruir a informação, a partir da quebra do paradigma da linearidade. 3- Quais dos seguintes produtos apresentam atualmente a característica de “convergência” (união de recursos de mídia e comunicação até então separados): 1. High Definition TV 2. Aparelho de DVD portátil 3. Celular. 4. Tablet(s) 5. GPS 6. Smart Phone 7. iPod 4- Dentre os elementos de design abaixo, qual deles perturba mais o usuário? 1. Barra de rolagem horizontal. 2. Letras brancas em fundo escuro. 3. Excesso de hiperlinks. 4. Cores mal aplicadas no layout. 5. Informação central “dispersa” em várias janelas e links. 6. Informação linear, concentrada em uma única página. 7. Links quebrados. UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados
  • 14. Thais Campas – A.I. Sr./ UX expert 5- Assinale as frases em que há uma correta relação entre causa e efeito. 1. Você não deve planejar mais que três níveis de associação para chegar à informação central que deseja passar ao usuário, pois os menus “escadinha” geram fadiga ocular no usuário. 2. O conceito de inovação está intrinsecamente relacionado à usabilidade, pois atende as metas do plano de negócios e estratégias de marketing. 3. Uma IHC é considerada uma interface social se e somente se possuir recursos de comunicação interpessoal instantânea. 4. Se a primeira conclusão sobre um objeto ou indivíduo é produzida no subconsciente do usuário, nem sempre a análise heurística feita por um especialista será suficiente para levantar problemas de usabilidade de um projeto a ser lançado. 5. Como entre 62% e 90% da informação conclusiva é produzida pelo indivíduo a partir da cor, então a legibilidade de uma página de internet é um fator de importância reduzida na primeira visita do usuário a um site. 6. A IS deve obedecer a padrões culturalmente e coletivamente aceitos pelo grupo de usuários a que se destina, pois ela deve ser suficientemente flexível para todos. 7. A IHC deve ser altamente flexível, pois deve ser adequada ao modelo mental do usuário (persona) UPA member 8922 – since 2004 – thcampas@gmail.com – 5511 9498-9803 *todos os direitos reservados