SlideShare una empresa de Scribd logo
1 de 28
Descargar para leer sin conexión
Prêmio Inovação dá Sorte 2013
UMA ABORDAGEM DE
USABILIDADE APLICADA AO SITE

DO PERNAMBUCO DÁ SORTE
Madson Klleber
Gene Shelly
Jonathan Lima
Orientador: Ricardo Tavares A. de Oliveira
• “Se as pessoas não conseguem comprar, você não faz dinheiro.”
(NIELSEN, 2001)

• “Quanto mais cedo forem encontrados os problemas de interação
ou interface, menor o custo de se consertá-los.” (KARAT, 1993)
INTERNET
Uma poderosa ferramenta para estratégias
empresariais

Fonte da imagem: http://fastcom.com.br/wp-content/uploads/2011/10/acesso-a-internet-no-brasil.jpg
USABILIDADE
• Facilidade de uso de uma interface. (BEVAN,
1995)
• Uma boa usabilidade, é um fator que assegura a
facilidade, a eficiência de uso de um produto,
baseado na perspectiva do usuário, otimizando
as interações entre esse usuário e a interface.
(PREECE, 2005).
JAKOB NIELSEN
• Jacob Nielsen é um cientista da
computação com Ph.D. em
interação homem-máquina.
• Nielsen é considerado um dos
maiores especialistas em
usabilidade da web.
• “o rei da Usabilidade" (Internet
Magazine)
• “O guru da Usabilidade na Web"
(The New York Times)
Fonte da imagem:
http://s3.amazonaws.com/media.nngroup.com/media/p
eople/photos/jakobnielsen_cropped.jpg.400x400_q95_crop_upscale.jpg

• “A pessoa mais inteligente da Web"
(ZDNet AnchorDesk)
AVALIAÇÃO HEURÍSTICA

Análise do site do Pernambuco
dá Sorte com base nas 10
Heurísticas de Nielsen
1. VISIBILIDADE DO STATUS DO SISTEMA

Figura 01 – Registrando o cadastro.
Figura 02 – Tela informativa de sucesso na operação realizada.
2. CONTROLE DO USUÁRIO E LIBERDADE

Por ser um site relativamente simples, ou seja, que
não requer muito esforço mental para ser

utilizado, o usuário consegue assumir o controle
da interface sem maiores problemas.
3. CONSISTÊNCIA

Figura 03 – Contato confuso.
Figura 04 – Site externo Instituto Ativa Brasil.
4. PREVENÇÃO DE ERROS

Figura 05. Dica para o usuário.
Figura 06 – Aviso ao usuário.
5. FLEXIBILIDADE E EFICIÊNCIA DE USO

Figura 07 - Atalhos.
6. RELAÇÃO ENTRE A INTERFACE E O MUNDO REAL

Figura 08 - Informativo.
7. RECONHECIMENTO AO INVÉS DE LEMBRANÇA

Figura 09 - Dica de utilização.

Figura 10 - Dica de utilização.

Figura 11 - Dica de utilização.
8. ESTÉTICA E DESIGN MINIMALISTA

Figura 12 – Exagero nos espaços em branco.
Figura 13 – Exagero nos espaços em branco.
•

Figura 14 – Botões inconsistentes.

•

Figura 15 - Design do botão não segue padrões.

•

Figura 16 - Design do botão não segue padrões.
Figura 17. Algum texto escrito.

Figura 18 – Botão com texto clicável.
9. BOAS MENSAGENS DE ERRO
O site apresenta boas mensagens de erro. Informa
realmente ao usuário o erro cometido, ajudando-o

assim a que ele possa refazer o processo do modo
correto.
10. AJUDA E DOCUMENTAÇÃO
• Embora o site seja simples e pequeno, não há
um mapa do site que possa guiar o usuário, caso

seja necessário, mas isso não causa maiores
problemas no fluxo e no entendimento do site

