Modelo Conceitual e Usabilidade. Exercício Apresentação grupos –Diferença Mídia Impressa e Mídia Tradicional.

Apresentação em tema: "Modelo Conceitual e Usabilidade. Exercício Apresentação grupos –Diferença Mídia Impressa e Mídia Tradicional."— Transcrição da apresentação:

1 Modelo Conceitual e Usabilidade

2 Exercício Apresentação grupos –Diferença Mídia Impressa e Mídia Tradicional

3 Design centrado em usuários Design é baseado em: –Habilidades e necessidades reais do usuário –Contexto –Tarefas Regra de ouro: Conheça seu usuário Desafio: atenda aos objetivos do que se constrói atendendo seus usuários.

4 Metodologia para Construção de Sites Conceituação –Modelo Conceitual Concepção –Arquitetura de Informação –Desenvolvimento da linha gráfica e telas tipo –Desenvolvimento do estilo editorial – tom de voz Implementação –Desenvolvimento de Conteúdo –Diagramação + HTML –Projeto de TI Integração e aceite Publicação Monitoração e-performance

5 Implementação Abordagem Participativa Estratégia Visão – Missão - Objetivos Arquitetura de Informação Look & Feel Arquitetura + Projeto de IT Conteúdo Back office infra-estrutura, parcerias,etc Integração Testes Aceite Publicação Gerenciamento de Projetos Boas Práticas / Guideline Modelo de negócios Modelagem Conceitual Operação e Manutenção Piloto

6 Exercício Imagine que você fosse construir uma casa –Abstraia quais seriam as ações a serem realizadas nas etapas de: Conceituação Concepção Implementação Teste

7 Exercício Conceituação (objetivos, necessidades, restrições) –Que tipo de moradia desejo (prédio, casa) –Qual a distância que estou disposto a morar do centro de São Paulo –Quantas pessoas irão morar na casa –Existem restrições (crianças, idosos, deficientes) –Qual o meu orçamento –Vou construir (quanto tempo tenho) ou comprar pronta –Quais as referências que tenho (revistas, moradias de amigos, etc)

8 Exercício Concepção (mapeamento dos conceitos em modelos palpáveis) Que espaços gostaria de ter –Amplitude de cada um deles –Proximidade de espaços –Privacidade Qual o estilo que desejo –Acabamentos / decoração / iluminação / pintura

9 Exercício Implementação (tornar o modelo concebido realidade) –Obra propriamente dita –Implementação não é possível sem concepção –Concepção sem conceituação pode levar a espaços inabitáveis –Percebam: profissionais envolvidos não podem construir a casa sem obter informações dos donos a cada etapa (abordagem participativa)

10 Pecebam... –Percebam: profissionais envolvidos não podem construir a casa sem obter informações dos donos a cada etapa (abordagem participativa) –Multi-disciplinar –Não é possível realizar implementação sem concepção concepção sem conceituação

11 Usabilidade

12 Por que usabilidade é importante em e-business? Número de Computadores na Internet 72,400,000 0 10,000,000 20,000,000 30,000,000 40,000,000 50,000,000 60,000,000 70,000,000 80,000,000 19831984198819911992199419972000 Industry Standard 20000 Interfaces amigáveis

13 Definição de Usabilidade Norma ISO 9241: Usabildade como sendo: extensão que um produto pode ser usados por usuários específicos para atingir objetivos específicos, com efetividade, eficiência e satisfação, num determinado contexto de uso. Usabilidade é apenas uma dentro das várias questões tratadas em projetos centrados no usuário.

14 Design Centrado no Usuário usuários contexto ambiente objetivosdesejos Contexto tarefa Detalhe tarefa Fluxo tarefa Organização tarefa

15 Por que usabilidade é importante em e-business? Usabilidade está ligada à experiência do usuário –A interface revela a preocupação com as necessidades de informação do usuário –A estratégia de negócios não é visível, a interface é –Constrói confiança no usuário Sites estão a um click de distância entre sí –joy of use não apenas easy of use

16 Por que usabilidade é importante em e-business? Usability is a prerequisite for e-commerce success.....It doesnt matter how cheap the products are if people cant find them or if they get stuck on a step in the checkout process E-commerce user experience –NN/g

