Palestra: Vamos entender ux? Uma visão geral

435 visualizações

Publicada em

Se você é um designer e está começando a lidar com o complexo mundo digital ou um desenvolvedor que, às vezes, precisa tomar decisões sobre a experiência do usuário, esta palestra vai ter dar uma visão geral sobre um projeto de UX, o que é, qual a importância de UX para produtos, como os UX designers pensam, quais ferramentas são usadas e quais etapas fundamentais de um projeto UX.

Publicada em: Design
0 comentários
5 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
435
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1
Ações
Compartilhamentos
0
Downloads
0
Comentários
0
Gostaram
5
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Palestra: Vamos entender ux? Uma visão geral

  1. 1. carladebona.com VAMOS ENTENDERUX?
  2. 2. UDESC PUC/SP CARLA DE BONA Designer Gráfica Mestre em Comunicação e Semiótica Startup Aplicativo mobile Projetos de criação de marcas e UX/UI design em empresas e startups Mentora de competidores de web e DG para o WorldSkills carladebona.com Instrutora de UX na caelum Instrutora na alura Apoia diversas iniciativas de empoderamento da mulher na tecnologia Professora de Graduação da FIAP
  3. 3. USER EXPERIENCE não é fazer um design bonito As telas são só uma parte do processo...
  4. 4. UX? O QUE É
  5. 5. DELETAR QUANTOS COISAS VOCÊ DEIXOU DE USAR OU ACESSAR PQ ELES ERAM RUINS?
  6. 6. REALIZADO COM SUCESSO!
  7. 7. DESIGN CENTRADO NO USUÁRIO
  8. 8. FONTE: The Mobile PlayBook Google 2013 do usuários alegam menos chance de retornar a um site depois de uma experiência de uso negativa 88% vão para um site concorrente depois de uma experiência ruim no site mobile 41% FONTE: ECONSULTANCY 2012
  9. 9. é o custo às empresas de sites que demoram para carregar $2,6 dos clientes mobile vão abandonar o seu site se eles tiverem que esperar 3 segundos para uma página para carregar 57% FONTE: ECONSULTANCY 2012 FONTE: MoPowered 2014 BILHÕES DE DÓLARES
  10. 10. dos julgamentos dos usuários sobre a credibilidade de um site estão baseados na qualidade estética do site 75% FONTE: HCI 2009
  11. 11. DEU PRA TER UMA IDEIA DA IMPORTÂNCIA DE INVESTIR EM BOAS EXPERIÊNCIAS DE USO? OW YEAH!
  12. 12. #comoFaz
  13. 13. Feito por Envis Preciselt GmbH (2009 | Redesign 2013) Baseado no “As disciplinas de UX do Dan Saffer - 2008”
  14. 14. MÉTODOS E ENTREGÁVEIS BLUEPRINT CONSUMER JOURNEY MAP USER STORIES PERSONAS ECOSYSTEM MAP COMPETITIVE AUDIT VALUE PROPOSITION STAKEHOLDERS INTERVIEWS KEY PERFORMANCE INDICATORS BRAINSTORMING MOODBOARDS STORYBOARDS USER FLOW TASK ANALYSIS TAXONOMIES HEURISTIC ANALYSIS SITEMAP FEATURES ROADMAP USE CASES AND SCENARIOS METRICS ANALYSIS FOCUS GROUP QUANTITATIVE SURVEYUSABILITY TEST CARD SORTING A/B TEST EYETRACKING ACCESSIBILITY ANALYSIS SKETCHES WIREFRAMES PROTOTYPES PATTERN LIBRARY
  15. 15. QUEM É O ILUMINADO QUE FAZ TUDO ISSO?
  16. 16. DESIGNER DE INTERFACES ARQUITETO DE INFORMAÇÃO PESQUISADOR DESIGNER DE INTERAÇÃO DESIGNER DE ESTRATÉGIAS DESENVOLVEDOR EMPREENDEDOR
  17. 17. TIME MULTIDISCIPLINAR CULTURA UX
  18. 18. #comoFaz DE VERDADE AGORA
  19. 19. PESQUISA PLANEJAMENTO PROTOTIPAÇÃO VALIDAÇÃO
  20. 20. PESQUISA
  21. 21. POR QUE A PESQUISA COM USUÁRIOS É IMPORTANTE PARA CRIAÇÃO DE EXPERIÊNCIAS?
  22. 22. ESTUDAR O USUÁRIO
  23. 23. ESTUDAR O USUÁRIO DENTRO DE UM CONTEXTO
  24. 24. ESTUDAR O USUÁRIO DENTRO DE UM CONTEXTO USANDO FERRAMENTAS
  25. 25. ESTUDAR O USUÁRIO DENTRO DE UM CONTEXTO USANDO FERRAMENTAS PARA EXECUTAR TAREFAS
  26. 26. ESTUDAR O USUÁRIO DENTRO DE UM CONTEXTO USANDO FERRAMENTAS PARA EXECUTAR TAREFAS PARA ATINGIR UM OBJETIVO
  27. 27. ALÉM DISSO...
  28. 28. Estou feliz que todos concordam
  29. 29. Ops...
  30. 30. ah ha!
  31. 31. Estou feliz que todos concordam
  32. 32. ENTREVISTAS NÃO ESTRUTURADA (OPEN-ENDED) ESTRUTURADA
  33. 33. NÃO ESTRUTURADA ESTRUTURADA Uma conversa sobre um assunto determinado Tendem a ser aprofundadas Perguntas abertas Para obter primeiras impressões Visão geral do problema Novos insights dificil de tabular e analisar Perguntas fechadas e respostas precisas Perguntas curtas e claras Estudo padronizado Obter feedback Dados mais rapidos e fáceis de analisar Validar informações anteriores Não oferece novos insights
  34. 34. DADOS DADOS E MAIS... DADOS... #comoFaz
  35. 35. Projetar com dados Não é só seguir os números, envolve observação, testes, empatia com o usuário. Margaret Gould Stewart User experience master
  36. 36. EMPATIA Capacidade de compreender o sentimento ou reação da outra pessoa imaginando-se nas mesmas circunstâncias.
  37. 37. PERSONAS Um método de segmentação de mercado. É uma ferramenta que utiliza pessoas fictícias para representar usuários de um serviço ou produto.
  38. 38. VANTAGENS EM SE USAR PERSONAS Habilita o time a trabalhar com necessidades e desejos do público alvo Serve para comunicar características do usuário de maneira sintética e fácil de ser compreendida Traz mais “humanidade” (um rosto humano!) para dados fatuais
  39. 39. PLANEJAMENTO
  40. 40. FAZER ESCOLHAR TOMAR DECISÕES
  41. 41. SITEMAP CARD SORTING USER STORIES USER FLOW
  42. 42. SITE MAP Ajuda a visualizar a estrutura básica e a navegação geral entre as diferentes partes do sistema. Um dos métodos mais conhecidos de UX Consiste em um diagrama das áreas de um site/app organizadas hierarquicamente
  43. 43. SITE MAP Exemplo visual
  44. 44. CARD SORTING conteúdo, organização e taxonomia
  45. 45. EXEMPLO DE CARD SORTING DE UM WEBSITE
  46. 46. USER STORIES focam nos objetivos do usuário e como o sistema alcança esses objetivos
  47. 47. USER STORIES Como um(a) Eu quero... Para que... um leitor um glossário para me ajudar a entender as palavras que eu não sei eu possa entender melhor a história Como um(a) Eu quero... Para que... um usuário eu quero ter um login eu possa acessar meu painel
  48. 48. USER FLOW É o caminho que um usuário segue através de sua interface do site para concluir uma tarefa (fazer uma reserva, comprar um produto, inscrever-se a alguma coisa). Construir um fluxo que atenda às necessidades do usuário
  49. 49. USER FLOW Recuperando senha esquecida
  50. 50. MINISTÉRIO DE UX ADVERTE: CONHEÇA OS MAIS DIVERSOS MÉTODOS E FERRAMENTAS DE UX. DESENVOLVA A HABILIDADE DE ESCOLHER A MAIS ADEQUADA E DE ESCULPIR SUAS PRÓPRIAS FERRAMENTAS E PROCESSOS
  51. 51. PROTOTIPAÇÃO
  52. 52. CLARO EXPLÍCITO ACIONÁVEL
  53. 53. SE SUAS IDÉIAS NÃO PODE SER DESENHADAS, NÃO PODE SER FEITAS.
  54. 54. ESBOÇOS Sketching é um exercício de brainstorm A técnica ajuda a definir melhor o nosso entendimento do problema, ao mesmo tempo em que nos ajuda a pensar nas possíveis soluções.
  55. 55. TELAS FINAIS DO PROJETO
  56. 56. PRIMEIRO RABISCOFRAME
  57. 57. WIREFRAME A planta baixa do site, seu esqueleto. As disposições e orientações de cada elemento.
  58. 58. existem muitas outras... INVISION P.O.P. APP AXURE BALSAMIQ PROTÓTIPOS NAVEGÁVEIS EXPERIÊNCIA DE NAVEGAÇÃO DOCUMENTOS MAIS ENXUTOS MAIS FACILIDADE PARA TESTAR COM USUÁRIOS
  59. 59. FERRAMENTAS wireframes/protótipos MARVEL APP WIREFRAME.CC SKETCH APP PROTO.IO
  60. 60. VALIDAÇÃO
  61. 61. UXITERATIVO PROCESSO
  62. 62. um PRODUTO DIGITAL nunca está 100% pronto...
  63. 63. PESQUISA ACHÔ :D
  64. 64. TESTE DE USABILIDADE É uma técnica de avaliação São estes com usuários representativos. (Não vale fazer com o seu colega designer!) Tem um roteiro de tarefas E um analista observando (na maior parte dos casos) Teste com 5 usuários - Nielsen
  65. 65. ALGUMAS FERRAMENTAS DE VALIDAÇÃO HOTJAR.COM TESTR.COM.BR MIXPANEL SILVERBACK APP
  66. 66. QUASE NO FIM...
  67. 67. CHECKLIST Use com moderação BONUS ixdchecklist.com userium.com goodui.org uxchecklist.github.io
  68. 68. OI! PODE IR EMBORA? FICA!!!!! VAI TER BOLO! EU ACHO...OI!AE! OBRIGADA :) CABÔ. FIM. VLW. FLWS. carladebona.com @carladebona

×