Healthy Head — Benchmark visual
Analisando concorrentes e suas decisões de UI
As decisões de UI tomadas no Healthy Head foram embasadas em benchmark. Além das funcionalidades, é importante ver o que o mercado tem usado visualmente para conversar com os usuários.
Analisamos um total de 6 marcas que realizam o serviço de terapia online:
- Zenklub
- Vittude
- Fepo
- Telavita
- Psitto
- Psicologia Viva
Nosso objetivo era descobrir as cores, tipografia, espaçamentos e quais imagens estavam usando como comunicação visual. Daremos mais destaque as marcas Zenklub e Vittude, visto que eram as mais conhecidas e utilizadas, mas a maioria dos serviços apresentados nesse artigo tiveram soluções similares.
No topo deste artigo possui uma imagem resumida das outras 4 marcas e é notável que todas as marcas se utilizaram da cor azul e suas variações em lugares de destaque de seus sites. Além disso, com exceção da Psicologia Viva, os sites foram constantes em terem no máximo duas cores para trabalhar, uma como primária e outra como secundária.
Quanto a tipografia, observamos que 2 das 6 marcas utilizam a Fira Sans. Apesar disso, optamos por seguir com a Open Sans, encontrada na marca Fepo, já que não gostamos da estética curvada e estreita da Fira. Já no tamanho, espaçamento e altura da linha, seguimos com a maioria padrão de 16px, espaçamento automático e altura de 1.5x.
Imagens estão presentes em todas as marcas pesquisadas, seja como forma de ilustrar o uso do produto, como uma vídeo chamada, ou como a foto de pessoas diversas, para exemplificar a pluralidade e diversidade de perfis que podem ser encontrados nessas plataformas. Com o Healthy Head não foi diferente, temos imagens no onboarding do produto que demonstram tanto o seu uso quanto a diversidade de usuários que poderão ser encontrados.
Os ícones foram também uma constante, principalmente na versão mobile, no formato outlined, porém optamos por não seguir dessa forma. Após alguns testes rápidos que fizemos com o protótipo projetado no celular, sentimos que os ícones do menu inferior ficaram sem destaque na hierarquia visual, então resolvemos deixá-los preenchidos, para fins de visibilidade e acessibilidade.