17 Por que usabilidade é importante em e-business? US consumers value convenience over price when shopping online. –Gartner G2 advises online retailers to focus on convenience in their marketing messages, and to keep ease of use, lack of complexity, and speed of transaction uppermost in their minds when revamping or developing retail sites.

18 Por que usabilidade é importante em e-business? Conforme pesquisas: índice de abandono de carrinhos é de 75% (fonte Vividence) índice de sucesso de usuários em sites de e-commerce é de apenas 54%. (tarefas: comprar um produto específicado, escolher e comprar um produto qualquer, conseguir auxilio. )

19 Por que usabilidade é importante em e-business? Causas do insucesso –54% relacionada a usabilidade (informação sobre produto, localização de itens, checkout, adição ao carrinho) –23% relacionadas a estratégia de venda (prazo de entrega, preço, estoque, custo relacionado a imposto e entrega) –12% relacionados ao cadastramento e a necessidade de informar dados pessoais –9% relacionado a problemas técnicos

20 Por que usabilidade é importante em e-business? Alguns estudos revelam que melhoria na usabilidade pode aumentar as vendas de 100 a 400% (NN/g group) Pesquisas mostram que os usuários confiam mais em sites que possuem usabilidade alta (assumem que a facilidade se refletirá também no suporte) (NN/g group)

21 Por que usabilidade é importante em e-business? User centered approach –exemplos: Comparação entre itens (preço e especificações, pontos positivos e negativos) Recomendação de especialistas –Vendedores nas lojas reais, teoricamente, fariam este papel.

22 O que é usabilidade Atributos de um sistema interativo relacionados a: Facilidade de aprendizado Eficiência (fácil de usar): rapidez e percentagem de erros Memorização/reconhecimento Suporte a erros Motivação a usar o sistema (likeability) O que é não é usabilidade Sinônimo de funcionalidade Etapa final de processo após projeto construído Atributo exclusivo de design, arquitetura, conteúdo ou tecnologia Atributo antagônico a projetos visuais mais elaborados Usabilidade pode ser medida – entendimento necessita de especialista

23 Cuidados com Usabilidade no projeto AtividadeDescrição ObjetivosEntenda claramente os objetivos do produto para produzi-lo de forma usável PlanejamentoIntroduza no planejamento atividades relacionadas a usabilidade e testes com usuários nas várias etapas do projeto TécnicasAplicar as ferramentas e técnicas adequadas nas etapas adequadas do projeto, levando em conta o custo/benefício, Envolva-seColoque-se no lugar do usuário. Entenda as necessidades do mesmo. Envolva usuários no projeto, revisão e teste Preocupe-sePreocupe-se com a usabilidade final. Tome cuidado em consertar problemas de usabilidade que foram descobertos EspecialistasUse especialistas no assunto.

24 O que é um problema de usabilidade …qualquer coisa que interfira com a habilidade do usuário em completar suas tarefas de forma efetiva e eficiente. (Karat, 1992) …um aspecto do sistema e/ou demanda sobre o usuário que torna o sistema desagradável, ineficiente, oneroso ou impossível de permitir a realização dos objetivos do usuário em uma situação típica de uso. (Lavery et al, 1997)

25 Custo x Benefício A usabilidade parte da identificação dos objetivos estratégicos do site, verificando como pode contribuir para que eles sejam alcançados. Usabilidade não garante o sucesso de um projeto: antes de ser usável, o produto tem que ser útil Usabilidade possibilita benefícios reais, mas demanda custo, esforço e trabalho ROI pode ser medido através de mudanças de comportamento identificada nos logs, por exemplo, menor abandono de shopping carts, número de tarefas completadas, diminuição de chamadas no call center, aumento de vendas e probabilidade de outras vendas pelo mesmo usuário, etc.

26 Metodologias de trabalho centrados no usuário Investigação Focus Group Pesquisas quantitativas Investigação contextual Pesquisa etnográfica Pesquisas e questionários Diário de uso Captura de tela Inspeção Avaliação heurística Percurso cognitivo (cognitive walkthrough) Testes com usuários Protocolo de verbalização Método de co- discoberta Paper and Pen Simulation Paper Prototype Field Studies (alfa ou beta testes) Follow UP Studies Protocolo de questões Medição de performance Eye-tracking

