SlideShare uma empresa Scribd logo
1 de 30
Baixar para ler offline
Oi gente,
tudo bem?
Vamos falar sobre
AI, UI, UX <3?
RESUMO
Dois problemas:
PRIMEIRO.
É um problema prático, com duas dicas.
SEGUNDO.
É um problema mais abrangente,
relacionado a conceitos e profissão.
PRIMEIRO PROBLEMA
Interfaces exploráveis
Deixe o usuário explorar
(e duas dicas pra isso acontecer)
Às vezes acho que a gente projeta
pro outro aquilo que irrita a nós mesmos,
como se o outro fosse um alienígena.
DICA UM: Não perturbe
O usuário deve poder explorar o programa sem
interrupções.
EXEMPLO
Lightboxes perguntando toda hora se deseja realizar aquela ação.
Se for uma ação rotineira é ainda mais insuportável.
Como "nós" fazemos?
Pop-up|
Tour|
Confirmação|
ps. presta atenção na conversa "Tentar novamente?", e eu respondo "Okay"??? Oi?
Me perturbando com pop-up?|
OBS no catraca atualizaram e melhoraram
essa lightbox: antes ela aparecia logo ao
abrir o site, hoje só depois de um tempo.
Muito melhor desse jeito.
É comum logo ao abrir um site
vir uma mega pop-up pedindo
pra segui-lo. Saco! Deixe-me
ver o conteúdo primeiro!
Outro problema é que poucas
vezes é responsivo. Impossível
fechar a lightbox no celular!
Me perturbando com o tour?|
Você acha mesmo que eu vou
lembrar de tudo isso?
É muita informação em um
curto período. Eu quero
experimentar primeiro, ter
minhas dúvidas! O pior é que
quando as dúvidas surgirem,
não tem nada para me ajudar.
O que poderia me ajudar são
help-text contextuais, Q&A,
por exemplo.
Vou logo ao exemplo.
Ao arquivar uma mensagem, o
gmail utiliza uma mensagem de
feedback em amarelo discreta:
"The conversation has been
archived. Learn more Undo".
Não te interrompe com um
diálogo pra confirmar. O
melhor é que também é
possível "desfazer" a ação por
ali.
Sem traumas.
E a tal da confirmação?|
Não é o caso de pop-ups, tours, janelas de
confirmação serem agentes do mal que nunca devam
ser usados.
Porém, usa-se de maneira rotineira e
indiscriminada, interrompendo de modo bem
desagradável o uso.
Existem outros modos de fazer. Por que não
quebrar um pouco a cabeça?
DICA DOIS: Não puna o usuário
O usuário não pode ter medo. As pessoas erram.
Clicam em "não" quando na verdade queriam dizer
"sim, quero salvar o arquivo".
EXEMPLO
Se ao clicar em "deletar", ele não puder desfazer a ação, o usuário
ficará com medo de deletar outro arquivo na próxima. Ele pode
parar de usar o programa.
Waze e minha experiência traumática
No meu primeiro uso do Waze
eu reportei polícia. Mas não
tinha policiais ali. Eu apenas saí
clicando em tudo até fazer
alguma coisa no aplicativo. O
problema é que lá não tem
como retirar um alerta que
você fez. Fiquei com vergonha.
OBS Depois que descobri que meu alerta
não aparece no mapa dos outros, só quando
mais pessoas reportam que aparece.
Não conheço o Waze a fundo. Pode ser que o fato do usuário
não poder retirar um report que fez pode ter um objetivo
obscuro por trás. Ou eles acharam que com tantas
confirmações antes, ninguém erraria. Não sei. Não fui atrás.
Só vou falar dos "sentimentos": na hora não ficou claro pra
mim que só apareceria quando outros usuários reportassem.
E por isso, fiquei com medo. Fiquei um tempo sem usar.
É claro também que sendo uma função de uso não tão
constante, eu voltei a usar. Se fosse uma ação mais rotineira,
teria sido pior.
O ato de desfazer/refazer é uma das
coisas mais maravilhosas da tecnologia.
Sério.
REVISÃO
É bacana, legal e tudo de
bom o usuário poder explorar.
DICA UM: Não interrompa o usuário
DICA DOIS: Não deixe o usuário com medo
Deixa ele explorar, ser feliz.
SEGUNDO PROBLEMA
Entendendo o problema
Projetar:
O quê? Pra quem?
Para o quê?
Para o cliente final ou interno? Front ou backoffice?
Hotsite ou landing page? Sistema? Aplicativo ou web
app? CRM, ERP, especialista ou apoio a decisão?
Desktop, web, tablet, mobile, watch, toten?
Projetar...
DÚVIDA
No mercado vejo muitos designers atuando no front de
hotsites e landing pages. Poucos em todas as outras
situações. O que acham disso: uma oportunidade
perdida ou um mercado difícil de penetrar?
E afinal, qual o problema
e como vou direcionar esse projeto?
É um processo de melhoria?
> Pesquisa de mercado
> Teste de usabilidade
> Análise heurística
> Pesquisa etnográfica
> Análise de requisitos
NOTA
Alguns acreditam que é só a partir da pesquisa
etnográfica que a ‘inovação’ pode acontecer.
Ou de descobrimento?
Mas o cliente não
sabe o que quer”“
Ninguém entende seu negócio
melhor que o próprio dono.
Se o cliente busca o seu conhecimento, ele sabe que existe
um problema, só não sabe como atacá-lo.
É necessário um processo de descobrimento seu: entender
qual o negócio do cliente e seu problema.
Cliente, o grande vilão
E assim termina!
That's all, folks
biancatrancoso@gmail.com
Vila Velha, 2015

