Redesign para clínica de odontologia

Maíra Pascoal é cirurgiã-dentista com especialização em ortodontia e mestrado em Saúde da Criança e do Adolescente. Localizado em Campinas-SP, seu consultório odontológico é reconhecido como referência na técnica com Invisalign, a tecnologia mais avançada do mundo em placas alinhadoras.

Cliente

Maíra Pascoal

Duração

3 meses

Demandas

UI/UX, Web Design, Wordpress, Front-end, Redesign

Redesign para clínica de odontologia

Maíra Pascoal é cirurgiã-dentista com especialização em ortodontia e mestrado em Saúde da Criança e do Adolescente. Localizado em Campinas-SP, seu consultório odontológico é reconhecido como referência na técnica com Invisalign, a tecnologia mais avançada do mundo em placas alinhadoras.

Duração

3 meses

Cliente

Maíra Pascoal

Demandas

UI/UX, Web Design, Wordpress, Front-end, Redesign

Redesign para clínica de odontologia

Maíra Pascoal é cirurgiã-dentista com especialização em ortodontia e mestrado em Saúde da Criança e do Adolescente. Localizado em Campinas-SP, seu consultório odontológico é reconhecido como referência na técnica com Invisalign, a tecnologia mais avançada do mundo em placas alinhadoras.

Duração

3 meses

Cliente

Maíra Pascoal

Demandas

UI/UX, Web Design, Wordpress, Front-end, Redesign

O problema

A Dra. Maíra Pascoal e sua equipe me chamaram para renovar o site de sua clínica odontológica. Eles buscavam um visual mais clean, moderno e que transmitisse a qualidade de seus serviços prestados.

A Dra. Maíra é credenciada como Invisalign Doctor Emerald, sendo a primeira na região metropolitana de Campinas a receber esse reconhecimento. Além disso, seu mestrado em Saúde da Criança e do Adolescente a destaca como especialista no atendimento a esse público. O site antigo, além de enfrentar problemas funcionais, não comunicava efetivamente todos esses diferenciais. Era essencial desenvolver um novo site que realmente representasse o trabalho da equipe e seus pontos fortes.

Meu papel

Auditoria de UX para identificar problemas de navegação, usabilidade, conteúdo e desempenho do site.


Colaboração com a equipe de marketing para estruturar o conteúdo.


Wireframing, Prototipagem e UI Design.


Desenvolvimento front-end (HTML, CSS, Javascript) utilizando a plataforma CMS WordPress.


Configuração do ambiente de produção, realização de testes funcionais, de performance e de segurança, e publicação do website.


Redefinindo a estrutura

Após o entendimento das necessidades do projeto, o próximo passo foi realizar uma análise competitiva e estabelecer os requisitos do produto. Em seguida, comecei a redefinir a estrutura. Para corrigir algumas inconsistências e otimizar a experiência do usuário, foi necessário reestruturar o sitemap e reorganizar alguns fluxos, garantindo assim uma navegação mais intuitiva, eficiente e que estivesse mais alinhada com o escopo do projeto.

Construindo a base

Após definirmos a estrutura e o propósito de cada página, comecei a criar alguns wireframes. O objetivo aqui era visualizar a disposição dos elementos e a hierarquia das informações de forma rápida, testando diferentes abordagens e estabelecendo a base do projeto antes de avançar para o design visual.

UI Design com propósito

Na estrutura reformulada do site, criamos duas seções específicas para abordar o Invisalign: uma voltada para adultos e outra para crianças, dando um destaque especial para este público. Além disso, desenvolvemos um espaço dedicado para apresentar todos os tratamentos oferecidos pela clínica.

 

Cada tratamento possui sua própria página, contendo uma explicação e um botão de ação (CTA) para esclarecer dúvidas e agendar consultas, funcionando como uma landing page para cada tratamento.

UI Design com propósito

Na estrutura reformulada do site, criamos duas seções específicas para abordar o Invisalign: uma voltada para adultos e outra para crianças, dando um destaque especial para este público. Além disso, desenvolvemos um espaço dedicado para apresentar todos os tratamentos oferecidos pela clínica. Cada tratamento possui sua própria página, contendo uma explicação e um botão de ação (CTA) para esclarecer dúvidas e agendar consultas, funcionando como uma landing page para cada tratamento.

Design visual

No começo do projeto, já existia um logotipo criado e uma paleta de cores monocromática. Partindo disso, eu desenvolvi um guia de estilos e expandi a paleta, adicionando cores complementares e uma seleção específica para o Invisalign First, destinado ao público infantil. Além disso, customizei alguns ícones e defini padrões para componentes e outros estilos.

Turquesa Escuro
#388690

Turquesa Médio
#4AB1BF

Turquesa Claro
#5EC5CF

Azul Marinho
#1C4691

Azul Royal
#275DBF

Azul Celeste
#01B9FF

Terracota
#5EC5CF

Verde Limão
#B3E167

Mostarda
#FFC328

Cinza Escuro
#383736

Cinza Médio
#A5A4A4

Cinza Claro
#F7F7F7

Responsividade

Tivemos a premissa de que, independentemente do dispositivo utilizado pelo usuário, a experiência deveria ser sempre fluida e intuitiva. Também tivemos o cuidado de otimizar o conteúdo para mobile na fase de desenvolvimento, melhorando a performance do site em dispositivos móveis.

Desenvolvendo em Wordpress

Após a aprovação do design visual, iniciamos a etapa de desenvolvimento. Fiquei encarregado de configurar o ambiente de produção, desenvolver o front-end no Wordpress e também de publicar o website depois de finalizado. Durante o processo, realizei a otimização de todas as imagens, conduzi testes funcionais e de performance, além de reforçar a segurança do ambiente.

Optamos pelo Wordpress como a principal ferramenta deste projeto devido à sua facilidade na gestão e atualização de conteúdo. Isso elimina a necessidade de expertise avançada em programação, facilitando a administração do site pela equipe de marketing da Dra. Maíra.

Considerações finais

Atuar em um projeto desempenhando os papéis de designer e desenvolvedor é sempre um desafio. Mesmo já tendo passado por essa experiência diversas vezes, sempre surgem novos aprendizados que levamos para próximos projetos. Ficamos satisfeitos com o resultado alcançado, que só foi possível graças à colaboração contínua com a equipe de marketing da Dra. Maíra e à confiança depositada em meu trabalho.