27 Metodologias para investigação Focus Group Qualitativa, empregada bem no início dos projetos com potenciais usuários, de forma a identificar conceitos Em alguns casos é usada para identificar ou confirmar preferências ou necessidades de um grupo, confirmar aceitação. Levantar aspectos inaceitáveis ou insatisfatórios, e como melhorá-los Os conceitos podem ser apresentados em papel, na forma de storyboards, ou protótipos em telas, ou em plástico Sempre é realizada em grupo Pesquisas Quantitativas Analisar numa amostra significativa de público preferências. Não entra em aprofundamento como o focus group. Linguagem deve ser cristalina e melhor se utilizada no início do projeto Permite a generalização de um achado para um popilação inteira. Ex: Nielsen rating usa 1.500 pessoas para generalizar conceitos para milhões de pessoas e justificar investimentos de milhões de dólares em um produto

28 Metodologias para investigação Investigação contextual Método de entrevista de campo estruturada,mais próxima de descoberta do que de avaliação. O ambiente em que as pessoas trabalham realmente influencia como as pessoas utilizam um produto. Utilizada nos estágios iniciais de desenvolvimento Pesquisa etnográfica Metodologia de observação com origem na antropologia Consiste na observação de eventos em seu contexto natural (com observador ou câmera de vídeo) Principal vantagem: descobrir hábitos não revelados através de questionário

29 Metodologias de usabilidade: inspeção Avaliação heurística Técnica em que especialista julga cada elemento de uma interface de usuário de acordo com princípios estabelecidos de usabilidade. Em média, estatísticas apontam que 3 a 6 avaliadores conseguem detectar a maioria dos problemas. Quando: Em qualquer estágio, particularmente quando projeto já tem uma certa maturidade e estrutura fechada. Exemplo de lista de princípios: http://www.useit.com/papers/heuristic/heuristic_list.html

30 Metodologias de usabilidade: inspeção 10 Heurísticas de usabilidade de Nielsen 1.Visibilidade de status do sistema 2.Correspondência entre sistema e mundo real 3.Liberdade e controle do usuário 4.Consistência e padrões 5.Prevenção de erros 6.Reconhecimento ao invés de lembrança 7.Flexibilidade e eficiência de uso 8.Design e estética minimalista 9.Facilidade de recuperação de erros 10.Ajuda e documentação http://www.weinschenk.com/guidelinesdemo/default.html

31 Metodologias de usabilidade: inspeção Percurso cognitivo (cognitive walkthrough) Técnica de análise em que especialista constróem cenários de execução de tarefas a partir de uma especificação ou protótipo. A partir do cenário, o especialista pilota a interface, executando e escrutinando cada uma das funções, passo-a-passo, e anotando problemas. Quando usar: Estágios iniciais de desenvolvimento Exemplo TV1: análise baseada em cenário para encontrar falhas do projeto de Gerenciamento de Categorias da Unilever. Importante por se tratar de processo anteriormente off-line.

32 Tipos de testes de Usabilidade Baixa Fidelidade (Testes Exploratórios) Alta Fidelidade (Assesment and Validation tests) – usuários interagem com o sistema Profundidade do Teste Horizontal Vertical

33 Metodologias de usabilidade: testes Testes de usabilidade: conceito geral Experiências para se encontrar informação específica sobre um projeto Observação de usuários executando tarefas específicas com o produto, analisando quanto tempo se leva para executar uma tarefa ou quantos erros ocorrem ao longo da tarefa Baseado em objetivos específicos (não: quão usável é o produto; sim: qual a facilidade de preenchimento do formulário X) Pode ser gravado Normalmente ocorre debriefing depois Produção de relatório

34 Metodologias de usabilidade: testes Testes de usabilidade: elementos básicos Clarificar objetivos do teste Escolher os usuários da amostra preferencialmente de forma randômica Possuir um script pré definido e preferencialmente previamente testado Representação do que deve ser testado Observação dos usuários utilizando a representação do produto e questionamento dos mesmos Resumo qualitativo e quantitativo dos resultaods coletados Recomendações de melhorias