Mais conteúdo relacionado

Mais procurados

Cap 11 eliminando excessos aud
Cap 11   eliminando excessos audCap 11   eliminando excessos aud
Cap 11 eliminando excessos aud
Edu Gamarros
 
DúVidas TéCnicas
DúVidas TéCnicasDúVidas TéCnicas
DúVidas TéCnicas
joelreichert
 
Tutorial como fazer banner de fotos recentes
Tutorial  como fazer banner de fotos recentesTutorial  como fazer banner de fotos recentes
Tutorial como fazer banner de fotos recentes
Artur Ferreira
 

Mais procurados (17)

Protocolo experiência e-lab boyle-mariotte
Protocolo experiência e-lab boyle-mariotteProtocolo experiência e-lab boyle-mariotte
Protocolo experiência e-lab boyle-mariotte
 
Fotoevents
FotoeventsFotoevents
Fotoevents
 
Gerenciamento
GerenciamentoGerenciamento
Gerenciamento
 
Persistência Visual
Persistência VisualPersistência Visual
Persistência Visual
 
Computação gráfica
Computação gráficaComputação gráfica
Computação gráfica
 
Snapchat - Métricas de avaliação
Snapchat - Métricas de avaliaçãoSnapchat - Métricas de avaliação
Snapchat - Métricas de avaliação
 
Tutorial Reinstalando Quick
Tutorial Reinstalando QuickTutorial Reinstalando Quick
Tutorial Reinstalando Quick
 
Pablo
Pablo  Pablo
Pablo
 
Handbook Usability Testing - Capitulo 13
Handbook Usability Testing - Capitulo 13Handbook Usability Testing - Capitulo 13
Handbook Usability Testing - Capitulo 13
 
Relatorio
RelatorioRelatorio
Relatorio
 
Teorias e Prática aplicadas ao mercado digital
Teorias e Prática aplicadas ao mercado digitalTeorias e Prática aplicadas ao mercado digital
Teorias e Prática aplicadas ao mercado digital
 
Dica 013
Dica 013Dica 013
Dica 013
 
Cap 11 eliminando excessos aud
Cap 11   eliminando excessos audCap 11   eliminando excessos aud
Cap 11 eliminando excessos aud
 
Desenvolvimento Android p1
Desenvolvimento Android p1Desenvolvimento Android p1
Desenvolvimento Android p1
 
Guião Phopeach_Elvira Rodrigues
Guião Phopeach_Elvira RodriguesGuião Phopeach_Elvira Rodrigues
Guião Phopeach_Elvira Rodrigues
 
DúVidas TéCnicas
DúVidas TéCnicasDúVidas TéCnicas
DúVidas TéCnicas
 
Tutorial como fazer banner de fotos recentes
Tutorial  como fazer banner de fotos recentesTutorial  como fazer banner de fotos recentes
Tutorial como fazer banner de fotos recentes
 

Semelhante a AI, UI & UX do amor - parte 1

ErgoDesign e Arquitetura da Informação - Parte A
ErgoDesign e Arquitetura da  Informação - Parte AErgoDesign e Arquitetura da  Informação - Parte A
ErgoDesign e Arquitetura da Informação - Parte A
Fabiano Damiati
 
Aula 3.1 análise de sistemas homem-máquina
Aula 3.1   análise de sistemas homem-máquinaAula 3.1   análise de sistemas homem-máquina
Aula 3.1 análise de sistemas homem-máquina
Daniel Moura
 
Aula 3.1 análise de sistemas homem-máquina
Aula 3.1   análise de sistemas homem-máquinaAula 3.1   análise de sistemas homem-máquina
Aula 3.1 análise de sistemas homem-máquina
Daniel Moura
 
