AutoresAndressa VieiraÉ formada em Marketing e trabalha há10 anos com internet, 8 deles comusabilidade, arquitetura de inf...
AutoresPaula SatoFormada em Jornalismo pela ECA-USP,tem pós-graduação em Arquitetura daInformação pela Faculdade Impacta d...
AutoresMarcos VigoritoFormado em publicidade pela ECA-USPe técnico em processamento de dadospela Escola Técnica Federal de...
AutoresGabriela MuhlbachGraduada em Comunicação Digital pelaUNISINOS, trabalhou com editoraçãográfica e foi arquiteta de i...
AutoresGabriela MuhlbachGraduada em Comunicação Digital pelaUNISINOS, trabalhou com editoraçãográfica e foi arquiteta de i...
Toda a equipe
Toda a equipe • Estamos representando essa galera! • Equipe multi disciplinar: 8 pessoas de diversas   formações, 2 focada...
O que a Locaweb faz?
O que a Locaweb faz? • A empresa é conhecida por oferecer hospedagem e   registro de domínio • Também é forte em Cloud Ser...
Nosso carro chefe
e Cloud
e PABX Virtual
Gateway de pagamento
E-mail marketing [+15 mil]
Novos produtos: WebDesk
WebChat
WebStore
Organograma da Locaweb
Onde UX se encaixa?
Onde UX se encaixa? • UX faz parte da diretoria de produtos • Trabalhamos muito próximo da gerência de produto (PO) e   te...
Site é com o Marketing
Site é com o Marketing • Cuidamos apenas da interface de utilização dos serviços   (após contratação) • O site não logado ...
O que fazermos •   Cuidamos dos produtos: desde fichas de contratação até     a interface de administração •   Wireframes,...
Nosso processo
Nosso processo • Tudo é bastante dinâmico, pois adotamos metodologias   ágeis de desenvolvimento • Kanban (este quadro) é ...
Lidando com sistemas legados
Monstro gigante e obsoleto
Monstro gigante e obsoleto • A empresa está há 13 anos no mercado, tem mais de 600   funcionário e mais de 200 mil cliente...
Wireframe dos devs
Wireframe dos devs • Os devs queriam desenvolver o sistema sem a ajuda de UX.   Tanto que fizeram seu próprio wireframe • ...
Conversa com todas as áreas
Conversa com todas as áreas • O suporte técnico da Locaweb é interno, tem quase 300   analistas e utiliza esse sistema par...
Mapeando usos
Wireframes
Wireframes • Quando conseguimos entender o sistema e começamos os   wireframes, os desenvolvdores já estavam trabalhando n...
Está ficando pronto!
Está ficando pronto! • Estamos validando todas as entregas com os gestores e os   analistas do suporte • O pessoal está go...
Aprendizados•   UX pode ser a ponte entre áreas, pois é quem conversa com    usuários, clientes, PO, desenvolvedores, QA e...
UX envolvido no QA
UX em agências e consultorias
UX em agências e consultorias•   Em uma agência, o processo de desenvolvimento acontece    como em uma linha de produção, ...
UX na Locaweb
UX na Locaweb•   Na Locaweb a equipe de UX faz parte dos times de produtos•   Assim, os profissionais de UX estão envolvid...
Protótipo
Protótipo•   Esse é o protótipo que entregamos para os desenvolvedores•   Ele ilustra como deve acontecer a escolha da qua...
Como foi implementado
Como foi implementado•   Quando o desenvolvedor entregou a história, ela não havia    sido implementada como na especifica...
Soluções de UX implementadas
Soluções de UX implementadas•   É muito importe que UX valide as entregas, para que erros    como esses não passem•   Apes...
Os desenvolvedores e as interfaces
Os desenvolvedores e as interfaces•   Os desenvolvedores de backend exergam códigos e não sabem    lidar com interfaces•  ...
Entregáveis no final
Entregáveis no final•   Percebemos que entregar um calhamaço de documentação só    no fim do processo de UX, dificulta o a...
Negociações constantes
Negociações constantes•   Soluções boas e que não demandam muito esforço de    desenvolvimento são resultado de constantes...
UX participa do processo de QA
UX participa do processo de QA•   QA (quality assurance) é a fase de testes, que normalmente é    feita por desenvolvedore...
Quem ajuda UX nas validações?
Quem ajuda UX nas validações?• Temos um jovem aprendiz que nos ajuda a testar e também o  suporte, que nos dá feedbacks po...
Bom relacionamento entre UX e QA
Bom relacionamento entre UX e QA• É muito importante fazer amizade com o profissional de QA,  para que ele nos ajude a gar...
Aprendizados• Interação perfeita, mas não desenvolvida não  entrega valor• UX participa do processo todo e valida no final...
Pesquisa à nossa moda
Pesquisa online: site, painel, por e-mail
Pesquisa online: site, painel, por e-mail• Nem sempre temos tempo de fazer pesquisas by the book• Mesmo assim, estamos sem...
Somos abertos a feedbacks
Somos abertos a feedbacks• Acompanhamos diariamente o feedback de clientes: temos uma  ferramenta própria para isso, desen...
Ligamos para eles
Ligamos para eles• Fazemos entrevistas por telefone pois temos acesso aos dados  dos clientes• Utilizamos o telefone para ...
Pegamos carona com o suporte
Pegamos carona com o suporte• Uma grande vantagem é que o nosso suporte é proprio e tenho  fácil acesso a ele• Nós entrevi...
Dê olho no twitter
Dê olho no twitter• E ficamos ligados em qualquer oportunidade de contato com  quem queremos falar• Recebemos relatório do...
Falamos com ele por Skype
Falamos com ele por Skype• Entramos em contato com ele e o entrevistamos• A entrevista for super bacana, nos ajudou bastan...
Entrevistas em eventos
Entrevistas em eventos• Aproveitamos todas as oportunidades de contato com usuários,  para conhecê-los melhor• Como a Loca...
Também corremos atrás de números
Também corremos atrás de números• Fazemos testes A/B, consultamos dados de uso direto no banco,  pedimos informações para ...
Números (BI)Os grupos de cobrança são usados?               98.68%                               1.17%                    ...
Números (BI)• Um exemplo são os grupos de cobrança, que eram um requisito  para o novo painel de controle. Eles foram derr...
Personas
Personas•   Estamos usando também personas como ferramenta•   As primeiras nasceram by the book: mapeamos uso, fizemos ent...
Aprendizados• Ter alguma métrica é melhor do que não ter nenhuma• Contato permanente com o usuário é tão (ou mais)  import...
Perguntas?Andressa, Paula e Marcos
UX no Limite
Próximos SlideShares
Carregando em…5
×