como um todo.
CONCLUSÃO
REFERÊNCIAS
• BEVAN, N. Usability Issues in web site design. Washington DC, 22-26, 1998.
• Disponível em: <http://www.nigelbevan.com/papers/usweb98.pdf>. Acesso em: 17 out.
2013.
• BEVAN, N. Usability is Quality of Use. Yokohama, 1995.
• Disponível em: <http://www.nigelbevan.com/papers/usabis95.pdf>. Acesso em: 05 nov.
2013.
• CAMPI, Monica. “O mundo estará conectado em 2020, diz Schmidt.” Revista eletrônica
INFO Online. São Paulo, EDITORA ABRIL, 15 de abril de 2013. Disponível em:
<http://info.abril.com.br/noticias/mercado/o-mundo-estara-conectado-em-2020-dizschmidt-15042013-24.shl> Acesso em: 01 de novembro de 2013.
• GIL, Antonio Carlos. Como elaborar projetos de pesquisa. 3. ed. São Paulo: Atlas, 1994.
• KARAT, J. The cost-benefit and business case analysis of usability engineering. InterChi’93,
Amsterdam, Tutorial Notes 23, 1993.
•
REFERÊNCIAS
• KRUG, Steve. Não me Faça Pensar: Uma Abordagem de Bom Senso À Usabilidade na Web.
2ª Ed. Alta Books Editora, 2008.
• NEOSPOT. “Usability vs. User Experience (UX)”. NeoSpot. Lund, Suécia, 2011. Disponível
em: < http://www.neospot.se/usability-vs-user-experience> Acesso em: 02 de novembro
de 2013.
• NIELSEN, J. 10 Usability Heuristics for User Interface Design, 1995a. Disponível em: <
http://www.nngroup.com/articles/ten-usability-heuristics/>. Acesso em: 13 set. 2013.
• NIELSEN, J. Characteristics of Usability Problems Found by Heuristic Evaluation, 1995b.
Disponível em: <http://www.nngroup.com/articles/usability-problems-found-byheuristic-evaluation/>. Acesso em: 06 nov. 2013.
• NIELSEN NORMAN GROUP. Remote Usability Test: Moderated and Unmoderated.
Disponível em: <http://www.nngroup.com/articles/remote-usability-tests/>. Acesso em:
18 de out. de 2013.
• PREECE, J.; ROGERS, I.; SHARP, H. Design de Interação: Além da Interação HumanoComputador; Porto Alegre: Bookman, 2005
Obrigado
;)

Más contenido relacionado

Similar a Prêmio inovação dá sorte - 2013

A importância do teste ab para o comércio eletrônico brasileiro
A importância do teste ab para o comércio eletrônico brasileiroA importância do teste ab para o comércio eletrônico brasileiro
A importância do teste ab para o comércio eletrônico brasileiroJoão Victor Marques
 
Usabilidade com Paper Prototype
Usabilidade com Paper PrototypeUsabilidade com Paper Prototype
Usabilidade com Paper Prototypeeudisnet
 
UX - User Experience (Experiência do usuário) para Mobile
UX - User Experience (Experiência do usuário) para MobileUX - User Experience (Experiência do usuário) para Mobile
UX - User Experience (Experiência do usuário) para MobileCamila Massaneiro dos Santos
 
Seminario Lep Ibge Slideshare
Seminario Lep Ibge SlideshareSeminario Lep Ibge Slideshare
Seminario Lep Ibge Slideshareguest5ccda
 
Usabilidade: Palestra no auditório do IBGE
Usabilidade: Palestra no auditório do IBGEUsabilidade: Palestra no auditório do IBGE
Usabilidade: Palestra no auditório do IBGELuiz Agner
 
Palestra Palácio do Planalto, Brasília
Palestra Palácio do Planalto, BrasíliaPalestra Palácio do Planalto, Brasília
Palestra Palácio do Planalto, BrasíliaLuiz Agner
 
12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)maumoreira
 
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?Rafael Burity
 
Heurísticas de nielsen e as regras de ben shneiderman
Heurísticas de nielsen e as regras de ben shneidermanHeurísticas de nielsen e as regras de ben shneiderman
Heurísticas de nielsen e as regras de ben shneidermanL_IBRAIM
 
UXconf 2017 - Review
UXconf 2017 - ReviewUXconf 2017 - Review
UXconf 2017 - ReviewRafael Burity
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface DesignEdu Agni
 
2010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 032010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 03Neca Boullosa
 
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Augusto César Albuquerque
 
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...José Henrique da Silva
 
Design e Usabilidade
Design e UsabilidadeDesign e Usabilidade
Design e UsabilidadeClaudio Toldo
 
Heurística, Principios e Usabilidade na web
Heurística, Principios e Usabilidade na webHeurística, Principios e Usabilidade na web
Heurística, Principios e Usabilidade na webDaniel Brandão
 
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerce
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerceEvento Comportamento do Consumidor e Estratégias Digitais para E-commerce
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerceImpacta Eventos
 
A web como unificação das plataformas mobile
A web como unificação das plataformas mobileA web como unificação das plataformas mobile
A web como unificação das plataformas mobileAllan Marques Baptista
 

Similar a Prêmio inovação dá sorte - 2013 (20)