35 Metodologias de usabilidade: testes Protocolo de verbalização Usuário vocaliza seus pensamentos e opiniões enquanto interage com o produto. Possibilita melhor compreensão do modelo mental do usuário e da sua interação com um produto Possibilita também descobrir terminologia do usuário que pode ser aproveitada no sistema

36 Metodologias de usabilidade: testes Método de co-descoberta Idêntico ao anterior, porém com dois usuários. Reproduz situação típica de trabalho, qdo há pesssoas disponíveis para ajuda, e permite melhores insights Protocolo de questões Além da vocalização espontânea, o avaliador faz perguntas de questionário estruturado

37 Paper and Pencil Simulation Mostra-se um aspecto do produto para o usuário e pede-se para responder uma série de perguntas. Usado nas fases iniciais para correção rápida de problemas Field Studies Ocorre no ambiente de uso de usuários potenciais antes do lançamento Seu objetivo é coletar melhorias para as próximas versões Follow Up Studies Ocorre após o lançamento Seu objetivo é coletar melhorias para as próximas versões através de pesquisas, entrevistas, observações Ótimo teste de usabilidade, porém pouco usado

38 Incertezas Teste de Usabilidade Testes são artificias Não existe certeza que o produto vai funcionar ao ser lançado Raramente os usuários testados representam a população em questão

39 Modelo Conceitual

40 Relembrando.... Design de um produto editorial precisa de método O produto resultante do design precisa ser útil –Abordagem participativa –Testes com usuários

41 Modelo Mental e Modelo Conceitual Projetista idealiza modelo conceitual do sistema Designers concebem o sistema Imagem do Sistema Usuário cria modelo mental do sistema baseado em suas interações Golfo de execução Golfo de avaliação

42 Modelagem Conceitual Inicio de tudo é uma idéia (uma percepção de necessidades de público exteriorizada ou não, forma de cumprir um objetivo) Documento que descreve conceitos, e fornece para as fases seguintes informações do mercado e do público. Este documento trará as diretrizes para a evolução do produto permitindo a coerência do todo

43 Modelagem Conceitual Descrição Sucinta da Idéia e do Contexto Definição de Objetivos do negócio e do site Público Alvo e suas Necessidades / Caracterísiticas Análise da Concorrência Levantamento de Requisitos, Escopo, Limitações Metáforas Visão Missão Modelo de Negócios (viabilidade) Parcerias Planejamento Necessidades Operacionais Para ilustrar usaremos com exemplo o site Homem Nerd criado por um dos grupos de alunos em 2005.

44 Modelagem Conceitual Descrição da Idéia e do Contexto –Descrever o Contexto em que a iniciativa se insere (Estratégia maior, Visão, Missão e Objetivos) –Descrever sucintamente a idéia, seus objetivos, necessidades que atende, e o público ao qual ela se destina, os possíveis competidores, e o alinhamento com o contexto maior na qual ela se insere

45 Exemplo – Homem Nerd Idéia, Contexto, Modelo de Negócios, público alvo –Intencionamos criar no futuro uma editora voltada para divulgação da cultura nerd associada a quadrinhos, cinema (aventura, ficção científica, fantasia e terror), comédias, seriados televisivos (sitcoms e desenhos animados) e videogames. –O site será de entretenimento e visa estudar o público alvo da editora, definindo suas características e seus desejos, traçando o seu perfil, através de pesquisas de opinião e analisando o feedback das diferentes seções –Apesar de já existirem sites de entretenimento semelhantes, nossa abordagem se diferenciará por ser mais opinativa e menos informativa. Outro diferencial será que o site terá maior participação do usuário por meio de enquetes, seção de cartas, resenhas e quadrinhos de leitores.

46 Objetivos do negócio e do site Ligado ao público alvo Definir objetivos claros que atendam a um dado público direcionam: –Informações que serão disponibilizadas e a linguagem de comunicação Ex: Para uma exposição de arte pode-se pensar em vários objetivos bastante diferentes para um site –Incentivar a visita de escolas para promover divulgação e consciência cultural e artísitica –Ter o máior número possível de visitas –Objetivo puramente institucional –Objetivo puramente did]atico