Entendendo Desfazer
Entendendo DesfazerEntendendo Desfazer
Entendendo Desfazer
Pix El
 
designer grafico Aula 05 - Heurísticas de Nielsen.pdf
designer grafico Aula 05 - Heurísticas de Nielsen.pdfdesigner grafico Aula 05 - Heurísticas de Nielsen.pdf
designer grafico Aula 05 - Heurísticas de Nielsen.pdf
JulioCesar371362
 

Semelhante a AI, UI & UX do amor - parte 1 (20)

Engenharia de Usabilidade
Engenharia de UsabilidadeEngenharia de Usabilidade
Engenharia de Usabilidade
 
User experiense
User experienseUser experiense
User experiense
 
Experiência do usuário
Experiência do usuárioExperiência do usuário
Experiência do usuário
 
Alessandro Ribeiro | Fazemos nosso usuário sorrir
Alessandro Ribeiro | Fazemos nosso usuário sorrirAlessandro Ribeiro | Fazemos nosso usuário sorrir
Alessandro Ribeiro | Fazemos nosso usuário sorrir
 
Aula 3.1 - Ergonomia
Aula 3.1 - ErgonomiaAula 3.1 - Ergonomia
Aula 3.1 - Ergonomia
 
Pessoas Ou Processos
Pessoas Ou ProcessosPessoas Ou Processos
Pessoas Ou Processos
 
UX Design para Desenvolvedores
UX Design para DesenvolvedoresUX Design para Desenvolvedores
UX Design para Desenvolvedores
 
ErgoDesign e Arquitetura da Informação - Parte A
ErgoDesign e Arquitetura da  Informação - Parte AErgoDesign e Arquitetura da  Informação - Parte A
ErgoDesign e Arquitetura da Informação - Parte A
 
Aula 3.1 análise de sistemas homem-máquina
Aula 3.1   análise de sistemas homem-máquinaAula 3.1   análise de sistemas homem-máquina
Aula 3.1 análise de sistemas homem-máquina
 
Aula 3.1 análise de sistemas homem-máquina
Aula 3.1   análise de sistemas homem-máquinaAula 3.1   análise de sistemas homem-máquina
Aula 3.1 análise de sistemas homem-máquina
 
Entendendo Desfazer
Entendendo DesfazerEntendendo Desfazer
Entendendo Desfazer
 
O que é user experience
O que é user experienceO que é user experience
O que é user experience
 
designer grafico Aula 05 - Heurísticas de Nielsen.pdf
designer grafico Aula 05 - Heurísticas de Nielsen.pdfdesigner grafico Aula 05 - Heurísticas de Nielsen.pdf
designer grafico Aula 05 - Heurísticas de Nielsen.pdf
 
Lidar com Expectativas é a melhor forma de garantir a Experiência
Lidar com Expectativas é a melhor forma de garantir a ExperiênciaLidar com Expectativas é a melhor forma de garantir a Experiência
Lidar com Expectativas é a melhor forma de garantir a Experiência
 
Design For Simplicity Rio Info 2007
Design For Simplicity Rio Info 2007Design For Simplicity Rio Info 2007
Design For Simplicity Rio Info 2007
 
UX UI para Programadores
UX UI para Programadores UX UI para Programadores
UX UI para Programadores
 
Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012 Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012
 
UX e Tecnologia - Bianca Brancaleone
UX e Tecnologia - Bianca BrancaleoneUX e Tecnologia - Bianca Brancaleone
UX e Tecnologia - Bianca Brancaleone
 
Usabilidade em Aplicativos - Webdesign - 2021-02
Usabilidade em Aplicativos - Webdesign - 2021-02Usabilidade em Aplicativos - Webdesign - 2021-02
Usabilidade em Aplicativos - Webdesign - 2021-02
 
Usabilidade em Aplicativos - Webdesign - 2021-01
Usabilidade em Aplicativos - Webdesign - 2021-01Usabilidade em Aplicativos - Webdesign - 2021-01
Usabilidade em Aplicativos - Webdesign - 2021-01
 