A importância do teste ab para o comércio eletrônico brasileiro
A importância do teste ab para o comércio eletrônico brasileiroA importância do teste ab para o comércio eletrônico brasileiro
A importância do teste ab para o comércio eletrônico brasileiro
 
Usabilidade com Paper Prototype
Usabilidade com Paper PrototypeUsabilidade com Paper Prototype
Usabilidade com Paper Prototype
 
UX - User Experience (Experiência do usuário) para Mobile
UX - User Experience (Experiência do usuário) para MobileUX - User Experience (Experiência do usuário) para Mobile
UX - User Experience (Experiência do usuário) para Mobile
 
Seminario Lep Ibge Slideshare
Seminario Lep Ibge SlideshareSeminario Lep Ibge Slideshare
Seminario Lep Ibge Slideshare
 
Usabilidade: Palestra no auditório do IBGE
Usabilidade: Palestra no auditório do IBGEUsabilidade: Palestra no auditório do IBGE
Usabilidade: Palestra no auditório do IBGE
 
Palestra Palácio do Planalto, Brasília
Palestra Palácio do Planalto, BrasíliaPalestra Palácio do Planalto, Brasília
Palestra Palácio do Planalto, Brasília
 
12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)
 
O que é user experience
O que é user experienceO que é user experience
O que é user experience
 
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?
[GDGSP] android meetup #67 | Realmente preciso de ux no projeto mobile?
 
Heurísticas de nielsen e as regras de ben shneiderman
Heurísticas de nielsen e as regras de ben shneidermanHeurísticas de nielsen e as regras de ben shneiderman
Heurísticas de nielsen e as regras de ben shneiderman
 
UXconf 2017 - Review
UXconf 2017 - ReviewUXconf 2017 - Review
UXconf 2017 - Review
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface Design
 
2010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 032010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 03
 
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
 
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...
JOSÉ HENRIQUE DA SILVA - ANÁLISE DE USABILIDADE EM LOJAS VIRTUAIS: APLICAÇÃO ...
 
Design e Usabilidade
Design e UsabilidadeDesign e Usabilidade
Design e Usabilidade
 
Heurística, Principios e Usabilidade na web
Heurística, Principios e Usabilidade na webHeurística, Principios e Usabilidade na web
Heurística, Principios e Usabilidade na web
 
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerce
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerceEvento Comportamento do Consumidor e Estratégias Digitais para E-commerce
Evento Comportamento do Consumidor e Estratégias Digitais para E-commerce
 
UX.. Vale a pena?
UX.. Vale a pena?UX.. Vale a pena?
UX.. Vale a pena?
 
A web como unificação das plataformas mobile
A web como unificação das plataformas mobileA web como unificação das plataformas mobile
A web como unificação das plataformas mobile
 

