projeto de interface com usuÁrio · ux - user experience curva de aprendizado “foi o escritor...
TRANSCRIPT
![Page 1: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/1.jpg)
PROJETO DE INTERFACE COM USUÁRIO
Prof. Emilio Cesar ParmegianiUNIP
AULA 1
1
![Page 2: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/2.jpg)
UX - USER EXPERIENCE
Você gosta de uma boa experiência ou você prefere sofrer?
O primeiro contato com uma pessoa normalmente é feito através da aparência
Com o passar do tempo você pode mudar o conceito inicial
2
![Page 3: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/3.jpg)
Escola Unidos do Software Bonito
Quesito apresentação.Nota: 10!
Quesito Usabilidade.Nota: 10!
Quesito Resposta. Nota: 10!
Quesito Utilidade.Nota: 10!
UX - USER EXPERIENCE
3
![Page 4: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/4.jpg)
UX - USER EXPERIENCE
USABILIDADE DESIGN
UX
Usabilidade e Design pertencem a UX
4
![Page 5: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/5.jpg)
UX - USER EXPERIENCE
5
![Page 6: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/6.jpg)
UX - USER EXPERIENCE
6
![Page 7: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/7.jpg)
UX - USER EXPERIENCE
Semiótica: “a ótica dos sinais”Estudo dos símbolos e sinais.
7
![Page 8: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/8.jpg)
UX - USER EXPERIENCE
8
![Page 9: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/9.jpg)
UX - USER EXPERIENCE
Usuário são diversas pessoas onde cada um tem uma cultura diferente.
9
![Page 10: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/10.jpg)
UX - USER EXPERIENCEEm uma aplicação é necessário colocar o nome de um botão ou apenas um ícone é suficiente?
DEPENDE!
10
![Page 11: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/11.jpg)
UX - USER EXPERIENCE
Twitter Facebook YouTube Flickr
Linkedin MySpace Delicious Google +
Wordpress Evernote Orkut Picasa
11
![Page 12: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/12.jpg)
UX - USER EXPERIENCECurva de Aprendizado: Quanto mais tempo o
usuário gasta para entender o que faz uma aplicação, mais insatisfação é gerada.
12
![Page 13: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/13.jpg)
UX - USER EXPERIENCERevolução Industrial: meados do século XVIII
Começaram a fabricar produtos em série, com mesmo formato, cor, tamanho.
Não se utilizavam mais os artesãos.
13
![Page 14: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/14.jpg)
UX - USER EXPERIENCEProcuraram soluções para atender cada cliente
de forma diferente
Mas isso está correto?14
![Page 15: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/15.jpg)
UX - USER EXPERIENCENa época da bolha da internet acontecia a
mesma coisa. Empresas ofereciam web sites para empresas e de que forma tratavam cada
característica do consumidor?
Eu tenho um layout Azul, um vermelho, um rosa...15
![Page 16: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/16.jpg)
UX - USER EXPERIENCEÉ preciso pensar no seu cliente, que tipo de
pessoa você pretende atingir com uma aplicação?
E quando o público alvo é muito amplo? Mesmo sendo amplo é possível ter uma direção. Será que o
público geral de iOS é o mesmo do Android?16
![Page 17: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/17.jpg)
UX - USER EXPERIENCE
Ergonomia VisualQuanto tempo o usuário vai ficar exposto a sua
aplicação?Quantas vezes ele vai repetir determinada tarefa?
Bonito é diferente de agradável!
17
![Page 18: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/18.jpg)
UX - USER EXPERIENCEErgonomia Visual
18
![Page 19: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/19.jpg)
UX - USER EXPERIENCEErgonomia Visual: Regra da ExceçãoE se o usuário quer fazer tal coisa?
Tudo bem, criamos uma caixa aqui!!!E se o usuário quiser fazer aquela outra coisa?Não tem problema, fazemos aparecer uma tela
aqui!!!No final você criou um Frankenstein!!!
Em UX você não se preocupa com a Exceção!
19
![Page 20: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/20.jpg)
UX - USER EXPERIENCE
20
![Page 21: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/21.jpg)
UX - USER EXPERIENCEQual foi o segredo do sucesso do Twitter?
21
![Page 22: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/22.jpg)
UX - USER EXPERIENCE
Curva de Aprendizado próximo de zero!
O Twitter foi a junção de Blog, rede social e SMS, ferramentas até então muito conhecidas e sua
interface simples permitiu um rápico aprendizado pelos usuários.
22
![Page 23: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/23.jpg)
UX - USER EXPERIENCE
Curva de Aprendizado
Aplicações corporativas normalmente possuem curvas de aprendizado maiores, pois as rotinas ou funções muitas vezes estão associadas aos
processos da empresa.
23
![Page 24: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/24.jpg)
UX - USER EXPERIENCECurva de Aprendizado
“Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme de uma carta sua, disse: ‘Me desculpe, não tive tempo de escrever uma carta curta, por isso
ela foi longa mesmo’.“
Twitter e Foursquare resolveram problemas de comunicação que não se pensava existir.
24
![Page 25: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/25.jpg)
UX - USER EXPERIENCE
25
![Page 26: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/26.jpg)
• O cliente não repara se o campo está 1px para a direita ou se está muito amarelo, o cliente quer saber se o aplicativo fuciona.
• Não faz diferença se o canto é arredonda ou não, ninguém repara nisso.
• A aplicação está lenta, mas está funcionando, é isso que importa.
UX - USER EXPERIENCEMitos entre os Desenvolvedores
26
![Page 27: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/27.jpg)
• O cliente deve ser ouvido
• O cliente é quem define as cores
• O usuário deve ser ouvido
• O layout é que faz vender o produto
UX - USER EXPERIENCEMitos entre os Designers
27
![Page 28: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/28.jpg)
• Site acessível e funcional tem que ser feio
• Todas as páginas idevem ser acessíveis em 3 cliques
• Seu usuário é como você
UX - USER EXPERIENCEMitos entre os Arquitetos
28
![Page 29: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/29.jpg)
Arquitetura de Informação
Design
Code
UX - USER EXPERIENCE
Como devemos entender UX no mundo da UI
29
![Page 30: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/30.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?
• Tempo de exposição do usuário a App
• Finalidade da App: Publica? Privada?
• Cultura do usuário
• Curva de Aprendizado do usuário
• Tecnologia utilizada
30
![Page 31: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/31.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?
Tempo de exposição do usuário a App
31
![Page 32: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/32.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?
Finalidade da App: Publica? Privada?
32
![Page 33: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/33.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?Cultura do usuário
33
![Page 34: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/34.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?
Curva de Aprendizado do usuário
34
![Page 35: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/35.jpg)
UX - USER EXPERIENCEO que deve ser levado em consideração ao criar
uma App?
Tecnologia utilizada
35
![Page 36: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/36.jpg)
UX - USER EXPERIENCECurva de Aprendizado x Curva de Satisfação
A Curva de Satisfação ocorre em dois momentos:
•Quando você olha a aplicação
•Quando você usa a aplicaçãoEstá diretamente associada a Curva de Aprendizado.
36
![Page 37: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/37.jpg)
UX - USER EXPERIENCECurva de Aprendizado x Curva de Satisfação
0123456789
10
0 1 2 3 4 5 6 7 8 9 10
Satis
fação
Aprendizagem
37
![Page 38: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/38.jpg)
UX - USER EXPERIENCEQuem é o usuário?
Podem existir dois tipos de clientes:
•Cliente
•Cliente do cliente
38
![Page 39: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/39.jpg)
UX - USER EXPERIENCEQuem é o usuário?
Quem você deve agradar?
39
![Page 40: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/40.jpg)
BIBLIOGRAFIA•Curso Design de Interfaces, Eduardo Horvath
•ASSOCIAÇÃO BRASILEIRA DE NORMAS TÉCNICAS. NBR ISO/IEC 9126-1: Engenharia de software: qualidade de produto: parte 1 – modelo de qualidade. Rio de Janeiro, 2003.
40
![Page 41: PROJETO DE INTERFACE COM USUÁRIO · UX - USER EXPERIENCE Curva de Aprendizado “Foi o escritor Mark Twain, que ao responder a um correspondente seu que reclamou do tamanho enorme](https://reader034.vdocuments.pub/reader034/viewer/2022042310/5ed78c9219431b1a896567ce/html5/thumbnails/41.jpg)
Prof. Emilio Parmegiani
Download do material
OBRIGADO
@emilioparmewww.emilioparme.com
[email protected]/emilioparme
41