AI, UI & UX do amor - parte 1

  • 1. Oi gente, tudo bem? Vamos falar sobre AI, UI, UX <3?
  • 2. RESUMO Dois problemas: PRIMEIRO. É um problema prático, com duas dicas. SEGUNDO. É um problema mais abrangente, relacionado a conceitos e profissão.
  • 4. Deixe o usuário explorar (e duas dicas pra isso acontecer)
  • 5. Às vezes acho que a gente projeta pro outro aquilo que irrita a nós mesmos, como se o outro fosse um alienígena.
  • 6. DICA UM: Não perturbe O usuário deve poder explorar o programa sem interrupções. EXEMPLO Lightboxes perguntando toda hora se deseja realizar aquela ação. Se for uma ação rotineira é ainda mais insuportável.
  • 10. Confirmação| ps. presta atenção na conversa "Tentar novamente?", e eu respondo "Okay"??? Oi?
  • 11. Me perturbando com pop-up?| OBS no catraca atualizaram e melhoraram essa lightbox: antes ela aparecia logo ao abrir o site, hoje só depois de um tempo. Muito melhor desse jeito. É comum logo ao abrir um site vir uma mega pop-up pedindo pra segui-lo. Saco! Deixe-me ver o conteúdo primeiro! Outro problema é que poucas vezes é responsivo. Impossível fechar a lightbox no celular!
  • 12. Me perturbando com o tour?| Você acha mesmo que eu vou lembrar de tudo isso? É muita informação em um curto período. Eu quero experimentar primeiro, ter minhas dúvidas! O pior é que quando as dúvidas surgirem, não tem nada para me ajudar. O que poderia me ajudar são help-text contextuais, Q&A, por exemplo.
  • 13. Vou logo ao exemplo. Ao arquivar uma mensagem, o gmail utiliza uma mensagem de feedback em amarelo discreta: "The conversation has been archived. Learn more Undo". Não te interrompe com um diálogo pra confirmar. O melhor é que também é possível "desfazer" a ação por ali. Sem traumas. E a tal da confirmação?|
  • 14. Não é o caso de pop-ups, tours, janelas de confirmação serem agentes do mal que nunca devam ser usados. Porém, usa-se de maneira rotineira e indiscriminada, interrompendo de modo bem desagradável o uso. Existem outros modos de fazer. Por que não quebrar um pouco a cabeça?
  • 15. DICA DOIS: Não puna o usuário O usuário não pode ter medo. As pessoas erram. Clicam em "não" quando na verdade queriam dizer "sim, quero salvar o arquivo". EXEMPLO Se ao clicar em "deletar", ele não puder desfazer a ação, o usuário ficará com medo de deletar outro arquivo na próxima. Ele pode parar de usar o programa.
  • 16. Waze e minha experiência traumática No meu primeiro uso do Waze eu reportei polícia. Mas não tinha policiais ali. Eu apenas saí clicando em tudo até fazer alguma coisa no aplicativo. O problema é que lá não tem como retirar um alerta que você fez. Fiquei com vergonha. OBS Depois que descobri que meu alerta não aparece no mapa dos outros, só quando mais pessoas reportam que aparece.
  • 17. Não conheço o Waze a fundo. Pode ser que o fato do usuário não poder retirar um report que fez pode ter um objetivo obscuro por trás. Ou eles acharam que com tantas confirmações antes, ninguém erraria. Não sei. Não fui atrás. Só vou falar dos "sentimentos": na hora não ficou claro pra mim que só apareceria quando outros usuários reportassem. E por isso, fiquei com medo. Fiquei um tempo sem usar. É claro também que sendo uma função de uso não tão constante, eu voltei a usar. Se fosse uma ação mais rotineira, teria sido pior.
  • 18. O ato de desfazer/refazer é uma das coisas mais maravilhosas da tecnologia. Sério.
  • 19. REVISÃO É bacana, legal e tudo de bom o usuário poder explorar. DICA UM: Não interrompa o usuário DICA DOIS: Não deixe o usuário com medo Deixa ele explorar, ser feliz.
  • 21. Projetar: O quê? Pra quem? Para o quê?
  • 22. Para o cliente final ou interno? Front ou backoffice? Hotsite ou landing page? Sistema? Aplicativo ou web app? CRM, ERP, especialista ou apoio a decisão? Desktop, web, tablet, mobile, watch, toten? Projetar...
  • 23. DÚVIDA No mercado vejo muitos designers atuando no front de hotsites e landing pages. Poucos em todas as outras situações. O que acham disso: uma oportunidade perdida ou um mercado difícil de penetrar?
  • 24. E afinal, qual o problema e como vou direcionar esse projeto?
  • 25. É um processo de melhoria? > Pesquisa de mercado > Teste de usabilidade > Análise heurística
  • 26. > Pesquisa etnográfica > Análise de requisitos NOTA Alguns acreditam que é só a partir da pesquisa etnográfica que a ‘inovação’ pode acontecer. Ou de descobrimento?
  • 27. Mas o cliente não sabe o que quer”“
  • 28. Ninguém entende seu negócio melhor que o próprio dono. Se o cliente busca o seu conhecimento, ele sabe que existe um problema, só não sabe como atacá-lo. É necessário um processo de descobrimento seu: entender qual o negócio do cliente e seu problema. Cliente, o grande vilão