CRP-5215 
COMUNICAÇÃO DIGITAL 
E ENSINO 
À DISTÂNCIA. 
Aula 08: Design de interação.
CRP-0420: 
COMUNICAÇÃO 
DIGITAL. 
Aula 08: Design de interação.
PROGRAMA: 
1. Contexto 
2. Emergência 
e redes 
3. A coisa 
4. Ideologias e 
Tendências 
5. Inteligência 
Artificial 
6. Educação 
7. Experiência 
do usuário 
8. Design 
de interação 
9. Design thinking 
10.Interfaces 
11. Código 
12. Games 
13. Planejamento 
estratégico
PARA CASA: 
Imagine 5 personas e respectivos cenários 
para um aplicativo ou serviço web popular.
Iniciantes, experts e 
INTERMEDIÁRIOS: 
- Iniciantes aprendem rápido 
- Intermediários se satisfazem com o que 
sabem 
- Poucos se transformam em experts. 
• É preciso desenhar produtos para quem 
não quer deixar de ser intermediário.
Intermediários 
PERPÉTUOS 
O que isto faz? 
Como imprimir? 
Pra que serve? 
Onde começo? 
Esqueci como importar 
Onde acho aquilo mesmo? 
Me lembre pra que serve isto? 
Opa! Dá para desfazer? 
Pra que serve este controle? 
Que vantagens tem a nova versão? 
Como 
automatizar? 
Tem atalhos? 
Posso mudar? 
O que é 
perigoso fazer? 
iniciante intermediário expert
Iniciantes, não 
IDIOTAS. 
• Pense nos iniciantes como pessoas muito 
inteligentes e muito ocupadas. 
• É preciso promover rapidamente os 
iniciantes para o nível intermediário. 
• Adapte o produto ao seu modelo mental. 
• Eles dependem muito de menus e nunca são 
objetivos: estão aprendendo.
Intermediários são 
TÍPICOS: 
• Precisam de acesso a ferramentas. 
• Sabem usar materiais de referência. 
• São motivados a mergulhar no assunto e 
aprender cada vez mais. 
• Sabem que existem ferramentas de uso 
avançado, mesmo que não precisem delas 
ou saibam usá-las.
VISÃO DE PRODUTO 
• Harmonizar as perspectivas internas e 
externas com relação ao escopo; 
• Determinar orçamento e cronograma; 
• Listar as limitações e oportunidades 
técnicas, logísticas, operacionais; 
• Definir objetivos de cada participante; e 
• Analisar demandas reais de usuários.
Pesquisa 
QUALITATIVA 
• Ajuda a compreender comportamentos, 
atitudes e aptidões dos usuários; 
• Determina em que contexto técnico e de 
mercado a iniciativa acontecerá; e 
• Dá credibilidade aos projetos e baseia 
decisões em demandas atuais.
O USUÁRIO: 
• Quais são seus objetivos ao usar o produto 
ou serviço? 
• Quais são suas frustrações com o estado 
atual das coisas? 
• Como é o processo de decisão? 
• Como é seu relacionamento com o produto 
ou serviço?
O USUÁRIO: 
• Qual é o contexto em que o produto se 
encaixa em suas vidas ou trabalho? 
• Quais são os conhecimentos prévios? 
• Quais são as tarefas em que o produto é 
essencial e em quais ainda é falho? 
• Quais são os objetivos e motivações? 
• Como se encaixa no modelo mental?
ABORDAGEM 
• Primeiro os objetivos, depois as tarefas; 
• Lembre-se que o usuário não é parte da 
equipe de desenvolvimento do produto; 
• Evitr debates tecnológicos; e 
• Encorajar roteiros e narrativas.
O que proporciona a 
MOTIVAÇÃO? 
Experiência: poder, distinção, diversão. 
Finalidade: conexão, informação, eficiência. 
Estilo de vida: reconhecimento, 
popularidade, respeito.
Abordagem do 
USUÁRIO 
• Objetivos: metas, oportunidades, prioridades 
• Contexto: funções realizadas, freqüência, 
preferências, reação a falhas, expertise 
• Processos: fluxo de trabalho, ocorrências e 
recorrências, exceções 
• Atitude: preferências, aspirações, restrições 
e motivações.
Motivação de 
USUÁRIOS: 
• Experiência: se sentir com poder, se divertir, 
se sentir descolado, permanecer focado e 
alerta. 
• Finalidade: estar conectado, saber o estado 
das coisas, ser eficiente, encontrar a 
informação que precisa rapidamente. 
• Estilo de vida: ser conhecedor, popular, 
respeitado, satisfazer ambições.
Motivação de 
ORGANIZAÇÕES: 
• Aumentar lucratividade e penetração. 
• Ampliar base de usuários. 
• Ter os recursos necessários. 
• Aumentar a eficiência ou variedade de 
produtos e serviços oferecidos. 
• Educar o usuário. 
• Se proteger contra adversidades.
Motivação 
TÉCNICA: 
• Funcionar em múltiplos browsers e 
diferentes plataformas móveis; 
• Garantir integridade dos dados; 
• Aumentar velocidade de processamento; 
• Usar certa linguagem ou processo; e 
• Manter consistência através de todas as 
experiências possíveis.
REQUISITOS: 
• Dados informações que circularão pelo 
sistema. Inputs e outputs; 
• Funcionalidades operações e ações; 
• Mercado cronograma, legislação etc; 
• Experiência valores da organização; 
• Aprendizado curva e pré-requisitos; e 
• Técnica plataformas e tecnologias.
A jornada do 
USUÁRIO:
CARD SORTING: 
Técnica de criar navegação através de 
protótipos de papel.
ESFORÇO 
• Ir de uma janela a outra, posicioná-las e 
redimensioná-las; clicar em botões; 
• Preeencher formulários desnecessários; 
• Confirmar ações; 
• Lembrar que nome seus arquivos têm 
e aonde estão; e 
• Redefinir dados pessoais ou preferências.
MENOS = MAIS 
ESFORÇO EFICIÊNCIA
Ladrões de 
EFICIÊNCIA: 
• Cognição compreensão da estrutura do 
produto e seu funcionamento. 
• Memória lembrar funções, senhas, posição 
de objetos, metáforas, caminhos. 
• Esforço visual descobrir hierarquia e 
significado dos objetos mostrados. 
• Esforço físico teclas, gestuais, movimento de 
mouse, número de cliques.
Navegação é esforço 
DESNECESSÁRIO. 
• Entre janelas, visualizações e páginas; 
• Entre partes de uma janela ou página; 
• Entre ferramentas, comandos e menus; e 
• Dentro de partes da informação: 
• Zoom 
• Rolagem 
• Links
Melhorando a 
NAVEGAÇÃO: 
• Reduzir o número de lugares a ir. 
• Mostrar sinalização clara. 
• Mostrar visões amplas e gerais. 
• Mapear controles, funções e áreas. 
• Se adequar às necessidades do usuário;. 
• Colocar as funções mais úteis e desejadas 
em locais convenientes e próximos. 
• Evitar hierarquias.
BUSCA É ESFORÇO. 
• Poucas experiências são menos satisfatórias 
do que o uso frequente de mecanismos de 
busca internos dos sites. 
• Nos acostumamos a usá-los por falta de 
melhor opção para combater o esforço 
cognitivo de tentar entender aonde as 
coisas estão e para que servem.
Consistência e 
RELEVÂNCIA. 
Vivemos uma época de escassez de atenção.
Metáforas são 
PRÓTESES: 
• Uteis a princípio, limitadas a médio prazo. 
• Não há muitas, não escalonam. 
• Prendem as interfaces aos mecanismos do 
mundo físico. 
• Reconhecimento questionável, sujeitas a 
barreiras culturais.
Expressões 
IDIOMÁTICAS 
• São muito melhores do que metáforas. 
• Não focam em conhecimento técnico, intuição 
de função ou metáfora, mas no aprendizado 
de tarefas simples para realizar funções. 
• Exemplos: duplo-clique, deslizar, vibracall.
Expressões 
IDIOMÁTICAS 
• Desde os primeiros Macs, o sucesso da 
interface não vem de sua natureza gráfica, 
mas da restrição do vocabulário. 
• De infinitos comandos para lembrar e clicar ao 
apontar, clicar e arrastar. 
• Construção de expressões complexas a partir 
do menor número de primitivos.
Construção de 
LINGUAGEM: 
Expressões 
comandos e respostas 
específicos 
Compostos 
mecanismos e 
símbolos genéricos 
Primitivos 
ações e respostas invisíveis
TESTES 
São essenciais.
FIM
PARA CASA: 
Definir o produto digital que definirá 
seu trabalho final. Meia página.

