Arquitetura de Informação e Usabilidade na Globo.com
1.
2. Quem sou Renato Rosa, 28 anos, 9 de internet Arquiteto de informação – Globo.com Núcleo de jornalismo Idealizador do NPI Núcleo de Projeto de Interface da AG2 Membro do IAI Information Architecture Institute
5. Conceito de usabilidade É a facilidade de uso que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa específica.
6. “ Usabilidade é a capacidade, em termos funcionais humanos, de um sistema ser usado facilmente e com eficiência pelo usuário.” - Shackel (1993) “ Usabilidade está diretamente ligada ao diálogo na interface. É a capacidade do software em permitir que o usuário alcance suas metas de interação com o sistema” - Scapin (1993)
7. Ergonomia Identifica fatores humanos referentes à eficiência de utilização de sistemas por parte dos usuários. Ergonomia
8. IHC Interação Humano-Computador (IHC) é uma área de pesquisa dedicada a estudar os fenômenos de comunicação entre pessoas e sistemas computacionais. Ergonomia IHC
15. Desenvolvê-lo com as premissas centradas no usuário, deixá-lo o mais próximo do seu modelo mental. Orientação ao usuário
16.
17. Em IHC, nosso desafio é contribuir para diminuir essa frustração, projetando interfaces intuitivas , seguras e confiáveis para seus usuários. Em IHC
18. Objetivo final da usabilidade é que os usuários fiquem livres para se concentrarem naquilo que precisam. Resumindo
26. Usabilidade em interação 1. Fácil aprendizagem O usuário consegue rapidamente explorar o sistema e realizar suas tarefas 2. Efetividade Aumento de produtividade em função da curva de aprendizado 3. Memorização Os usuários precisam memorizar as suas tarefas sem sobrecarregar suas interações
27. 4. Flexibilidade O sistema e a interface devem ser flexíveis aos erros dos usuários 5. Eficiência Menos trabalho, mais resultado 6. Satisfação Conforto, segurança e felicidade subjetiva Usabilidade em interação
28. Se um site for difícil de usar, Porque usabilidade é importante? o usuário sai. Se a homepage não for clara o suficiente para mostrar o que a empresa oferece e o que é possível fazer, o usuário também sai. Se o usuário se perder, ele sai. Se demorar para carregar, ele definitivamente sai.
31. O que é AI? Arquitetura de informação não trata de mapas ou diagramas, mas de COMUNICAÇÃO. Organiza a informação de um ambiente de forma que seus usuários encontrem a informação que procuram.
32. O que é AI? quadrados verdes círculos laranja triângulos azuis blocos oliva caixas sólidas bolinhas de gude esferas pequenas figuras ocas montanhas altas
33.
34. Estudar usuários? Segundo Nielsen (2004) Um erro nos sites e intranets é estruturar a informação baseado em como a empresa enxerga a sua informação. O que é AI?
35. ROSENFELD e MORVILLE O que é AI? Contexto Objetivos da organização, políticas, cultura, tecnologia e recursos humanos Usuários Audiências, tarefas, necessidades, comportamento de busca de informação, experiência, vocabulário Conteúdo Documentos, formatos/tipos, objetos, metadados, estrutura existente
36. Tradicionamente, um arquiteto de informação está envolvido com as seguintes etapas: 1. Pesquisa com o usuário O que as pessoas precisam saber e encontrar em um website? 2. Definição de conteúdo e funcionalidades Textos, imagens, buscas, menus, botões, etc. O que é AI?
37. Tradicionamente, um arquiteto de informação está envolvido com as seguintes etapas: 3. Desenvolvimento e organização de esquemas Como o site será dividido e organizado? Como o usuário navega pelo site? 4. Desenvolvimento de interface Integração com o designer gráfico. O que é AI?
38. Quem trabalha onde? Escopo Interfaces Direção de arte Informação Interação Apresentação Conteúdo Estrutura Arquitetura Interação Interfaces Componentes Design gráfico Branding
39. Escopo Interfaces Direção de arte Informação Interação Apresentação Conteúdo Estrutura Arquitetura Interação Interfaces Componentes Design gráfico Branding Arquiteto de informação Quem trabalha onde?
40. Direção de arte Informação Interação Apresentação Conteúdo Estrutura Arquitetura Interação Interfaces Componentes Design gráfico Branding Designer de interação Quem trabalha onde?
41. O que o AI entrega? O mais típico deliverable do arquiteto de informação é o sitemap : a estrutura de informações do website. O AI define as opções de organização dos grupos de informação, tentando suprir as necessidades dos usuários e os objetivos do negócio.
42.
43. Lista de funcionalidades Arquitetura (ou sitemap ou fluxograma) Descrição funcional de telas Lista de keywords Lista de paths (ou fluxos) Check-list de padrões O que o AI entrega?
44.
45. Devemos seguir as convenções de navegação. As pessoas gastam mais tempo em “outros” sites, com isso, tudo que fosse uma convenção e utilizado na maioria destes “outros” sites seria fixado de forma muito forte em suas mentes. Modelo mental Design de interação
46. Marca (Link p/ a Home) Buscar Navegação global Navegação de rodapé Navegação local Conteúdo global e contextual
52. A maioria das pessoas só pode memorizar de 4 a 7 pequenos fragmentos diferentes de informação na memória de curto prazo. Organização é fundamental Fale com as pessoas que formam o seu público alvo e coloque os itens e serviços que elas desejam nos lugares de maior destaque da sua tela. Você sabia que...
53.
54. O que devemos saber Isso porque pensamos hierarquicamente. Hot Spots (Eyetrack, 2004).
62. Conteúdo, experiência e flow não são conceitos acadêmicos, são aplicações em questão práticas que melhoram a qualidade de vida. A boa experiência é aquela que faz o usuário esquecer o resto do mundo. Sua atenção está voltada aos objetivos alcancáveis. É o mais próximo que poderemos chegar de felicidade. Usabilidade em conteúdo, experiência e flow
64. Web 2.0 é a rede como uma plataforma que interliga todos os dispositivos conectados. O'REILLY Os sites Web 2.0 devem estimular os usuários a fornecer conteúdo e aplicar regras de direitos autorais flexíveis, que permitam a utilização deste conteúdo por parte de outros usuários. Além de desenvolver aplicações leves e fáceis de serem mexidas. Estas características criam um efeito de rede e uma “ arquitetura de participação ”, o que torna a experiência do usuário mais rica. WEB 2.0
65.
66.
67.
68. Globo.com Equipe de Branding Agência Dept. Criação Equipe de Design de Interface Equipe de AI O processo de trabalho na Globo.com Foco na experiência do usuário
69. O processo de trabalho na Globo.com A multidisciplinaridade já começa no Departamento de Criação in-house. Ele é responsável por todos os projetos da empresa, mesmo aqueles que eventualmente são terceirizados. Os projetos estratégicos e mais importantes são sempre feitos internamente, enquanto que os terceirizados contam com o acompanhamento constante de profissionais da equipe.
70. O processo de trabalho na Globo.com A equipe de Arquitetura da Informação faz o levantamento e categorização de todas as informações que existirão nos sites. Eles estimam a quantidade de páginas, o conteúdo e funcionalidades existentes em cada uma delas e importância de cada informação presenta na tela.
71. O processo de trabalho na Globo.com Além da arquitetura da informação propriamente dita, o grupo é responsável pelo documento de descrição de telas , que explica o funcionamento de cada elemento da página. Esse documento é usado tanto pelos designers de interface e branding como pelos profissionais de tecnologia . Os arquitetos da informação normalmente têm background em jornalismo e comunicação, biblioteconomia ou psicologia.
72. O processo de trabalho na Globo.com Já a equipe de Design de Interface se preocupa com a Usabilidade e Interação Humano-Computador de tudo que é projetado na Criação, na consistência entre todos os produtos. São os responsáveis pela facilidade de uso, facilidade de aprendizado, memorização, tratamento de erros e até mesmo pela agradabilidade.
73. O processo de trabalho na Globo.com Ele projeta os wireframes , que são como uma planta-baixa do site, prevendo cada detalhe e funcionalidade que será utilizada. O nível de complexidade do desenho depende do projeto. O designer de interface normalmente tem background em Design, com ênfase em design de interação, de produto ou IHC.
74. O processo de trabalho na Globo.com Já a equipe de Branding foca seu trabalho no Design gráfico, na parte visual. Os profissionais de branding normalmente tem background em Design, com ênfase em comunicação visual ou publicidade e propaganda.
81. Como se avalia usabilidade? Avaliação heurística Teste de desempenho Eye-tracking Inspeção de padrões Pesquisa por questionários (surveys) Teste de usabilidade Checklist de guidelines Inspeção de funcionalidades Teste de usabilidade Teste de desempenho Protótipos de baixa fidelidade Card-sorting e entrevistas Avaliação de melhores práticas de usabilidade Teste de usabilidade Análise de logs de busca e comunicação
82.
83. Análise heurística (ou avaliação heurística) Especialistas em usabilidade avaliam a interface e suas funcionalidades a partir de guidelines e julgam se os aspectos estão de acordo com princípios de usabilidade reconhecidos (heurísticas). Criador das 10 heurísticas mais aplicadas no mundo.
84. Quando aplicar? Uma avaliação rápida da interface a partir de critérios básicos de usabilidade que pode ser realizada principalmente na fase de design e desenvolvimento , antes da realização de testes por usuários. Como aplicar? Especialistas com domínio de princípios de IHC ou fatores humanos . O conhecimento do especialista afeta a qualidade do teste. Análise heurística (ou avaliação heurística)
85. Número de recursos 3 a 5 especialistas. Pode-se estabelecer contextos (cenários) de uso e tarefas para servir de contexto para o teste. O que resulta Problemas da interface classificados por ordem de severidade e recomendações de design; heurísticas e critérios. Análise heurística (ou avaliação heurística)
86. Segundo Willis (2003), é uma técnica para compreender como o usuário agrupa informações dentro de um domínio. Os participantes organizam cartões representando tipos específicos de informação Card sorting
87. Card sorting Quando aplicar? No projeto de um novo site; Na criação de uma nova área do site; No redesign de um site. Como aplicar? Online ou em papel.
88. Número de recursos Acima de 6 pessoas (individual) ou 4-6 pessoas (por grupo) representativas do público-alvo do instrumento a ser avaliado. Um facilitador, e observadores. O que resulta Arquitetura de informação Análise de similaridade Card sorting
89. Testes de usabilidade Requer um protótipo funcional ou sistema, na qual são realizados testes de tarefas com os usuários, medições de desempenho, complementados com observações e questionários.
90. Quando aplicar? Quando precisarmos testar um ou mais sistema(s) ou protótipo(s)com o objetivo de assegurar um grau de facilidade de uso, satisfação e utilidade de seus componentes. Como aplicar? Teste de laboratório, presencial, com ambiente controlado; protocolos e questionários. Testes de usabilidade
91. Número de recursos Mínimo de 20 usuários representativos , considerando a avaliação de três sites; facilitador do teste, observadores. 60 a 90 minutos, por usuário. O que resulta Ferramentas de registro de logs, vídeos, computadores com o mesmo padrão. Análises estatísticas comparativas e representações de necessidades. Testes de usabilidade
93. A Globo.com foi a primeira empresa da América Latina a ter um Laboratório de Usabilidade in-house dedicado exclusivamente a esse tipo de pesquisa. CASE Globo.com
94. CASE Globo.com Premissas de produto Avaliação da criação Dados do call center Pesquisas com usuários + + + Dados de audiência + Roteiro de tarefas Lista de funções que devem ser testadas Teste Resultados tabulação de dados + Relatório + Propostas para melhoria do produto Melhorias no produto
95. Créditos Parte dos conteúdos dessa palestra foram baseados em publicações, livros e exposições dos seguintes autores / profissionais: Felipe Memória ( http://www.fmemoria.com.br ) Mônica Fernandes ( http://monicamcf.sites.uol.com.br/ ) Marcio Tristão ( http://www.mtristao.com )
96. Muito obrigado! Renato Rosa [email_address] [email_address] Entre em contato para maiores informações.