Melhorando o acompanhamento e controle da saúde das crianças
Como utilizamos UX design para atualizar a caderneta da criança e acompanhar o desenvolvimento e saúde delas.
O desafio
O meu objetivo é atuar como UX Designer e durante o curso UX Unicórnio, juntamente com Larissa Gialorenço, Rebeca Jacobsen, Thaisa Shalders e Yago Torres, escolhemos o desafio de desenvolver um produto que ajude pais e profissionais, do setor da saúde, no acompanhamento da saúde e vacinas de crianças em fase de desenvolvimento, como alternativa digital à Caderneta de Saúde da Criança, esta que é entregue quando a criança nasce e é usada até os 10 anos de idade, para, além do controle das vacinas, também auxiliar no desenvolvimento da saúde e registros de todo seu histórico médico.
O cenário atual
Após o nascimento da criança, os pais recebem a Caderneta de Saúde da Criança (CSC) — você pode ver a versão para meninas aqui e para meninos aqui — , que contém cerca de 90 páginas de informações sobre o desenvolvimento da criança, gestação, controle das vacinas e muito mais. Esse documento deve ser utilizado até a criança completar 10 anos de idade, ou seja, os responsáveis pela criança devem manter a Caderneta sempre em mãos, atualizada e conservada durante todos esses anos.
Porém, com uma breve pesquisa, conseguimos ver que nem sempre os pais recebem a CSC do governo e acabam precisando pagar por isso.
Devido ao momento que estamos passando, com muitas fake news e movimentos anti vacina, muitos pais acabam não vacinando suas crianças, o que pode fazer com que doenças que já haviam sido erradicadas, devido as vacinações, voltem a atingir o país.
Apesar dos inúmeros tópicos, gráficos e informações presentes na CSC, os responsáveis, em sua maioria, utilizam-na somente para o controle e atualização das vacinas, ignorando as diversas outras funções que ela oferece.
Considerando a rotina corrida da maioria das famílias com crianças, manter a caderneta atualizada e não perder prazos de vacina pode ser um desafio.
Objetivo do produto
Criar um aplicativo que permita o acesso digital à Caderneta (CSC), incentivando que as famílias, de pelo menos 20% das crianças no Brasil até 2022, estejam utilizando as diversas funções que a CSC Digital oferece — não somente o registro de vacinas.
Usuários
Nossos usuários são:
• Famílias de crianças entre 0–10 anos;
• Profissionais de saúde do SUS.
Para este desafio, a fim de estudo, optamos por nos aprofundar no usuário “Família’’, pois entendemos que é o usuário que mais será atingido com nossa solução, portanto, todos tópicos a seguir terão foco somente neste usuário.
Perfil dos usuários
Dentro do usuário Família identificamos várias proto-personas: Casais, mãe/pai solo, avós que cuidam de netos, etc. Porém durante a pesquisa e com a amostra que obtivemos validamos uma persona principal, segue abaixo suas principais tarefas, dores e analgésicos:
Contexto do Usuário
A jornada da família começa no momento em que precisam levar seus filhos em uma consulta com o médico pediatra ou ir até um local de vacinação.
Jornada do usuário
Utilizamos o mapeamento de experiência para identificar quais são as principais dores e sentimentos dos usuários e ter uma compreensão básica de uma experiência sem a nossa solução. Como podemos ver, a jornada se torna um ciclo e o usuário a percorre inúmeras vezes durante o crescimento da criança:
Primeira etapa de validação
Iniciamos esta etapa escrevendo, entre o time, todas as nossas suposições e hipóteses sobre a família, levando em consideração as suas possíveis dores e principais tarefas.
Após finalizar as suposições sobre a família, utilizamos o método CSD para classificá-las.
Com ajuda das classificações no CSD, alocamos todas as suposições dentro da Matriz e no final, escolhemos as que ficaram no quadrante + Impacto — Conhecimento.
Utilizamos as suposições escolhidas (+ Impacto e — Conhecimento) para criarmos as perguntas da Pesquisa Quantitativa, que objetivou principalmente em compreender as dificuldades das famílias com o uso da CSC e entender os pontos de melhoria. Foram feitas 13 perguntas no total, aqui selecionamos alguns exemplos que mostram como transformamos suposições em hipóteses. O formulário completo pode ser verificado clicando aqui.
Alguma vez você já perdeu a CSC?
• Sim
• Não
Você já esqueceu a CSC para alguma consulta?
• Não, nunca esqueci
• Sim, já esqueci pelo menos uma vez
• Sim, já esqueci mais de uma vez
Que suposição queremos validar com essas duas perguntas:
Entender quão frequente é o uso da CSC na rotina da família.
Com qual frequência você utiliza a CSC? (Sendo 1 quase nunca e 5 muito utilizada)
• 1
• 2
• 3
• 4
• 5
Que suposição queremos validar com essa pergunta:
Entender as dificuldades da utilização da CSC.
Os questionários foram distribuídos através de redes sociais, com foco nos responsáveis finais por crianças de 0 a 10 anos. Nosso objetivo era obter de 50 a 100 respostas e ao final de 2 dias, conseguimos o total de 77. Abaixo estão os gráficos da pesquisa:
Através da pesquisa quantitativa, descobrimos que:
- A maioria das famílias utilizam a CSC mais para o controle de vacinação;
- Nem todas as famílias recebem a CSC;
- Alguns também utilizam para consultas pediátricas e para acompanhar o crescimento da criança.
Diante disso, aplicamos a pesquisa qualitativa, com perguntas direcionadas a estas descobertas, com o objetivo de entender o porquê e buscar uma solução. Selecionamos 5 pessoas, das que receberam a CSC, para realizar a pesquisa via telefone.
Concluímos que:
Alternativas de solução
Utilizamos o método How Might We (Como Poderíamos) que permite capturar as ideias e pontos de dor dos usuários e os reformular positivamente.
Através dos problemas identificados nas pesquisas com os usuários, chegamos à seguinte questão: Como poderíamos incentivar e facilitar o uso das diversas funções disponíveis na CSC pelas famílias brasileiras?
A matriz de impacto x esforço é uma ferramenta para priorização de tarefas. Nela posicionamos e medimos o esforço e impacto de cada uma das nossas alternativas de solução e priorizamos as que ficaram no quadrante de menos esforço e mais impacto.
Para conferir esta etapa por completo, clique aqui.
A solução
Utilizamos o Esboço em 4 etapas para colocar as ideias no papel e exercitar nossa criatividade. Priorizamos o que era mais importante em cada tela, e através disso pudemos ter mais clareza de como seria a solução.
Cada integrante do grupo colocou suas ideias no papel, utilizando tudo que aprendeu no curso até o momento, após isso fizemos uma apresentação individual, juntamos as melhores ideias e transformamos em um protótipo de baixa fidelidade. Você pode testar clicando aqui.
Primeiro teste de usabilidade
Após desenvolver nosso protótipo de baixa fidelidade, partimos para os primeiros testes com os usuários. De acordo com o roteiro que definimos, selecionamos 4 usuários do nosso público alvo.
Tarefas:
1. Você acabou de criar seu acesso, entre no app e cadastre seu filho.
2. Seu filho acabou de completar 2 meses e ainda não tomou as vacinas indicadas para essa faixa de idade, entre no perfil do seu filho Gustavo, verifique qual vacina precisa ser tomada e veja as informações sobre ela.
3. Você levou a criança ao médico, mas esqueceu o que foi passado durante a consulta, verifique o histórico médico da criança e veja quais medicamentos foram indicados na última consulta.
4. Agora que você já verificou sobre as vacinas, precisa marcar o retorno ao pediatra, marque para o dia 12/11 às 14h.
5. Após a consulta com o pediatra, verifique como está a evolução do crescimento do seu filho.
6. Ao final do dia, Gustavo estava animado e bem agitado, registre isso no diário.
Perguntas finais:
Qual foi sua maior dificuldade para realizar as tarefas?
Você faria alguma modificação no app?
Nossos aprendizados:
- O usuário tentava digitar e clicar nos campos, entendemos que devemos utilizar mais recursos, como cores, para melhorar o entendimento do rabiscoframe.
- O usuário não entendeu qual vacina estava atrasada, mesmo com o ícone de aviso. Utilizar ícones de avisos maiores e mais chamativos.
- Alguns usuários não entenderam que a opção era um botão de clicar. Utilizar ícones ou textos que indicam que o usuário pode clicar ali.
- Todos os usuários clicaram na data no calendário e não no botão de adicionar. Incluir a opção de clicar na data e abrir a tela de adicionar.
Wireframes e Fluxo do Usuário
Guia de Estilos
Nos nossos primeiros testes de interface, seguimos o Guia de Estilo que o nosso cliente (Governo) já possui. Porém, não alcançamos o resultado desejado. Pensando nisso, decidimos propor melhorias ao Guia de Estilo do Governo — acrescentando cores secundárias e modificando alguns componentes e elementos, atendendo melhor as necessidades do nosso aplicativo sem se distanciar do estilo visual seguido pelos sites e aplicativos vinculados ao governo.
Cores
Para conversar com os sites e apps do Governo, mantivemos a sua cor primária azul (utilizando apenas 3 dos tons dele) e as variações de tons do preto e do branco.
Sentimos falta no Guia de Estilos deles, das cores secundárias que complementassem a cor primária. Diante disso, fizemos um estudo de cores utilizando algumas ferramentas que nos ajudaram a criar uma paleta de cores complementando o azul e nos auxiliando em diferentes hierarquias, ícones e botões.
Decidimos também criar as nossas próprias cores de aviso (warning, success e error), baseadas nos tons (vibração, saturação…) das cores secundárias, para criar um padrão visual agradável para os usuários.
Tipografia
Para a apresentação dos elementos textuais, mantivemos a fonte Rawline utilizada pelo Governo. Achamos interessante permanecer com essa escolha, devido à diversidade de pesos que a fonte possui, facilitando o uso e a criação de hierarquias entre os textos, assim como a compreensão dos elementos da tela.
Como o nosso aplicativo traz a digitalização da Caderneta de Saúde da Criança, o nosso objetivo foi trazer o lúdico existente na Caderneta impressa, mas sem perder a seriedade que um produto do segmento da saúde necessita.
Conseguimos unir esses dois aspectos (lúdico e sério) através das cores e dos componentes da interface como os ícones, botões, campos de preenchimento, cards entre outros componentes visuais.
Protótipo de alta fidelidade
Você pode interagir com nosso protótipo aqui embaixo, ou clicando aqui.
Segundo teste de usabilidade
Após construirmos o protótipo de alta fidelidade, selecionamos 5 usuários para realizar um teste de usabilidade e analisar se eles ainda tinham as mesmas dúvidas do primeiro teste e validar as novas mudanças que fizemos no app. No geral, os usuários conseguiram realizar todas as principais tarefas com êxito. Ainda assim, avaliamos algumas possíveis melhorias futuras.
A seguir estão as principais observações e nossos aprendizados:
- 2 dos 5 usuários não perceberam inicialmente que havia opção de navegar entre as abas do menu vacinas.
Aprendizado: Destacar o status da vacina pode ajudar o usuário a realizar a tarefa mais rápido.
- Ao navegarem no menu agenda, 3 dos 5 usuários não utilizaram os botões para classificar o lembrete como consulta ou vacina.
Aprendizado: Incluir uma identificação para os botões do tipo de lembrete na tela da agenda pode ajudar o usuário a entender que é um botão.
- No menu Desenvolvimento alguns usuários não perceberam que as sessões em dropdown poderiam conter mais informações.
Aprendizado: Deixar páginas que tem muito conteúdo mais interativas para chamar atenção do usuário ajudando ele a entender qual será sua próxima ação.
- A maioria dos usuários procurou o menu diário na página inicial e não na barra de menu (rodapé).
Aprendizado: Podemos repensar a barra de menu e analisar quais itens deveriam realmente permanecer lá.
- Os usuários não conseguiram perceber onde poderiam editar o perfil da criança.
Aprendizado: Incluir um ícone para identificar onde pode editar o perfil da criança ou mover o menu de edição para a barra de menu (rodapé) pode ajudar os usuários pela consistência e padronização, seguindo a Heurística de Nielsen.
Conclusão e aprendizados
Entender os problemas dos usuários e trabalhar nas soluções desse projeto foi muito desafiador e gratificante ao ver o resultado final.
Aprendemos que as certezas que temos, nem sempre são certezas. E principalmente que toda a imersão no tema, envolvendo as pesquisas e testes de usabilidade, são etapas muito importantes para o sucesso de qualquer projeto, proporcionando a melhor experiência possível para cada usuário e que seria ideal para melhor validação de personas a realização de outra pesquisa com maior mix de usuários, evitando qualquer viés nos resultados.
Sabemos que temos vários pontos a melhorar, como por exemplo, aumentar a base de respostas em ambas pesquisas, também devemos ser um pouco mais claros no rabiscoframe para que o teste de usabilidade tenha um resultado melhor.
Agradecemos muito ao Leandro Rezende e toda a equipe do UX Unicórnio pelo curso e por todo o suporte, sem eles isso não seria possível.