CRP-5215-0420-2014-08

  • 1.
    CRP-5215 COMUNICAÇÃO DIGITAL E ENSINO À DISTÂNCIA. Aula 08: Design de interação.
  • 2.
    CRP-0420: COMUNICAÇÃO DIGITAL. Aula 08: Design de interação.
  • 3.
    PROGRAMA: 1. Contexto 2. Emergência e redes 3. A coisa 4. Ideologias e Tendências 5. Inteligência Artificial 6. Educação 7. Experiência do usuário 8. Design de interação 9. Design thinking 10.Interfaces 11. Código 12. Games 13. Planejamento estratégico
  • 10.
    PARA CASA: Imagine5 personas e respectivos cenários para um aplicativo ou serviço web popular.
  • 14.
    Iniciantes, experts e INTERMEDIÁRIOS: - Iniciantes aprendem rápido - Intermediários se satisfazem com o que sabem - Poucos se transformam em experts. • É preciso desenhar produtos para quem não quer deixar de ser intermediário.
  • 15.
    Intermediários PERPÉTUOS Oque isto faz? Como imprimir? Pra que serve? Onde começo? Esqueci como importar Onde acho aquilo mesmo? Me lembre pra que serve isto? Opa! Dá para desfazer? Pra que serve este controle? Que vantagens tem a nova versão? Como automatizar? Tem atalhos? Posso mudar? O que é perigoso fazer? iniciante intermediário expert
  • 16.
    Iniciantes, não IDIOTAS. • Pense nos iniciantes como pessoas muito inteligentes e muito ocupadas. • É preciso promover rapidamente os iniciantes para o nível intermediário. • Adapte o produto ao seu modelo mental. • Eles dependem muito de menus e nunca são objetivos: estão aprendendo.
  • 17.
    Intermediários são TÍPICOS: • Precisam de acesso a ferramentas. • Sabem usar materiais de referência. • São motivados a mergulhar no assunto e aprender cada vez mais. • Sabem que existem ferramentas de uso avançado, mesmo que não precisem delas ou saibam usá-las.
  • 21.
    VISÃO DE PRODUTO • Harmonizar as perspectivas internas e externas com relação ao escopo; • Determinar orçamento e cronograma; • Listar as limitações e oportunidades técnicas, logísticas, operacionais; • Definir objetivos de cada participante; e • Analisar demandas reais de usuários.
  • 29.
    Pesquisa QUALITATIVA •Ajuda a compreender comportamentos, atitudes e aptidões dos usuários; • Determina em que contexto técnico e de mercado a iniciativa acontecerá; e • Dá credibilidade aos projetos e baseia decisões em demandas atuais.
  • 30.
    O USUÁRIO: •Quais são seus objetivos ao usar o produto ou serviço? • Quais são suas frustrações com o estado atual das coisas? • Como é o processo de decisão? • Como é seu relacionamento com o produto ou serviço?
  • 31.
    O USUÁRIO: •Qual é o contexto em que o produto se encaixa em suas vidas ou trabalho? • Quais são os conhecimentos prévios? • Quais são as tarefas em que o produto é essencial e em quais ainda é falho? • Quais são os objetivos e motivações? • Como se encaixa no modelo mental?
  • 32.
    ABORDAGEM • Primeiroos objetivos, depois as tarefas; • Lembre-se que o usuário não é parte da equipe de desenvolvimento do produto; • Evitr debates tecnológicos; e • Encorajar roteiros e narrativas.
  • 36.
    O que proporcionaa MOTIVAÇÃO? Experiência: poder, distinção, diversão. Finalidade: conexão, informação, eficiência. Estilo de vida: reconhecimento, popularidade, respeito.
  • 37.
    Abordagem do USUÁRIO • Objetivos: metas, oportunidades, prioridades • Contexto: funções realizadas, freqüência, preferências, reação a falhas, expertise • Processos: fluxo de trabalho, ocorrências e recorrências, exceções • Atitude: preferências, aspirações, restrições e motivações.
  • 38.
    Motivação de USUÁRIOS: • Experiência: se sentir com poder, se divertir, se sentir descolado, permanecer focado e alerta. • Finalidade: estar conectado, saber o estado das coisas, ser eficiente, encontrar a informação que precisa rapidamente. • Estilo de vida: ser conhecedor, popular, respeitado, satisfazer ambições.
  • 39.
    Motivação de ORGANIZAÇÕES: • Aumentar lucratividade e penetração. • Ampliar base de usuários. • Ter os recursos necessários. • Aumentar a eficiência ou variedade de produtos e serviços oferecidos. • Educar o usuário. • Se proteger contra adversidades.
  • 40.
    Motivação TÉCNICA: •Funcionar em múltiplos browsers e diferentes plataformas móveis; • Garantir integridade dos dados; • Aumentar velocidade de processamento; • Usar certa linguagem ou processo; e • Manter consistência através de todas as experiências possíveis.
  • 41.
    REQUISITOS: • Dadosinformações que circularão pelo sistema. Inputs e outputs; • Funcionalidades operações e ações; • Mercado cronograma, legislação etc; • Experiência valores da organização; • Aprendizado curva e pré-requisitos; e • Técnica plataformas e tecnologias.
  • 42.
    A jornada do USUÁRIO:
  • 47.
    CARD SORTING: Técnicade criar navegação através de protótipos de papel.
  • 55.
    ESFORÇO • Irde uma janela a outra, posicioná-las e redimensioná-las; clicar em botões; • Preeencher formulários desnecessários; • Confirmar ações; • Lembrar que nome seus arquivos têm e aonde estão; e • Redefinir dados pessoais ou preferências.
  • 56.
    MENOS = MAIS ESFORÇO EFICIÊNCIA
  • 57.
    Ladrões de EFICIÊNCIA: • Cognição compreensão da estrutura do produto e seu funcionamento. • Memória lembrar funções, senhas, posição de objetos, metáforas, caminhos. • Esforço visual descobrir hierarquia e significado dos objetos mostrados. • Esforço físico teclas, gestuais, movimento de mouse, número de cliques.
  • 61.
    Navegação é esforço DESNECESSÁRIO. • Entre janelas, visualizações e páginas; • Entre partes de uma janela ou página; • Entre ferramentas, comandos e menus; e • Dentro de partes da informação: • Zoom • Rolagem • Links
  • 67.
    Melhorando a NAVEGAÇÃO: • Reduzir o número de lugares a ir. • Mostrar sinalização clara. • Mostrar visões amplas e gerais. • Mapear controles, funções e áreas. • Se adequar às necessidades do usuário;. • Colocar as funções mais úteis e desejadas em locais convenientes e próximos. • Evitar hierarquias.
  • 69.
    BUSCA É ESFORÇO. • Poucas experiências são menos satisfatórias do que o uso frequente de mecanismos de busca internos dos sites. • Nos acostumamos a usá-los por falta de melhor opção para combater o esforço cognitivo de tentar entender aonde as coisas estão e para que servem.
  • 70.
    Consistência e RELEVÂNCIA. Vivemos uma época de escassez de atenção.
  • 76.
    Metáforas são PRÓTESES: • Uteis a princípio, limitadas a médio prazo. • Não há muitas, não escalonam. • Prendem as interfaces aos mecanismos do mundo físico. • Reconhecimento questionável, sujeitas a barreiras culturais.
  • 77.
    Expressões IDIOMÁTICAS •São muito melhores do que metáforas. • Não focam em conhecimento técnico, intuição de função ou metáfora, mas no aprendizado de tarefas simples para realizar funções. • Exemplos: duplo-clique, deslizar, vibracall.
  • 78.
    Expressões IDIOMÁTICAS •Desde os primeiros Macs, o sucesso da interface não vem de sua natureza gráfica, mas da restrição do vocabulário. • De infinitos comandos para lembrar e clicar ao apontar, clicar e arrastar. • Construção de expressões complexas a partir do menor número de primitivos.
  • 79.
    Construção de LINGUAGEM: Expressões comandos e respostas específicos Compostos mecanismos e símbolos genéricos Primitivos ações e respostas invisíveis
  • 84.
  • 91.
  • 92.
    PARA CASA: Definiro produto digital que definirá seu trabalho final. Meia página.