Desafio de UX/UI
App Unimed Central Nacional
Como usei UX/UI para melhorar a experiência dos usuários do app da Unimed.
Recebi um desafio para identificar um problema em um app que uso com frequência e propor uma solução aplicando processos de UX/UI. Aqui, descreve o passo a passo do processo que utilizei para ir da definição do problema à solução e detalho, de forma resumida, cada um deles:
- Objetivo
- Problema
- Imersão
- Matriz CSD
- Hipóteses
- Pesquisas
- Benchmark
- Ideação
- Rabiscoframe
- Wireframe
- Protótipo
- Teste
- Conclusão
Objetivo
Melhorar a experiência de usuários do app exclusivo para beneficiários da Central Nacional Unimed.
Por conta do prazo, decidi focar em uma das funcionalidades mais acessadas no app: O Guia Médico.
Problema
Em geral, o app da Central Nacional Unimed é bem confuso. Entendo que a quantidade de informações que o um app de plano médico precisa ter é enorme e procedimentos médicos possuem uma linguagem técnica difícil para a maioria das pessoas, por isso o UX Writing , desenho de ícones, ilustrações, hierarquia das informações, cores etc. precisam ser muito bem pensados, do contrário, geram muita confusão.
Imersão
Nesta etapa, procurei mergulhar no problema, conhecer melhor a empresa, e entender quem são seus usuários. Na imersão, desenvolvi as personas e sua jornada para descobrir seus anseios e dores.
A Unimed é a maior cooperativa médica do mundo e seu corpo diretivo é todo formado por médicos (dos diretores aos presidentes das cooperativas locais), que ocupam cargos eletivos com duração de 4 anos. O fato de haver uma renovação constante na diretoria, e de que seus ocupantes não necessariamente têm formação na área que dirigem, traz alguns desafios para a empresa, como: muita burocracia; lentidão nas tomadas de decisão; resistência em inovação e falta de projetos de longo prazo.
Após acompanhar o uso do app pude observar alguns problemas:
- Sistema de busca não é prático
- Formulários confuso (alguns inputs que deveria ter dropdown não tem, o que força o usuário a saber, por exemplo, o nome das especialidades)
- Falta de objetividade
- UX Writing (termos muito técnicos ou que não deixam a ação clara)
- Mensagens de alerta “ameaçadores”.
Personas e Jornada do Usuário:
Matriz CSD
Após definir as personas, precisei fazer descobertas relevantes sobre cada uma delas e priorizar quais problemas atacar.
Para isso, usei a Matriz CSD e escrevi algumas certezas, suposições e dúvidas que seriam confirmadas, ou não, com a pesquisa qualitativa.
Certezas:
- A maioria dos usuários não sabem classificar o que estão sentindo ou qual problema eles têm, por isso não conseguem encontrar a especialidade que precisam no Guia;
- Os usuários pesquisam sobre os médicos antes de marcar consultas;
Suposições:
- Tanto os labels, como mensagens e termos utilizados no Guia são muito técnicos ou não dão clareza para a ação pretendida e isso pode confundir o usuário;
- Os usuários não sabem o que as especializações tratam e pesquisam na internet pra tentar descobrir;
- No geral, a aparência é pouco amigável, principalmente para um app de saúde.
Dúvidas:
- Os usuários preferem o formato “book” dos Guias e ainda não estão tão familiarizados com o digital.
Pesquisa Quantitativa
O próximo passo foi validá-las através de uma pesquisa Quantitativa.
Descobertas da Matriz CSD:
- A maioria usuários saem do app para pesquisar no Google e descobrir qual a especialidade buscar no Guia;
- Em algumas ocasiões, ligaram para o consultório para confirmar se aquela seria a especialidade que procuravam;
- É muito comum pesquisarem sobre o médico antes de marcar uma consulta. Geralmente, buscam depoimentos e reclamações de outros usuários;
- Minha dúvida se os usuários preferem o guia na versão Book não se confirmou.
Hipóteses
Com o resultado da pesquisa quantitativa elaborei algumas hipóteses para o produto:
- Deixar o app com aparência mais amigável pode melhorar a experiência do usuário no momento que ele busca a solução do seu problema, ainda mais quando observado que nas etapas da Jornada do Usuário os sentimentos são, em sua maioria, negativos;
- Com formulários inteligentes o usuário vai poder encontrar exatamente o que precisa, sem perder tempo com consultas desnecessárias;
- Melhorar o UX Writing fará com que o usuário não se sinta incapaz por não entender o que fazer;
- Disponibilizar informações e soluções para enfermidades comuns, dicas, artigos etc. faria com que o usuário acionasse menos o plano e resolvesse seu problema de forma mais rápida;
- Possibilidade de os próprios usuários classificarem os médicos para que outros possam escolher com base neste ranking.
Pesquisa Qualitativa
Assim como foi feito com a matriz CSD, utilizei uma pesquisa para validar as minhas hipóteses, mas, para isso, optei pela Qualitativa, para extrair feedbacks melhores e mais reais.
Get Alisson (Ali) Melo’s stories in your inbox
Join Medium for free to get updates from this writer.
Descobertas das hipóteses:
- Antes de marcar consultas o usuário tende a pesquisar na internet sobre enfermidades ou pegar dicas em grupos de redes sociais. Isso faz com que o usuário corra o sério risco de piorar sua saúde por conta de informações equivocadas. Por isso receberam bem a ideia de ter um espaço no app onde possam tirar essas dúvidas;
- Em conversas sobre os textos de alguns botões ou inputs ficou claro que a forma como são escritos prejudica a navegabilidade e, consequentemente, a experiência do usuário;
- Perde-se muito tempo no formulário de pesquisa até entender quais informações colocar;
- Alguns textos estão com baixo contraste e podem atrapalhar o entendimento da ação;
- É comum que os usuários pesquisem na internet depoimentos sobre os médicos antes de marcar uma consulta.
Ideação
Com as descobertas feitas pelas pesquisas elaborei e organizei ideias e insights para a solução dos problemas:
- Criar uma tela de boas-vindas com uma mensagem amigável direcionando o usuário para o Guia;
- Melhorar o sistema de busca, tornando-o o mais simples possível;
- Junto com o campo de busca inserir pequenas descrições de cada categoria disponível, por exemplo: Especialidades, Médicos, Clínicas etc;
- Um destaque para emergência e uma breve descrição;
- Permitir o usuário descrever seus sintomas e o app buscar e especialidade adequada;
- Filtro com distância, ranking do médico, gênero etc.;
- Artigos na home divididos por tema, tópicos etc.;
- Menu de fácil acesso para a home, chat, agendamentos etc.;
- Limpar o resultado das buscas, deixar só as informações mais relevantes;
- Opção de consultas por videochamadas;
- Criar um perfil para o médico cadastrado, com foto, nome, especialidade, ranking etc.
Para decidir quais soluções seriam priorizadas, e quais ficariam para outras fases do projeto, usei a matriz de Impacto X Esforço, com ela consegui definir quais soluções têm maior impacto na experiência do usuário e, ao mesmo tempo, seria viável para o negócio.
Por conta da inviabilidade técnica, de tempo ou custo, algumas soluções foram descartadas para este momento:
- Permitir o usuário descrever seus sintomas e o app buscar automaticament a especialidade adequada;
- Opção de consultas por videochamadas;
Rabiscoframes
Sempre quando possível, começo a materializar o produto no papel e faço testes para saber se a ideia vai funcionar na prática. Essa é uma forma rápida e fácil de testar.
Clique aqui para testar o Rabiscoframe
Wireframe
Com os wireframes eu consigo testar de forma mais real aspectos como UX Writing, botões, arquitetura de informações, tamanhos etc. E consigo fazer correções de forma rápida.
Clique aqui para testar o Wireframe
Protótipo
Usando o wireframe como base, desenhei as telas do novo app do Guia Médico da Central Nacional Unimed fazendo alguns pequenos ajustes que foram descobertos em um teste de usabilidade feito com o wireframe.
Style Guide:
A paleta cromática é a mesma do branding da marca e foi extraída do site institucional da empresa.
Tipografia:
Escolhi a tipografia da família Poppins. Ela é uma fonte disponibilizada pelo Google o que ajuda a carregar as páginas mais rapidamente. Além disso, ela é uma fonte bastante geométrica e com uma família de tipos bem grande o que ajuda na legibilidade. As vogais são têm formas bem arredondadas e isso combina bem com as formas arredondadas do layout.
Para definir os diferentes tamanhos multipliquei a fonte base de 12px por 1.618 (golden section).
Protótipo
Com base na pesquisa, entendi que o layout teria que priorizar as informações e destacar o que era realmente importante. Para isso, optei por um layout em que a cor branca seria a grande protagonista.
Para o UX Writing (não é minha especialidade, mas apliquei por entender a importância de que os termos usados e as ações devem ser cada vez mais claros e objetivos para o usuário) troquei alguns textos para um mais amigável e próximo ao usuário, como se o usuário estivesse realmente numa consulta.
Clique aqui para testar o Protótipo em Alta
Destaques
Com base na pesquisa quantitativa, pude observar que muitas pessoas têm dificuldade em saber qual especialidade buscar e perdem muito tempo pesquisando na internet ou ligando para os consultórios. Pensando nisso, propus um filtro de buscas em forma de um corpo humano, onde o usuário aponta para qual região do corpo precisa de atendimento e o app indica as possíveis especialidades.
Filtro de especialidades:
Classificação dos médicos:
Outra dor do usuário era ter que buscar referências do médico com outros pacientes, geralmente na internet. Para isso, resolvi criar um sistema de classificação dos profissionais. Cada usuário pode classificar o atendimento de 0 a 5 estrelas e a soma dessas classificações aparece no perfil do médico.
Teste de Usabilidade
Com o protótipo em alta fidelidade em mãos parti para o teste de usabilidade. Com ele pude testar as soluções propostas e a navegabilidade.
Fiz o teste passando algumas tarefas para alguns usuário cumprir, como encontrar uma especialidade; fazer uma busca; encontrar um médico etc., e eu observava enquanto eles navegavam.
Do teste fiz algumas descobertas:
- O novo layout agradou bastante os usuários. Pontos como contraste, tipografia e ícones foram elogiados;
- A forma como a opção de Emergência foi colocada foi um ponto positivo. No app atual isso gerava um pouco de confusão, fazia com que clicassem no botão sem precisar. Estes microsegundos perdidos atrapalham a experiência;
- O novo Filtro de Especialidades, onde o usuário podia clicar na ilustração do corpo para saber o que buscar, foi bem recebido e curva de aprendizado foi bem rápida;
- Foi sugerido por alguns que, além da classificação dos médicos, houvesse também um campo de depoimentos;
- Sentiram falta da indicação da distância entre o consultório e o local do usuário na listagem dos médicos. Este é um ponto importante de escolha.
Conclusão
Construí este case em um prazo bastante reduzido para que se pudesse colher mais informações do cliente e dos usuários, isso limitou um pouco a proposta de soluções, mas acredito que, para este desafio, cheguei a um bom resultado, ainda mais levando em conta que eu realmente uso o app do guia da Unimed e, por muitas vezes, minha experiência não foi boa.
