Busca de Credenciados
Nova solução de busca de credenciados do plano de saúde CASSI.
Contexto
A CASSI (Caixa de Assistência dos Funcionários do Banco do Brasil) é uma operadora de planos de saúde voltada principalmente para os funcionários do Banco do Brasil, seus dependentes e aposentados.
Desafio
O principal desafio deste projeto foi redesenhar a experiência de busca de prestadores da CASSI. Até então, o sistema era operado por uma empresa terceirizada, e a proposta era internalizar toda a solução, garantindo mais autonomia e controle sobre as evoluções do produto.
Objetivos
Modernizar a interface e melhorar a usabilidade.
Otimizar o código para facilitar futuras manutenções e melhorias.
Incluir a busca por procedimentos, funcionalidade que não existia na versão anterior.
Discovery
Para este projeto, iniciamos com uma etapa de discovery, onde o principal objetivo era compreender em profundidade todos os processos e sistemas que sustentavam a solução existente.
Como o produto havia sido desenvolvido por uma empresa terceirizada, foi essencial identificar quais partes precisariam ser reconstruídas do zero, garantindo, ao mesmo tempo, que a nova versão mantivesse o mínimo de funcionalidades já disponíveis aos usuários.
Durante essa fase, mapeamos detalhadamente os sistemas, fluxos e pontos de contato por meio de um service blueprint, o que nos permitiu visualizar toda a jornada e as dependências envolvidas no processo.
Benchmarking
Não poderíamos deixar faltar a famosa análise dos nossos principais semelhantes. Então realizamos o famoso benchmarking com os principais planos de saúde do mercado e comparamos quais eram as features presentes em cada um deles correlacionada com as nossas.
Definições de Escopo
Após algumas reuniões e conversas com a área e nossos Stakeholders decidimos, o que seria mantido, aprimorado e adicionado como uma inovação.
Design Systems
Durante o desenvolvimento deste projeto, a CASSI contava com quatro Design Systems distintos, utilizados em diferentes produtos: Website, Área Logada do Cliente, Intranet e Aplicativo.
Naquele momento, já estava em andamento o projeto “Harmony”, que tinha como objetivo unificar todas essas interfaces em um único sistema de design, com componentes compartilhados e uma linguagem visual consistente.
Enquanto essa unificação ainda estava em fase de implementação, foi necessário adaptar o design das telas para cada um dos padrões existentes, garantindo coerência visual dentro de cada contexto e mantendo a identidade da marca em todas as plataformas.
Antes e depois
Aqui apresento algumas comparações entre as telas originais e as novas versões, desenvolvidas durante o processo de atualização do layout e modernização da interface.
Antes
Antes
Antes
Antes
Depois
Depois
Depois
Depois
Alternativas e responsividade
Como mencionado as variações de Design System das diferentes plataformas, trago aqui as adaptações feitas para os diferentes DSs e breakpoints.
Versão Web
Versão Sistema online
Versão Harmony web
Versão responsive Web
Versão responsive sistema online
Versão Harmony app
Versão mapa Sistema online
Versão mapas responsivos e app
Cenários
(overflow)
Após criar as telas principais é hora de montar o overflow. Isso ajuda a mapear todos os caminhos da interface e apresentar de forma mais fácil para os stakeholders. É um passo importante e um documento usado para apresentar a solução para aprovação. Também ajuda os Desenvolvedores a entender a navegação e comportamentos.
No fluxo aproveito para destacar o comportamento de alguns botões, menus e links, sempre com textos de apoio ou regras de usabilidade e negócio.
Overflow das telas do app
Acessibilidade
Nos preocupamos em seguir as regras da ABNT NBR 17225 (norma brasileira recém-lançada) e as diretrizes internacionais WCAG (Web Content Accessibility Guidelines) do W3C. em nossas soluções e algumas das orientações para o time que irá desenvolver também são entregues no arquivo de handoff do figma.
Resultados e acompanhamento
Após o acompanhamento do time de desenvolvimento até o lançamento em produção, chegou o momento mais gratificante: ver a nova interface em uso pelos usuários reais.
A partir daí, iniciamos o monitoramento do comportamento dos usuários, utilizando mapas de calor, métricas de visualização, cliques e tempo em tela, além de gravações de jornada, que nos ajudaram a identificar padrões de uso e oportunidades de melhoria contínua.
As entregas seguem sendo acompanhadas e quando vemos uma oportunidade de melhoria alimentamos o backlog do time para futuras implementações.