DESIGN DE INTERAÇÃO, EXPERIÊNCIA DO USUÁRIO E USABILIDADE
O QUE É EXPERIÊNCIA DO USUÁRIO
UX teve sua raiz na ergonomia, campo que desde 1940 tem focado na interação homem-máquina, atualmente bastante relacionado aos princípios de Design Centrado no Usuário (UCD). Disciplina que incorpora aspectos da psicologia, antropologia, ciência da computação, design gráfico, industrial e de interação.
O QUE É EXPERIÊNCIA DO USUÁRIO
O termo “Experiência do Usuário” foi cunhado pela primeira vez por Donald Norman, em meados de 1990, em The Design of Everyday Things . Donald Norman, é um especialista em ciências cognitivas mundialmente conhecido por seus estudos sobre como o design pode facilitar a vida das pessoas que usam qualquer artefato que possa ser projetado.
http://userexperienceproject.blogspot.com
O QUE É EXPERIÊNCIA DO USUÁRIO
O conceito de UX em aplicações web é ilustrado por por Jesse James Garrett em The Elements of User Experience, um modelo conceitual de design centrado no usuário, diagrama publicado em 2000. Garrett, pesquisador, desenvolvedor e designer de experiência do usuário, é co-fundador da Adaptive Path e também conhecido por ter em 2005 cunhado o termo Ajax para descrever a tecnologia por trás de serviços emergentes como Google Maps e Google Suggests em artigo científico.
SUPERFÍCIE
ESQUELETO
ESTRUTURA
ESCOPO
ESTRATÉGIA
www.jjg.net/elements/pdf/elements.pdf
O QUE É DESIGN DE INTERAÇÃO
Projetar produtos interativos que ofereçam suporte no dia a dia e no trabalho das pessoas. Jenny Preece, autora de Interaction Design – Beyond Human-Computer Interaction é pesquisadora, PhD, professora de Sistemas de Informação e reitora da Faculdade de Estudos de Informação, Universidade de Maryland.
O QUE É DESIGN DE INTERAÇÃO
Atua no plano de “estrutura”, com ênfase na definição de fluxos que serão apresentados para os usuários, para facilitar suas tarefas, definindo como esses interagem com as funcionalidades do sistema.
O QUE É DESIGN DE NAVEGAÇÃO
Atua no plano de “estrutura e esqueleto”, como especialização do design de interface, responsável por apresentar acessos a informação, fornecendo aos usuários percursos que o ajudem a encontrar facilmente o que procuram.
O QUE É DESIGN DE INTERFACE
Atua no plano de “esqueleto e superfície”, com ênfase na definição de padrões e de elementos gráficos como botões, campos, áreas, entre outras formas de apresentação de conteúdos na interface.
O QUE É DESIGN DE INFORMAÇÃO
Atua no plano de “esqueleto e superfície”, e é responsável por apresentar a informação para uma comunicação efetiva, ou seja, ele comunica idéias aos usuário permitindo a melhor compreensão de conteúdos.
ENTREGÁVEIS EM DESIGN DE INTERAÇÃO
Avaliação de usabilidade
Fluxos e mapas de navegação
Casos de uso e/ou cenários
Personas
Mapas do site e inventário de conteúdos
Wireframes
Protótipos (funcionáis e não funcionais, alta e baixa fidelidade)
ABORDAGENS PARA DESIGN DE INTERAÇÃO
Abordagem Descrição Usuários Designers
Centrado no Usuário
Foco nas necessidades e objetivos do usuário Guia o design
Traduz na solução as necessidades e objetivos do usuário
Centrado em Atividades
Foco nas atividades e tarefas que precisam ser completadas Realiza as atividades
Cria as ferramentas para que os usuários realizem as ações
Sistemas Foco nos componentes do sistema
Determina os objetivos do sistema
Assegura que todas as partes do sistema estão atendidas
Gênios Confia nas habilidades e conhecimentos do designer para fazer produtos
Fonte de validação Fonte de inspiração
COMO DESENVOLVER UM SOFTWARE DE SUCESSO
DESIGNERS • Motivações e atitudes • Comportamentos • Aptidões dos usuários
GERENTES • Modelo do negócio • Orçamento disponível • Projeção de lucro
DESENVOLVEDORES • Tecnologias disponíveis • Tecnologias envolvidas • Capacidade técnica
Keeley's Triangle
PROCESSOS DE UX NO SCRUM
The Silicon Valley Product Group (SVPG) - www.svpg.com Conventional Product Development Process
PROCESSOS DE UX NO SCRUM
The Silicon Valley Product Group (SVPG) - www.svpg.com Agile / Scrum Product Development Process
Sprint 0
UX NO SCRUM - DICA
ESTRATÉGIA E ESCOPO
2 SPRINTS a frente do desenvolvimento
ESTRUTURA, ESQUELETO E SUPERFICIE
1 SPRINT a frente do desenvolvimento
PESQUISA EM DESIGN ONDE BUSCAR INFORMAÇÕES
Fonte Quem O que
Stakeholders Executivos da empresa, pessoas da área de negócios, de marketing, desenvolvedores
Visão preliminar do produto; orçamento e organograma; limitações técnicas; objetivos e direcionamento do negócio; percepção sobre o usuário.
Especialistas SME – Subject Matter Expert, especialistas no domínio
Como melhorar o produto; informações técnicas e melhores práticas; questões específicas da área; características do usuário; vocabulário especializado.
Clientes Quem irá comprar o sistema, produto ou serviço
Objetivos de compra; frustrações com soluções atuais; processo de decisão de compra; regras para instalação, manutenção e gerenciamento do produto.
Usuários Quem efetivamente usará o sistema, produto ou serviço
Problemas e frustrações; o que precisam para realizar seu trabalho; contexto geral de suas atividades; tarefas, objetivos e motivações.
MÉTODOS E PROPÓSITOS DE PESQUISA
Propósitos Métodos Usados para
Demográfico Quem são os usuários? Idade, sexo, geografia
• Questionários • Análise de registros • Banco de dados
• Censo demográfico • Segmentação de público • Informar/validar outras pesquisas
Comportamental Como as coisas são feitas? Padrões de comportamento, modelos conceituais
• Pesquisa de campo • Entrevistas contextuais • Card sorting • Estudo etnográfico
• Estratégia do produto • Funcionalidades • Design de interação • Arquitetura de informação
Motivacional Por que eles fazem? Objetivos, emoções, preferências, desejos
• Pesquisa de campo • Entrevistas contextuais • Questionários
• Estratégia do produto • Estrturar a experiência • Interpretação visual • Estratégia da marca
Avaliativo Por que eles fazem?
• Teste de usabilidade • Feedback do usuário • Teste A/B
• Design de interação • Fluxos de interação • Layout de páginas • Nomenclaturas
MÉTODOS DE PESQUISA EXPLORATÓRIOS
Quantitativa ou Qualitativa
Com ou sem usuários
Metodos aplicados no Início do projeto e na fase de concepção do produtos, para identificar as reais necessidades do usuário e do negócio e projetar interfaces mais adequadas ao seu uso.
MÉTODOS DE PESQUISA AVALIATIVOS
Quantitativa ou Qualitativa
Com ou sem usuários
Usados para analisar a qualidade da interface e interação de um produto, podendo ser de produtos já existentes ou em desenvolvimento.
PERSONAS
Personas são pessoas fictícias criadas para representar diferentes tipos de usuários, seu comportamento, atitudes e metas. A aplicação de Personas em interface de software for desenvolvida por Alan Cooper e sua técnica foi popularizada em 1999 com em seu livro The Inmates are Running the Asylum. Alan Cooper é também conhecido por pai do Visual Basic e criador da linguagem “Ruby”.
PERSONAS
Quem são os usuários? Como eles se comportam? Como eles pensam? O que eles desejam e por quê?
Ferramenta de apoio a decisão
A partir dos achados de pesquisa
CRIAÇÃO DE PERSONAS
Passo 1: Identificar variáveis comportamentais e demográficas
Passo 2: Mapear entrevistados nas variáveis
Passo 3: Identificar principais padrões de comportamento
Passo 4: Listar características e objetivos relevantes
Passo 5: Checar todo o conjunto de personas e elminiar redundâncias
Passo 6: Desenvolver a narrativa
Passo 7: Determinar tipos de personas
TIPOS DE PERSONAS
Primárias Secundárias Suplementares
Clientes Servidas Negativas
EXEMPLO DE PERSONA
MODELANDO E IDENTIFICANDO REQUISITOS
Ferramentas Descrição
Mapas mentais Como as pessoas pensam sobre algo e suas expectativas sobre como ele deve se comportar.
Cenários Narrativas que descrevem interações com o sistema. Informa sobre objetivos, expectativas, motivações, ações e reações do usuário.
Personas Modelos descritivos de usuários baseados em padrões reais.
Casos de uso Explica textualmente, como o sitema responde a cada interação de um ator, que pode ser um usuário ou outro sistema.
Análise de tarefas Lista as tarefas que o design final deverá suportar. Podem ser categorizadas por importância, nível de acesso e personas.
Fluxo de tarefas Detalha como um usuário irá completar todas as tarefas em uma aplicação, do começo ao fim.
Síntese de requisitos
Dados/Atributos
Objetos e informações que o usuário precisa ver
Funcionalidades
Operações ou ações que os usuários farão com os dados ou em resposta a eles.
Elementos de interface
Forms, botões, campos, tabelas, filtros, paginação, menus, sub-menus, etc.
REQUISITOS - DICA
Envolver um QA ou Tester na etapa de modelagem e identificação de requisitos, sendo que o mesmo nesta etapa já pode dar início a documentação de regras e a formatação de testes automatizados*. * Cucumber (utilizado para a automatização de testes de aceitação na Locaweb)
PADRÕES E PRINCÍPIOS DO DESIGN DE INTERAÇÃO
Análise heurística é um método informal de inspeção onde os avaliadores julgam cada elemento da interface, tendo como referência princípios heurísticos de usabilidade. Jacob Nielsen é engenheiro, PhD, autor, pesquisador e consultor em Interface com o usuário e usabilidade.
PRINCÍPIOS DE DESIGN DE INTERAÇÃO
10 Heurísticas de Nielsen
Diálogos simples e naturais (estética e desing minimalista)
Saídas claramente marcadas (liberdade e controle do usuário)
Falar a linguagem do usuário (palavras, frases, conceitos)
Atalhos (flexibilidade e eficiência de uso)
Minimizar a sobrecarga de memória do usuário (reconhecimento em vez de memorização)
Boas mensagens de erro (fácil reconhecimento, diagnóstico e recuperação de erros)
Consistência (padrões de interface e interação) Prevenir erros (design defensivo)
Feedback (visibilidade do status do sistema) Ajuda e documentação (acessível, contextualizada e concisa)
PRINCÍPIOS DE DESIGN DE INTERAÇÃO
Outros princípios para a criação de interfaces eficazes Apresente as etapas do processo
Faça uma navegação clara e eficiente
Título das páginas reforça a navegação e orienta o usuário
Use botões para ações e links para navegação
Separe as tarefas primárias, secundárias e terciárias (detaque e foco visual)
Deixe sua interface rápida (carregamento, leitura e decisão)
Mantenha Proximidade entre elementos relacionados
Utilize interações comuns e já comprovadas
Mantenha a conexão entre design visual e de interação
Menos é mais
As melhores interfaces devem ser quase “invisíveis”
PADRÕES DE DESIGN DE INTERAÇÃO
Organização hierárquica Postural
Estrutural
Comportamental
Padrão de Interação Comportamental Exploratório – otimização do uso exploratório de aplicações
Navegação em grandes bases de dados – soluções para grandes quantidades de informação
Busca avançada – melhores práticas para a busca e apresentação de conteúdos
Entrada e alteração de dados – elementos de facilitam e orientam o usuário ao informar dados
Informação centralizada – formatos comuns de apresentação de informações que precisam ser compreendidas pelos usuários
Padrão de Interação Postural Postura Transitória
Postura Soberana
Padrão de Interação Estrutural
Divisão de áreas (navegação, visão geral, detalhes)
DOS REQUISITOS AO DESIGN SKETCHES
Big picture
Navegação
Áreas
Interação
DOS REQUISITOS AO DESIGN WIREFRAMES
Detalhamento
Fluxos
Elementos de interface
Navegação
Áreas
Interação
Conteúdos
DOS REQUISITOS AO DESIGN DESIGN VISUAL
Cores
Repetição
Alinhamento
Proximidade
Tipografia
Contraste
DOS REQUISITOS AO DESIGN PROTÓTIPOS
BAIXA FIDELIDADE ALTA FIDELIDADE
FUNCIONAL E NÃO FUNCIONAL
DOS REQUISITOS AO DESIGN IMPLEMENTAÇÃO
HTML / CSS javascript estrutura
comportamento
apresentação
DOS REQUISITOS AO DESIGN TESTE DE USABILIDADE
Objetivo é observar usuários reais usando o produto para descobrir problemas e pontos de melhoria. Pode ser realizado com protótipos ou aplicações, em desenvolvimento ou já disponíveis no mercado. Medem desempenho, precisão, lembrança e reposta emocional.
TESTE DE USABILIDADE - DICA
Envolver os designers nos testes de forma que haja a possibilidade de consolidação de informações obtidas para uma identificação mais rápida de tudo o que precisa ser revisto e ajustado no design do produto.
Mourylise Heymer [email protected] www.ungarbage.com