47 Modelagem Conceitual Análise do Público Alvo (pesquisas de foco, task analysis e etnográficos) –Quais as itenções e necessidades deste público Estratégias de busca e uso de informação Como a decisão é tomada? Quais os argumentos de convencimento? Que tipo de informação é necessária? –Como a iniciativa atende a estas necessidades? Qual a reação do público a iniciativa? Como outros sites suprem esta necessidade? A experiência em outros sites é satisfatória? –Há necessidade de segmentação (tabela publico x necessidades) –Quais as sugestões, e principais apreensões

48 Exemplo Homem Nerd Para definir necessidades do público alvo –Foi proposto um formulário com perguntas específicas dentro de comunidades pertinetnes no orkut Chegou-se a um público alvo com as seguintes características –Maioria do sexo masculino –Entre 18 e 25 anos –Moradia no estado de SP –Ensino superior incompleto –Passa de 2 a 4 horas na Internet –Cinema é o entretenimento princial Sugeriu-se para o site –Atualizações diárias, conteúdo para banda larga, mais análises, mais resenhas e matérias (+ citado), mais novidades do mercado externo, imparcialidade, bons colunistas, informações sobre filmes alternativos, boa usabiliidade e informações sobre games e animes, etc…..

49 Modelagem Conceitual Análise do mercado (benchmarks) –Quem faz bem no mercado? –O que deve ser analisado? (Montar uma tabela comparativa das várias análises feitas) –Lista das coisas a serem seguidas e das coisas a serem evitadas

50 Exemplo Homem Nerd Foram pesquisados os sites: –Omelete –Anime Pró –E-pipoca –Herói –Spell Brasil E os seguintes aspectos –Objetivos do site –O que possui –Caracterísitcas da HP –Pontos positivos –Pontos negativos –Projeto Gráfico –Navegação Tabela Comparativa Conclusão

51 Modelagem Conceitual Levantamento de Requisitos –Com base em tudo que se levantou nos tópicos anteriores detalhar a solução listando requisitos necessários, limitações, o que será feito e o que esta fora do escopo –Tente responder para cada objetivo/necessidade do cliente a ser atendida: O que (Detalhar o objetivo/ necessidade) Para quem (levar em conta a forma levantada de estratégia de busca de informação, quais info são necessárias para se tomar uma decisão) Como será feito (como a mídia em questão ajudará, como será implementado, o que será oferecido e de que forma, quais os argumentos de convencimento) Por que? (qual o valor que isto traz para o cliente e para o negócio, como fazer que isto seja percebido) Exercício: faça o exercício acima para pagamento de contas. Tente extrair do seu grupo as necessidades e responda as perguntas acima)

52 Modelagem Conceitual Levantamento de Requisitos –Priorize a lista de requisitos (valor para o cliente e para o negócio) –Crie uma estratégia para que a priorização seja percebida pelo usuário/cliente

53 Exemplo Homem Ned Escopo –Conteúdo do site será composto de colunas, resenhas, críticas, quadrinhos, notícias, perfis, entrevistas que serão atualizadas conforme a seção. O conteúdo que não for escrito pelo público ou por nosos parceiross será feito pelos criadores do site/ –O site terá as seguintes seções (os detalhes foram emitidos) Colunas Resenhas Críticas Quadrinhos Notícias Perfis Identidade Visual

54 Modelagem Conceitual Metáforas –Existe alguma forma de tangibilizar melhor a iniciativa utilizando metáforas que remetam a experiências já conhecidas pelos usuários Ex: carrinho de compras nos Shoppings virtuais –Cuidado: não deixar se levar pelo banal ou pelo incompreensível –Deve ser usada se o conceito em questão é difícil de ser entendido

55 Modelagem Conceitual Visão –É aonde se pretende chegar no longo prazo. É a maneira como desejamos que nossos clientes, o mercado nos enxerguem –Exemplo Visão da Microsoft Começamos com a visão de um computador em cada mesa de trabalho – Bill Gates Chairman and Chief Software Architect –Exemplo British Royal Mail Nossa Visão é sermos reconhecidos como a melhor organização do Mundona entrega de correspondências e pacptes