UX no Limite

504 visualizações

Publicada em

Slides apresentados no EBAI 2011 (Encontro Brasileiro de Arquitetura de Informação) pela equipe de Experiência do Usuário da Locaweb

Publicada em: Tecnologia
  • Seja o primeiro a comentar

UX no Limite

  1. 1. AutoresAndressa VieiraÉ formada em Marketing e trabalha há10 anos com internet, 8 deles comusabilidade, arquitetura de informação,design de interação e experiência dousuário. Já passou pela Try, MapaDigital, Lumens e UOL, sendoresponsável pela coordenação deestudos de usabilidade e arquiteturade informação. Realizou dezenas deprojetos para sites institucionais,financeiros, portais, e-commerce,entre outras indústrias.Hoje é Gerente de Experiência doUsuário da Locaweb e Diretora eco-fundadora da UPA São Paulo.andressa.vieira@locaweb.com.br
  2. 2. AutoresPaula SatoFormada em Jornalismo pela ECA-USP,tem pós-graduação em Arquitetura daInformação pela Faculdade Impacta deTecnologia. Trabalhou com reportageme redação em redações de jornais,revistas e portais no Brasil e Japão,escrevendo sobre tudo, até fofoca.Também já foi garçonete, bartender erecepcionista.Atualmente, é Designer de Experiênciado Usuário na Locaweb.paula.sato@locaweb.com.br
  3. 3. AutoresMarcos VigoritoFormado em publicidade pela ECA-USPe técnico em processamento de dadospela Escola Técnica Federal de SãoPaulo. Trabalhou com a parte técnica naIBM Brasil e teve carreira solodesenvolvendo sites em outrasempresas que passou. Oficialmentetrabalha com usabilidade e experiênciado usuário há 4 anos.Hoje usa os diferentes conhecimentoscomo Designer de Experiência doUsuário na Locaweb.marcos.oliveira@locaweb.com.br
  4. 4. AutoresGabriela MuhlbachGraduada em Comunicação Digital pelaUNISINOS, trabalhou com editoraçãográfica e foi arquiteta de informação naW3 Haus em Porto Alegre. Trabalhou naLocaweb como Designer de Experiênciado Usuário.Atualmente trabalha no Terra comoArquiteta de Informação.
  5. 5. AutoresGabriela MuhlbachGraduada em Comunicação Digital pelaUNISINOS, trabalhou com editoraçãográfica e foi arquiteta de informação naW3 Haus em Porto Alegre. Trabalhou naLocaweb como Designer de Experiênciado Usuário.Atualmente trabalha no Terra comoArquiteta de Informação.
  6. 6. Toda a equipe
  7. 7. Toda a equipe • Estamos representando essa galera! • Equipe multi disciplinar: 8 pessoas de diversas formações, 2 focadas em design visual • Nós fazemos arquitetura de informação, design de interação, design de interface, QA (quality assurance) e pesquisa (de mercado e com usuários)
  8. 8. O que a Locaweb faz?
  9. 9. O que a Locaweb faz? • A empresa é conhecida por oferecer hospedagem e registro de domínio • Também é forte em Cloud Server • Mas ainda tem produtos como o PABX Virtual (ramais VOIP), gateway de pagamentos, WebStore (loja virtual), WebDesk (sistema de helpdesk) e WebChat (chat online)
  10. 10. Nosso carro chefe
  11. 11. e Cloud
  12. 12. e PABX Virtual
  13. 13. Gateway de pagamento
  14. 14. E-mail marketing [+15 mil]
  15. 15. Novos produtos: WebDesk
  16. 16. WebChat
  17. 17. WebStore
  18. 18. Organograma da Locaweb
  19. 19. Onde UX se encaixa?
  20. 20. Onde UX se encaixa? • UX faz parte da diretoria de produtos • Trabalhamos muito próximo da gerência de produto (PO) e tecnologia (DEV)
  21. 21. Site é com o Marketing
  22. 22. Site é com o Marketing • Cuidamos apenas da interface de utilização dos serviços (após contratação) • O site não logado é um canal de comuniçação e venda. E é o marketing quem cuida dele
  23. 23. O que fazermos • Cuidamos dos produtos: desde fichas de contratação até a interface de administração • Wireframes, protótipos, especificações, layout, pesquisa, textos e pitacos • E trabalhamos paralelamente ao desenvolvimento
  24. 24. Nosso processo
  25. 25. Nosso processo • Tudo é bastante dinâmico, pois adotamos metodologias ágeis de desenvolvimento • Kanban (este quadro) é um instrumento que nos ajuda a enxergar o que está acontecendo. Como está o desenvolvimento da história, ritmo, pendências, prioridades, envolvidos e dependências • Também é uma ferramente importante de comunicação com a equipe: obter o feedback sobre o nosso processo, sinalizar impedimentos etc
  26. 26. Lidando com sistemas legados
  27. 27. Monstro gigante e obsoleto
  28. 28. Monstro gigante e obsoleto • A empresa está há 13 anos no mercado, tem mais de 600 funcionário e mais de 200 mil clientes • O sistema é o mesmo desde a criação da empresa, mas nunca foi prioridade arrumar a casa. Até resolver mudar o Painel de Controle dos clientes e, consequentemente, a ferramenta do suporte • É um sistema legado com muita informação e ninguém na empresa sabia tudo que existia nele!
  29. 29. Wireframe dos devs
  30. 30. Wireframe dos devs • Os devs queriam desenvolver o sistema sem a ajuda de UX. Tanto que fizeram seu próprio wireframe • Quando fomos envolvidos no projeto já era agosto e o prazo para a entrega do sistema funcionando era final de outubro • Tivemos que correr para entender como o Sistema Integrado funcionava
  31. 31. Conversa com todas as áreas
  32. 32. Conversa com todas as áreas • O suporte técnico da Locaweb é interno, tem quase 300 analistas e utiliza esse sistema para gerenciar os dados dos clientes, quais serviços eles possuem e detalhes de cobrança • O Sistema Integrado é usado por outras áreas da empresa • Foi necessário conversar com todas as áreas que utilizam o sistema, para entender os usos e funcionalidades • Após pegar carona com o suporte e fazer muitas entrevistas, chegamos ao mapa a seguir
  33. 33. Mapeando usos
  34. 34. Wireframes
  35. 35. Wireframes • Quando conseguimos entender o sistema e começamos os wireframes, os desenvolvdores já estavam trabalhando no backend • Desenhamos os wireframes também em paralelo com o design visual • Ainda não terminamos todos os wires (o prazo foi estendido), mas já estamos fazendo a validação de algumas telas que foram entregues pelos desenvolvedores
  36. 36. Está ficando pronto!
  37. 37. Está ficando pronto! • Estamos validando todas as entregas com os gestores e os analistas do suporte • O pessoal está gostando e acreditamos que vamos melhorar a vida de muitos analistas
  38. 38. Aprendizados• UX pode ser a ponte entre áreas, pois é quem conversa com usuários, clientes, PO, desenvolvedores, QA e tem a função de levantar informações e disseminá-las• Não basta ler o briefing, é necessário conversar muito e mergulhar no projeto para entender todos os cenários de uso e necessidades• É preciso saber negociar, pois em um projeto de escopo grande, mas com pouco tempo, é necessário defender o usuário mas também debater com os desenvolvedores o que é possível entregar dentro do prazo
  39. 39. UX envolvido no QA
  40. 40. UX em agências e consultorias
  41. 41. UX em agências e consultorias• Em uma agência, o processo de desenvolvimento acontece como em uma linha de produção, com fases bem definidas• A equipe de UX é envolvida apenas no começo do projeto, mas quando chega ao fim não sabe se o que foi definido acabou sendo implementado
  42. 42. UX na Locaweb
  43. 43. UX na Locaweb• Na Locaweb a equipe de UX faz parte dos times de produtos• Assim, os profissionais de UX estão envolvidos em todas as etapas do processo, acompanhando o desenvolvimento, fazendo a validação das entregas
  44. 44. Protótipo
  45. 45. Protótipo• Esse é o protótipo que entregamos para os desenvolvedores• Ele ilustra como deve acontecer a escolha da quantidade de ramais na ficha de contratação do PABX virtual• Há um slider, através do qual o usuário aumenta ou diminui o número de ramais e, instantaneamente, vê quanto vai pagar
  46. 46. Como foi implementado
  47. 47. Como foi implementado• Quando o desenvolvedor entregou a história, ela não havia sido implementada como na especificação• O slider não tem sepadores e fica muito complicado para o usuário entender quantos ramais está contratando• Além disso, não há link para contratar mais de dez ramais• O tamanho da fonte e os espaçamentos também não estavam corretos
  48. 48. Soluções de UX implementadas
  49. 49. Soluções de UX implementadas• É muito importe que UX valide as entregas, para que erros como esses não passem• Apesar de entregarmos uma especificação muito completa, os desenvolvedores não têm paciência para ler tudo com atenção• Nem sempre a explicação escrita ou mesmo o protótipo deixam 100% claro o que deve ser feito
  50. 50. Os desenvolvedores e as interfaces
  51. 51. Os desenvolvedores e as interfaces• Os desenvolvedores de backend exergam códigos e não sabem lidar com interfaces• Para eles, é difícil pegar erros de layout• Como nem sempre temos especialistas em interface disponíveis, é necessário validar tudo• O desafio é garantir que estes problemas não atrapalhem o produto final
  52. 52. Entregáveis no final
  53. 53. Entregáveis no final• Percebemos que entregar um calhamaço de documentação só no fim do processo de UX, dificulta o acordo com o PO e os desenvolvedores• Trabalha dessa maneira também dificulta a comunicação
  54. 54. Negociações constantes
  55. 55. Negociações constantes• Soluções boas e que não demandam muito esforço de desenvolvimento são resultado de constantes negociações• É importante conversar pessoalmente e não entregar apenas a documentação para evitar ruídos de comunicação• Nesses bate-papos justificamos nossas decisões de design ou encontramos uma solução melhor juntos
  56. 56. UX participa do processo de QA
  57. 57. UX participa do processo de QA• QA (quality assurance) é a fase de testes, que normalmente é feita por desenvolvedores para garantir a qualidade do código e o funcionamento do software/produto• Na Locaweb, UX também participa do QA, validando se tudo foi desenvolvido de acordo• UX tem o poder de validar e também reprovar uma entrega
  58. 58. Quem ajuda UX nas validações?
  59. 59. Quem ajuda UX nas validações?• Temos um jovem aprendiz que nos ajuda a testar e também o suporte, que nos dá feedbacks pois está em contato direto om o cliente• Não temos um modelo fixo de entregáveis. As mesmas instruções passadas aos DEVs são guia para o desenvolvedor responsável pelo QA• Nossas especificações também ajudam a construir casos de uso para QA
  60. 60. Bom relacionamento entre UX e QA
  61. 61. Bom relacionamento entre UX e QA• É muito importante fazer amizade com o profissional de QA, para que ele nos ajude a garantir a qualidade do produto do ponto de vista de UX• O QA também pode nos ajudar a encontrar cenários de uso que não havíamos pensado
  62. 62. Aprendizados• Interação perfeita, mas não desenvolvida não entrega valor• UX participa do processo todo e valida no final para garantir a qualidade• Envolvimento das pessoas responsáveis para ter melhores resultados• A mudança de escopo sempre acontecerá
  63. 63. Pesquisa à nossa moda
  64. 64. Pesquisa online: site, painel, por e-mail
  65. 65. Pesquisa online: site, painel, por e-mail• Nem sempre temos tempo de fazer pesquisas by the book• Mesmo assim, estamos sempre em contato com clientes e coletando dados• Fazemos pesquisa através de fomrulário online no site, no painel dos produtos e também por e-mail• Os clientes são bastante receptivos e os resultados são bem legais
  66. 66. Somos abertos a feedbacks
  67. 67. Somos abertos a feedbacks• Acompanhamos diariamente o feedback de clientes: temos uma ferramenta própria para isso, desenvolvida pela equipe da Locaweb• Também estamos implantando o UserVoice, que pode ser acessado inclusive por não clientes• Um cliente pode ver o feedback do outro e também votar no que achar mais interessante
  68. 68. Ligamos para eles
  69. 69. Ligamos para eles• Fazemos entrevistas por telefone pois temos acesso aos dados dos clientes• Utilizamos o telefone para pesquisas curtas e pontuais• E também para entender melhor os feedbacks
  70. 70. Pegamos carona com o suporte
  71. 71. Pegamos carona com o suporte• Uma grande vantagem é que o nosso suporte é proprio e tenho fácil acesso a ele• Nós entrevistamos os analistas e também pegamos carona nos atendimentos
  72. 72. Dê olho no twitter
  73. 73. Dê olho no twitter• E ficamos ligados em qualquer oportunidade de contato com quem queremos falar• Recebemos relatório do twitter• Estávamos trabalho no novo painel e essa cara tuitou reclamando da usabilidade do atual…
  74. 74. Falamos com ele por Skype
  75. 75. Falamos com ele por Skype• Entramos em contato com ele e o entrevistamos• A entrevista for super bacana, nos ajudou bastante a entender melhor algumas questões de uso e confirmar impressões• E o cara ainda ficou feliz :D
  76. 76. Entrevistas em eventos
  77. 77. Entrevistas em eventos• Aproveitamos todas as oportunidades de contato com usuários, para conhecê-los melhor• Como a Locaweb promove vários eventos em diferentes capitais, aproveitamos para conhecê-los, bater papo, marcar entrevistas• Se a pesquisa for rápida, fazemos até durante o evento
  78. 78. Também corremos atrás de números
  79. 79. Também corremos atrás de números• Fazemos testes A/B, consultamos dados de uso direto no banco, pedimos informações para o BI e temos ferramentas como o Click Tale• Números nos ajudam tanto nas decisões, como no embasamento de nossa propostas
  80. 80. Números (BI)Os grupos de cobrança são usados? 98.68% 1.17% 0.15% 1 grupo 2 grupos acima de 3 grupos
  81. 81. Números (BI)• Um exemplo são os grupos de cobrança, que eram um requisito para o novo painel de controle. Eles foram derrubados pelos números• Pouquíssimos clientes usavam, então porque adicionar esta complexidade para o usuário?• Os poucos clientes que usavam era devido a um desvio de uso, para atender a outra necessidade (mais simples, inclusive do ponto de desenvolvimento)
  82. 82. Personas
  83. 83. Personas• Estamos usando também personas como ferramenta• As primeiras nasceram by the book: mapeamos uso, fizemos entrevistas pessoais, questionário online, analisamos métricas de BI e fizemos entrevistas com o suporte• Já a segundo leva… Em função da correria, apenas mapeamos uso e fizemos um questionário online. Também usamos o conhecimento que tínhamos sobre os usuários, mas com o compromisso de validar e amadurecer aquelas personas• Trabalhar com persona é legal, ajuda bastante, mas dá um trabalhão: é dificil encaixar em nossa correria :/• Ainda estamos aprendendo a fazer e usar as personas
  84. 84. Aprendizados• Ter alguma métrica é melhor do que não ter nenhuma• Contato permanente com o usuário é tão (ou mais) importante que fazer uma pesquisa pontual• É bom poder validar novas funcionalidades em pouco tempo• Pesquisa sempre é importante. Se não tiver tempo, terceirizar!
  85. 85. Perguntas?Andressa, Paula e Marcos

×