UX/UI Case Study: Como simplificar o amarzenamento de dados médicos das pessoas
A pouco mais de dois meses atrás, eu me inscrevi despretensiosamente no Curso Livre de "UX na Prática" do Centro Universitário Belas Artes, e logo no primeiro dia formei uma equipe com 5 pessoas, ao qual nos foi proposto o seguinte tema: "Como melhorar a saúde na cidade de São Paulo?".
O processo de Design Thinking
A partir disso, foram realizadas pesquisas, questionários online e entrevistas para delimitar um caminho a ser seguido para solucionar esse desafio. No primeiro momento, fizemos um brainstorm de nossas certezas, suposições e dúvidas que tínhamos coletado de forma empírica durante nossa vida, e então fizemos uma Matriz CSD.
Utilizamos de questionários, entrevistas e também pesquisas desk para entender os Pain Points dos habitantes da cidade de São Paulo, e conseguimos então fazer a primeira convergência do Double-Diamond, no qual tivemos nossas hipóteses de soluções.
O fato é: tínhamos muitos problemas e muitas possibilidades de produtos digitais para resolvê-los, porém precisávamos entregar um MVP com apenas uma solução e algumas features bem enxutas, e sobre qual proposta nós finalmente decidimos escolher.
Um grande fator para a nossa decisão foi com um artigo que achamos da Ambra Saúde feita em 2017, no qual fala que os hospitais, clínicas e laboratórios necessitam de muito espaço para acomodar tudo que é gerado. Além disso, o ambiente ainda precisa ser climatizado para manter as propriedades e qualidades da impressão por um bom tempo.
Entendendo o Problema:
O armazenamento de dados médicos tais como: raio-x, exame de sangue, ressonâncias magnéticas, verificações regulares de indivíduos, entre outros, são, hoje, um problema. Foi identificado que não existe nenhum lugar para salvar tais dados das pessoas além de meio físico/material, e assim, eles se perdem com o tempo, dificultando o acompanhamento médico.
A ideia foi transformar a experiência onde as pessoas tenham todos esses dados salvos, e que consigam compartilhar com seus médicos para que eles consigam manter um acompanhamento individual com seus pacientes, e que, através do design e ilustrações acolhedoras, se conectem com empatia essas pessoas.
Foco nas dores do usuário, 4W e UX Writing
Nos dias atuais, não se consegue falar de um aplicativo de sucesso sem uma comunicação/branding focada nos usuários. Com a síntese dos pain points da nossa persona, vimos algo além de sua dor de não conseguir organizar todos os dados médicos que ela precisava (como o de seu filho), mas também o sentimento que ela tinha com o ato de ir aos hospitais/clínicas: frieza.
Ana Paula tem problemas em organizar e armazenar histórico de exames e vacinas quando frequenta um hospital ou laboratório. Nossa solução deve facilitar o acesso e armazenagem desse histórico, para agilizar qualquer atendimento futuro.
"Memo" nasceu para transformar a relação entre médicos#pacientes através da empatia. Seu significado advém de "memória", que significa "aquilo que ocorre ao espírito como resultado de experiências já vividas; lembrança, reminiscência". Em uma análise subjetiva de identidade, ficou claro para os usuários que havia no aplicativo a sensações de conforto e humanização.
Pensamos na melhor forma de aplicar uma UX Writing focada em passar esses sentimentos. Queríamos que ela tivesse uma experiência além do objetivo principal de guardar seus dados médicos, mas também fazer com que ela deixasse de remeter sentimentos negativos ao ato de guardar dados médicos ou até mesmo de ir ao médico.
Mapeando a Jornada do Usuário
Depois que identificamos quais features teriam no aplicativo através de um mapeamento de priorização por esforço#valor, acabou não sendo tão difícil de criar uma jornada do usuário. Definimos completamente o MVP e também analisamos futuras possibilidades de features e melhorias no app que acabaram ficando no backlog.
Decisões de design através da persona e o contexto de uso
Problema e Solução:
Como fazer a persona, que tem o dia a dia corrido, ter uma experiência rápida e ágil quando estiver utilizando o app?
Sabe-se que a nossa maior base de usuários serão pessoas responsáveis por sua própria relação médica. Pessoas como a Ana tem um cotidiano ligeiro, querem respostas rápidas e agilidade no fluxo de adicionar um exame.
Por conta disso, aderimos ao uso de formulários step by step. Desde o cadastro e login até mesmo a escolha de qual hospital a pessoa quer importar o exame médico para o aplicativo: a ideia é que seja sempre uma informação por tela. Isso agiliza a informação e a pessoa não perde tempo lendo um formulário grande e depois respondendo ele/preenchendo os campos. Precisávamos também que a key feature de "adicionar dado médico" fosse a primeira coisa que o usuário tivesse dentro do seu raio de visão. Portanto nós adicionamos na própria tela inicial do app uma chamativa para ele realizar essa função. Verificar fluxo abaixo.
Como resolvemos o problema principal de armazenar os dados?
Problema 1 e Solução:
Disponibilizar formas fáceis e rápidas do usuário importar os exames médicos para o aplicativo.
Além do usuário ser capaz de importar exames para o app através de um PDF e fotografia, ele também tem a possibilidade de utilizar os bancos de dados dos próprios hospitais/laboratórios que estiverem vinculados ao aplicativo.
Fazer essa feature foi um pouco mais complexa. Nós fizemos o MMF (Minimum Marketable Feature) de todo o fluxo de importação e visualização dos dados (próximo problema), e chegamos em um resultado sutil onde englobamos também a decisão de dar informações únicas por tela para o usuário em caso de forms. Verificar fluxo abaixo.
Problema 2 e Solução:
De que forma o usuário seleciona os documentos a serem importados e recebe o feedback do app que foi importado com sucesso?
A princípio não tínhamos pensado em uma tela de validação para o usuário saber que o exame dele foi importado com sucesso. Isso foi visto com feedbacks que recebemos e pudemos observar através de testes de usabilidade. No fim, sentimos a sua necessidade e vimos que a experiência do usuário se tornaria mais consistente dessa forma. Foi necessária uma iteração no fluxo e algumas conexões de atalhos para onde o usuário deseja ir. A intenção é que ele consiga adicionar vários sequencialmente para poupar tempo e quantidade de clique. Verificar fluxo abaixo.
Problema 3 e Solução:
O usuário deve poder acessar o histórico de exames importados pro app, e também precisa conseguir visualizar exames imagéticos, como um raio-X.
O usuário consegue acessar o histórico de exames dele pela navbar, um dos componentes principais do aplicativo, localizado na tela de início. Há também o caminho pelo fluxo de adicionar um novo exame médico: no final, na tela de validação informando que foi importado com sucesso o usuário tem as opções de: adicionar novo exame, retornar à tela de início ou ir ao histórico.
Em relação à visualização de exames imagéticos, já tínhamos em mente algo similar enquanto fazíamos a sessão de priorização de features, até mesmo porque precisaríamos possibilitar ao usuário que ele tirasse fotografias dos exames caso não tivesse eles em PDF/banco de dados. Isso acabou evoluindo, e com um contexto que retiramos de entrevista com usuário, entendemos que seria também necessária a visualização de documentos especiais, tais como o raio-X. Verificar fluxo abaixo.
Utilizando da experiência de branding para realizar um Onboarding amável
Um ponto chave, e também um dos primeiros contatos da pessoa com o aplicativo em si, é o onboarding. Utilizar de toda a experiência do branding do produto, como cores, ilustrações, diagramação, comunicação e tom de voz, faz parte para se ter um step by step agradável ao usuário.
A funcionalidade "Pular" é uma mão na roda para tornar o app ainda mais ágil para certos tipos de usuários. Embora o Onboarding seja interessante, e até mesmo necessário para dar um overview do app para o usuário que não o conhece direito, há também aqueles que já conhecem e estão passando por este passo novamente por diversas razões. Obrigar esses X% de usuários a passar por um fluxo que não tem mais tanto sentido para eles torna a experiência chata e até mesmo cansativa.
As ilustração são mais subjetivas do que objetivas com um propósito em específico: a própria humanidade é subjetiva, diferente, e requer percepções diferentes de contexto de uso. Por conta disso a experiência se torna uníssona com o posicionamento do branding ao interagir com ilustrações que tenham essas mesmas percepções. Com uma linguagem fácil e curta, elas criam uma harmonia no design do produto.
Nós da equipe Afonso acreditamos que em qualquer produto sempre haja escopo e espaço para melhorar a experiência.
Por isso, temos features que ficaram de fora do MVP, mas que estão no backlog para os próximos passos de iteração que será realizado no Memo.
- Dashboard de gerenciamento para médicos
- Feature de criar perfis de dependentes
- Possibilidade de criar lembretes e alarmes de agendamentos/medicamentos
- Informativos sobre vacinas de sua localidade
O time de produto
Luis Fernando Lima
Product Designer aficcionado e Ilustrador de coração, ama desenho animado e bichos e vê o Design como ferramenta poderosa de transformação social.
LinkedIn: https://www.linkedin.com/in/korvvo/
Lucas Sarabia
UX Designer que curte uma praia no seu tempo livre, e ama se perder nos parágrafos dos artigos sobre tecnologia e inovação.
LinkedIn: https://www.linkedin.com/in/lucassarabia/
Patrícia Cunha
Designer Gráfica em migração para UX/UI. Se diverte ilustrando usando técnicas tradicionais e digitais.
LinkedIn: https://www.linkedin.com/in/patricialaisscunha/
Ricardo Miura
Diretor de Arte e aspirante à UX, curte fotografia e audiovisual mas também tá sempre envolvido em projetos editoriais.
E claro, não podemos esquecer também das pessoas que possibilitaram esse projeto com uma mentoria incrível,
e ! Profissionais excelentes com uma didática maravilhosa.E um muito obrigado à todos que chegaram até aqui, se tiverem comentários a fazer sobre o Memo, cheguem mais, vamos trocar uma ideia! No mais, até o próximo case ;)