56 Modelagem Conceitual Dicas para escrever Visão –Pense na iniciativa hoje –Utilize sua intuição e conhecimentos para enxergar a iniciativa daqui a 5 anos. Como seria possível perceber a transformação? –A visão deve ser um conceito claro e concreto de premissa de criação de valor da iniciativa –Possua uma chance plausível de sucesso, no qual as pessoas acreditem –Capture o espírito desejado da organização –Seja fácil de ler e entender –Seja forte para ser aplicada em processos decisórios –Motive mesmo em tempos difíceis

57 Exemplo Homem Nerd Para criarmos uma identidade e ligarmos o site a um setor de vendas, desde o princípio disponibilizaremos uma lojinha com material promocional da marca Homem-nerd. Serão camisetas, canecas, bonés, bandeiras, adesivos (todos com logo e endereço do site). Nos primeiros meses, a lojinha funcionará apenas com a venda de camisetas, devido ao alto preço dos demais produtos para tiragens reduzidas. Quano o site conquistar um público maior, passará a vender produtos ligados a cultura nerd, derivados do site e da futura editora, cujo público-alvo é o mesmo dis site.

58 Modelagem Conceitual Missão –É a forma de se chegar a Visão –Deve descrever o negócio principal da iniciativa, o cliente e o valor que se gera para o mesmo. –Missão da ECT: Prestar serviços de correios convencionais e avançados, transporte de encomendas e atendimentos especiais de forma empresarial, com competitividade e lucratividade, de acordo com a qualidade exigida pelos diversos segmentos de mercado, bem como desenvolver e motivar pessoas para garantir a excelência desses serviço

59 Modelagem Conceitual Parcerias –Listar as parcerias necessárias para viabilização da iniciativa Ex: para um shopping virtual são necessárias parcerias com operadores logísticos, meios de pagamento, lojistas, etc.

60 Exemplo Homem Nerd Quadrinista Leonardo Pascal para tirinhas Colaboradores convidados para resenhas Leitores são potencial colaboradores

61 Modelagem Conceitual Modelo de Negócios –Estudo de viabiliade de negócio. Estima-se o investimento, as despesas com operação, as parcerias necessárias, marketing e a receita e o tempo para que ocorra o retorno do investimento (ROI). Através deste estudo decide-se ou não pela inciativa

62 Modelagem Conceitual Planejamento –Planeja-se como realizar o projeto, estabelece-se cronograma, orçamento, estrutura do projeto (dono do projeto, quem aprova, quem faz o que, etc)

63 Modelagem Conceitual Necessidades Operacionais –Listar o que precisa ser feito no dia-a-dia para que o produto resultante do projeto sobreviva Ex: para um shopping –Colocação de ofertas, marketing externo, garantia da qualidade, conquista de novos lojistas, controle financeiro, etc.

64 Gaps mesmo com abordagem participativa Expectativa Usuários Usuário não sabe verbalizar suas necessidades Usuário não foi compreendido Custo, legado, políticas Modelagem Conceitual (sistema) Modelo Mental (usuário) Exercicio: quais os tipos de testes podem ser aplicados em cada uma das fases para Que se mantenham / diminuam os gaps acima. Proponha realimentações para Diminuição de gaps. Tarefas/ contexto do usuário não forma entendidas Falhas de consistências (AI + L&F) Custo, legado,políticas Interface

65 Definição dos Projetos

66 Demais Etapas

67 Concepção Transformação de conceitos em modelos funcionais Simplificação do complexo Uso de wireframes e maquetes Envolve as etapas de: –Arquitetura de Informação –Projeto Gráfico – Identidade Visual –Estilo Editorial – Tom de voz

68 Integração Unir todas as partes Testes e Aceite Publicação Monitoramento

69 Implementação Usando os modelos concebidos implementar as várias páginas Envolve –Editoria de todos os conteúdos –Diagramação em HTML –Projeto de TI

70 Maus exemplos http://www.webpagesthatsuck.com –http://www.guinnessudv.com (MENU)http://www.guinnessudv.com http://digilander.libero.it/chiediloapippo/Engineering/iarchitect/index- 1.htm (hall of shame e hall of fame)http://digilander.libero.it/chiediloapippo/Engineering/iarchitect/index- 1.htm

71 Leituras Complementares http://www-3.ibm.com/ibm/easy/eou_ext.nsf/publish/558 http://www.acm.org/~perlman/uidesign.html - capítulo 1http://www.acm.org/~perlman/uidesign.html