Prêmio inovação dá sorte - 2013

  • 2. UMA ABORDAGEM DE USABILIDADE APLICADA AO SITE DO PERNAMBUCO DÁ SORTE
  • 3. Madson Klleber Gene Shelly Jonathan Lima Orientador: Ricardo Tavares A. de Oliveira
  • 4. • “Se as pessoas não conseguem comprar, você não faz dinheiro.” (NIELSEN, 2001) • “Quanto mais cedo forem encontrados os problemas de interação ou interface, menor o custo de se consertá-los.” (KARAT, 1993)
  • 5. INTERNET Uma poderosa ferramenta para estratégias empresariais Fonte da imagem: http://fastcom.com.br/wp-content/uploads/2011/10/acesso-a-internet-no-brasil.jpg
  • 6. USABILIDADE • Facilidade de uso de uma interface. (BEVAN, 1995) • Uma boa usabilidade, é um fator que assegura a facilidade, a eficiência de uso de um produto, baseado na perspectiva do usuário, otimizando as interações entre esse usuário e a interface. (PREECE, 2005).
  • 7. JAKOB NIELSEN • Jacob Nielsen é um cientista da computação com Ph.D. em interação homem-máquina. • Nielsen é considerado um dos maiores especialistas em usabilidade da web. • “o rei da Usabilidade" (Internet Magazine) • “O guru da Usabilidade na Web" (The New York Times) Fonte da imagem: http://s3.amazonaws.com/media.nngroup.com/media/p eople/photos/jakobnielsen_cropped.jpg.400x400_q95_crop_upscale.jpg • “A pessoa mais inteligente da Web" (ZDNet AnchorDesk)
  • 8. AVALIAÇÃO HEURÍSTICA Análise do site do Pernambuco dá Sorte com base nas 10 Heurísticas de Nielsen
  • 9. 1. VISIBILIDADE DO STATUS DO SISTEMA Figura 01 – Registrando o cadastro.
  • 10. Figura 02 – Tela informativa de sucesso na operação realizada.
  • 11. 2. CONTROLE DO USUÁRIO E LIBERDADE Por ser um site relativamente simples, ou seja, que não requer muito esforço mental para ser utilizado, o usuário consegue assumir o controle da interface sem maiores problemas.
  • 12. 3. CONSISTÊNCIA Figura 03 – Contato confuso.
  • 13. Figura 04 – Site externo Instituto Ativa Brasil.
  • 14. 4. PREVENÇÃO DE ERROS Figura 05. Dica para o usuário.
  • 15. Figura 06 – Aviso ao usuário.
  • 16. 5. FLEXIBILIDADE E EFICIÊNCIA DE USO Figura 07 - Atalhos.
  • 17. 6. RELAÇÃO ENTRE A INTERFACE E O MUNDO REAL Figura 08 - Informativo.
  • 18. 7. RECONHECIMENTO AO INVÉS DE LEMBRANÇA Figura 09 - Dica de utilização. Figura 10 - Dica de utilização. Figura 11 - Dica de utilização.
  • 19. 8. ESTÉTICA E DESIGN MINIMALISTA Figura 12 – Exagero nos espaços em branco.
  • 20. Figura 13 – Exagero nos espaços em branco.
  • 21. • Figura 14 – Botões inconsistentes. • Figura 15 - Design do botão não segue padrões. • Figura 16 - Design do botão não segue padrões.
  • 22. Figura 17. Algum texto escrito. Figura 18 – Botão com texto clicável.
  • 23. 9. BOAS MENSAGENS DE ERRO O site apresenta boas mensagens de erro. Informa realmente ao usuário o erro cometido, ajudando-o assim a que ele possa refazer o processo do modo correto.
  • 24. 10. AJUDA E DOCUMENTAÇÃO • Embora o site seja simples e pequeno, não há um mapa do site que possa guiar o usuário, caso seja necessário, mas isso não causa maiores problemas no fluxo e no entendimento do site como um todo.
  • 26. REFERÊNCIAS • BEVAN, N. Usability Issues in web site design. Washington DC, 22-26, 1998. • Disponível em: <http://www.nigelbevan.com/papers/usweb98.pdf>. Acesso em: 17 out. 2013. • BEVAN, N. Usability is Quality of Use. Yokohama, 1995. • Disponível em: <http://www.nigelbevan.com/papers/usabis95.pdf>. Acesso em: 05 nov. 2013. • CAMPI, Monica. “O mundo estará conectado em 2020, diz Schmidt.” Revista eletrônica INFO Online. São Paulo, EDITORA ABRIL, 15 de abril de 2013. Disponível em: <http://info.abril.com.br/noticias/mercado/o-mundo-estara-conectado-em-2020-dizschmidt-15042013-24.shl> Acesso em: 01 de novembro de 2013. • GIL, Antonio Carlos. Como elaborar projetos de pesquisa. 3. ed. São Paulo: Atlas, 1994. • KARAT, J. The cost-benefit and business case analysis of usability engineering. InterChi’93, Amsterdam, Tutorial Notes 23, 1993. •
  • 27. REFERÊNCIAS • KRUG, Steve. Não me Faça Pensar: Uma Abordagem de Bom Senso À Usabilidade na Web. 2ª Ed. Alta Books Editora, 2008. • NEOSPOT. “Usability vs. User Experience (UX)”. NeoSpot. Lund, Suécia, 2011. Disponível em: < http://www.neospot.se/usability-vs-user-experience> Acesso em: 02 de novembro de 2013. • NIELSEN, J. 10 Usability Heuristics for User Interface Design, 1995a. Disponível em: < http://www.nngroup.com/articles/ten-usability-heuristics/>. Acesso em: 13 set. 2013. • NIELSEN, J. Characteristics of Usability Problems Found by Heuristic Evaluation, 1995b. Disponível em: <http://www.nngroup.com/articles/usability-problems-found-byheuristic-evaluation/>. Acesso em: 06 nov. 2013. • NIELSEN NORMAN GROUP. Remote Usability Test: Moderated and Unmoderated. Disponível em: <http://www.nngroup.com/articles/remote-usability-tests/>. Acesso em: 18 de out. de 2013. • PREECE, J.; ROGERS, I.; SHARP, H. Design de Interação: Além da Interação HumanoComputador; Porto Alegre: Bookman, 2005